highlight.css 2.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. :root {
  2. --light-hl-0: #795E26;
  3. --dark-hl-0: #DCDCAA;
  4. --light-hl-1: #000000;
  5. --dark-hl-1: #D4D4D4;
  6. --light-hl-2: #A31515;
  7. --dark-hl-2: #CE9178;
  8. --light-hl-3: #AF00DB;
  9. --dark-hl-3: #C586C0;
  10. --light-hl-4: #001080;
  11. --dark-hl-4: #9CDCFE;
  12. --light-hl-5: #008000;
  13. --dark-hl-5: #6A9955;
  14. --light-hl-6: #0000FF;
  15. --dark-hl-6: #569CD6;
  16. --light-hl-7: #0070C1;
  17. --dark-hl-7: #4FC1FF;
  18. --light-hl-8: #098658;
  19. --dark-hl-8: #B5CEA8;
  20. --light-hl-9: #000000;
  21. --dark-hl-9: #C8C8C8;
  22. --light-code-background: #FFFFFF;
  23. --dark-code-background: #1E1E1E;
  24. }
  25. @media (prefers-color-scheme: light) { :root {
  26. --hl-0: var(--light-hl-0);
  27. --hl-1: var(--light-hl-1);
  28. --hl-2: var(--light-hl-2);
  29. --hl-3: var(--light-hl-3);
  30. --hl-4: var(--light-hl-4);
  31. --hl-5: var(--light-hl-5);
  32. --hl-6: var(--light-hl-6);
  33. --hl-7: var(--light-hl-7);
  34. --hl-8: var(--light-hl-8);
  35. --hl-9: var(--light-hl-9);
  36. --code-background: var(--light-code-background);
  37. } }
  38. @media (prefers-color-scheme: dark) { :root {
  39. --hl-0: var(--dark-hl-0);
  40. --hl-1: var(--dark-hl-1);
  41. --hl-2: var(--dark-hl-2);
  42. --hl-3: var(--dark-hl-3);
  43. --hl-4: var(--dark-hl-4);
  44. --hl-5: var(--dark-hl-5);
  45. --hl-6: var(--dark-hl-6);
  46. --hl-7: var(--dark-hl-7);
  47. --hl-8: var(--dark-hl-8);
  48. --hl-9: var(--dark-hl-9);
  49. --code-background: var(--dark-code-background);
  50. } }
  51. :root[data-theme='light'] {
  52. --hl-0: var(--light-hl-0);
  53. --hl-1: var(--light-hl-1);
  54. --hl-2: var(--light-hl-2);
  55. --hl-3: var(--light-hl-3);
  56. --hl-4: var(--light-hl-4);
  57. --hl-5: var(--light-hl-5);
  58. --hl-6: var(--light-hl-6);
  59. --hl-7: var(--light-hl-7);
  60. --hl-8: var(--light-hl-8);
  61. --hl-9: var(--light-hl-9);
  62. --code-background: var(--light-code-background);
  63. }
  64. :root[data-theme='dark'] {
  65. --hl-0: var(--dark-hl-0);
  66. --hl-1: var(--dark-hl-1);
  67. --hl-2: var(--dark-hl-2);
  68. --hl-3: var(--dark-hl-3);
  69. --hl-4: var(--dark-hl-4);
  70. --hl-5: var(--dark-hl-5);
  71. --hl-6: var(--dark-hl-6);
  72. --hl-7: var(--dark-hl-7);
  73. --hl-8: var(--dark-hl-8);
  74. --hl-9: var(--dark-hl-9);
  75. --code-background: var(--dark-code-background);
  76. }
  77. .hl-0 { color: var(--hl-0); }
  78. .hl-1 { color: var(--hl-1); }
  79. .hl-2 { color: var(--hl-2); }
  80. .hl-3 { color: var(--hl-3); }
  81. .hl-4 { color: var(--hl-4); }
  82. .hl-5 { color: var(--hl-5); }
  83. .hl-6 { color: var(--hl-6); }
  84. .hl-7 { color: var(--hl-7); }
  85. .hl-8 { color: var(--hl-8); }
  86. .hl-9 { color: var(--hl-9); }
  87. pre, code { background: var(--code-background); }