mirror of
https://github.com/pheralb/svgl.git
synced 2025-12-29 08:01:36 +08:00
🎨 Add Shiki light/dark mode styles and line number formatting
This commit is contained in:
@@ -41,3 +41,33 @@
|
||||
"OnestMedium", system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
|
||||
"Segoe UI Symbol", "Noto Color Emoji";
|
||||
}
|
||||
|
||||
/* Shiki light/dark mode */
|
||||
html.dark .shiki,
|
||||
html.dark .shiki span {
|
||||
color: var(--shiki-dark) !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
/* Shiki Line Numbers */
|
||||
code {
|
||||
counter-reset: step;
|
||||
counter-increment: step 0;
|
||||
}
|
||||
|
||||
code:has(.line:nth-child(2)) .line::before {
|
||||
content: counter(step);
|
||||
counter-increment: step;
|
||||
width: 1rem;
|
||||
margin-right: 1.5rem;
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
html.light code:has(.line:nth-child(2)) .line::before {
|
||||
color: #a0a0a0;
|
||||
}
|
||||
|
||||
html.dark code:has(.line:nth-child(2)) .line::before {
|
||||
color: #525252;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user