CodeSandBox/judge4c
2
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat(styles): add mdx.css for improved code styling and line numbering

Browse Source
This commit is contained in:
cfngc4594 2025-02-21 01:39:46 +08:00
parent 89512c8e6a
commit 0c276eeef9
1 changed files with 35 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/style/mdx.css Normal file
View File

@ -0,0 +1,35 @@
[data-rehype-pretty-code-figure] pre {
@apply px-0;
}
[data-rehype-pretty-code-figure] code {
@apply text-sm !leading-loose md:text-base border-0 p-0;
}
[data-rehype-pretty-code-figure] code[data-line-numbers] {
counter-reset: line;
}
[data-rehype-pretty-code-figure] code[data-line-numbers]>[data-line]::before {
counter-increment: line;
content: counter(line);
@apply mr-4 inline-block w-4 text-right text-gray-500;
}
[data-rehype-pretty-code-figure] [data-line] {
@apply border-l-2 border-l-transparent px-3;
}
[data-rehype-pretty-code-figure] [data-highlighted-line] {
background: rgba(200, 200, 255, 0.1);
@apply border-l-blue-400;
}
[data-rehype-pretty-code-figure] [data-highlighted-chars] {
@apply rounded bg-zinc-600/50;
box-shadow: 0 0 0 4px rgb(82 82 91 / 0.5);
}
[data-rehype-pretty-code-figure] [data-chars-id] {
@apply border-b-2 p-1 shadow-none;
}