euv_ui/style/css/
const.rs

1/// Raw stylesheet for rendered markdown bodies ([`crate::euv_markdown`]).
2///
3/// `class!` cannot express descendant selectors, so markdown typography is
4/// injected once at startup through `Css::inject_css`. All colors reference
5/// the theme CSS variables, so light/dark switching works unchanged.
6pub const EUV_MD_CSS: &str = r#"
7.md-body {
8    line-height: 1.7;
9    font-size: var(--font-base);
10    word-wrap: break-word;
11}
12.md-body h1, .md-body h2, .md-body h3, .md-body h4, .md-body h5, .md-body h6 {
13    position: relative;
14    font-weight: 700;
15    letter-spacing: -0.01em;
16    margin-top: 1.8em;
17    margin-bottom: 0.6em;
18    scroll-margin-top: 72px;
19    line-height: 1.3;
20}
21.md-body h1 {
22    font-size: var(--font-3xl);
23    margin-top: 0;
24    padding-bottom: 0.4em;
25    border-bottom: 1px solid var(--border);
26}
27.md-body h2 {
28    font-size: var(--font-2xl);
29    padding-bottom: 0.3em;
30    border-bottom: 1px dashed var(--border);
31}
32.md-body h3 { font-size: var(--font-xl); }
33.md-body h4 { font-size: var(--font-lg); }
34.md-body h5, .md-body h6 { font-size: var(--font-base); }
35.md-body .header-anchor {
36    float: left;
37    margin-left: -0.9em;
38    padding-right: 0.2em;
39    opacity: 0;
40    color: var(--muted-foreground);
41    font-weight: 400;
42    transition: opacity 0.15s ease-out;
43    user-select: none;
44}
45.md-body h1:hover .header-anchor,
46.md-body h2:hover .header-anchor,
47.md-body h3:hover .header-anchor,
48.md-body h4:hover .header-anchor,
49.md-body h5:hover .header-anchor,
50.md-body h6:hover .header-anchor {
51    opacity: 1;
52}
53.md-body p, .md-body ul, .md-body ol, .md-body blockquote, .md-body pre, .md-body table {
54    margin: 1em 0;
55}
56.md-body ul, .md-body ol {
57    padding-left: 1.4em;
58}
59.md-body ul { list-style: disc; }
60.md-body ol { list-style: decimal; }
61.md-body ul ul, .md-body ul ol, .md-body ol ul, .md-body ol ol {
62    margin: 0.25em 0;
63}
64.md-body li { margin: 0.25em 0; }
65.md-body li input[type="checkbox"] {
66    margin-right: 0.4em;
67    accent-color: var(--accent);
68}
69.md-body a {
70    color: var(--accent);
71    font-weight: 500;
72    text-decoration: underline;
73    text-underline-offset: 3px;
74    text-decoration-style: dashed;
75    text-decoration-color: var(--border);
76}
77.md-body a:hover {
78    text-decoration-style: solid;
79    text-decoration-color: var(--accent);
80}
81.md-body strong { font-weight: 700; }
82.md-body em { font-style: italic; }
83.md-body del { opacity: 0.6; }
84.md-body hr {
85    border: none;
86    border-top: 1px dashed var(--border);
87    margin: 2em 0;
88}
89.md-body blockquote {
90    margin: 1em 0;
91    padding: 0.4em 1em;
92    border-left: 4px solid var(--border);
93    color: var(--muted-foreground);
94}
95.md-body blockquote p { margin: 0.4em 0; }
96.md-body code {
97    font-family: ui-monospace, monospace;
98    font-size: 0.875em;
99    padding: 0.15em 0.4em;
100    background: var(--accent-muted);
101    border: 1px solid var(--border);
102}
103.md-body pre {
104    padding: 1em 1.2em;
105    overflow-x: auto;
106    border: 1px solid var(--border);
107    background: var(--accent-muted);
108}
109.md-body pre code {
110    padding: 0;
111    border: none;
112    background: transparent;
113    font-size: 0.875rem;
114    line-height: 1.6;
115}
116.md-body table {
117    width: 100%;
118    border-collapse: collapse;
119    font-size: var(--font-sm);
120    display: block;
121    overflow-x: auto;
122}
123.md-body table thead { border-bottom: 2px solid var(--border); }
124.md-body table th, .md-body table td {
125    padding: 0.5em 0.9em;
126    border: 1px solid var(--border);
127    text-align: left;
128}
129.md-body table th { font-weight: 700; }
130.md-body table tbody tr:nth-child(2n) { background: var(--accent-muted); }
131.md-body img { max-width: 100%; }
132.md-body .docs-container {
133    margin: 1.2em 0;
134    padding: 0.1em 1.2em;
135    border-left: 4px solid var(--foreground);
136    background: var(--accent-muted);
137}
138.md-body .docs-container .docs-container-title {
139    font-weight: 700;
140    font-size: var(--font-sm);
141    letter-spacing: 0.04em;
142    text-transform: uppercase;
143    margin: 0.8em 0 0.4em;
144}
145.md-body .docs-container.tip { border-left-style: solid; }
146.md-body .docs-container.warning { border-left-style: dashed; }
147.md-body .docs-container.danger {
148    border-left: 4px double var(--foreground);
149}
150.md-body .docs-container.details {
151    border-left: 1px solid var(--border);
152    background: transparent;
153}
154.md-body .footnote-definition { font-size: var(--font-sm); color: var(--muted-foreground); }
155"#;
euv_ui/style/css/const.rs

euv_ui/style/css/
const.rs
