source: public/css/custom.css@ eb2627e

Last change on this file since eb2627e was eb2627e, checked in by w96k <w96k.ru@…>, on Oct 11, 2022 at 11:50:11 AM

Add Zettelkasten notes as Digital Garden

  • Property mode set to 100644
File size: 3.8 KB
Line 
1:root {
2 --universal-margin: 0.5rem;
3 --universal-padding: 0.5rem;
4 --universal-border-radius: 0.2rem;
5 --a-link-color: blue;
6 --a-visited-color: #551A8B;
7}
8
9:link { color: #0000EE; }
10:visited { color: #551A8B; }
11
12html {
13 font-family: sans-serif;
14 /* line-height: 1.2; */
15}
16
17body {
18 padding: 0.5em;
19 background: #f0f0f0;
20}
21
22article,
23#footnotes,
24#content > :not(article):not(#table-of-contents) {
25 max-width: calc(60ch);
26 margin: var(--universal-padding);
27 padding: calc(var(--universal-padding) * 2);
28 background: #fefefe;
29 box-shadow: 0 1px 0px rgba(0,0,0,.1);
30 position: relative;
31 border-radius: var(--universal-border-radius);
32 border: 1px solid #cfcfcf;
33}
34
35article p {
36 word-break: break-word;
37 hyphens: auto;
38}
39
40.footdef {
41 margin-bottom: 0;
42}
43
44article h2 {
45 margin-top: 0;
46 padding: 0;
47}
48
49.navbar {
50 display: flex;
51 flex-direction: row;
52 border: 0;
53 position: relative;
54 z-index: 999;
55 /* top: calc(var(--universal-padding) - 2px); */
56}
57
58.navbar a {
59 text-transform: none;
60 background: #fefefe;
61 border: 1px solid rgba(0,0,0,.25);
62 box-shadow: 0 1px 0px rgba(0,0,0,.1);
63 border-radius: var(--universal-border-radius);
64 text-decoration: underline;
65 color: var(--a-link-color);
66 padding: 4px 12px;
67 margin-right: 6px;
68}
69
70.navbar a:visited {
71 color: purple;
72}
73
74#youmu {
75 position: relative;
76 top: 1em;
77 margin-bottom: -0.5em;
78 max-width: 400px;
79 filter: drop-shadow(0 12px 4px rgba(0,0,0,.25));
80}
81
82#preamble {
83 max-width: calc(60ch + 6em);
84 margin: var(--universal-margin);
85}
86
87#postamble {
88 margin: var(--universal-margin);
89 max-width: calc(76ch);
90 display: flex;
91 flex-direction: row;
92 justify-content: space-between;
93 font-size: 10pt;
94}
95
96#postamble p {
97 margin-top: 0;
98}
99
100#meta p {
101 text-align: right;
102}
103
104@media screen and (max-width: 120ch) {
105 #table-of-contents {
106 display: none !important;
107 }
108}
109
110#table-of-contents {
111 display: block;
112 z-index: 1050;
113 position: fixed;
114 left: 70ch;
115 background: #fefefe;
116 box-shadow: 0 1px 0px rgba(0,0,0,.1);
117 border-radius: var(--universal-border-radius);
118 border: 1px solid #cfcfcf;
119 max-height: calc(100% - 3 * (var(--universal-margin) + 0.5em) - 5em);
120 overflow: auto;
121 max-width: 35ch;
122 padding-right: 2em;
123}
124
125#table-of-contents * {
126 padding: none;
127}
128
129#table-of-contents h2 {
130 font-size: 12pt;
131 margin: var(--universal-margin);
132 margin-top: calc(2 * var(--universal-margin));
133 font-weight: 400;
134 padding: .05em .5em;
135}
136
137#text-table-of-contents ul li {
138 font-size: 11pt;
139 width: 100%;
140}
141
142.licenses {
143 text-align: center;
144 margin-top: 0.3em !important;
145}
146
147.licenses a:not(:first-child) {
148 margin-left: 0.5em;
149}
150
151nav * {
152 padding: 0.1em 0;
153}
154
155.abstract {
156 background: var(--nav-hover-back-color);
157 border-radius: 0.05em;
158 margin: 0 -1em;
159 padding: 0.25em 1em;
160}
161
162pre {
163 border: 1px solid #ccc;
164 box-shadow: none;
165 padding: 8pt;
166 overflow: auto;
167 margin: var(--universal-margin);
168 border-radius: var(--universal-border-radius);
169}
170
171.figure {
172 text-align: center;
173}
174
175.org-svg {
176 width: auto;
177 max-width: 100%;
178}
179
180.asciicast {
181 text-align: center;
182}
183
184img {
185 max-width: 100%;
186 border-radius: var(--universal-border-radius);
187}
188
189video {
190 max-width: 100%;
191 max-height: 40em;
192 display: block;
193 margin: 0 auto;
194}
195
196#content {
197 margin: 0 !important;
198}
199
200audio {
201 display: block;
202 width: calc(100% - var(--universal-padding) * 2);
203 margin: 0 var(--universal-padding);
204}
205
206table tr td:nth-child(1) {
207 width: 20%;
208}
209
210a {
211 text-decoration: underline;
212}
213
214a:hover {
215 text-decoration: underline;
216 background: #ddd;
217}
218
219a:active {
220 color: purple;
221 background: #ccc;
222}
223
224.abstract {
225 background: rgba(0,0,0,.1);
226}
227
228/* Org-mode */
229.done {color: green;}
230.todo {color: red;}
Note: See TracBrowser for help on using the repository browser.