prism.scss 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259
  1. /*
  2. * 自定义
  3. */
  4. pre.line-numbers {
  5. padding-top: 45px !important;
  6. }
  7. .window-controls{
  8. position: absolute;
  9. width: 65px;
  10. height: 14px;
  11. top: 15px;
  12. padding: 0;
  13. display: block;
  14. // margin-left: -36px;
  15. z-index: 1000;
  16. }
  17. .window-controls i{
  18. margin-right: 8px;
  19. }
  20. .window-controls .red{
  21. background: rgb(224, 68, 62);
  22. width: 13px;
  23. height: 13px;
  24. border-radius: 50%;
  25. float: left;
  26. }
  27. .window-controls .yellow{
  28. background: rgb(255, 189, 46);
  29. width: 13px;
  30. height: 13px;
  31. border-radius: 50%;
  32. float: left;
  33. }
  34. .window-controls .green{
  35. background: rgb(26, 171, 41);
  36. width: 13px;
  37. height: 13px;
  38. border-radius: 50%;
  39. float: left;
  40. }
  41. /* PrismJS 1.14.0
  42. http://prismjs.com/download.html#themes=prism-okaidia&languages=markup+css+clike+javascript+c+bash+cpp+csharp+diff+markup-templating+git+go+graphql+http+hpkp+hsts+java+json+less+markdown+nginx+php+php-extras+sql+python+sass+scss+scala+plsql+vim&plugins=line-numbers+autolinker+wpd+command-line */
  43. /**
  44. * okaidia theme for JavaScript, CSS and HTML
  45. * Loosely based on Monokai textmate theme by http://www.monokai.nl/
  46. * @author ocodia
  47. */
  48. code[class*="language-"],
  49. pre[class*="language-"] {
  50. color: #f8f8f2;
  51. background: none;
  52. text-shadow: 0 1px rgba(0, 0, 0, 0.3);
  53. font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
  54. text-align: left;
  55. white-space: pre;
  56. word-spacing: normal;
  57. word-break: normal;
  58. word-wrap: normal;
  59. line-height: 1.8;
  60. -moz-tab-size: 4;
  61. -o-tab-size: 4;
  62. tab-size: 4;
  63. -webkit-hyphens: none;
  64. -moz-hyphens: none;
  65. -ms-hyphens: none;
  66. hyphens: none;
  67. }
  68. /* Code blocks */
  69. pre[class*="language-"] {
  70. padding: 1em;
  71. margin: .5em 0;
  72. overflow: auto;
  73. border-radius: 0.3em;
  74. }
  75. :not(pre) > code[class*="language-"],
  76. pre[class*="language-"] {
  77. background: #263238;
  78. }
  79. /* Inline code */
  80. :not(pre) > code[class*="language-"] {
  81. padding: .1em;
  82. border-radius: .3em;
  83. white-space: normal;
  84. }
  85. .token.comment,
  86. .token.prolog,
  87. .token.doctype,
  88. .token.cdata {
  89. color: #546e7a;
  90. }
  91. .token.punctuation {
  92. margin-left: 5px;
  93. color: rgba(233,237,237,1);
  94. }
  95. .namespace {
  96. opacity: .7;
  97. }
  98. .token.property,
  99. .token.tag,
  100. .token.constant,
  101. .token.symbol,
  102. .token.deleted {
  103. color: #f92672;
  104. }
  105. .token.boolean,
  106. .token.number {
  107. color: #ae81ff;
  108. }
  109. .token.selector,
  110. .token.attr-name,
  111. .token.string,
  112. .token.char,
  113. .token.builtin,
  114. .token.inserted {
  115. color: #a6e22e;
  116. }
  117. .token.operator,
  118. .token.entity,
  119. .token.url,
  120. .language-css .token.string,
  121. .style .token.string,
  122. .token.variable {
  123. color: #f8f8f2;
  124. }
  125. .token.atrule,
  126. .token.attr-value,
  127. .token.function {
  128. color: #e6db74;
  129. }
  130. .token.keyword {
  131. color: #66d9ef;
  132. }
  133. .token.regex,
  134. .token.important {
  135. color: #fd971f;
  136. }
  137. .token.important,
  138. .token.bold {
  139. font-weight: bold;
  140. }
  141. .token.italic {
  142. font-style: italic;
  143. }
  144. .token.entity {
  145. cursor: help;
  146. }
  147. pre.line-numbers {
  148. position: relative;
  149. padding-left: 3.8em;
  150. counter-reset: linenumber;
  151. }
  152. pre.line-numbers > code {
  153. position: relative;
  154. white-space: inherit;
  155. }
  156. .line-numbers .line-numbers-rows {
  157. position: absolute;
  158. pointer-events: none;
  159. top: 0;
  160. font-size: 100%;
  161. left: -3.8em;
  162. width: 3em; /* works for line-numbers below 1000 lines */
  163. letter-spacing: 2px;
  164. border-right: 1px solid #537f7e;
  165. line-height: 2.0;
  166. -webkit-user-select: none;
  167. -moz-user-select: none;
  168. -ms-user-select: none;
  169. user-select: none;
  170. }
  171. .line-numbers-rows > span {
  172. pointer-events: none;
  173. display: block;
  174. counter-increment: linenumber;
  175. }
  176. .line-numbers-rows > span:before {
  177. content: counter(linenumber);
  178. color: #537f7e;
  179. display: block;
  180. padding-right: 0.8em;
  181. text-align: right;
  182. }
  183. .token a {
  184. color: inherit;
  185. }
  186. code[class*="language-"] a[href],
  187. pre[class*="language-"] a[href] {
  188. cursor: help;
  189. text-decoration: none;
  190. }
  191. code[class*="language-"] a[href]:hover,
  192. pre[class*="language-"] a[href]:hover {
  193. cursor: help;
  194. text-decoration: underline;
  195. }
  196. .command-line-prompt {
  197. border-right: 1px solid #999;
  198. display: block;
  199. float: left;
  200. font-size: 100%;
  201. letter-spacing: -1px;
  202. margin-right: 1em;
  203. pointer-events: none;
  204. -webkit-user-select: none;
  205. -moz-user-select: none;
  206. -ms-user-select: none;
  207. user-select: none;
  208. }
  209. .command-line-prompt > span:before {
  210. color: #999;
  211. content: ' ';
  212. display: block;
  213. padding-right: 0.8em;
  214. }
  215. .command-line-prompt > span[data-user]:before {
  216. content: "[" attr(data-user) "@" attr(data-host) "] $";
  217. }
  218. .command-line-prompt > span[data-user="root"]:before {
  219. content: "[" attr(data-user) "@" attr(data-host) "] #";
  220. }
  221. .command-line-prompt > span[data-prompt]:before {
  222. content: attr(data-prompt);
  223. }