├── .github
└── workflows
│ └── nodejs.yml
├── .gitignore
├── .vscode
└── settings.json
├── LICENSE
├── config.json
└── themes
└── pure-ejs
├── assets
├── css
│ ├── SourceSansPro.css
│ ├── notablog.css
│ └── theme.css
└── fonts
│ ├── source-sans-pro-v13-latin-600.woff
│ ├── source-sans-pro-v13-latin-600.woff2
│ ├── source-sans-pro-v13-latin-600italic.woff
│ ├── source-sans-pro-v13-latin-600italic.woff2
│ ├── source-sans-pro-v13-latin-700.woff
│ ├── source-sans-pro-v13-latin-700.woff2
│ ├── source-sans-pro-v13-latin-700italic.woff
│ ├── source-sans-pro-v13-latin-700italic.woff2
│ ├── source-sans-pro-v13-latin-italic.woff
│ ├── source-sans-pro-v13-latin-italic.woff2
│ ├── source-sans-pro-v13-latin-regular.woff
│ └── source-sans-pro-v13-latin-regular.woff2
├── layouts
├── index.html
├── partials
│ ├── articleList.html
│ ├── footer.html
│ ├── head.html
│ └── navbar.html
├── post.html
└── tag.html
└── manifest.json
/.github/workflows/nodejs.yml:
--------------------------------------------------------------------------------
1 | name: Node.js Reference Test
2 |
3 | on:
4 | push:
5 |
6 | jobs:
7 | build:
8 | runs-on: ubuntu-latest
9 | steps:
10 | - uses: actions/checkout@v2
11 | - uses: actions/setup-node@v2
12 | with:
13 | node-version: "16"
14 | - name: Generate the test blog
15 | run: |
16 | npm i -g notablog
17 | notablog generate .
18 | env:
19 | CI: true
20 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # Node.js
2 | node_modules/
3 | pnpm-lock.yaml
4 |
5 | # macOS
6 | .DS_Store
7 | .AppleDouble
8 | .LSOverride
9 |
10 | # Sass
11 | .sass-cache/
12 | *.css.map
13 | *.sass.map
14 | *.scss.map
15 |
16 | # VSCode
17 | .vscode/*
18 | !.vscode/settings.json
19 | !.vscode/tasks.json
20 | !.vscode/launch.json
21 | !.vscode/extensions.json
22 |
23 | # Project
24 | TODO.md
25 | public/
26 | cache/
27 | *.log
--------------------------------------------------------------------------------
/.vscode/settings.json:
--------------------------------------------------------------------------------
1 | {
2 | "telemetry.enableCrashReporter": false
3 | }
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2019-present Wen-Zhi Wang
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/config.json:
--------------------------------------------------------------------------------
1 | {
2 | "url": "https://www.notion.so/b6fcf809ca5047b89f423948dce013a0?v=03ddc4d6130a47f8b68e74c9d0061de2",
3 | "theme": "pure-ejs",
4 | "previewBrowser": "/usr/bin/chromium",
5 | "autoSlug": true
6 | }
7 |
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/css/SourceSansPro.css:
--------------------------------------------------------------------------------
1 | /* source-sans-pro-regular - latin */
2 | @font-face {
3 | font-family: 'Source Sans Pro';
4 | font-style: normal;
5 | font-weight: 400;
6 | src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'),
7 | url('../fonts/source-sans-pro-v13-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
8 | url('../fonts/source-sans-pro-v13-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
9 | }
10 | /* source-sans-pro-600 - latin */
11 | @font-face {
12 | font-family: 'Source Sans Pro';
13 | font-style: normal;
14 | font-weight: 600;
15 | src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'),
16 | url('../fonts/source-sans-pro-v13-latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
17 | url('../fonts/source-sans-pro-v13-latin-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
18 | }
19 | /* source-sans-pro-600italic - latin */
20 | @font-face {
21 | font-family: 'Source Sans Pro';
22 | font-style: italic;
23 | font-weight: 600;
24 | src: local('Source Sans Pro SemiBold Italic'), local('SourceSansPro-SemiBoldItalic'),
25 | url('../fonts/source-sans-pro-v13-latin-600italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
26 | url('../fonts/source-sans-pro-v13-latin-600italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
27 | }
28 | /* source-sans-pro-italic - latin */
29 | @font-face {
30 | font-family: 'Source Sans Pro';
31 | font-style: italic;
32 | font-weight: 400;
33 | src: local('Source Sans Pro Italic'), local('SourceSansPro-Italic'),
34 | url('../fonts/source-sans-pro-v13-latin-italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
35 | url('../fonts/source-sans-pro-v13-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
36 | }
37 | /* source-sans-pro-700 - latin */
38 | @font-face {
39 | font-family: 'Source Sans Pro';
40 | font-style: normal;
41 | font-weight: 700;
42 | src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'),
43 | url('../fonts/source-sans-pro-v13-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
44 | url('../fonts/source-sans-pro-v13-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
45 | }
46 | /* source-sans-pro-700italic - latin */
47 | @font-face {
48 | font-family: 'Source Sans Pro';
49 | font-style: italic;
50 | font-weight: 700;
51 | src: local('Source Sans Pro Bold Italic'), local('SourceSansPro-BoldItalic'),
52 | url('../fonts/source-sans-pro-v13-latin-700italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
53 | url('../fonts/source-sans-pro-v13-latin-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
54 | }
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/css/notablog.css:
--------------------------------------------------------------------------------
1 | :root {
2 | --bg: rgb(250, 250, 246);
3 | --bg-blur: rgba(250, 250, 246, 0.4);
4 | }
5 |
6 | body {
7 | background: var(--bg);
8 | }
9 |
10 | /* Navbar */
11 |
12 | .Navbar {
13 | display: flex;
14 | align-items: center;
15 | font-size: 16px;
16 | position: fixed;
17 | top: 0;
18 | left: 0;
19 | z-index: 999;
20 | width: 100%;
21 | height: 50px;
22 | padding: 10px 20px;
23 | /* Background blur stuff. */
24 | background-color: var(--bg-blur);
25 | -webkit-backdrop-filter: blur(20px);
26 | backdrop-filter: blur(20px);
27 | overflow-x: auto;
28 | }
29 |
30 | .Navbar a {
31 | color: inherit;
32 | text-decoration: none;
33 | }
34 |
35 | .Navbar a:last-child > .Navbar__Btn {
36 | /* .nav padding 20px */
37 | margin-right: 20px;
38 | }
39 |
40 | .Navbar__Btn {
41 | border-radius: 0.25rem;
42 | padding: 0 6px;
43 | line-height: 1.8125;
44 | transition: background 30ms ease-in-out 0s;
45 | /* For centering inline image */
46 | display: flex;
47 | align-items: center;
48 | }
49 |
50 | .Navbar__Btn:hover {
51 | background: rgba(55, 53, 47, 0.08);
52 | }
53 |
54 | .Navbar__Btn:active {
55 | background: rgba(55, 53, 47, 0.16);
56 | }
57 |
58 | .Navbar__Btn > span {
59 | white-space: nowrap;
60 | }
61 |
62 | .Navbar__Btn > span:not(:first-child) {
63 | margin-left: 6px;
64 | }
65 |
66 | .Navbar__Delim {
67 | margin: 0 3px;
68 | color: rgba(55, 53, 47, 0.4);
69 | }
70 |
71 | /* Common */
72 |
73 | .Header,
74 | .PageRoot,
75 | .ArticleList {
76 | width: 900px;
77 | max-width: 100%;
78 | margin: 0px auto;
79 | padding: 0px 96px;
80 | }
81 |
82 | @media only screen and (max-width: 900px) {
83 | .Header,
84 | .PageRoot,
85 | .ArticleList {
86 | max-width: 87.5%;
87 | padding-left: 0px;
88 | padding-right: 0px;
89 | }
90 | }
91 |
92 | /* Header */
93 |
94 | .Header a {
95 | color: inherit;
96 | text-decoration: none;
97 | }
98 |
99 | .Header__Cover {
100 | position: absolute;
101 | top: 0;
102 | right: 0;
103 | /* Firefox need this while Chrome doesn't. */
104 | left: 0;
105 | z-index: -1;
106 | }
107 |
108 | .Header__Cover > img {
109 | height: calc(30vh + 50px);
110 | width: 100%;
111 | object-fit: cover;
112 | }
113 |
114 | .Header__Spacer {
115 | margin-top: 30vh;
116 | }
117 |
118 | .Header__Spacer--NoCover {
119 | margin-top: calc(50px + 2.5rem);
120 | }
121 |
122 | .Header__Icon {
123 | line-height: 1.1;
124 | /* On Android Firefox, emoji can't be displayed if font-size > 77px. */
125 | font-size: 75px;
126 | }
127 |
128 | .Header__Title {
129 | margin-top: 2.5rem;
130 | margin-bottom: 0.25em;
131 | line-height: 1.2;
132 | font-size: 2.625rem;
133 | font-weight: 700;
134 | letter-spacing: -0.005em;
135 | }
136 |
137 | .Header > *:last-child {
138 | margin-bottom: 2.5rem;
139 | }
140 |
141 | .Header__DescBigQuoteMark {
142 | font-size: 1.5em;
143 | line-height: 0;
144 | }
145 |
146 | /* DateTagBar */
147 |
148 | .DateTagBar {
149 | font-size: 0.9rem;
150 | line-height: 1.2;
151 | display: flex;
152 | flex-wrap: wrap;
153 | }
154 |
155 | .DateTagBar__Item {
156 | margin-right: 8px;
157 | margin-bottom: 8px;
158 | padding: 2px 6px;
159 | border-radius: 0.25rem;
160 | }
161 |
162 | .DateTagBar__Date {
163 | color: hsla(45, 2%, 40%, 1);
164 | padding-left: 0px;
165 | padding-right: 8px;
166 | }
167 |
168 | .DateTagBar__Tag {
169 | font-size: 0.85rem;
170 | white-space: nowrap;
171 | }
172 |
173 | .DateTagBar__Tag--default {
174 | color: rgb(50, 48, 44);
175 | background: rgba(227, 226, 224, 0.5);
176 | }
177 |
178 | .DateTagBar__Tag--gray {
179 | color: rgb(50, 48, 44);
180 | background: rgb(227, 226, 224);
181 | }
182 |
183 | .DateTagBar__Tag--brown {
184 | color: rgb(68, 42, 30);
185 | background: rgb(238, 224, 218);
186 | }
187 |
188 | .DateTagBar__Tag--orange {
189 | color: rgb(73, 41, 14);
190 | background: rgb(250, 222, 201);
191 | }
192 |
193 | .DateTagBar__Tag--yellow {
194 | color: rgb(64, 44, 27);
195 | background: rgb(253, 236, 200);
196 | }
197 |
198 | .DateTagBar__Tag--green {
199 | color: rgb(28, 56, 41);
200 | background: rgb(219, 237, 219);
201 | }
202 |
203 | .DateTagBar__Tag--blue {
204 | color: rgb(24, 51, 71);
205 | background: rgb(211, 229, 239);
206 | }
207 |
208 | .DateTagBar__Tag--purple {
209 | color: rgb(65, 36, 84);
210 | background: rgb(232, 222, 238);
211 | }
212 |
213 | .DateTagBar__Tag--pink {
214 | color: rgb(76, 35, 55);
215 | background: rgb(245, 224, 233);
216 | }
217 |
218 | .DateTagBar__Tag--red {
219 | color: rgb(93, 23, 21);
220 | background: rgb(255, 226, 221);
221 | }
222 |
223 | .DateTagBar__Tag > a {
224 | border: none;
225 | }
226 |
227 | /* Article */
228 |
229 | .Article {
230 | margin: 2rem 0;
231 | }
232 |
233 | .Article a {
234 | color: inherit;
235 | text-decoration: none;
236 | }
237 |
238 | .Article__Title {
239 | margin: 0;
240 | padding-bottom: 0.5rem;
241 | line-height: 1.5;
242 | font-size: 1.4rem;
243 | font-weight: 600;
244 | letter-spacing: -0.01em;
245 | }
246 |
247 | .Article__Title > a {
248 | border-bottom: 2px solid hsl(45, 8%, 85%);
249 | }
250 |
251 | .Article__Title > a:not(:first-child) {
252 | margin-left: 5px;
253 | }
254 |
255 | .Article__Title > a:hover {
256 | border-bottom: 2px solid hsl(45, 8%, 55%);
257 | }
258 |
259 | .Article__Desc {
260 | padding-bottom: 0.5rem;
261 | }
262 |
263 | /* PageRoot (content body) */
264 |
265 | .PageRoot {
266 | padding-bottom: 0;
267 | padding-top: 0;
268 | }
269 |
270 | /* Footer */
271 |
272 | .Footer {
273 | display: flex;
274 | flex-wrap: wrap;
275 | align-items: center;
276 | justify-content: center;
277 | font-size: 14px;
278 | padding: 5rem 3rem;
279 | color: rgba(55, 53, 47, 0.6);
280 | }
281 |
282 | .Footer > div:nth-child(2) {
283 | margin: 0 3px;
284 | }
285 |
286 | .Footer a {
287 | color: rgba(55, 53, 47);
288 | }
289 |
290 | @media only screen and (max-width: 680px) {
291 | * {
292 | -webkit-tap-highlight-color: transparent;
293 | }
294 | .Navbar {
295 | box-shadow: rgba(15, 15, 15, 0.1) 0px 1px 0px, transparent 0px 0px 0px;
296 | }
297 | .Navbar__Btn {
298 | font-size: 14px;
299 | }
300 | .Header__Icon {
301 | font-size: 55px;
302 | }
303 | .Header__Cover > img {
304 | height: calc(30vh + 30px);
305 | }
306 | }
307 |
308 | @supports (not (backdrop-filter: blur(20px))) and
309 | (not (-webkit-backdrop-filter: blur(20px))) {
310 | .Navbar {
311 | background-color: var(--bg);
312 | }
313 | }
314 |
315 | .inline-img-icon {
316 | height: 1.2em;
317 | /* Setting width prevents content shifting after image loaded. */
318 | width: 1.2em;
319 | vertical-align: sub;
320 | }
321 |
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/css/theme.css:
--------------------------------------------------------------------------------
1 | /* Primitives */
2 |
3 | * {
4 | box-sizing: border-box;
5 | }
6 |
7 | *::selection {
8 | background: rgba(45, 170, 219, 0.3);
9 | }
10 |
11 | :root {
12 | --color-text-default: rgb(55, 53, 47);
13 | --color-text-default-light: rgba(55, 53, 47, 0.6);
14 | --color-text-gray: rgb(155, 154, 151);
15 | --color-text-brown: rgb(100, 71, 58);
16 | --color-text-orange: rgb(217, 115, 13);
17 | --color-text-yellow: rgb(223, 171, 1);
18 | --color-text-green: rgb(15, 123, 108);
19 | --color-text-blue: rgb(11, 110, 153);
20 | --color-text-purple: rgb(105, 64, 165);
21 | --color-text-pink: rgb(173, 26, 114);
22 | --color-text-red: rgb(224, 62, 62);
23 | --color-bg-default: rgb(255, 255, 255);
24 | --color-bg-gray: rgb(235, 236, 237);
25 | --color-bg-gray-light: rgba(235, 236, 237, 0.3);
26 | --color-bg-brown: rgb(233, 229, 227);
27 | --color-bg-brown-light: rgba(233, 229, 227, 0.3);
28 | --color-bg-orange: rgb(250, 235, 221);
29 | --color-bg-orange-light: rgba(250, 235, 221, 0.3);
30 | --color-bg-yellow: rgb(251, 243, 219);
31 | --color-bg-yellow-light: rgba(251, 243, 219, 0.3);
32 | --color-bg-green: rgb(221, 237, 234);
33 | --color-bg-green-light: rgba(221, 237, 234, 0.3);
34 | --color-bg-blue: rgb(221, 235, 241);
35 | --color-bg-blue-light: rgba(221, 235, 241, 0.3);
36 | --color-bg-purple: rgb(234, 228, 242);
37 | --color-bg-purple-light: rgba(234, 228, 242, 0.3);
38 | --color-bg-pink: rgb(244, 223, 235);
39 | --color-bg-pink-light: rgba(244, 223, 235, 0.3);
40 | --color-bg-red: rgb(251, 228, 228);
41 | --color-bg-red-light: rgba(251, 228, 228, 0.3);
42 | --color-pill-default: rgba(206, 205, 202, 0.5);
43 | --color-pill-gray: rgba(155, 154, 151, 0.4);
44 | --color-pill-brown: rgba(140, 46, 0, 0.2);
45 | --color-pill-orange: rgba(245, 93, 0, 0.2);
46 | --color-pill-yellow: rgba(233, 168, 0, 0.2);
47 | --color-pill-green: rgba(0, 135, 107, 0.2);
48 | --color-pill-blue: rgba(0, 120, 223, 0.2);
49 | --color-pill-purple: rgba(103, 36, 222, 0.2);
50 | --color-pill-pink: rgba(221, 0, 129, 0.2);
51 | --color-pill-red: rgba(255, 0, 26, 0.2);
52 | --color-ui-hover-bg: rgba(55, 53, 47, 0.08);
53 | --column-spacing: 46px;
54 | }
55 |
56 | body {
57 | color: var(--color-text-default);
58 | fill: currentColor;
59 | font-family: 'Source Sans Pro', -apple-system, 'BlinkMacSystemFont',
60 | 'Segoe UI', 'Roboto', 'Helvetica Neue', 'Arial', 'Noto Sans', sans-serif,
61 | 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
62 | margin: 0;
63 | }
64 |
65 | code {
66 | /* Use monospace before Courier so font looks better on Android Chrome. */
67 | font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace,
68 | Courier;
69 | }
70 |
71 | p {
72 | margin: 0;
73 | }
74 |
75 | /* Anchor */
76 |
77 | .Anchor {
78 | color: inherit;
79 | text-decoration: none;
80 | padding-right: 4px;
81 | margin-left: -20px;
82 | visibility: hidden;
83 | }
84 |
85 | /* Audio */
86 |
87 | .Audio {
88 | width: 100%;
89 | }
90 |
91 | /* Bookmark */
92 |
93 | .Bookmark {
94 | margin: 4px 0;
95 | border: 1px solid rgba(55, 53, 47, 0.16);
96 | border-radius: 5px;
97 | padding: 12px 14px 14px;
98 | transition: background 120ms ease-in 0s;
99 | }
100 |
101 | .Bookmark:hover {
102 | background: var(--color-ui-hover-bg);
103 | }
104 |
105 | .Bookmark > a {
106 | color: inherit;
107 | text-decoration: none;
108 | }
109 |
110 | .Bookmark__Title {
111 | margin: 0;
112 | margin-bottom: 2px;
113 | font-size: 0.875rem;
114 | font-weight: normal;
115 | white-space: nowrap;
116 | overflow: hidden;
117 | text-overflow: ellipsis;
118 | }
119 |
120 | .Bookmark__Desc {
121 | margin: 0;
122 | font-size: 0.75rem;
123 | line-height: 1rem;
124 | opacity: 0.6;
125 | height: 2rem;
126 | overflow: hidden;
127 | }
128 |
129 | .Bookmark__Link {
130 | margin: 0;
131 | margin-top: 6px;
132 | font-size: 0.75rem;
133 | line-height: 1rem;
134 | white-space: nowrap;
135 | overflow: hidden;
136 | text-overflow: ellipsis;
137 | }
138 |
139 | /* BulletedList */
140 |
141 | .BulletedListWrapper {
142 | margin: 2px 0;
143 | padding-left: calc(1.5em + 4px);
144 | line-height: 1.5;
145 | list-style-type: disc;
146 | }
147 |
148 | .BulletedList {
149 | margin: 2px 0;
150 | padding-top: 3px;
151 | padding-bottom: 3px;
152 | }
153 |
154 | /* Callout */
155 |
156 | .Callout {
157 | display: flex;
158 | border-radius: 5px;
159 | padding: 16px 16px 16px 12px;
160 | margin: 4px 0;
161 | background: var(--color-bg-gray-light);
162 | }
163 |
164 | .Callout__Icon {
165 | width: 1.5em;
166 | line-height: 1.5em;
167 | }
168 |
169 | .Callout__Content {
170 | margin-left: 8px;
171 | }
172 |
173 | /* Code */
174 |
175 | pre.Code {
176 | border-radius: 5px;
177 | background-color: rgb(247, 246, 243);
178 | margin: 10px 0;
179 | padding: 26px 16px;
180 | overflow: auto;
181 | }
182 |
183 | pre.Code code {
184 | background-color: rgb(247, 246, 243);
185 | color: rgb(55, 53, 47);
186 | font-size: 0.9em;
187 | line-height: 1.4;
188 | padding: 0;
189 | word-wrap: break-word;
190 | tab-size: 2;
191 | }
192 |
193 | .Code.Code--NoWrap .SemanticString {
194 | white-space: pre;
195 | }
196 |
197 | /* Collection */
198 |
199 | .CollectionInline > h3 {
200 | line-height: 1.75;
201 | font-size: 1.25rem;
202 | font-weight: 700;
203 | margin-top: 0.5rem;
204 | margin-bottom: 1px;
205 | padding: 3px 2px;
206 | }
207 |
208 | .CollectionInline > h3:hover > .Anchor {
209 | visibility: visible;
210 | }
211 |
212 | .Table {
213 | overflow-x: auto;
214 | }
215 |
216 | .Table > table {
217 | width: 100%;
218 | font-size: 0.875rem;
219 | /* No double border */
220 | border-collapse: collapse;
221 | /* Force the table respects widths set on | */
222 | table-layout: fixed;
223 | /* Make space between table and scrollbar */
224 | margin-bottom: 10px;
225 | }
226 |
227 | .Table > table td,
228 | .Table > table th {
229 | /* For | and unknown | */
230 | padding: 0 8px;
231 | height: 2rem;
232 | border: 1px solid rgba(55, 53, 47, 0.09);
233 | overflow: hidden;
234 | word-break: break-word;
235 | }
236 |
237 | .Table > table td:first-child,
238 | .Table > table th:first-child {
239 | border-left: none;
240 | }
241 |
242 | .Table > table td:last-child,
243 | .Table > table th:last-child {
244 | border-right: none;
245 | }
246 |
247 | .Table > table th {
248 | text-align: left;
249 | font-weight: normal;
250 | color: var(--color-text-default-light);
251 | /* Default width, which may be overridden by inline style attr. */
252 | width: 200px;
253 | }
254 |
255 | .Table__CellTitle > a {
256 | color: inherit;
257 | text-decoration: none;
258 | border-bottom: 2px solid hsl(45, 8%, 85%);
259 | }
260 |
261 | .Table__CellTitle > a:hover {
262 | border-bottom: 2px solid hsl(45, 8%, 55%);
263 | }
264 |
265 | .Table__CellText {
266 | padding: 6px 8px;
267 | line-height: 1.5;
268 | }
269 |
270 | .Table__CellSelect {
271 | /* 3px + 3px (margin of span) = 6px (desired) */
272 | padding: 3px 8px;
273 | }
274 |
275 | .Table__CellCheckbox {
276 | padding: 6px 8px;
277 | }
278 |
279 | .Table__CellCheckbox > div {
280 | display: flex;
281 | align-items: center;
282 | justify-content: center;
283 | width: 1rem;
284 | height: 1rem;
285 | }
286 |
287 | .Table__CellCheckbox--No svg {
288 | width: 100%;
289 | height: 100%;
290 | display: block;
291 | flex-shrink: 0;
292 | backface-visibility: hidden;
293 | }
294 |
295 | .Table__CellCheckbox--Yes svg {
296 | width: 12px;
297 | height: 12px;
298 | display: block;
299 | fill: white;
300 | flex-shrink: 0;
301 | backface-visibility: hidden;
302 | }
303 |
304 | .Gallery {
305 | display: grid;
306 | grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
307 | grid-auto-rows: 1fr;
308 | gap: 16px;
309 | border-top: 1px solid rgba(55, 53, 47, 0.16);
310 | padding-top: 16px;
311 | padding-bottom: 4px;
312 | }
313 |
314 | .Gallery__Item {
315 | box-shadow: rgba(15, 15, 15, 0.1) 0px 0px 0px 1px,
316 | rgba(15, 15, 15, 0.1) 0px 2px 4px;
317 | border-radius: 5px;
318 | transition: background 120ms ease-in 0s;
319 | position: relative;
320 | /* 10:7 */
321 | /* padding-top: 70%; */
322 | }
323 |
324 | .Gallery__Item:hover {
325 | background: rgba(55, 53, 47, 0.03);
326 | }
327 |
328 | .Gallery__Item > a {
329 | color: inherit;
330 | text-decoration: none;
331 | }
332 |
333 | /* .Gallery__Item>a>div {
334 | position: absolute;
335 | top: 0;
336 | right: 0;
337 | bottom: 0;
338 | left: 0;
339 | } */
340 |
341 | /* This is the key to make the layout robust. */
342 |
343 | /* .Gallery__Item>a>div>div {
344 | grid-item-title has padding-top 8px, padding-bottom 10px, and its line-height.
345 | Since we can not get line-height with CSS, so just assign a large enough value.
346 | height: calc(100% - 18px - 2rem);
347 | } */
348 |
349 | .Gallery__Item__Cover {
350 | box-shadow: rgba(55, 53, 47, 0.09) 0px -1px 0px 0px inset;
351 | height: 200px;
352 | }
353 |
354 | .Gallery__Item__Cover > img {
355 | width: 100%;
356 | height: 100%;
357 | max-height: 200px;
358 | border-radius: 5px 5px 0 0;
359 | object-fit: cover;
360 | object-position: center 50%;
361 | padding-bottom: 1px;
362 | }
363 |
364 | .Gallery__Item__Cover--Contain > img {
365 | object-fit: contain;
366 | }
367 |
368 | .Gallery__Item__Title {
369 | padding: 8px 10px 6px;
370 | overflow: hidden;
371 | text-overflow: ellipsis;
372 | }
373 |
374 | .Gallery__Item__Title .SemanticString {
375 | white-space: nowrap;
376 | }
377 |
378 | .Gallery__Item__Property {
379 | display: flex;
380 | align-items: center;
381 | font-size: 0.75rem;
382 | height: 1.5rem;
383 | white-space: nowrap;
384 | overflow: hidden;
385 | padding: 0px 10px;
386 | }
387 |
388 | .Gallery__Item__Property:last-child {
389 | margin-bottom: 10px;
390 | }
391 |
392 | .Gallery__Item__PropertyText .SemanticString {
393 | white-space: nowrap;
394 | }
395 |
396 | @supports not (display: grid) {
397 | .Gallery__Item {
398 | margin-top: 16px;
399 | }
400 | }
401 |
402 | /* ColorfulBlock */
403 |
404 | .ColorfulBlock--ColorDefault {
405 | color: var(--color-text-default);
406 | }
407 |
408 | .ColorfulBlock--ColorGray {
409 | color: var(--color-text-gray);
410 | }
411 |
412 | .ColorfulBlock--ColorBrown {
413 | color: var(--color-text-brown);
414 | }
415 |
416 | .ColorfulBlock--ColorOrange {
417 | color: var(--color-text-orange);
418 | }
419 |
420 | .ColorfulBlock--ColorYellow {
421 | color: var(--color-text-yellow);
422 | }
423 |
424 | .ColorfulBlock--ColorGreen {
425 | color: var(--color-text-green);
426 | }
427 |
428 | .ColorfulBlock--ColorBlue {
429 | color: var(--color-text-blue);
430 | }
431 |
432 | .ColorfulBlock--ColorPurple {
433 | color: var(--color-text-purple);
434 | }
435 |
436 | .ColorfulBlock--ColorPink {
437 | color: var(--color-text-pink);
438 | }
439 |
440 | .ColorfulBlock--ColorRed {
441 | color: var(--color-text-red);
442 | }
443 |
444 | .ColorfulBlock--BgDefault {
445 | background: var(--color-bg-default);
446 | }
447 |
448 | .ColorfulBlock--BgGray {
449 | background: var(--color-bg-gray);
450 | }
451 |
452 | .ColorfulBlock--BgBrown {
453 | background: var(--color-bg-brown);
454 | }
455 |
456 | .ColorfulBlock--BgOrange {
457 | background: var(--color-bg-orange);
458 | }
459 |
460 | .ColorfulBlock--BgYellow {
461 | background: var(--color-bg-yellow);
462 | }
463 |
464 | .ColorfulBlock--BgGreen {
465 | background: var(--color-bg-green);
466 | }
467 |
468 | .ColorfulBlock--BgBlue {
469 | background: var(--color-bg-blue);
470 | }
471 |
472 | .ColorfulBlock--BgPurple {
473 | background: var(--color-bg-purple);
474 | }
475 |
476 | .ColorfulBlock--BgPink {
477 | background: var(--color-bg-pink);
478 | }
479 |
480 | .ColorfulBlock--BgRed {
481 | background: var(--color-bg-red);
482 | }
483 |
484 | /* ColumnList */
485 |
486 | .ColumnList {
487 | display: flex;
488 | flex-wrap: wrap;
489 | }
490 |
491 | .Column {
492 | padding: 12px 0;
493 | word-break: break-word;
494 | }
495 |
496 | .Column:not(:first-child) {
497 | margin-left: var(--column-spacing);
498 | }
499 |
500 | @media only screen and (max-width: 680px) {
501 | .Column {
502 | width: 100% !important;
503 | margin-left: 0 !important;
504 | }
505 | }
506 |
507 | /* Divider */
508 |
509 | .Divider {
510 | width: 100%;
511 | border: 1px solid rgba(55, 53, 47, 0.09);
512 | }
513 |
514 | .Divider2 {
515 | width: 100%;
516 | height: calc(1.5rem + 10px);
517 | color: #1f2225;
518 | background-image: linear-gradient(
519 | to right,
520 | rgb(31, 34, 37) 25%,
521 | rgb(255, 255, 255) 0%
522 | );
523 | background-position: left center;
524 | background-size: 6px 1px;
525 | background-repeat: repeat-x;
526 | }
527 |
528 | /* Embed */
529 |
530 | .Embed__Content {
531 | display: flex;
532 | }
533 |
534 | .Embed__Caption {
535 | padding: 6px 2px;
536 | color: var(--color-text-default-light);
537 | font-size: 0.875em;
538 | }
539 |
540 | .Embed__ResponsiveContainer {
541 | position: relative;
542 | min-height: 100px;
543 | height: 0;
544 | margin: 0 auto;
545 | }
546 |
547 | .Embed__ResponsiveContainer > iframe {
548 | position: absolute;
549 | left: 0px;
550 | top: 0px;
551 | width: 100%;
552 | height: 100%;
553 | border: none;
554 | border-radius: 1px;
555 | pointer-events: auto;
556 | background-color: rgb(247, 246, 245);
557 | }
558 |
559 | /* Equation */
560 |
561 | .Equation {
562 | margin: 4px 0;
563 | padding: 4px 8px;
564 | }
565 |
566 | /* File */
567 |
568 | .File {
569 | color: inherit;
570 | text-decoration: none;
571 | }
572 |
573 | .File > div {
574 | display: flex;
575 | padding: 5px 0;
576 | margin: 2px 0;
577 | border-radius: 5px;
578 | transition: background 120ms ease-in 0s;
579 | }
580 |
581 | .File > div:hover {
582 | background: var(--color-ui-hover-bg);
583 | }
584 |
585 | .File__Icon {
586 | margin-left: 2px;
587 | margin-right: 4px;
588 | width: 1.5em;
589 | text-align: center;
590 | }
591 |
592 | .File__Title {
593 | line-height: 1.5;
594 | }
595 |
596 | .File__Size {
597 | margin-left: 6px;
598 | color: var(--color-text-default-light);
599 | font-size: 0.75em;
600 | }
601 |
602 | /* Heading */
603 |
604 | .Heading {
605 | margin-bottom: 1px;
606 | padding: 3px 2px;
607 | }
608 |
609 | /* Font-related CSS should be applied on ".SemanticString". */
610 | .Heading .SemanticString {
611 | font-weight: 600;
612 | letter-spacing: -0.01em;
613 | }
614 |
615 | .Heading:hover > .Anchor {
616 | visibility: visible;
617 | }
618 |
619 | .Heading--1 .SemanticString {
620 | font-size: 2.0625rem;
621 | line-height: 1.515;
622 | }
623 |
624 | .Heading--2 {
625 | margin-top: 1rem;
626 | }
627 |
628 | .Heading--2 .SemanticString {
629 | font-size: 1.625rem;
630 | line-height: 1.538;
631 | }
632 |
633 | .Heading--3 {
634 | margin-top: 0.5rem;
635 | }
636 |
637 | .Heading--3 .SemanticString {
638 | font-size: 1.25rem;
639 | line-height: 1.55;
640 | }
641 |
642 | .Heading--4 .SemanticString {
643 | font-size: 1rem;
644 | line-height: 1.563;
645 | }
646 |
647 | .Heading--5 .SemanticString {
648 | font-size: 0.8125rem;
649 | line-height: 1.615;
650 | color: #888;
651 | }
652 |
653 | .Column > .Heading:first-child {
654 | margin-top: 2px;
655 | }
656 |
657 | /* Icon */
658 |
659 | .Icon {
660 | /* For emoji */
661 | text-align: center;
662 | /* For image */
663 | border-radius: 3px;
664 | }
665 |
666 | /* Image */
667 |
668 | .Image {
669 | margin-top: 0.5em;
670 | margin-bottom: 0.5em;
671 | align-self: center;
672 | }
673 |
674 | .Image--FullWidth {
675 | width: calc(100vw - 15px);
676 | }
677 |
678 | .Image--Normal,
679 | .Image--PageWidth {
680 | max-width: 100%;
681 | }
682 |
683 | .Image--Normal {
684 | text-align: center;
685 | }
686 |
687 | .Image--PageWidth {
688 | width: 100%;
689 | }
690 |
691 | .Image > figure {
692 | margin: 0;
693 | }
694 |
695 | .Image > figure > figcaption {
696 | color: var(--color-text-default-light);
697 | font-size: 0.875rem;
698 | text-align: left;
699 | }
700 |
701 | .Image--FullWidth > figure img {
702 | /* 15px is scrollbar */
703 | width: calc(100vw - 15px);
704 | object-fit: cover;
705 | }
706 |
707 | .Image--FullWidth > figure > figcaption {
708 | padding: 6px 26px;
709 | }
710 |
711 | .Image--Normal > figure img,
712 | .Image--PageWidth > figure img {
713 | max-width: 100%;
714 | object-fit: contain;
715 | }
716 |
717 | .Image--Normal > figure > figcaption,
718 | .Image--PageWidth > figure > figcaption {
719 | padding: 6px 2px;
720 | }
721 |
722 | /* NumberedList */
723 |
724 | .NumberedListWrapper {
725 | margin: 2px 0;
726 | padding-left: calc(1.5em + 4px);
727 | line-height: 1.5;
728 | }
729 |
730 | .NumberedList {
731 | margin: 2px 0;
732 | padding-top: 3px;
733 | padding-bottom: 3px;
734 | }
735 |
736 | /* Page */
737 |
738 | .PageRoot {
739 | display: flex;
740 | flex-direction: column;
741 | }
742 |
743 | .PageRoot--FullWidth {
744 | width: 100%;
745 | }
746 |
747 | .Page {
748 | color: inherit;
749 | text-decoration: none;
750 | }
751 |
752 | .Page > div {
753 | display: flex;
754 | padding: 3px 0;
755 | margin: 2px 0;
756 | border-radius: 5px;
757 | transition: background 120ms ease-in 0s;
758 | }
759 |
760 | .Page > div:hover {
761 | background: var(--color-ui-hover-bg);
762 | }
763 |
764 | .Page__Icon {
765 | display: flex;
766 | align-items: center;
767 | justify-content: center;
768 | width: 1.5em;
769 | margin-left: 2px;
770 | margin-right: 4px;
771 | }
772 |
773 | .Page__Title .SemanticStringArray {
774 | border-bottom: 1px solid rgba(55, 53, 47, 0.16);
775 | }
776 |
777 | /* PDF */
778 |
779 | .PDF__Content {
780 | text-align: center;
781 | }
782 |
783 | .PDF__Content > embed {
784 | max-width: 100%;
785 | }
786 |
787 | .PDF__Caption {
788 | padding: 6px 2px;
789 | color: var(--color-text-default-light);
790 | font-size: 0.875em;
791 | }
792 |
793 | /* Pill */
794 |
795 | .Pill {
796 | padding: 0 6px;
797 | border-radius: 3px;
798 | white-space: nowrap;
799 | display: inline-block;
800 | /* margin of inline-block does not collapse */
801 | margin: 3px 0;
802 | margin-right: 6px;
803 | }
804 |
805 | .Pill--ColorDefault {
806 | background: var(--color-pill-default);
807 | }
808 |
809 | .Pill--ColorGray {
810 | background: var(--color-pill-gray);
811 | }
812 |
813 | .Pill--ColorBrown {
814 | background: var(--color-pill-brown);
815 | }
816 |
817 | .Pill--ColorOrange {
818 | background: var(--color-pill-orange);
819 | }
820 |
821 | .Pill--ColorYellow {
822 | background: var(--color-pill-yellow);
823 | }
824 |
825 | .Pill--ColorGreen {
826 | background: var(--color-pill-green);
827 | }
828 |
829 | .Pill--ColorBlue {
830 | background: var(--color-pill-blue);
831 | }
832 |
833 | .Pill--ColorPurple {
834 | background: var(--color-pill-purple);
835 | }
836 |
837 | .Pill--ColorPink {
838 | background: var(--color-pill-pink);
839 | }
840 |
841 | .Pill--ColorRed {
842 | background: var(--color-pill-red);
843 | }
844 |
845 | /* Quote */
846 |
847 | .Quote {
848 | background: var(--color-bg-gray-light);
849 | border-left: 5px solid currentcolor;
850 | border-radius: 5px;
851 | margin: 0.5rem 0;
852 | padding: 0.5em 0.9em;
853 | font-size: 1.2em;
854 | }
855 |
856 | /* SemanticStringArray */
857 |
858 | .SemanticString {
859 | line-height: 1.5;
860 | white-space: pre-wrap;
861 | word-break: break-word;
862 | }
863 |
864 | .SemanticString__Fragment--Link,
865 | .SemanticString__Fragment--Resource > a {
866 | color: inherit;
867 | text-decoration: none;
868 | border-bottom: 2px solid hsl(45, 8%, 85%);
869 | }
870 |
871 | .SemanticString__Fragment--Link:hover,
872 | .SemanticString__Fragment--Resource > a:hover {
873 | border-bottom: 2px solid hsl(45, 8%, 55%);
874 | }
875 |
876 | .SemanticString__Fragment--Code {
877 | border-radius: 5px;
878 | background-color: rgba(135, 131, 120, 0.15);
879 | font-size: 0.9em;
880 | padding: 0.2em 0.4em;
881 | word-break: break-word;
882 | }
883 |
884 | .SemanticString__Fragment--HighlightedBg,
885 | .SemanticString__Fragment--HighlightedColor {
886 | background-color: inherit;
887 | }
888 |
889 | /* Code in highlighted should use the highlight background or color. */
890 |
891 | .SemanticString__Fragment--HighlightedBg .SemanticString__Fragment--Code {
892 | background-color: inherit;
893 | }
894 |
895 | .SemanticString__Fragment--HighlightedColor .SemanticString__Fragment--Code {
896 | color: inherit;
897 | }
898 |
899 | .SemanticString__Fragment--ColorDefault {
900 | color: var(--color-text-default);
901 | }
902 |
903 | .SemanticString__Fragment--ColorGray {
904 | color: var(--color-text-gray);
905 | }
906 |
907 | .SemanticString__Fragment--ColorBrown {
908 | color: var(--color-text-brown);
909 | }
910 |
911 | .SemanticString__Fragment--ColorOrange {
912 | color: var(--color-text-orange);
913 | }
914 |
915 | .SemanticString__Fragment--ColorYellow {
916 | color: var(--color-text-yellow);
917 | }
918 |
919 | .SemanticString__Fragment--ColorGreen {
920 | color: var(--color-text-green);
921 | }
922 |
923 | .SemanticString__Fragment--ColorBlue {
924 | color: var(--color-text-blue);
925 | }
926 |
927 | .SemanticString__Fragment--ColorPurple {
928 | color: var(--color-text-purple);
929 | }
930 |
931 | .SemanticString__Fragment--ColorPink {
932 | color: var(--color-text-pink);
933 | }
934 |
935 | .SemanticString__Fragment--ColorRed {
936 | color: var(--color-text-red);
937 | }
938 |
939 | .SemanticString__Fragment--BgDefault {
940 | background: var(--color-bg-default);
941 | }
942 |
943 | .SemanticString__Fragment--BgGray {
944 | background: var(--color-bg-gray);
945 | }
946 |
947 | .SemanticString__Fragment--BgBrown {
948 | background: var(--color-bg-brown);
949 | }
950 |
951 | .SemanticString__Fragment--BgOrange {
952 | background: var(--color-bg-orange);
953 | }
954 |
955 | .SemanticString__Fragment--BgYellow {
956 | background: var(--color-bg-yellow);
957 | }
958 |
959 | .SemanticString__Fragment--BgGreen {
960 | background: var(--color-bg-green);
961 | }
962 |
963 | .SemanticString__Fragment--BgBlue {
964 | background: var(--color-bg-blue);
965 | }
966 |
967 | .SemanticString__Fragment--BgPurple {
968 | background: var(--color-bg-purple);
969 | }
970 |
971 | .SemanticString__Fragment--BgPink {
972 | background: var(--color-bg-pink);
973 | }
974 |
975 | .SemanticString__Fragment--BgRed {
976 | background: var(--color-bg-red);
977 | }
978 |
979 | .SemanticString__Fragment--Commented {
980 | background: rgba(255, 212, 0, 0.14);
981 | border-bottom: 2px solid rgb(255, 212, 0);
982 | }
983 |
984 | .SemanticString__Fragment--Individual,
985 | .SemanticString__Fragment--Resource,
986 | .SemanticString__Fragment--Date {
987 | color: var(--color-text-default-light);
988 | }
989 |
990 | /* TableOfContents */
991 |
992 | .TableOfContents {
993 | margin: 4px 0;
994 | padding: 5px;
995 | border-radius: 5px;
996 | font-size: 0.875rem;
997 | }
998 |
999 | .TableOfContents__Item {
1000 | list-style-type: none;
1001 | transition: background 120ms ease-in 0s;
1002 | border-radius: 5px;
1003 | }
1004 |
1005 | .TableOfContents__Item:hover {
1006 | background: var(--color-ui-hover-bg);
1007 | }
1008 |
1009 | .TableOfContents__Item > a {
1010 | color: inherit;
1011 | text-decoration: none;
1012 | }
1013 |
1014 | .TableOfContents__Item > a > div {
1015 | padding: 4.5px 2px;
1016 | }
1017 |
1018 | .TableOfContents__Item .SemanticStringArray {
1019 | border-bottom: 1px solid rgba(55, 53, 47, 0.16);
1020 | }
1021 |
1022 | /* Text */
1023 |
1024 | .Text {
1025 | min-height: calc(1.5rem + 10px);
1026 | }
1027 |
1028 | .Text__Content {
1029 | padding: 3px 2px;
1030 | margin: 2px 0;
1031 | }
1032 |
1033 | .Text__Children {
1034 | margin-left: 1.5em;
1035 | }
1036 |
1037 | /* ToDo */
1038 |
1039 | .ToDo__Content {
1040 | display: flex;
1041 | padding: 3px 0;
1042 | margin: 2px 0;
1043 | line-height: 1.5;
1044 | }
1045 |
1046 | .ToDo__Icon {
1047 | display: flex;
1048 | align-items: center;
1049 | justify-content: center;
1050 | height: 1.5em;
1051 | width: 1.5em;
1052 | margin-left: 2px;
1053 | margin-right: 4px;
1054 | flex-shrink: 0;
1055 | }
1056 |
1057 | .ToDo__Title--done {
1058 | opacity: 0.375;
1059 | }
1060 |
1061 | .ToDo__Children {
1062 | margin-left: calc(1.5em + 6px);
1063 | }
1064 |
1065 | .IconCheckboxChecked {
1066 | display: flex;
1067 | align-items: center;
1068 | justify-content: center;
1069 | width: 1em;
1070 | height: 1em;
1071 | background: rgb(46, 170, 220);
1072 | }
1073 |
1074 | .IconCheckboxChecked > svg {
1075 | width: 0.75em;
1076 | height: 0.75em;
1077 | fill: white;
1078 | }
1079 |
1080 | .IconCheckboxUnchecked {
1081 | display: flex;
1082 | }
1083 |
1084 | .IconCheckboxUnchecked > svg {
1085 | width: 1em;
1086 | height: 1em;
1087 | fill: inherit;
1088 | }
1089 |
1090 | /**
1091 | * Toggle
1092 | * Ref. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details
1093 | */
1094 |
1095 | .Toggle {
1096 | margin: 2px 0;
1097 | }
1098 |
1099 | .Toggle__Summary {
1100 | padding: 3px 0;
1101 | cursor: pointer;
1102 | list-style: none;
1103 | display: flex;
1104 | }
1105 |
1106 | .Toggle__Summary::-webkit-details-marker {
1107 | display: none;
1108 | }
1109 |
1110 | .Toggle__Summary:focus {
1111 | outline: none;
1112 | }
1113 |
1114 | .Toggle__Summary::before {
1115 | /* If we don't specify "content", this element doesn't show. */
1116 | content: '';
1117 | /* Prevent this element shrink when content is long. */
1118 | flex: 0 0 1.25rem;
1119 | border-radius: 0.25rem;
1120 | margin: 0.125rem 0.25rem;
1121 | width: 1.25rem;
1122 | height: 1.25rem;
1123 | background-image: url("data:image/svg+xml,%3Csvg width='100%' height='100%' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.8 9.30718C14.1938 9.53454 14.3907 9.64822 14.4568 9.79663C14.5144 9.92609 14.5144 10.0739 11.4568 10.2034C14.3907 10.3518 14.1938 10.4655 13.8 10.6928L8.7 13.6373C8.3062 13.8647 8.10931 13.9783 7.94774 13.9614C7.80681 13.9466 7.67878 13.8726 7.59549 13.758C7.5 13.6266 7.5 13.3992 7.5 12.9445L7.5 7.05551C7.5 6.6008 7.5 6.37344 7.59549 6.24201C7.67878 6.12736 7.80681 6.05345 7.94774 6.03864C8.10931 6.02166 8.3062 6.13533 8.7 6.36269L13.8 9.30718Z' fill='black'/%3E%3C/svg%3E");
1124 | background-repeat: no-repeat;
1125 | transition: background-image 0.1s ease-in-out, transform 0.2s ease-in-out;
1126 | }
1127 |
1128 | .Toggle--Empty > .Toggle__Summary::before {
1129 | opacity: 0.5;
1130 | }
1131 |
1132 | .Toggle[open] > .Toggle__Summary::before {
1133 | transform: rotate(90deg);
1134 | }
1135 |
1136 | .Toggle__Summary:hover::before {
1137 | background-image: url("data:image/svg+xml,%3Csvg width='100%' height='100%' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='20' height='20' rx='5' fill='%2337352F' fill-opacity='0.08'/%3E%3Cpath d='M13.8 9.30718C14.1938 9.53454 14.3907 9.64822 14.4568 9.79663C14.5144 9.92608 14.5144 10.0739 14.4568 10.2034C14.3907 10.3518 14.1938 10.4655 13.8 10.6928L8.7 13.6373C8.3062 13.8647 8.10931 13.9783 7.94774 13.9614C7.80681 13.9466 7.67878 13.8726 7.59549 13.758C7.5 13.6266 7.5 13.3992 7.5 12.9445L7.5 7.05551C7.5 6.6008 7.5 6.37344 7.59549 6.24201C7.67878 6.12736 7.80681 6.05345 7.94774 6.03864C8.10931 6.02166 8.3062 6.13533 8.7 6.36269L13.8 9.30718Z' fill='black'/%3E%3C/svg%3E");
1138 | }
1139 |
1140 | .Toggle__Content {
1141 | padding-left: calc(1.5em + 4px);
1142 | }
1143 |
1144 | /* Video */
1145 |
1146 | .Video {
1147 | margin-top: 0.5em;
1148 | margin-bottom: 0.5em;
1149 | align-self: center;
1150 | }
1151 |
1152 | .Video__Content > video {
1153 | max-width: 100%;
1154 | }
1155 |
1156 | .Video__Caption {
1157 | padding: 6px 2px;
1158 | color: var(--color-text-default-light);
1159 | font-size: 0.875em;
1160 | }
1161 |
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-600.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/dragonman225/notablog-starter/82481c3a26225be44f7ab18a145ef6b58529d75b/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-600.woff
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-600.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/dragonman225/notablog-starter/82481c3a26225be44f7ab18a145ef6b58529d75b/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-600.woff2
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-600italic.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/dragonman225/notablog-starter/82481c3a26225be44f7ab18a145ef6b58529d75b/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-600italic.woff
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-600italic.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/dragonman225/notablog-starter/82481c3a26225be44f7ab18a145ef6b58529d75b/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-600italic.woff2
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-700.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/dragonman225/notablog-starter/82481c3a26225be44f7ab18a145ef6b58529d75b/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-700.woff
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-700.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/dragonman225/notablog-starter/82481c3a26225be44f7ab18a145ef6b58529d75b/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-700.woff2
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-700italic.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/dragonman225/notablog-starter/82481c3a26225be44f7ab18a145ef6b58529d75b/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-700italic.woff
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-700italic.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/dragonman225/notablog-starter/82481c3a26225be44f7ab18a145ef6b58529d75b/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-700italic.woff2
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-italic.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/dragonman225/notablog-starter/82481c3a26225be44f7ab18a145ef6b58529d75b/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-italic.woff
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-italic.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/dragonman225/notablog-starter/82481c3a26225be44f7ab18a145ef6b58529d75b/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-italic.woff2
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-regular.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/dragonman225/notablog-starter/82481c3a26225be44f7ab18a145ef6b58529d75b/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-regular.woff
--------------------------------------------------------------------------------
/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-regular.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/dragonman225/notablog-starter/82481c3a26225be44f7ab18a145ef6b58529d75b/themes/pure-ejs/assets/fonts/source-sans-pro-v13-latin-regular.woff2
--------------------------------------------------------------------------------
/themes/pure-ejs/layouts/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | <%- include('partials/head.html', { fontSize: 20, favicon: siteMeta.iconUrl }) %>
6 | <%= siteMeta.title %>
7 |
8 |
9 | <% if (siteMeta.description) { %>
10 |
11 |
12 | <% } %>
13 | <% if (siteMeta.iconUrl) { %>
14 |
15 | <% } %>
16 |
17 |
18 |
19 | <%- include('partials/navbar.html', { siteMeta }) %>
20 |
42 | <%- include('partials/articleList.html', {
43 | pages: siteMeta.pages.filter(page => page.publish && page.inList)
44 | }) %>
45 | <%- include('partials/footer.html', { siteMeta }) %>
46 |
47 |
48 |
--------------------------------------------------------------------------------
/themes/pure-ejs/layouts/partials/articleList.html:
--------------------------------------------------------------------------------
1 |
2 | <% pages.forEach(function(page) { %>
3 |
4 |
5 | <% if (page.iconUrl) { %>
6 | 
7 | <% } %>
8 |
9 | <%= page.title %>
10 |
11 |
12 | <% if (page.descriptionHTML) { %>
13 |
14 | <%- page.descriptionHTML %>
15 |
16 | <% } %>
17 |
18 | <% if (page.date) { %>
19 | Posted on <%= page.dateString %>
20 | <% } %>
21 | <% page.tags.forEach(function(tag) { %>
22 |
23 | <%= tag.value %>
24 |
25 | <% }) %>
26 | |