source: at-w96k/public/css/custom.css@ cfff059

Last change on this file since cfff059 was cfff059, checked in by Mikhail Kirillov <w96k@…>, on Jul 17, 2022 at 11:06:29 AM

Change line-height

  • Property mode set to 100644
File size: 6.4 KB
Line 
1body {
2 padding: 0 1em 1em 1em;
3 background: #f0f0f0;
4}
5
6article,
7#footnotes {
8 max-width: calc(60ch + 4em);
9 border-radius: 0.1em;
10 margin: var(--universal-padding);
11 padding: 1em;
12 background: #fefefe;
13 box-shadow: 0 2px 2px rgba(0,0,0,.35);
14 position: relative;
15 border-radius: var(--universal-border-radius);
16 border: 1px solid #f0f0f0;
17}
18
19article p {
20 word-break: break-word;
21 hyphens: auto;
22 /* text-align: justify; */
23}
24
25.footdef {
26 margin-bottom: 0;
27}
28
29article h2 {
30 margin-top: 0;
31 padding: 0;
32}
33
34.navbar {
35 border: 0;
36 padding: 0 calc(var(--universal-padding) * 2.5);
37 position: relative;
38 top: 1em;
39 z-index: 999;
40}
41
42.navbar .button {
43 text-transform: none;
44 background: #fefefe;
45 box-shadow: 0 -2px 0 rgba(0,0,0,.35), 1px -1px 0px rgba(0,0,0,.15);
46 border-radius: 0.15em 0.15em 0 0;
47 text-decoration: underline;
48 color: var(--a-link-color);
49 padding: 4px 12px;
50 margin: 6px;
51}
52
53/* 16:9 */
54.video {
55 padding-top: 56.25%;
56 position: relative;
57 width: calc(100% - 1em);
58}
59
60iframe {
61 width: 100%;
62 min-height: 445px;
63 top: 0;
64 left: 0;
65 bottom: 0;
66 right: 0;
67}
68
69.cover {
70 margin: 0.5em 0;
71 border: 1px solid rgba(0,0,0,.3);
72 border-radius: 0.1em;
73}
74
75#youmu {
76 position: relative;
77 top: 1em;
78 margin-bottom: -0.5em;
79 max-width: 400px;
80 filter: drop-shadow(0 12px 4px rgba(0,0,0,.25));
81}
82
83#preamble {
84 max-width: calc(60ch + 6em);
85 margin: var(--universal-margin);
86}
87
88#postamble {
89 margin: var(--universal-margin);
90 max-width: calc(60ch + 7.75em);
91}
92
93#meta p {
94 text-align: right;
95}
96
97#copyright p {
98
99}
100
101@media screen and (max-width: 768px) {
102 #postamble, #meta {
103 text-align: center;
104 }
105}
106
107hr {
108 background: rgba(0,0,0,.05) !important;
109 height: 0.5rem !important;
110 margin: 1px !important;
111}
112
113@media screen and (max-width: 120ch) {
114 #table-of-contents {
115 display: none !important;
116 }
117}
118
119#table-of-contents {
120 display: block;
121 z-index: 1050;
122 font-size: 12pt;
123 position: fixed;
124 left: 75ch;
125 top: calc(var(--universal-margin) + 3.9rem);
126 background: #fefefe;
127 line-height: 12pt;
128 box-shadow: 0 2px 2px rgba(0,0,0,.35);
129 border: none;
130 max-height: calc(100% - 2 * (var(--universal-margin) + 0.5em) - 9em);
131 overflow: auto;
132 max-width: 30ch;
133 border-radius: var(--universal-border-radius);
134}
135
136#table-of-contents * {
137 padding: none;
138}
139
140#table-of-contents h2 {
141 font-size: 13pt;
142 margin: var(--universal-margin);
143 margin-top: calc(2 * var(--universal-margin));
144 border: 0;
145 font-weight: 400;
146 padding: .05em .5em;
147}
148
149#text-table-of-contents ul {
150 margin: 0 0 0 1em;
151}
152
153#text-table-of-contents > ul {
154 margin: 0 1em 0 2em;
155}
156
157#text-table-of-contents ul li {
158 font-size: 11pt;
159 width: 100%;
160}
161
162#table-of-contents #text-table-of-contents {
163 display: block;
164 text-align: left;
165 max-width: 35ch;
166}
167
168#table-of-contents li {
169 clear:both
170}
171
172.licenses {
173 text-align: center;
174 margin-top: 0.3em !important;
175}
176
177.licenses a:not(:first-child) {
178 margin-left: 0.5em;
179}
180
181.inline li {
182 display: inline-flex;
183}
184
185table {
186 overflow-x: hidden !important;
187}
188
189table th, table td {
190 padding: var(--universal-padding);
191}
192
193.org-left {
194 text-align: left !important;
195}
196
197dl {
198 padding: 0 calc(var(--universal-padding) + 1em);
199}
200
201nav * {
202 padding: 0.1em 0;
203}
204
205.abstract {
206 background: var(--nav-hover-back-color);
207 border-radius: 0.05em;
208 margin: 0 -1em;
209 padding: 0.25em 1em;
210}
211
212pre {
213 border: 1px solid #ccc;
214 box-shadow: none;
215 padding: 8pt;
216 overflow: auto;
217 margin: var(--universal-margin);
218 border-radius: var(--universal-border-radius);
219}
220
221figure {
222 text-align: center;
223}
224
225.org-svg {
226 width: auto;
227 max-width: 100%;
228}
229
230.asciicast {
231 text-align: center;
232}
233
234.iuse {
235
236}
237
238.iuse img {
239 height: 3em;
240}
241
242/* Style for WEBRING */
243.org-webring .org-webring-articles {
244 display: flex;
245 flex-flow: row wrap;
246}
247.org-webring .org-webring-article-title {
248 font-size: 0.1em !important;
249 padding: 0;
250 margin: 0 5em 0 9em;
251 border-radius: 0.25em;
252 max-height: 40ch;
253}
254.org-webring .org-webring-article {
255 flex: 1 1 auto;
256 flex-basis: 40%;
257 display: flex;
258 flex-direction: column;
259 margin: 0.5em;
260 transition: 0.3s;
261 opacity: 1;
262 overflow: hidden;
263 border-left: 3px solid rgba(0,0,0,.35);
264}
265.org-webring .org-webring-article:hover {
266 opacity: 1;
267}
268
269.org-webring .org-webring-article-pinned {
270 position: relative;
271 flex: 1 1 auto;
272 flex-basis: 100%;
273 display: flex;
274 flex-direction: column;
275 margin: 0 0.5rem;
276 padding: 0.5rem;
277 border: 0.15rem black solid;
278 border-color: black;
279 transition: 0.3s;
280 opacity: 1;
281}
282.org-webring .org-webring-article-pinned:hover {
283 opacity: 1;
284 background-color: #fefefe;
285}
286.org-webring .org-webring-article-pinned-symbol{
287 position: absolute;
288 top: 0.2rem;
289 right: 0.5rem;
290}
291.org-webring .org-webring-article-summary {
292 font-size: 0.8rem;
293 flex: 1 1 0;
294 display: none;
295}
296.org-webring .org-webring-attribution {
297 text-align: right;
298 font-size: 0.8rem;
299 padding-right: 0.5em;
300 color: #666;
301 display: none;
302}
303.org-webring .org-webring-article-date {
304 text-align: center;
305 display: none;
306}
307.org-webring .org-webring-article-source {
308 text-align: center;
309 display: none;
310}
311.org-webring .org-webring-timestamp {
312 color: #666;
313 display: none;
314}
315@media screen and (max-width: 600px) {
316 .org-webring .org-webring-articles {
317 display: flex;
318 flex-direction: column;
319 }
320}
321@media screen and (max-width: 600px) {
322 .org-webring .org-webring-article {
323 flex: 1 1 auto;
324 flex-basis: 100%;
325 display: flex;
326 flex-direction: column;
327 margin: 0 0.5rem;
328 margin-bottom: 0.5rem;
329 }
330 .org-webring .org-webring-article-pinned {
331 position: relative;
332 flex: 1 1 auto;
333 flex-basis: 100%;
334 display: flex;
335 flex-direction: column;
336 margin: 0 0.5rem;
337 margin-bottom: 0.5rem;
338 border: 0.15rem black solid;
339 border-color: black;
340 transition: 0.3s;
341 opacity: 1;
342 }
343}
344
345.org-webring > h4 {
346 display: none;
347}
348
349video {
350 max-width: 100%;
351 max-height: 40em;
352 display: block;
353 margin: 0 auto;
354}
355
356#content {
357 margin: 0 !important;
358}
359
360audio {
361 display: block;
362 width: calc(100% - var(--universal-padding) * 2);
363 margin: 0 var(--universal-padding);
364}
365
366ul ul {
367 margin: 0;
368}
369
370table tr td:nth-child(1) {
371 width: 20%;
372}
Note: See TracBrowser for help on using the repository browser.