summaryrefslogtreecommitdiff
path: root/themes/hugo-coder/assets/scss/_content.scss
diff options
context:
space:
mode:
authorRyan Schanzenbacher <ryan@rschanz.org>2021-12-26 00:30:09 -0500
committerRyan Schanzenbacher <ryan@rschanz.org>2021-12-26 00:30:09 -0500
commit98a21b966410c127e74b16e7a2817882ee16560f (patch)
treeee646c86e3d3f0fa1cd952294d49feeeb700d60f /themes/hugo-coder/assets/scss/_content.scss
parente6eec31b71ab728f6610f4e764b2e206fb95f940 (diff)
convert theme from submodule to regular files
Diffstat (limited to 'themes/hugo-coder/assets/scss/_content.scss')
m---------themes/hugo-coder0
-rw-r--r--themes/hugo-coder/assets/scss/_content.scss240
2 files changed, 240 insertions, 0 deletions
diff --git a/themes/hugo-coder b/themes/hugo-coder
deleted file mode 160000
Subproject 55b2a150f990bc56364dba347bc9acc6aab07be
diff --git a/themes/hugo-coder/assets/scss/_content.scss b/themes/hugo-coder/assets/scss/_content.scss
new file mode 100644
index 0000000..bb2720c
--- /dev/null
+++ b/themes/hugo-coder/assets/scss/_content.scss
@@ -0,0 +1,240 @@
1.content {
2 flex: 1;
3 display: flex;
4 margin-top: 1.6rem;
5 margin-bottom: 3.2rem;
6
7 article {
8 details {
9 summary {
10 cursor: pointer;
11 }
12 }
13
14 header {
15 margin-top: 6.4rem;
16 margin-bottom: 3.2rem;
17
18 h1 {
19 font-size: 4.2rem;
20 line-height: 4.6rem;
21 margin: 0;
22
23 @media only screen and (max-width: 768px) {
24 font-size: 4rem;
25 line-height: 4.4rem;
26 }
27 }
28 }
29
30 footer {
31 margin-top: 4rem;
32
33 .see-also {
34 margin: 3.2rem 0;
35
36 h3 {
37 margin: 3.2rem 0;
38 }
39 }
40 }
41
42 p {
43 text-align: justify;
44 text-justify: auto;
45 hyphens: auto;
46 }
47 }
48
49 .post {
50 .post-title {
51 margin-bottom: 0.75em;
52 }
53
54 .post-meta {
55 i {
56 text-align: center;
57 width: 1.6rem;
58 margin-left: 0;
59 margin-right: 0.5rem;
60 }
61
62 .date {
63 .posted-on {
64 margin-left: 0;
65 margin-right: 1.5rem;
66 }
67 }
68
69 .tags {
70 .tag {
71 display: inline-block;
72 padding: 0.3rem 0.6rem;
73 background-color: $alt-bg-color;
74 border-radius: 0.6rem;
75 line-height: 1.4em;
76
77 a {
78 color: $fg-color;
79 }
80 a:active {
81 color: $fg-color;
82 }
83 }
84 }
85 }
86 }
87
88 figure {
89 margin: 0;
90 padding: 0;
91 }
92
93 figcaption p {
94 text-align: center;
95 font-style: italic;
96 font-size: 1.6rem;
97 margin: 0;
98 }
99}
100
101.avatar img {
102 width: 20rem;
103 height: auto;
104 border-radius: 50%;
105
106 @media only screen and (max-width: 768px) {
107 width: 10rem;
108 }
109}
110
111.list {
112 ul {
113 margin: 3.2rem 0 3.2rem 0;
114 list-style: none;
115 padding: 0;
116
117 li {
118 font-size: 1.8rem;
119
120 @media only screen and (max-width: 768px) {
121 margin: 1.6rem 0 1.6rem 0;
122 }
123
124 .date {
125 display: inline-block;
126 flex: 1;
127 width: 20rem;
128 text-align: right;
129 margin-right: 3rem;
130
131 @media only screen and (max-width: 768px) {
132 display: block;
133 text-align: left;
134 }
135 }
136
137 .title {
138 font-size: 1.8rem;
139 flex: 2;
140 color: $fg-color;
141 font-family: $font-family;
142 font-weight: 700;
143
144 &:hover,
145 &:focus {
146 color: $link-color;
147 }
148 }
149 }
150 }
151
152 ul:not(.pagination) {
153 li {
154 @media only screen and (min-width: 768.1px) {
155 display: flex;
156 }
157 }
158 }
159}
160
161.centered {
162 display: flex;
163 align-items: center;
164 justify-content: center;
165
166 .about {
167 text-align: center;
168
169 h1 {
170 margin-top: 2rem;
171 margin-bottom: 0.5rem;
172 }
173
174 h2 {
175 margin-top: 1rem;
176 margin-bottom: 0.5rem;
177 font-size: 2.4rem;
178
179 @media only screen and (max-width: 768px) {
180 font-size: 2rem;
181 }
182 }
183
184 ul {
185 list-style: none;
186 margin: 3rem 0 1rem 0;
187 padding: 0;
188
189 li {
190 display: inline-block;
191 position: relative;
192
193 a {
194 color: $fg-color;
195 text-transform: uppercase;
196 margin-left: 1rem;
197 margin-right: 1rem;
198 font-size: 1.6rem;
199
200 &:hover,
201 &:focus {
202 color: $link-color;
203 }
204
205 @media only screen and (max-width: 768px) {
206 font-size: 1.4rem;
207 }
208
209 i {
210 font-size: 3.2rem;
211 }
212 }
213 }
214 }
215 }
216
217 .error {
218 text-align: center;
219
220 h1 {
221 margin-top: 2rem;
222 margin-bottom: 0.5rem;
223 font-size: 4.6rem;
224
225 @media only screen and (max-width: 768px) {
226 font-size: 3.2rem;
227 }
228 }
229
230 h2 {
231 margin-top: 2rem;
232 margin-bottom: 3.2rem;
233 font-size: 3.2rem;
234
235 @media only screen and (max-width: 768px) {
236 font-size: 2.8rem;
237 }
238 }
239 }
240}