Skip to content

Commit 41e243c

Browse files
author
GitHub Actions
committed
Deploy Wtoll/Website to Wtoll/Website:gh-pages
0 parents  commit 41e243c

File tree

12 files changed

+885
-0
lines changed

12 files changed

+885
-0
lines changed

‎.nojekyll‎

Whitespace-only changes.

‎404.html‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>404 Page Not Found</title>
7+
<link rel="stylesheet" href="https://wtoll.com/css/normalize.css">
8+
9+
10+
<link rel="stylesheet" href="https://wtoll.com/css/main.css">
11+
12+
13+
14+
</head>
15+
<body>
16+
<header>
17+
18+
<nav>
19+
<menu>
20+
21+
<li class="left"><a href="https://wtoll.com">Home</a></li>
22+
23+
<li ><a href="https://wtoll.com/posts/test">Test</a></li>
24+
25+
</menu>
26+
</nav>
27+
28+
</header>
29+
<main>
30+
31+
<div class="title">404</div>
32+
33+
</main>
34+
<footer>
35+
36+
37+
38+
</footer>
39+
</body>
40+
</html>

‎CNAME‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
wtoll.com

‎css/main.css‎

Lines changed: 237 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,237 @@
1+
:root {
2+
color-scheme: light dark;
3+
4+
--accent: light-dark(#00C2C2, #8AFFFF);
5+
6+
7+
8+
9+
--back: light-dark(#EDEDED, #222222);
10+
--text: light-dark(#222222, #EDEDED);
11+
12+
--layered: light-dark(#D9D9D9, #424242);
13+
--layered-pop: light-dark(#C4C4C4, #606060);
14+
15+
--subtle: light-dark(#7B7B7B, #AEAEAE);
16+
17+
18+
19+
20+
21+
22+
--code-background: var(--layered);
23+
}
24+
25+
26+
27+
div, h1, h2, h3, h4, h5, h6, p, li {
28+
color: var(--text);
29+
font-family: sans-serif;
30+
}
31+
32+
a {
33+
color: var(--accent);
34+
}
35+
36+
div.title {
37+
font-size: 2.5em;
38+
font-weight: bold;
39+
margin-block: 0.5em;
40+
}
41+
42+
43+
44+
45+
46+
47+
menu > li > a {
48+
text-decoration: none;
49+
}
50+
51+
52+
53+
54+
55+
56+
57+
58+
59+
60+
/* Checklists */
61+
li:has(> input[type="checkbox"]) {
62+
position: relative;
63+
list-style: none;
64+
margin-left: -1em;
65+
}
66+
67+
li > input[type="checkbox"] {
68+
opacity: 0;
69+
}
70+
71+
li:has(> input[type="checkbox"])::before {
72+
position: absolute;
73+
content: "";
74+
display: inline-block;
75+
background: var(--layered);
76+
width: 0.75em;
77+
aspect-ratio: 1;
78+
top: calc((100% - 0.75em) / 2);
79+
border-radius: 0.125em;
80+
}
81+
82+
li:has(> input[type="checkbox"][checked])::after {
83+
position: absolute;
84+
content: "";
85+
display: inline-block;
86+
width: 0.75em;
87+
aspect-ratio: 1;
88+
color: var(--subtle);
89+
background: conic-gradient(currentColor 0 0) no-repeat 50%/ 25% 100%, conic-gradient(currentColor 0 0) no-repeat 50%/ 100% 25%;
90+
transform: rotate(45deg);
91+
top: calc((100% - 0.75em) / 2);
92+
left: 0;
93+
}
94+
95+
/* Lists */
96+
ol, ul {
97+
padding-inline-start: 1.25em;
98+
}
99+
100+
/* Horizontal Rules */
101+
hr {
102+
border: 1px solid var(--layered-pop);
103+
border-radius: 1px;
104+
}
105+
106+
/* Code */
107+
code {
108+
background: var(--layered);
109+
padding: 0.125em;
110+
border-radius: 0.125em;
111+
}
112+
113+
/* Multiline Code */
114+
pre > code {
115+
background: unset;
116+
color: unset;
117+
}
118+
119+
pre:has(> code) {
120+
border-radius: 0.25em;
121+
}
122+
123+
pre:has(> code) code {
124+
display: grid;
125+
padding: 0px;
126+
}
127+
128+
pre:has(> code) code > span {
129+
padding: 0 0.25em;
130+
display: inline-block;
131+
}
132+
133+
pre:has(> code) code > span:first-child {
134+
padding-top: 0.25em;
135+
}
136+
137+
pre:has(> code) code > span:last-child {
138+
padding-bottom: 0.25em;
139+
}
140+
141+
/* Tables */
142+
table {
143+
border-collapse: collapse;
144+
background: var(--layered);
145+
border-radius: 0.25em;
146+
}
147+
148+
tbody tr:nth-child(odd) {
149+
background: var(--layered-pop);
150+
}
151+
152+
th {
153+
font-weight: normal;
154+
}
155+
156+
td, th {
157+
padding: 0.25em;
158+
}
159+
160+
161+
162+
163+
164+
165+
166+
167+
168+
169+
/* General structure */
170+
171+
body {
172+
min-height: 100vh;
173+
margin: 0;
174+
display: grid;
175+
grid-template-rows: auto 1fr auto;
176+
grid-template-columns: auto minmax(auto, 800px) auto;
177+
grid-template-areas:
178+
'header header header'
179+
'left main right'
180+
'footer footer footer';
181+
background: var(--back);
182+
column-gap: 20px;
183+
}
184+
185+
body > header {
186+
background: var(--back);
187+
position: sticky;
188+
top: 0;
189+
grid-area: header;
190+
display: grid;
191+
grid-template-columns: subgrid;
192+
}
193+
194+
body > main {
195+
grid-area: main;
196+
}
197+
198+
body > footer {
199+
text-align: center;
200+
grid-area: footer;
201+
padding: 0 20px;
202+
}
203+
204+
body > header, body > footer {
205+
padding-top: 0.5em;
206+
padding-bottom: 0.5em;
207+
}
208+
209+
210+
211+
212+
213+
/* Nav styles */
214+
215+
header > nav {
216+
grid-column: 2 / 3;
217+
}
218+
219+
header > nav > menu {
220+
margin: 0;
221+
padding: 0;
222+
list-style-type: none;
223+
}
224+
225+
header > nav > menu > li {
226+
float: right;
227+
}
228+
229+
header > nav > menu > .left {
230+
float: left;
231+
}
232+
233+
header > nav > menu > li > a {
234+
display: block;
235+
padding: 5px 10px;
236+
color: var(--text);
237+
}

0 commit comments

Comments
 (0)