Skip to content

Commit 7746f8f

Browse files
authored
Merge pull request #1 from vestauth/blog-3
Blog 3
2 parents bd00bf7 + baacda7 commit 7746f8f

6 files changed

Lines changed: 534 additions & 43 deletions

File tree

_config.yml

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -45,11 +45,9 @@ exclude:
4545
markdown: kramdown
4646
kramdown:
4747
input: GFM
48-
syntax_highlighter: none
49-
syntax_highlighter_opts:
50-
disable: true
48+
syntax_highlighter: rouge
5149

52-
highlighter: none
50+
highlighter: rouge
5351

5452
plugins:
5553
- jekyll-redirect-from

_includes/layouts/meta.html

Lines changed: 137 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,143 @@
4646
background-position: center;
4747
background-attachment: fixed;
4848
}
49+
50+
main :not(pre) > code {
51+
background: #f4f4f5;
52+
color: #111827;
53+
font-size: 0.9em;
54+
border-radius: 6px;
55+
padding: 0.08rem 0.32rem;
56+
}
57+
58+
main div.highlighter-rouge,
59+
main pre.highlight,
60+
main figure.highlight {
61+
margin-top: 0.15rem;
62+
margin-bottom: 1rem;
63+
background: #f5f8fc;
64+
border: 1px solid #d7e3f0;
65+
border-left: 3px solid #7aa2d6;
66+
border-radius: 10px;
67+
padding: 0.75rem 0.9rem;
68+
overflow-x: auto;
69+
font-size: 0.76rem;
70+
line-height: 1.55;
71+
}
72+
73+
main div.highlighter-rouge .highlight,
74+
main div.highlighter-rouge pre.highlight,
75+
main figure.highlight pre {
76+
margin: 0;
77+
border: 0;
78+
padding: 0;
79+
background: transparent;
80+
border-left: 0;
81+
border-radius: 0;
82+
font-size: inherit;
83+
overflow: visible;
84+
}
85+
86+
main div.highlighter-rouge code,
87+
main pre.highlight code {
88+
background: transparent;
89+
padding: 0;
90+
color: inherit;
91+
font-size: inherit;
92+
}
93+
94+
main .highlight .c,
95+
main .highlight .c1,
96+
main .highlight .cm {
97+
color: #64748b;
98+
font-style: italic;
99+
}
100+
101+
main .highlight .k,
102+
main .highlight .kd,
103+
main .highlight .kn,
104+
main .highlight .kp,
105+
main .highlight .kr,
106+
main .highlight .kt {
107+
color: #b45309;
108+
}
109+
110+
main .highlight .s,
111+
main .highlight .s1,
112+
main .highlight .s2,
113+
main .highlight .sb,
114+
main .highlight .se,
115+
main .highlight .sh {
116+
color: #0369a1;
117+
}
118+
119+
main .highlight .m,
120+
main .highlight .mi,
121+
main .highlight .mf {
122+
color: #be123c;
123+
}
124+
125+
main .highlight .na,
126+
main .highlight .nb,
127+
main .highlight .nc,
128+
main .highlight .nf,
129+
main .highlight .nx {
130+
color: #1d4ed8;
131+
}
132+
133+
@media (prefers-color-scheme: dark) {
134+
main :not(pre) > code {
135+
background: #0f141a;
136+
color: #e5e7eb;
137+
}
138+
139+
main div.highlighter-rouge,
140+
main pre.highlight,
141+
main figure.highlight {
142+
background: #0f141a;
143+
border-color: #27323d;
144+
border-left-color: #64748b;
145+
color: #e5e7eb;
146+
}
147+
148+
main .highlight .c,
149+
main .highlight .c1,
150+
main .highlight .cm {
151+
color: #7c8aa0;
152+
}
153+
154+
main .highlight .k,
155+
main .highlight .kd,
156+
main .highlight .kn,
157+
main .highlight .kp,
158+
main .highlight .kr,
159+
main .highlight .kt {
160+
color: #fbbf24;
161+
}
162+
163+
main .highlight .s,
164+
main .highlight .s1,
165+
main .highlight .s2,
166+
main .highlight .sb,
167+
main .highlight .se,
168+
main .highlight .sh {
169+
color: #34d399;
170+
}
171+
172+
main .highlight .m,
173+
main .highlight .mi,
174+
main .highlight .mf {
175+
color: #fb923c;
176+
}
177+
178+
main .highlight .na,
179+
main .highlight .nb,
180+
main .highlight .nc,
181+
main .highlight .nf,
182+
main .highlight .nx {
183+
color: #fda4af;
184+
}
185+
}
49186
</style>
50187
<script src="https://cdn.tailwindcss.com"></script>
51188
<script>

_layouts/blog.html

Lines changed: 12 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,6 @@
1818
font-size: 0.72rem;
1919
line-height: 1.65;
2020
color: #111827;
21-
text-transform: lowercase;
2221
}
2322

2423
.blog-topline {
@@ -88,6 +87,18 @@
8887
margin-bottom: 0.85rem;
8988
}
9089

90+
.blog-content blockquote {
91+
margin: 1rem 0;
92+
padding: 0.7rem 0.9rem;
93+
border-left: 3px solid #1a7f52;
94+
background: rgba(26, 127, 82, 0.06);
95+
color: #374151;
96+
}
97+
98+
.blog-content blockquote p:last-child {
99+
margin-bottom: 0;
100+
}
101+
91102
.blog-content ul,
92103
.blog-content ol {
93104
margin-top: 0;
@@ -111,31 +122,6 @@
111122
margin-bottom: 0.32rem;
112123
}
113124

114-
.blog-content code {
115-
background: #f4f4f5;
116-
color: #111827;
117-
font-size: 0.9em;
118-
border-radius: 6px;
119-
padding: 0.08rem 0.32rem;
120-
}
121-
122-
.blog-content pre {
123-
margin-top: 0.15rem;
124-
margin-bottom: 1rem;
125-
background: #f7f7f7;
126-
border: 1px solid #d9d9d9;
127-
border-radius: 10px;
128-
padding: 0.75rem 0.9rem;
129-
overflow-x: auto;
130-
font-size: 0.76rem;
131-
}
132-
133-
.blog-content pre code {
134-
background: transparent;
135-
padding: 0;
136-
font-size: inherit;
137-
}
138-
139125
.blog-content a {
140126
color: #1a7f52;
141127
text-decoration: underline;
@@ -195,13 +181,6 @@
195181
color: #a1a1aa;
196182
}
197183

198-
.blog-content code,
199-
.blog-content pre {
200-
background: #0d2219;
201-
border-color: #2f4f40;
202-
color: #f4f4f5;
203-
}
204-
205184
.blog-footer {
206185
border-top-color: #2f4f40;
207186
}

assets/img/blog/blog-3.png

430 KB
Loading

0 commit comments

Comments
 (0)