prism.css 7.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374
  1. /* http://prismjs.com/download.html?themes=prism&languages=markup+css+clike+javascript+ruby+css-extras+git+jade+json+php+php-extras+sass+scss+sql&plugins=line-highlight+line-numbers+show-invisibles+autolinker+file-highlight+show-language+jsonp-highlight+highlight-keywords+remove-initial-line-feed+autoloader+unescaped-markup+command-line+normalize-whitespace+keep-markup */
  2. /**
  3. * prism.js default theme for JavaScript, CSS and HTML
  4. * Based on dabblet (http://dabblet.com)
  5. * @author Lea Verou
  6. */
  7. code[class*="language-"],
  8. pre[class*="language-"] {
  9. color: #8a8484;
  10. background: none;
  11. font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
  12. text-align: left;
  13. white-space: pre;
  14. word-spacing: normal;
  15. word-break: normal;
  16. word-wrap: normal;
  17. font-size: 100%;
  18. line-height: 1.5;
  19. -moz-tab-size: 4;
  20. -o-tab-size: 4;
  21. tab-size: 4;
  22. -webkit-hyphens: none;
  23. -moz-hyphens: none;
  24. -ms-hyphens: none;
  25. hyphens: none;
  26. border:none;
  27. }
  28. pre[class*="language-"]::-moz-selection,
  29. pre[class*="language-"] ::-moz-selection,
  30. code[class*="language-"]::-moz-selection,
  31. code[class*="language-"] ::-moz-selection {
  32. text-shadow: none;
  33. background: #b3d4fc;
  34. }
  35. pre[class*="language-"]::selection,
  36. pre[class*="language-"] ::selection,
  37. code[class*="language-"]::selection,
  38. code[class*="language-"] ::selection {
  39. text-shadow: none;
  40. background: #b3d4fc;
  41. }
  42. @media print {
  43. code[class*="language-"],
  44. pre[class*="language-"] {
  45. text-shadow: none;
  46. }
  47. }
  48. /* Code blocks */
  49. pre[class*="language-"] {
  50. padding: 1em;
  51. margin: .5em 0;
  52. overflow: auto;
  53. max-height: 250px;
  54. position: relative;
  55. }
  56. :not(pre)>code[class*="language-"],
  57. pre[class*="language-"] {
  58. background: #FFF;
  59. border: 1px solid #F0F0F0;
  60. border-left: 2px solid #3BAFDA;
  61. border-radius: 4px;
  62. }
  63. /* Inline code */
  64. :not(pre)>code[class*="language-"] {
  65. padding: .1em;
  66. border-radius: .3em;
  67. white-space: normal;
  68. }
  69. .token.comment,
  70. .token.prolog,
  71. .token.doctype,
  72. .token.cdata {
  73. color: slategray;
  74. }
  75. .token.punctuation {
  76. color: #999;
  77. }
  78. .namespace {
  79. opacity: .7;
  80. }
  81. .token.property,
  82. .token.tag,
  83. .token.boolean,
  84. .token.number,
  85. .token.constant,
  86. .token.symbol,
  87. .token.deleted {
  88. color: #905;
  89. }
  90. .token.selector,
  91. .token.attr-name,
  92. .token.string,
  93. .token.char,
  94. .token.builtin,
  95. .token.inserted {
  96. color: #690;
  97. }
  98. .token.operator,
  99. .token.entity,
  100. .token.url,
  101. .language-css .token.string,
  102. .style .token.string {
  103. color: #a67f59;
  104. background: hsla(0, 0%, 100%, .5);
  105. }
  106. .token.atrule,
  107. .token.attr-value,
  108. .token.keyword {
  109. color: #07a;
  110. }
  111. .token.function {
  112. color: #DD4A68;
  113. }
  114. .token.regex,
  115. .token.important,
  116. .token.variable {
  117. color: #e90;
  118. }
  119. .token.important,
  120. .token.bold {
  121. font-weight: bold;
  122. }
  123. .token.italic {
  124. font-style: italic;
  125. }
  126. .token.entity {
  127. cursor: help;
  128. }
  129. pre[data-line] {
  130. position: relative;
  131. padding: 1em 0 1em 3em;
  132. }
  133. pre[data-file]::before {
  134. content: attr(data-file);
  135. position: absolute;
  136. top: 0;
  137. right: 0;
  138. }
  139. .line-highlight {
  140. position: absolute;
  141. left: 0;
  142. right: 0;
  143. padding: inherit 0;
  144. margin-top: 1em;
  145. /* Same as .prism’s padding-top */
  146. background: hsla(24, 20%, 50%, .08);
  147. background: -moz-linear-gradient(to right, hsla(186, 83%, 68%, 0.11) 70%, hsla(186, 33%, 82%, 0));
  148. background: -webkit-linear-gradient(to right, hsla(186, 83%, 68%, 0.11) 70%, hsla(186, 33%, 82%, 0));
  149. background: -o-linear-gradient(to right, hsla(186, 83%, 68%, 0.11) 70%, hsla(186, 33%, 82%, 0));
  150. background: linear-gradient(to right, hsla(186, 83%, 68%, 0.11) 70%, hsla(186, 33%, 82%, 0));
  151. pointer-events: none;
  152. line-height: inherit;
  153. white-space: pre;
  154. }
  155. .line-highlight:before,
  156. .line-highlight[data-end]:after {
  157. content: attr(data-start);
  158. position: absolute;
  159. top: .4em;
  160. left: .6em;
  161. min-width: 1em;
  162. padding: 0 .5em;
  163. color: #187798;
  164. font: 75%/1.5 sans-serif;
  165. text-align: center;
  166. vertical-align: .3em;
  167. border-radius: 999px;
  168. text-shadow: none;
  169. box-shadow: 0 1px white;
  170. }
  171. .line-highlight[data-end]:after {
  172. content: attr(data-end);
  173. top: auto;
  174. bottom: .4em;
  175. }
  176. pre.line-numbers {
  177. position: relative;
  178. padding-left: 3.8em;
  179. counter-reset: linenumber;
  180. }
  181. pre.line-numbers>code {
  182. position: relative;
  183. }
  184. .line-numbers .line-numbers-rows {
  185. position: absolute;
  186. pointer-events: none;
  187. top: 0;
  188. font-size: 100%;
  189. left: -3.8em;
  190. width: 3em;
  191. /* works for line-numbers below 1000 lines */
  192. letter-spacing: -1px;
  193. border-right: 1px solid #999;
  194. -webkit-user-select: none;
  195. -moz-user-select: none;
  196. -ms-user-select: none;
  197. user-select: none;
  198. }
  199. .line-numbers-rows>span {
  200. pointer-events: none;
  201. display: block;
  202. counter-increment: linenumber;
  203. }
  204. .line-numbers-rows>span:before {
  205. content: counter(linenumber);
  206. color: #999;
  207. display: block;
  208. padding-right: 0.8em;
  209. text-align: right;
  210. }
  211. .token.tab:not(:empty),
  212. .token.cr,
  213. .token.lf,
  214. .token.space {
  215. position: relative;
  216. }
  217. .token.tab:not(:empty):before,
  218. .token.cr:before,
  219. .token.lf:before,
  220. .token.space:before {
  221. color: hsl(24, 20%, 85%);
  222. position: absolute;
  223. }
  224. .token.tab:not(:empty):before {
  225. content: '\21E5';
  226. }
  227. .token.cr:before {
  228. content: '\240D';
  229. }
  230. .token.crlf:before {
  231. content: '\240D\240A';
  232. }
  233. .token.lf:before {
  234. content: '\240A';
  235. }
  236. .token.space:before {
  237. content: '\00B7';
  238. }
  239. .token a {
  240. color: inherit;
  241. }
  242. div.prism-show-language {
  243. position: relative;
  244. }
  245. div.prism-show-language>div.prism-show-language-label {
  246. color: #555;
  247. background-color: #E5E5E5;
  248. display: inline-block;
  249. position: absolute;
  250. bottom: auto;
  251. left: auto;
  252. top: 0;
  253. right: 0;
  254. width: auto;
  255. height: auto;
  256. font-size: 0.9em;
  257. border-radius: 0 4px 0 0;
  258. padding: 0 0.5em;
  259. text-shadow: none;
  260. z-index: 1;
  261. -webkit-box-shadow: none;
  262. -moz-box-shadow: none;
  263. box-shadow: none;
  264. -webkit-transform: none;
  265. -moz-transform: none;
  266. -ms-transform: none;
  267. -o-transform: none;
  268. transform: none;
  269. }
  270. /* Fallback, in case JS does not run, to ensure the code is at least visible */
  271. .lang-markup script[type='text/plain'],
  272. .language-markup script[type='text/plain'],
  273. script[type='text/plain'].lang-markup,
  274. script[type='text/plain'].language-markup {
  275. display: block;
  276. font: 100% Consolas, Monaco, monospace;
  277. white-space: pre;
  278. overflow: auto;
  279. }
  280. .command-line-prompt {
  281. border-right: 1px solid #999;
  282. display: block;
  283. float: left;
  284. font-size: 100%;
  285. letter-spacing: -1px;
  286. margin-right: 1em;
  287. pointer-events: none;
  288. -webkit-user-select: none;
  289. -moz-user-select: none;
  290. -ms-user-select: none;
  291. user-select: none;
  292. }
  293. .command-line-prompt>span:before {
  294. color: #999;
  295. content: ' ';
  296. display: block;
  297. padding-right: 0.8em;
  298. }
  299. .command-line-prompt>span[data-user]:before {
  300. content: "[" attr(data-user) "@" attr(data-host) "] $";
  301. }
  302. .command-line-prompt>span[data-user="root"]:before {
  303. content: "[" attr(data-user) "@" attr(data-host) "] #";
  304. }
  305. .command-line-prompt>span[data-prompt]:before {
  306. content: attr(data-prompt);
  307. }