authorgravatar for clembs@clembs.comClément Voisin <clembs@clembs.com> 2024-09-22 18:50:50+02:00
committergravatar for clembs@clembs.comClément Voisin <clembs@clembs.com> 2024-09-22 18:50:50+02:00
log40c767cf9ca6bbc8b0d2f3361ebea589b28a16c6
tree97fade7448cb0948f4d44700329a5c194aa955a3
parentb23b6b4e532fa02ad461ce4d321e22d10db64858
signature Signed by SSH key SHA256:n6WpmDfOyU/HUUpqJ8jF6NyuCeMewEKSdk/F+PmONTU

fix: no light/dark for ansi colors, smaller sidebar & less fucky layout

1 files changed, 53 insertions(+), 29 deletions(-)

src/manual/style.css+53-29
...@@ -15,12 +15,10 @@...@@ -15,12 +15,10 @@
15 --accent: light-dark(#179299, #94e2d5);15 --accent: light-dark(#179299, #94e2d5);
16 --link: light-dark(#179299, #94e2d5);16 --link: light-dark(#179299, #94e2d5);
1717
18 --font-text:18 --font-text: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
19 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,19 Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
20 Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;20 --font-code: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
21 --font-code:21 "Liberation Mono", "Courier New", monospace;
22 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
23 "Courier New", monospace;
24}22}
2523
26* {24* {
...@@ -40,17 +38,30 @@ body {...@@ -40,17 +38,30 @@ body {
40main {38main {
41 width: 100%;39 width: 100%;
42 max-width: 80ch;40 max-width: 80ch;
43 padding: 1rem;41 padding: 2rem;
44 padding-top: 2rem;
45 margin: auto;42 margin: auto;
46 line-height: 1.5;43 line-height: 1.5;
47}44}
4845
49h1, h2, h3, h4, h5, h6, p, ul, pre, blockquote, table {46h1,
47h2,
48h3,
49h4,
50h5,
51h6,
52p,
53ul,
54pre,
55blockquote,
56table {
50 margin-bottom: 1rem;57 margin-bottom: 1rem;
51}58}
5259
53h2, h3, h4, h5, h6 {60h2,
61h3,
62h4,
63h5,
64h6 {
54 padding-top: 0.8rem;65 padding-top: 0.8rem;
55 margin-top: -0.8rem;66 margin-top: -0.8rem;
56}67}
...@@ -75,12 +86,15 @@ a {...@@ -75,12 +86,15 @@ a {
75 color: inherit;86 color: inherit;
76}87}
7788
78table, th, td {89table,
90th,
91td {
79 border: 1px solid #9ca0b0;92 border: 1px solid #9ca0b0;
80 border-collapse: collapse;93 border-collapse: collapse;
81}94}
8295
83th, td {96th,
97td {
84 padding: 0.5rem;98 padding: 0.5rem;
85}99}
86100
...@@ -89,31 +103,31 @@ th, td {...@@ -89,31 +103,31 @@ th, td {
89}103}
90104
91.ansi-31 {105.ansi-31 {
92 color: light-dark(#d20f39, #f38ba8);106 color: #f38ba8;
93}107}
94108
95.ansi-32 {109.ansi-32 {
96 color: light-dark(#40a02b, #a6e3a1);110 color: #a6e3a1;
97}111}
98112
99.ansi-33 {113.ansi-33 {
100 color: light-dark(#de8d1c, #f9e2af);114 color: #f9e2af;
101}115}
102116
103.ansi-34 {117.ansi-34 {
104 color: light-dark(#1e66f5, #89b4fa);118 color: #89b4fa;
105}119}
106120
107.ansi-35 {121.ansi-35 {
108 color: light-dark(#ea76cb, #f5c2e7);122 color: #f5c2e7;
109}123}
110124
111.ansi-36 {125.ansi-36 {
112 color: light-dark(#179299, #94e2d5);126 color: #94e2d5;
113}127}
114128
115.ansi-2 {129.ansi-2 {
116 color: light-dark(#bcc0cc, #8087a2);130 color: #8087a2;
117}131}
118132
119.kw {133.kw {
...@@ -130,7 +144,8 @@ th, td {...@@ -130,7 +144,8 @@ th, td {
130 font-weight: bold;144 font-weight: bold;
131}145}
132146
133.tok-number_int, .tok-number_float {147.tok-number_int,
148.tok-number_float {
134 color: light-dark(#fe640b, #fab387);149 color: light-dark(#fe640b, #fab387);
135}150}
136151
...@@ -161,10 +176,12 @@ aside {...@@ -161,10 +176,12 @@ aside {
161 padding: 1rem;176 padding: 1rem;
162 border-radius: 0 1rem 1rem 0;177 border-radius: 0 1rem 1rem 0;
163 overflow-y: auto;178 overflow-y: auto;
164 width: 40ch;179 width: 35ch;
165}180}
166181
167#toc, #toc ul, #links {182#toc,
183#toc ul,
184#links {
168 list-style: none;185 list-style: none;
169}186}
170187
...@@ -236,7 +253,8 @@ aside a:hover {...@@ -236,7 +253,8 @@ aside a:hover {
236 margin: 0;253 margin: 0;
237}254}
238255
239#hidden-menu-checkbox, [name="tabs"] {256#hidden-menu-checkbox,
257[name="tabs"] {
240 display: block;258 display: block;
241 width: 1px;259 width: 1px;
242 height: 1px;260 height: 1px;
...@@ -245,7 +263,8 @@ aside a:hover {...@@ -245,7 +263,8 @@ aside a:hover {
245 left: -3px;263 left: -3px;
246}264}
247265
248#menu-btn, #clickable-background {266#menu-btn,
267#clickable-background {
249 display: none;268 display: none;
250}269}
251270
...@@ -279,12 +298,14 @@ main a:active {...@@ -279,12 +298,14 @@ main a:active {
279 text-decoration: none;298 text-decoration: none;
280}299}
281300
282.heading:hover, .heading:focus-visible {301.heading:hover,
302.heading:focus-visible {
283 text-decoration: underline;303 text-decoration: underline;
284 position: relative;304 position: relative;
285}305}
286306
287.heading:hover::before, .heading:focus-visible::before {307.heading:hover::before,
308.heading:focus-visible::before {
288 content: " #";309 content: " #";
289 color: var(--subtext-0);310 color: var(--subtext-0);
290 position: absolute;311 position: absolute;
...@@ -413,7 +434,8 @@ main a:active {...@@ -413,7 +434,8 @@ main a:active {
413 background-color: var(--surface-0);434 background-color: var(--surface-0);
414 }435 }
415436
416 #open, #close {437 #open,
438 #close {
417 display: none !important;439 display: none !important;
418 }440 }
419441
...@@ -448,7 +470,8 @@ pre > code {...@@ -448,7 +470,8 @@ pre > code {
448 padding: 0;470 padding: 0;
449}471}
450472
451pre, code {473pre,
474code {
452 border: 0;475 border: 0;
453 background-color: transparent;476 background-color: transparent;
454 font-family: var(--font-code);477 font-family: var(--font-code);
...@@ -475,7 +498,8 @@ pre, code {...@@ -475,7 +498,8 @@ pre, code {
475.file pre {498.file pre {
476 margin: 0;499 margin: 0;
477 padding: 0.75rem 0.5rem;500 padding: 0.75rem 0.5rem;
478 overflow-y: scroll;501 overflow-y: auto;
502 white-space: pre-wrap;
479 color: var(--text);503 color: var(--text);
480 position: relative;504 position: relative;
481}505}