You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

289 lines
4.4 KiB

1 year ago
  1. /* https://github.com/PrismJS/prism-themes/blob/master/themes/prism-vsc-dark-plus.css */
  2. pre[class*="language-"],
  3. code[class*="language-"] {
  4. color: #d4d4d4;
  5. font-size: 13px;
  6. text-shadow: none;
  7. font-family: Menlo, Monaco, Consolas, "Andale Mono", "Ubuntu Mono",
  8. "Courier New", monospace;
  9. direction: ltr;
  10. text-align: left;
  11. white-space: pre;
  12. word-spacing: normal;
  13. word-break: normal;
  14. line-height: 1.5;
  15. -moz-tab-size: 4;
  16. -o-tab-size: 4;
  17. tab-size: 4;
  18. -webkit-hyphens: none;
  19. -moz-hyphens: none;
  20. -ms-hyphens: none;
  21. hyphens: none;
  22. }
  23. pre[class*="language-"]::selection,
  24. code[class*="language-"]::selection,
  25. pre[class*="language-"] *::selection,
  26. code[class*="language-"] *::selection {
  27. text-shadow: none;
  28. background: #75a7ca;
  29. }
  30. @media print {
  31. pre[class*="language-"],
  32. code[class*="language-"] {
  33. text-shadow: none;
  34. }
  35. }
  36. pre[class*="language-"] {
  37. padding: 1em;
  38. margin: 0.5em 0;
  39. overflow: auto;
  40. background: #292929;
  41. }
  42. :not(pre) > code[class*="language-"] {
  43. padding: 0.1em 0.3em;
  44. border-radius: 0.3em;
  45. color: #db4c69;
  46. background: #f9f2f4;
  47. }
  48. /*********************************************************
  49. * Tokens
  50. */
  51. .namespace {
  52. opacity: 0.7;
  53. }
  54. .token.doctype .token.doctype-tag {
  55. color: #569cd6;
  56. }
  57. .token.doctype .token.name {
  58. color: #9cdcfe;
  59. }
  60. .token.comment,
  61. .token.prolog {
  62. color: #6a9955;
  63. }
  64. .token.punctuation,
  65. .language-html .language-css .token.punctuation,
  66. .language-html .language-javascript .token.punctuation {
  67. color: #d4d4d4;
  68. }
  69. .token.property,
  70. .token.tag,
  71. .token.boolean,
  72. .token.number,
  73. .token.constant,
  74. .token.symbol,
  75. .token.inserted,
  76. .token.unit {
  77. color: #b5cea8;
  78. }
  79. .token.selector,
  80. .token.attr-name,
  81. .token.string,
  82. .token.char,
  83. .token.builtin,
  84. .token.deleted {
  85. color: #ce9178;
  86. }
  87. .language-css .token.string.url {
  88. text-decoration: underline;
  89. }
  90. .token.operator,
  91. .token.entity {
  92. color: #d4d4d4;
  93. }
  94. .token.operator.arrow {
  95. color: #569cd6;
  96. }
  97. .token.atrule {
  98. color: #ce9178;
  99. }
  100. .token.atrule .token.rule {
  101. color: #c586c0;
  102. }
  103. .token.atrule .token.url {
  104. color: #9cdcfe;
  105. }
  106. .token.atrule .token.url .token.function {
  107. color: #dcdcaa;
  108. }
  109. .token.atrule .token.url .token.punctuation {
  110. color: #d4d4d4;
  111. }
  112. .token.keyword {
  113. color: #569cd6;
  114. }
  115. .token.keyword.module,
  116. .token.keyword.control-flow {
  117. color: #c586c0;
  118. }
  119. .token.function,
  120. .token.function .token.maybe-class-name {
  121. color: #dcdcaa;
  122. }
  123. .token.regex {
  124. color: #d16969;
  125. }
  126. .token.important {
  127. color: #569cd6;
  128. }
  129. .token.italic {
  130. font-style: italic;
  131. }
  132. .token.constant {
  133. color: #9cdcfe;
  134. }
  135. .token.class-name,
  136. .token.maybe-class-name {
  137. color: #4ec9b0;
  138. }
  139. .token.console {
  140. color: #9cdcfe;
  141. }
  142. .token.parameter {
  143. color: #9cdcfe;
  144. }
  145. .token.interpolation {
  146. color: #9cdcfe;
  147. }
  148. .token.punctuation.interpolation-punctuation {
  149. color: #569cd6;
  150. }
  151. .token.boolean {
  152. color: #569cd6;
  153. }
  154. .token.property,
  155. .token.variable,
  156. .token.imports .token.maybe-class-name,
  157. .token.exports .token.maybe-class-name {
  158. color: #9cdcfe;
  159. }
  160. .token.selector {
  161. color: #d7ba7d;
  162. }
  163. .token.escape {
  164. color: #d7ba7d;
  165. }
  166. .token.tag {
  167. color: #569cd6;
  168. }
  169. .token.tag .token.punctuation {
  170. color: #808080;
  171. }
  172. .token.cdata {
  173. color: #808080;
  174. }
  175. .token.attr-name {
  176. color: #9cdcfe;
  177. }
  178. .token.attr-value,
  179. .token.attr-value .token.punctuation {
  180. color: #ce9178;
  181. }
  182. .token.attr-value .token.punctuation.attr-equals {
  183. color: #d4d4d4;
  184. }
  185. .token.entity {
  186. color: #569cd6;
  187. }
  188. .token.namespace {
  189. color: #4ec9b0;
  190. }
  191. /*********************************************************
  192. * Language Specific
  193. */
  194. pre[class*="language-javascript"],
  195. code[class*="language-javascript"],
  196. pre[class*="language-jsx"],
  197. code[class*="language-jsx"],
  198. pre[class*="language-typescript"],
  199. code[class*="language-typescript"],
  200. pre[class*="language-tsx"],
  201. code[class*="language-tsx"] {
  202. color: #9cdcfe;
  203. }
  204. pre[class*="language-css"],
  205. code[class*="language-css"] {
  206. color: #ce9178;
  207. }
  208. pre[class*="language-html"],
  209. code[class*="language-html"] {
  210. color: #d4d4d4;
  211. }
  212. .language-regex .token.anchor {
  213. color: #dcdcaa;
  214. }
  215. .language-html .token.punctuation {
  216. color: #808080;
  217. }
  218. /*********************************************************
  219. * Line highlighting
  220. */
  221. pre[data-line] {
  222. position: relative;
  223. }
  224. pre[class*="language-"] > code[class*="language-"] {
  225. position: relative;
  226. z-index: 1;
  227. }
  228. .line-highlight {
  229. position: absolute;
  230. left: 0;
  231. right: 0;
  232. padding: inherit 0;
  233. margin-top: 1em;
  234. background: #f7ebc6;
  235. box-shadow: inset 5px 0 0 #f7d87c;
  236. z-index: 0;
  237. pointer-events: none;
  238. line-height: inherit;
  239. white-space: pre;
  240. }