Skip to content

Commit f873c68

Browse files
committed
improve website styling (WIP)
1 parent 1c56826 commit f873c68

6 files changed

Lines changed: 34 additions & 22 deletions

File tree

webui/src/assets/github-dark.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,12 +9,12 @@
99
padding: 3px 5px
1010
}
1111
pre:has(code.hljs) {
12-
background: #0d1117;
12+
background: var(--code-background);
1313
}
1414

1515
.hljs {
1616
color: #BBBBBB;
17-
background: #0d1117
17+
background: var(--code-background)
1818
}
1919

2020
.hljs-doctag,

webui/src/assets/github.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,12 +9,12 @@
99
padding: 3px 5px
1010
}
1111
pre:has(code.hljs) {
12-
background: #f6f8fa;
12+
background: var(--code-background);
1313
}
1414

1515
.hljs {
1616
color: #24292e;
17-
background: #f6f8fa;
17+
background: var(--code-background);
1818
}
1919

2020
.hljs-doctag,

webui/src/assets/main.css

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,18 +44,24 @@ main {
4444
h1 {
4545
font-size: 2.3rem;
4646
font-weight: 700;
47+
margin-top: 32px;
48+
margin-bottom: 18px;
4749
}
4850

4951
h2 {
5052
font-size: 1.7rem;
5153
font-weight: 700;
5254
margin-block-start: 2.5rem;
5355
margin-block-end: 1rem;
56+
margin-top: 28px;
57+
margin-bottom: 16px;
5458
}
5559

5660
h3 {
5761
font-size: 1.25rem;
5862
font-weight: 700;
63+
margin-top: 24px;
64+
margin-bottom: 14px;
5965
}
6066

6167
h4 {

webui/src/assets/vars.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -100,6 +100,8 @@
100100

101101
--badge-background: #eabaabff;
102102

103+
--code-background: #0d1117;
104+
103105
--footer-background: #282b33;
104106
}
105107

@@ -176,5 +178,7 @@
176178

177179
--badge-background: rgb(8, 109, 215);
178180

181+
--code-background: #f6f8fa;
182+
179183
--footer-background: rgb(244 244 246);
180184
}

webui/src/composables/markdown-tabs.ts

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -55,11 +55,13 @@ export function MarkdownItTabs(md: MarkdownIt, opts: Options) {
5555
</div>`
5656
}
5757

58-
return `<div class="nav code-tabs" id="tab-${counter}" role="tablist">
59-
${tabs}
60-
</div>
61-
<div class="tab-content code" id="tabContent-${counter}">
62-
${contents}
58+
return `<div class="code">
59+
<div class="nav code-tabs" id="tab-${counter}" role="tablist">
60+
${tabs}
61+
</div>
62+
<div class="tab-content code" id="tabContent-${counter}">
63+
${contents}
64+
</div>
6365
</div>`
6466

6567
}

webui/src/views/DocsView.vue

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -203,39 +203,37 @@ function formatParam(label: any): string {
203203
font-size: 0.9rem;
204204
}
205205
.content {
206-
line-height: 1.63;
207-
font-size: 1.15rem;
206+
line-height: 1.5rem;
207+
font-size: 1rem;
208208
}
209209
210210
.content h1 {
211-
margin-top: 1.2rem;
212-
margin-bottom: 1.6rem;
213211
font-size: 2.25rem;
214212
}
215213
216214
.content h2 {
217-
margin-top: 1.6rem;
218-
margin-bottom: 1rem;
219-
font-size: 1.8rem;
215+
font-size: 1.55rem;
220216
}
221217
222218
.content h2 > * {
223219
vertical-align: middle;display: inline-block;
224220
padding-right: 5px;
225221
}
226222
223+
.content h2 > a {
224+
padding-right: 0;
225+
}
226+
227227
.content h2 > svg path {
228228
fill: var(--link-color);
229229
}
230230
231231
.content h3 {
232-
margin-top: 1.3rem;
233-
margin-bottom: 0.75rem;
234232
font-size: 1.4rem;
235233
}
236234
237235
.content p {
238-
margin-bottom: 20px;
236+
margin-bottom: 12px;
239237
}
240238
241239
.content ul {
@@ -266,7 +264,7 @@ table {
266264
text-align: start;
267265
width: 100%;
268266
margin-bottom: 20px;
269-
font-size: 1rem;
267+
font-size: 0.9rem;
270268
}
271269
table.selectable td {
272270
cursor: pointer;
@@ -304,7 +302,7 @@ pre {
304302
margin-bottom: 1rem;
305303
white-space: pre-wrap;
306304
word-break: break-all;
307-
border-radius: 6px;
305+
box-shadow: none;
308306
line-height: 1.4;
309307
font-family: Menlo,Monaco,Consolas,"Courier New",monospace !important;
310308
font-size: 0.85rem;
@@ -325,7 +323,9 @@ code {
325323
font-size: 1rem;
326324
margin-bottom: 0.5rem;
327325
}
328-
326+
.code {
327+
background-color: var(--code-background);
328+
}
329329
.code-tabs {
330330
margin-top: 1rem;
331331
}

0 commit comments

Comments
 (0)