- commit
- ed3a7c3
- parent
- fbf32b2
- author
- Eric Bower
- date
- 2022-08-08 04:21:16 +0000 UTC
style(prose): update default styling - Increased header sizes - Increased font size - Tweaked colors for light mode - Tweaked blockquote padding
3 files changed,
+30,
-18
+1,
-1
1@@ -58,7 +58,7 @@
2 <article>
3 <div class="flex items-center">
4 <time datetime="{{.PublishAtISO}}" class="font-italic text-sm post-date">{{.PublishAt}}</time>
5- <h2 class="font-bold flex-1"><a href="{{.URL}}">{{.Title}}</a></h2>
6+ <div class="font-bold flex-1"><a href="{{.URL}}">{{.Title}}</a></div>
7 </div>
8 </article>
9 {{end}}
+1,
-1
1@@ -25,7 +25,7 @@
2 <div class="flex items-center">
3 <time datetime="{{.PublishAtISO}}" class="font-italic text-sm post-date">{{.PublishAt}}</time>
4 <div class="flex-1">
5- <h2 class="inline"><a href="{{.URL}}">{{.Title}}</a></h2>
6+ <div class="inline"><a href="{{.URL}}">{{.Title}}</a></div>
7 <address class="text-sm inline">
8 <a href="{{.BlogURL}}" class="link-grey">({{.Username}})</a>
9 </address>
+28,
-16
1@@ -12,13 +12,14 @@
2 @media (prefers-color-scheme: light) {
3 :root {
4 --white: #6a737d;
5- --code: rgba(255, 229, 100, 0.2);
6+ --code: #fff8d3;
7+ --code-border: #f0d547;
8 --pre: #f6f8fa;
9 --bg-color: #fff;
10 --text-color: #24292f;
11 --link-color: #005cc5;
12 --visited: #6f42c1;
13- --blockquote: #785840;
14+ --blockquote: #005cc5;
15 --blockquote-bg: #fff;
16 --hover: #d73a49;
17 --grey: #ccc;
18@@ -28,7 +29,8 @@
19 @media (prefers-color-scheme: dark) {
20 :root {
21 --white: #f2f2f2;
22- --code: #252525;
23+ --code: #414558;
24+ --code-border: #252525;
25 --pre: #252525;
26 --bg-color: #282a36;
27 --text-color: #f2f2f2;
28@@ -51,6 +53,7 @@ html {
29 -webkit-text-size-adjust: 100%;
30 -moz-tab-size: 4;
31 tab-size: 4;
32+ font-size: 17px;
33 }
34
35 body {
36@@ -69,16 +72,18 @@ b, strong {
37
38 code, kbd, samp, pre {
39 font-family: ui-monospace, SFMono-Regular, Consolas, 'Liberation Mono', Menlo, monospace;
40- font-size: 1rem;
41+ font-size: 0.8rem;
42 }
43
44 code, kbd, samp {
45 background-color: var(--code);
46+ border: 1px solid var(--code-border);
47 }
48
49 pre > code {
50 background-color: inherit;
51 padding: 0;
52+ border: none;
53 }
54
55 code {
56@@ -89,8 +94,8 @@ code {
57 pre {
58 border-radius: 5px;
59 padding: 1rem;
60+ margin: 1rem 0;
61 overflow-x: auto;
62- margin: 0;
63 background-color: var(--pre) !important;
64 }
65
66@@ -104,7 +109,7 @@ summary {
67
68 h1, h2, h3 {
69 margin: 0;
70- padding: 0;
71+ padding: 1rem 0 0 0;
72 border: 0;
73 font-style: normal;
74 font-weight: inherit;
75@@ -166,8 +171,12 @@ article {
76 blockquote {
77 border-left: 5px solid var(--blockquote);
78 background-color: var(--blockquote-bg);
79- padding: 0.5rem;
80- margin: 0.5rem 0;
81+ padding: 0.8rem;
82+ margin: 1rem 0;
83+}
84+
85+blockquote > p {
86+ margin: 0;
87 }
88
89 table {
90@@ -215,26 +224,29 @@ dd:not(:last-child) {
91 }
92
93 .md h1 {
94- font-size: 1.25rem;
95+ font-size: 1.85rem;
96 line-height: 1.15;
97 font-weight: bold;
98- padding: 0.5rem 0;
99+ padding: 1rem 0 0 0;
100 }
101
102 .md h2 {
103- font-size: 1.125rem;
104+ font-size: 1.45rem;
105 line-height: 1.15;
106 font-weight: bold;
107- padding: 0.5rem 0;
108+ padding: 1rem 0 0 0;
109 }
110
111 .md h3 {
112+ font-size: 1.25rem;
113 font-weight: bold;
114+ padding: 1rem 0 0 0;
115 }
116
117 .md h4 {
118- font-size: 0.875rem;
119+ font-size: 1rem;
120 font-weight: bold;
121+ padding: 1rem 0 0 0;
122 }
123
124 .post-date {
125@@ -246,17 +258,17 @@ dd:not(:last-child) {
126 }
127
128 .text-2xl {
129- font-size: 1.5rem;
130+ font-size: 1.85rem;
131 line-height: 1.15;
132 }
133
134 .text-xl {
135- font-size: 1.25rem;
136+ font-size: 1.45rem;
137 line-height: 1.15;
138 }
139
140 .text-lg {
141- font-size: 1.125rem;
142+ font-size: 1.25rem;
143 line-height: 1.15;
144 }
145