coppermind 0.1.7 → 3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,359 @@
1
+ .container {
2
+ max-width: $md-screen;
3
+ padding-left: var(--spacer);
4
+ padding-right: var(--spacer);
5
+ margin-left: auto;
6
+ margin-right: auto;
7
+ }
8
+
9
+ @media screen and (min-width: $md-screen) {
10
+ .container {
11
+ padding-left: var(--spacer-2);
12
+ padding-right: var(--spacer-2);
13
+ }
14
+ }
15
+
16
+ /**
17
+ * Header
18
+ */
19
+
20
+ .masthead {
21
+ padding-top: var(--spacer);
22
+ padding-bottom: var(--spacer);
23
+ margin-bottom: var(--spacer-3);
24
+ }
25
+
26
+ .masthead-title {
27
+ font-size: 1.3em;
28
+ font-weight: bold;
29
+
30
+ a {
31
+ color: inherit;
32
+ text-decoration: none;
33
+ }
34
+
35
+ .tagline {
36
+ padding-left: var(--spacer);
37
+ opacity: .5;
38
+ }
39
+ }
40
+
41
+ .nav-list {
42
+ padding: 0;
43
+ margin: var(--spacer) 0 0 0;
44
+ border-top: 1px solid var(--border-color);
45
+ border-bottom: 1px solid var(--border-color);
46
+ list-style: none;
47
+
48
+ li {
49
+ display: inline-block;
50
+ margin: 0 .4em;
51
+ }
52
+
53
+ a {
54
+ color: inherit;
55
+
56
+ &:hover,
57
+ &:focus {
58
+ text-decoration: underline;
59
+ }
60
+ }
61
+
62
+ a.current {
63
+ text-decoration: underline;
64
+ }
65
+ }
66
+
67
+ /**
68
+ * Post
69
+ */
70
+
71
+ .posts {
72
+ .post {
73
+ padding: var(--spacer);
74
+ margin-bottom: var(--spacer);
75
+ border: 1px solid var(--border-color);
76
+ border-radius: var(--border-radius);
77
+
78
+ .post-excerpt {
79
+ margin-bottom: 0;
80
+ }
81
+ }
82
+ }
83
+
84
+ .page,
85
+ .post {
86
+ margin-bottom: var(--spacer-2);
87
+
88
+ h1, h2, h3, h4, h5, h6 {
89
+ color: var(--heading-color);
90
+ }
91
+ }
92
+
93
+ .page-title,
94
+ .post-title {
95
+ margin-top: 0;
96
+
97
+ a {
98
+ color: inherit;
99
+ }
100
+ }
101
+
102
+ .post-meta {
103
+ display: block;
104
+ margin-top: -.5em;
105
+ margin-bottom: var(--spacer);
106
+ opacity: .65;
107
+ font-size: .85em;
108
+ }
109
+
110
+ .post-categories,
111
+ .post-tags {
112
+ display: inline-block;
113
+ list-style: none;
114
+ padding: 0;
115
+ margin: 0;
116
+
117
+ li {
118
+ display: inline-block;
119
+
120
+ &:not(:last-child) {
121
+ margin-right: .4em;
122
+ }
123
+ }
124
+ }
125
+
126
+ .post-category {
127
+ border-bottom: 2px dotted var(--border-color);
128
+ }
129
+
130
+ a.post-category {
131
+ color: inherit;
132
+
133
+ &:hover,
134
+ &:focus {
135
+ border-bottom-style: solid;
136
+ border-color: var(--body-color);
137
+ text-decoration: none;
138
+ }
139
+ }
140
+
141
+ .post-tag {
142
+ padding: .1em .5em;
143
+ border: 1px solid var(--border-color);
144
+ border-radius: var(--border-radius);
145
+ background-color: rgba(var(--link-color-rgb), .3);
146
+ }
147
+
148
+ a.post-tag {
149
+ color: inherit;
150
+
151
+ &:hover,
152
+ &:focus {
153
+ background-color: rgba(var(--link-color-rgb), .6);
154
+ text-decoration: none;
155
+ }
156
+ }
157
+
158
+ // Footnote number within body text
159
+ a[href^="#fn:"],
160
+ // Back to footnote link
161
+ a[href^="#fnref:"] {
162
+ display: inline-block;
163
+ margin-left: .1em;
164
+ font-weight: bold;
165
+ }
166
+ // List of footnotes
167
+ .footnotes {
168
+ margin-top: var(--spacer-2);
169
+ font-size: 85%;
170
+ }
171
+
172
+ .related {
173
+ padding-top: var(--spacer-2);
174
+ padding-bottom: var(--spacer-2);
175
+ margin-bottom: var(--spacer-2);
176
+ border-top: 1px solid var(--border-color);
177
+ border-bottom: 1px solid var(--border-color);
178
+ }
179
+
180
+ .related-title {
181
+ margin-top: 0;
182
+ }
183
+
184
+ .related-posts {
185
+ padding-left: 0;
186
+ list-style: none;
187
+
188
+ small {
189
+ opacity: .5;
190
+ }
191
+ }
192
+
193
+ /**
194
+ * Code
195
+ */
196
+
197
+ .highlight {
198
+ border-radius: var(--border-radius);
199
+ background-color: var(--code-bg-color);
200
+ }
201
+
202
+ .rouge-table {
203
+ margin: 0;
204
+ font-size: 100%;
205
+
206
+ &,
207
+ td,
208
+ th {
209
+ border: 0;
210
+ padding: 0;
211
+ }
212
+
213
+ pre {
214
+ padding: 0;
215
+ margin: 0;
216
+ }
217
+
218
+ .gutter {
219
+ vertical-align: top;
220
+ user-select: none;
221
+ opacity: .25;
222
+ padding-right: var(--spacer);
223
+ }
224
+ }
225
+
226
+ /**
227
+ * Pagination
228
+ */
229
+
230
+ .pagination {
231
+ display: flex;
232
+ text-align: center;
233
+ margin-top: var(--spacer-2);
234
+ }
235
+
236
+ .pagination-item {
237
+ float: left;
238
+ width: 50%;
239
+ padding: var(--spacer);
240
+ border: 1px solid var(--border-color);
241
+
242
+ &:first-child {
243
+ border-right-width: 0;
244
+ border-top-left-radius: var(--border-radius);
245
+ border-bottom-left-radius: var(--border-radius);
246
+ }
247
+ &:last-child {
248
+ border-top-right-radius: var(--border-radius);
249
+ border-bottom-right-radius: var(--border-radius);
250
+ }
251
+ }
252
+
253
+ a.pagination-item:hover {
254
+ background-color: var(--border-color);
255
+ text-decoration: none;
256
+ }
257
+
258
+ /**
259
+ * Footer
260
+ */
261
+
262
+ .footer {
263
+ padding-top: var(--spacer);
264
+ padding-bottom: var(--spacer);
265
+ margin-top: var(--spacer-3);
266
+
267
+ p {
268
+ margin: 0;
269
+ }
270
+ }
271
+
272
+ .social-icons {
273
+ list-style: none;
274
+ padding: 0;
275
+ margin: var(--spacer) 0;
276
+ height: calc(var(--body-line-height) * var(--body-font-size));
277
+ }
278
+ .social-icon-item {
279
+ float: left;
280
+ margin-right: var(--spacer);
281
+ }
282
+
283
+ @media screen and (min-width: $md-screen) {
284
+ .footer {
285
+ display: flex;
286
+ }
287
+ .footer-column {
288
+ width: 100%;
289
+ }
290
+ .social-icons {
291
+ margin: 0;
292
+ }
293
+ }
294
+
295
+ /**
296
+ * Archive
297
+ */
298
+
299
+ .taxonomies-wrapper {
300
+ margin-bottom: var(--spacer-2);
301
+ }
302
+
303
+ .taxonomies {
304
+ list-style: none;
305
+ display: grid;
306
+ grid-column-gap: 2em;
307
+ grid-template-columns: repeat(2, 1fr);
308
+ margin: 0;
309
+ padding: 0;
310
+ font-weight: bold;
311
+
312
+ .taxonomy {
313
+ display: flex;
314
+ padding: 0.25em 0;
315
+ justify-content: space-between;
316
+ text-decoration: none;
317
+ border-bottom: 1px solid;
318
+ margin-bottom: var(--spacer);
319
+ }
320
+ }
321
+
322
+ .post-list-by-taxonomy {
323
+ time {
324
+ font-family: monospace;
325
+ }
326
+ }
327
+
328
+ .back-to-top {
329
+ display: block;
330
+ font-size: 0.8em;
331
+ text-transform: uppercase;
332
+ text-align: right;
333
+ text-decoration: none;
334
+ }
335
+
336
+ @media (min-width: $sm-screen) {
337
+ .taxonomies {
338
+ grid-template-columns: repeat(3, 1fr);
339
+ }
340
+ }
341
+
342
+ /**
343
+ * Markdown TOC
344
+ */
345
+
346
+ #markdown-toc {
347
+ padding: var(--spacer-2) var(--spacer-3);
348
+ margin: var(--spacer-2) 0;
349
+ border: solid var(--border-color);
350
+ border-width: 1px 0;
351
+
352
+ &::before {
353
+ display: block;
354
+ margin-left: calc(var(--spacer-3) * -1);
355
+ content: "Contents";
356
+ font-size: 85%;
357
+ font-weight: 500;
358
+ }
359
+ }
@@ -0,0 +1,59 @@
1
+ // Some predefined classes
2
+
3
+ /**
4
+ * Message -- Show different levels of alert messages to users.
5
+ */
6
+
7
+ .message-info,
8
+ .message-warning,
9
+ .message-danger {
10
+ padding: var(--spacer);
11
+ border-radius: var(--border-radius);
12
+ color: var(--body-bg-color);
13
+ }
14
+
15
+ .message-info {
16
+ background-color: var(--info-color);
17
+ }
18
+
19
+ .message-warning {
20
+ background-color: var(--warning-color);
21
+ }
22
+
23
+ .message-danger {
24
+ background-color: var(--danger-color);
25
+ }
26
+
27
+ /**
28
+ * Alignment
29
+ */
30
+
31
+ .align-right {
32
+ margin-bottom: 1rem;
33
+ margin-left: 1rem;
34
+ float: right;
35
+ }
36
+
37
+ .align-left {
38
+ margin-right: 1rem;
39
+ margin-bottom: 1rem;
40
+ float: left;
41
+ }
42
+
43
+ .align-center {
44
+ display: block;
45
+ margin-right: auto;
46
+ margin-left: auto;
47
+ }
48
+
49
+ figcaption.align-right {
50
+ text-align: right;
51
+ }
52
+
53
+ figcaption.align-left {
54
+ text-align: left;
55
+ }
56
+
57
+ figcaption.align-center {
58
+ text-align: center;
59
+ }
@@ -0,0 +1,54 @@
1
+ $sm-screen: 35.5rem;
2
+ $md-screen: 48rem;
3
+ $lg-screen: 64rem;
4
+ $xl-screen: 80rem;
5
+
6
+ :root {
7
+ --spacer: 1rem;
8
+ --spacer-2: calc(var(--spacer) * 2);
9
+ --spacer-3: calc(var(--spacer) * 3);
10
+
11
+ // https://github.com/necolas/normalize.css/issues/665
12
+ --body-font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
13
+ --body-font-size: 16px;
14
+ --body-line-height: 1.5;
15
+
16
+ --border-radius: .5em;
17
+
18
+ // https://qwtel.com/posts/software/the-monospaced-system-ui-css-font-stack/
19
+ --code-font-family: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro", "Fira Mono", "Droid Sans Mono", "Courier New", monospace;
20
+
21
+ /**
22
+ * Color
23
+ */
24
+ --body-bg-color: var(--oc-white);
25
+ --body-color: var(--oc-gray-9);
26
+ --code-bg-color: var(--oc-gray-1);
27
+ --heading-color: var(--oc-black);
28
+ --border-color: var(--oc-gray-4);
29
+ --link-color: var(--oc-blue-9);
30
+ --link-color-rgb: var(--oc-blue-9-rgb);
31
+ --link-hover-color: var(--oc-blue-7);
32
+ --info-color: var(--oc-green-9);
33
+ --warning-color: var(--oc-yellow-9);
34
+ --danger-color: var(--oc-red-9);
35
+ }
36
+
37
+ @media (prefers-color-scheme: dark) {
38
+ :root {
39
+ /**
40
+ * Color
41
+ */
42
+ --body-bg-color: var(--oc-gray-9);
43
+ --body-color: var(--oc-gray-4);
44
+ --code-bg-color: var(--oc-gray-7);
45
+ --heading-color: var(--oc-white);
46
+ --border-color: var(--oc-gray-7);
47
+ --link-color: var(--oc-cyan-4);
48
+ --link-color-rgb: var(--oc-cyan-4-rgb);
49
+ --link-hover-color: var(--oc-cyan-6);
50
+ --info-color: var(--oc-green-1);
51
+ --warning-color: var(--oc-yellow-1);
52
+ --danger-color: var(--oc-red-1);
53
+ }
54
+ }
@@ -0,0 +1,9 @@
1
+ @import "variables";
2
+ @import "base";
3
+ @import "layout";
4
+ @import "predefined";
5
+
6
+ @import "highlight-light";
7
+ @media (prefers-color-scheme: dark) {
8
+ @import "highlight-dark";
9
+ }
@@ -0,0 +1,3 @@
1
+ ---
2
+ ---
3
+ @import "monophase/main";