From 0104158276fe65f9f60701072ba6b376aea5daeb Mon Sep 17 00:00:00 2001 From: KyonQi Date: Fri, 11 Oct 2024 16:07:11 +0200 Subject: [PATCH] =?UTF-8?q?Build=20at=20YYYY-10-2024=E5=B9=B410=E6=9C=8811?= =?UTF-8?q?=E6=97=A5=2016:07:11=20+2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- 2024/10/11/hello-world/index.html | 594 +++ 404.html | 556 +++ archives/2024/10/index.html | 541 +++ archives/2024/index.html | 541 +++ archives/index.html | 541 +++ css/main.css | 6810 +++++++++++++++++++++++++++++ index.html | 546 +++ js/main.js | 210 + js/plugins/copycode.js | 32 + js/search/algolia-search.js | 75 + js/search/local-search.js | 170 + js/services/fcircle.js | 36 + js/services/friends.js | 27 + js/services/ghinfo.js | 33 + js/services/mdrender.js | 10 + js/services/memos.js | 73 + js/services/siteinfo.js | 38 + js/services/sites.js | 30 + js/services/timeline.js | 106 + js/services/weibo.js | 60 + notebooks/index.html | 539 +++ placeholder | 0 search.json | 1 + 23 files changed, 11569 insertions(+) create mode 100644 2024/10/11/hello-world/index.html create mode 100644 404.html create mode 100644 archives/2024/10/index.html create mode 100644 archives/2024/index.html create mode 100644 archives/index.html create mode 100644 css/main.css create mode 100644 index.html create mode 100644 js/main.js create mode 100644 js/plugins/copycode.js create mode 100644 js/search/algolia-search.js create mode 100644 js/search/local-search.js create mode 100644 js/services/fcircle.js create mode 100644 js/services/friends.js create mode 100644 js/services/ghinfo.js create mode 100644 js/services/mdrender.js create mode 100644 js/services/memos.js create mode 100644 js/services/siteinfo.js create mode 100644 js/services/sites.js create mode 100644 js/services/timeline.js create mode 100644 js/services/weibo.js create mode 100644 notebooks/index.html delete mode 100644 placeholder create mode 100644 search.json diff --git a/2024/10/11/hello-world/index.html b/2024/10/11/hello-world/index.html new file mode 100644 index 0000000..7784c92 --- /dev/null +++ b/2024/10/11/hello-world/index.html @@ -0,0 +1,594 @@ + + + + + + + + + + + + + + + + + + + + Hello World - KyonQi + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + +

Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.

+

Quick Start

Create a new post

1
$ hexo new "My New Post"
+ +

More info: Writing

+

Run server

1
$ hexo server
+ +

More info: Server

+

Generate static files

1
$ hexo generate
+ +

More info: Generating

+

Deploy to remote sites

1
$ hexo deploy
+ +

More info: Deployment

+ +
+
+
许可协议
+

本文采用 署名-非商业性使用-相同方式共享 4.0 国际 许可协议，转载请注明出处。

+
+
+
+
+ + + + + + + +

本站由 Qi 使用 Stellar 1.29.1 主题创建。
本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。

+
+
+ + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
diff --git a/404.html b/404.html new file mode 100644 index 0000000..36eb983 --- /dev/null +++ b/404.html @@ -0,0 +1,556 @@ + + + + + + + + + + + + + + + + + + + + KyonQi + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + +
+

404

+

+ + 很抱歉，您访问的页面不存在 + +

+

+ 可能是输入地址有误或该地址已被删除 +

+

+ 返回主页 +
+ + + + +

本站由 Qi 使用 Stellar 1.29.1 主题创建。
本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。

+
+
+ + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
diff --git a/archives/2024/10/index.html b/archives/2024/10/index.html new file mode 100644 index 0000000..deb85ba --- /dev/null +++ b/archives/2024/10/index.html @@ -0,0 +1,541 @@ + + + + + + + + + + + + + + + + + + + + 归档 - KyonQi + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
KyonQi
+ + + + +
+

本站由 Qi 使用 Stellar 1.29.1 主题创建。
本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。

+
+
+ + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
diff --git a/archives/2024/index.html b/archives/2024/index.html new file mode 100644 index 0000000..76a0018 --- /dev/null +++ b/archives/2024/index.html @@ -0,0 +1,541 @@ + + + + + + + + + + + + + + + + + + + + 归档 - KyonQi + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
KyonQi
+ + + + +
+

本站由 Qi 使用 Stellar 1.29.1 主题创建。
本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。

+
+
+ + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
diff --git a/archives/index.html b/archives/index.html new file mode 100644 index 0000000..896d9b1 --- /dev/null +++ b/archives/index.html @@ -0,0 +1,541 @@ + + + + + + + + + + + + + + + + + + + + 归档 - KyonQi + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
KyonQi
+ + + + +
+

本站由 Qi 使用 Stellar 1.29.1 主题创建。
本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。

+
+
+ + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
diff --git a/css/main.css b/css/main.css new file mode 100644 index 0000000..ee793ca --- /dev/null +++ b/css/main.css @@ -0,0 +1,6810 @@ +:root { + --width-main: 720px; + --fsp: 17px; + --fsh2: calc(var(--fsp) + 11px); + --fsh3: calc(var(--fsp) + 7px); + --fsh4: calc(var(--fsp) + 4px); + --side-content-width: 224px; + --gap-margin: 16px; + --gap-padding: 16px; + --gap-p: calc(17px + 4px); + --gap-p-compact: calc(17px * 0.75); +} +@media screen and (min-width: 2048px) { + :root { + --width-main: 780px; + } +} +@media screen and (min-width: 2560px) { + :root { + --width-main: 860px; + } +} +@media screen and (max-width: 768px) { + :root { + --side-content-width: 188px; + } +} +@media screen and (max-width: 667px) { + :root { + --side-content-width: 224px; + } +} +:root { + --gap-max: calc(var(--gap-margin) + var(--gap-padding)); +} +.l_body.story { + --gap-p: 2rem; +} +.l_body.story div.tag-plugin, +.l_body.story p>img { + margin-top: 2.4rem; + margin-bottom: 2.4rem; +} +:root { + --theme-link: #2094f3; +} +:root[data-theme="light"] { + --site-bg: #f9fafb; + --card: #fff; + --block: #f1f2f3; + --block-border: #e3e5e8; + --block-hover: #e9eaec; + --theme-link-opa: rgba(32,148,243,0.2); + --leftbar-bg: #e3e5e8; + --alpha20: rgba(255,255,255,0.2); + --alpha50: rgba(255,255,255,0.5); + --alpha60: rgba(255,255,255,0.6); + --alpha75: rgba(255,255,255,0.75); + --alpha100: #fff; + --text: #000; + --text-p1: #333; + --text-p2: #4d4d4d; + --text-p3: #808080; + --text-p4: #999; + --text-meta: #ccc; + --text-code: #14181f; +} +:root[data-theme="dark"] { + --site-bg: #1c1e21; + --card: #373d43; + --block: #26292c; + --block-border: #383d42; + --block-hover: #2f3337; + --theme-link-opa: rgba(32,148,243,0.4); + --leftbar-bg: #383d42; + --alpha20: rgba(0,0,0,0.2); + --alpha50: rgba(0,0,0,0.5); + --alpha60: rgba(0,0,0,0.6); + --alpha75: rgba(0,0,0,0.75); + --alpha100: #000; + --text: #fff; + --text-p1: #ccc; + --text-p2: #b3b3b3; + --text-p3: #858585; + --text-p4: #707070; + --text-meta: #4d4d4d; + --text-code: #fff; +} +@media screen and (max-width: 667px) { + :root[data-theme="dark"] { + --site-bg: #000; + } +} +:root:not([data-theme]) { + --site-bg: #f9fafb; + --card: #fff; + --block: #f1f2f3; + --block-border: #e3e5e8; + --block-hover: #e9eaec; + --theme-link-opa: rgba(32,148,243,0.2); + --leftbar-bg: #e3e5e8; + --alpha20: rgba(255,255,255,0.2); + --alpha50: rgba(255,255,255,0.5); + --alpha60: rgba(255,255,255,0.6); + --alpha75: rgba(255,255,255,0.75); + --alpha100: #fff; + --text: #000; + --text-p1: #333; + --text-p2: #4d4d4d; + --text-p3: #808080; + --text-p4: #999; + --text-meta: #ccc; + --text-code: #14181f; +} +@media (prefers-color-scheme: dark) { + :root:not([data-theme]) { + --site-bg: #1c1e21; + --card: #373d43; + --block: #26292c; + --block-border: #383d42; + --block-hover: #2f3337; + --theme-link-opa: rgba(32,148,243,0.4); + --leftbar-bg: #383d42; + --alpha20: rgba(0,0,0,0.2); + --alpha50: rgba(0,0,0,0.5); + --alpha60: rgba(0,0,0,0.6); + --alpha75: rgba(0,0,0,0.75); + --alpha100: #000; + --text: #fff; + --text-p1: #ccc; + --text-p2: #b3b3b3; + --text-p3: #858585; + --text-p4: #707070; + --text-meta: #4d4d4d; + --text-code: #fff; + } +} +@media screen and (prefers-color-scheme: dark) and (max-width: 667px) { + :root:not([data-theme]) { + --site-bg: #000; + } +} +pre { + font-family: Menlo, Monaco, Consolas, system-ui, "Courier New", monospace, sans-serif; + font-size: 0.8125rem; + tab-size: 4; + -moz-tab-size: 4; + -o-tab-size: 4; + -webkit-tab-size: 4; +} +a { + text-decoration: none; + color: var(--theme-link); +} +a:hover { + color: #ff5724; +} +.md-text p:not([class]) { + text-align: left; +} +hr { + color: var(--text-meta); + opacity: 0.1; +} +img { + max-width: 100%; +} +li { + font-size: calc(var(--fsp) - 1px); +} +ul, +ol { + padding-left: 1.5rem; +} +table:not([class]) { + border-collapse: collapse; + overflow: auto; + display: block; + margin: 1rem 0; + max-width: 100%; + vertical-align: text-top; + --fsp: calc(17px - 2px); + font-size: var(--fsp); +} +table:not([class]) th { + background: var(--block); +} +table:not([class]) td, +table:not([class]) th { + padding: 0.5em 1em; + border: 1px solid var(--block-hover); + line-height: 1.5; +} +table:not([class]) tr { + word-break: keep-all; + white-space: nowrap; +} +table:not([class]) tr:hover { + background: var(--block); +} +*[ff=title] { + font-family: system-ui, "Microsoft Yahei", "Segoe UI", -apple-system, Roboto, Ubuntu, "Helvetica Neue", Arial, "WenQuanYi Micro Hei", sans-serif; +} +blockquote { + display: block; + margin-left: 0; + margin-right: 0; + padding: 0.25rem 0.75rem; + background: var(--block); + border-left: 4px solid var(--text-meta); + border-radius: 4px 12px 12px 4px; + color: var(--text-p2); +} +:root { + --blur-px: 12px; + --blur-bg: var(--alpha50); +} +.blur { + background: var(--blur-bg); +} +@supports ((-webkit-backdrop-filter: blur(var(--blur-px))) or (backdrop-filter: blur(var(--blur-px)))) { + .blur { + background: var(--blur-bg) !important; + backdrop-filter: saturate(200%) blur(var(--blur-px)); + -webkit-backdrop-filter: saturate(200%) blur(var(--blur-px)); + } +} +.blur:hover { + background: var(--card); +} +button { + border: none; + font-weight: 500; + outline: none; + -moz-user-select: none; + -ms-user-select: none; + -webkit-user-select: none; + user-select: none; + cursor: pointer; +} +a.button { + font-weight: 500; + line-height: 1; + padding: 0.75rem 2rem; + border-radius: 4px; + font-size: 0.9375rem; + user-select: none; +} +a.button.theme { + background: #1cd0fd; + color: var(--card); +} +a.button.theme:hover { + background: #ff5724; +} +a.button.start { + border-radius: 100px; + background: var(--text-p1); + color: var(--card); +} +a[onclick]:hover { + cursor: pointer; +} +a.button.start.gradient { + position: relative; +} +:root[data-theme="dark"] a.button.start.gradient { + transition: 0.38s ease-out; + z-index: 0; + background: linear-gradient(to right, #4c95fa, #38c9fa, #24f9c4, #24f9c4, #38c9fa, #4c95fa); + background-size: 1000%; + color: #fff; + text-shadow: 0 0 1px rgba(0,0,0,0.12); + animation: glow 60s linear infinite; +} +:root[data-theme="dark"] a.button.start.gradient:after { + content: ''; + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + border-radius: 100px; + background: inherit; + z-index: -1; + filter: blur(12px); + opacity: 0.5; + transition: 0.38s ease-out; +} +:root[data-theme="dark"] a.button.start.gradient:hover:after { + filter: blur(36px); + opacity: 1; +} +@-moz-keyframes glow { + from { + background-position: 0%; + } + to { + background-position: 1000%; + } +} +@-webkit-keyframes glow { + from { + background-position: 0%; + } + to { + background-position: 1000%; + } +} +@-o-keyframes glow { + from { + background-position: 0%; + } + to { + background-position: 1000%; + } +} +@keyframes glow { + from { + background-position: 0%; + } + to { + background-position: 1000%; + } +} +@media (prefers-color-scheme: dark) { + :root:not([data-theme]) a.button.start.gradient { + transition: 0.38s ease-out; + z-index: 0; + background: linear-gradient(to right, #4c95fa, #38c9fa, #24f9c4, #24f9c4, #38c9fa, #4c95fa); + background-size: 1000%; + color: #fff; + text-shadow: 0 0 1px rgba(0,0,0,0.12); + animation: glow 60s linear infinite; + } + :root:not([data-theme]) a.button.start.gradient:after { + content: ''; + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + border-radius: 100px; + background: inherit; + z-index: -1; + filter: blur(12px); + opacity: 0.5; + transition: 0.38s ease-out; + } + :root:not([data-theme]) a.button.start.gradient:hover:after { + filter: blur(36px); + opacity: 1; + } +@-moz-keyframes glow { + from { + background-position: 0%; + } + to { + background-position: 1000%; + } +} +@-webkit-keyframes glow { + from { + background-position: 0%; + } + to { + background-position: 1000%; + } +} +@-o-keyframes glow { + from { + background-position: 0%; + } + to { + background-position: 1000%; + } +} +@keyframes glow { + from { + background-position: 0%; + } + to { + background-position: 1000%; + } +} +} +.cap { + font-weight: 500; + font-size: 0.8125rem; + scrollbar-width: none; + color: var(--text-p2); +} +.cap.blue { + color: #0d87e9; +} +.cap.cyan { + color: #03c3f5; +} +.cap.theme { + color: #03cafc; +} +.dis-select { + -moz-user-select: none; + -ms-user-select: none; + -webkit-user-select: none; + user-select: none; +} +.mobile-only { + display: none; +} +@media screen and (max-width: 667px) { + .mobile-only { + display: block !important; + } +} +@media screen and (max-width: 667px) { + .mobile-hidden { + display: none !important; + } +} +.float-panel { + position: sticky; + grid-column-end: span 3; + right: 0; + bottom: 2rem; + float: right; + z-index: 10; + display: flex; + flex-direction: column; + border-radius: 8px; + margin-left: auto; + margin-right: 1rem; + overflow: hidden; + --blur-px: 16px; + --blur-bg: rgba(255,255,255,0.4); + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; +} +@media screen and (min-width: 667px) { + .float-panel { + margin-right: 2rem; + } +} +:root[data-theme="dark"] .float-panel { + --blur-bg: rgba(0,0,0,0.4); +} +@media (prefers-color-scheme: dark) { + :root:not([data-theme]) .float-panel { + --blur-bg: rgba(0,0,0,0.4); + } +} +.float-panel button { + cursor: pointer; + color: var(--text); + background: none; + padding: 8px; + line-height: 0; + font-size: 28px; + margin: 0; + display: flex; +} +.float-panel button >* { + width: auto; + height: 28px; +} +.float-panel button >* path#sep { + transition: transform 0.2s ease-out; + -moz-transition: transform 0.2s ease-out; + -webkit-transition: transform 0.2s ease-out; + -o-transition: transform 0.2s ease-out; +} +.l_body[leftbar] .float-panel, +.l_body[rightbar] .float-panel { + box-shadow: 0 0 4px -1px #1cd0fd, 0 0 16px -4px #1cd0fd, 0 0 32px -12px #1cd0fd, 0 0 128px -32px #1cd0fd; +} +.l_body[leftbar] .float-panel button.leftbar-toggle { + background: var(--alpha100); +} +.l_body[leftbar] .float-panel button.leftbar-toggle { + color: #1cd0fd; + border-color: var(--block-border); +} +.l_body[leftbar] .float-panel button.leftbar-toggle svg g { + fill: currentColor; + fill-opacity: 0.3; +} +.l_body[leftbar] .float-panel button.leftbar-toggle svg g path#sep { + transform: translateX(2px); +} +.l_body .l_right:empty+.float-panel button.rightbar-toggle { + display: none !important; +} +.l_body[rightbar] .float-panel button.rightbar-toggle { + background: var(--alpha100); +} +.l_body[rightbar] .float-panel button.rightbar-toggle { + color: #1cd0fd; + border-color: var(--block-border); +} +.l_body[rightbar] .float-panel button.rightbar-toggle svg g { + fill: currentColor; + fill-opacity: 0.3; +} +.l_body[rightbar] .float-panel button.rightbar-toggle svg g path#sep { + transform: translateX(2px); +} +code { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; + font-family: Menlo, Monaco, Consolas, system-ui, "Courier New", monospace, sans-serif; +} +p>code:not([class]), +li>code:not([class]) { + font-size: 85%; + background: var(--block); + padding: 0.2em; + border-radius: 4px; + color: var(--text-code); +} +.md-text .highlight, +pre:not([class]):has(>code) { + margin: var(--gap-p) 0; + border-radius: 12px; + overflow: hidden; + background: var(--block); + line-height: 1.5; + font-family: Menlo, Monaco, Consolas, system-ui, "Courier New", monospace, sans-serif; + box-sizing: border-box; +} +@media screen and (min-width: 500px) { + .md-text .highlight, + pre:not([class]):has(>code) { + min-width: 180px; + } +} +.md-text .highlight { + position: relative; + overflow: auto; + display: block; +} +.md-text .highlight figcaption { + color: var(--text-p2); + font-size: 0.8125rem; + font-weight: 500; + margin-left: 0.5rem; + display: inline-block; +} +.md-text .highlight figcaption span { + padding: 4px 0.5rem; + display: block; + border-bottom-left-radius: 4px; + border-bottom-right-radius: 4px; + background: var(--block-hover); +} +.md-text .highlight >table { + overflow: auto; + display: block; + margin: 0 !important; + background: transparent; + border: none; +} +.md-text .highlight >table td, +.md-text .highlight >table th { + padding: 0; + border: none; + line-height: 1.5; +} +.md-text .highlight >table::-webkit-scrollbar { + height: 4px; + width: 4px; +} +.md-text .highlight >table::-webkit-scrollbar-track-piece { + background: transparent; +} +.md-text .highlight >table::-webkit-scrollbar-thumb { + background: transparent; + cursor: pointer; + border-radius: 8px; +} +.md-text .highlight >table:hover::-webkit-scrollbar-thumb { + background: var(--text-meta); +} +.md-text .highlight >table:hover::-webkit-scrollbar-thumb:hover { + background: var(--text-p3); +} +.md-text .highlight >table tr { + background: transparent; +} +.md-text .highlight >table tr:hover { + background: transparent; +} +.md-text .highlight .gutter { + pointer-events: none; + -moz-user-select: none; + -ms-user-select: none; + -webkit-user-select: none; + user-select: none; + text-align: right; + padding: 0 1em; + border-width: 0; + margin-left: 0; + left: 0; + z-index: 1; +} +.md-text .highlight .gutter pre .line { + color: var(--text-p4); +} +.md-text .highlight .code pre { + display: block; + padding: 0.5em 1rem; +} +.md-text .highlight .gutter+.code pre { + padding-left: 0.25em; +} +.md-text .gist .gist-file { + border: 1px solid var(--block-border); + border-radius: 12px; + overflow: hidden; +} +.md-text .gist .gist-data { + border-bottom: 1px solid var(--block-border); +} +.md-text .gist .highlight { + display: inherit; + border: none; + border-radius: 0; + background: var(--block); + margin: 0; + padding: 1em 0; +} +.md-text .gist .blob-code-inner { + color: var(--text-p1); + font-family: Menlo, Monaco, Consolas, system-ui, "Courier New", monospace, sans-serif; +} +.md-text .gist .gist-meta { + background: var(--block-border); +} +table:not([class]) { + border-collapse: collapse; +} +.md-text pre >.caption { + color: var(--text-p3); +} +.md-text pre >.hljs { + padding: 1rem; + border-radius: 12px; + line-height: 1.5; + box-sizing: border-box; +} +.md-text .highlight .code { + vertical-align: top; +} +.md-text .highlight .code:before { + position: absolute; + top: 0; + right: 0; + padding: 4px 0.5rem; + opacity: 0.25; + font-weight: 700; + color: var(--theme); +} +.md-text .highlight.yaml .code:before { + content: "YAML"; +} +.md-text .highlight.json .code:before { + content: "JSON"; +} +.md-text .highlight.diff .code:before { + content: "diff"; +} +.md-text .highlight.html .code:before { + content: "HTML"; +} +.md-text .highlight.js .code:before, +.md-text .highlight.javascript .code:before { + content: "JS"; +} +.md-text .highlight.css .code:before { + content: "CSS"; +} +.md-text .highlight.less .code:before { + content: "Less"; +} +.md-text .highlight.stylus .code:before { + content: "Stylus"; +} +.md-text .highlight.bash .code:before { + content: "bash"; +} +.md-text .highlight.shell .code:before { + content: "shell"; +} +.md-text .highlight.sh .code:before { + content: "sh"; +} +.md-text .highlight.ini .code:before { + content: "ini"; +} +.md-text .highlight.c .code:before { + content: "C"; +} +.md-text .highlight.cpp .code:before { + content: "C++"; +} +.md-text .highlight.objc .code:before, +.md-text .highlight.objectivec .code:before { + content: "Objective-C"; +} +.md-text .highlight.swift .code:before { + content: "Swift"; +} +.md-text .highlight.java .code:before { + content: "Java"; +} +.md-text .highlight.python .code:before { + content: "Python"; +} +.md-text .highlight.php .code:before { + content: "PHP"; +} +.md-text .highlight.rust .code:before, +.md-text .highlight.rs .code:before { + content: "Rust"; +} +.md-text .highlight.sql .code:before { + content: "SQL"; +} +.md-text .highlight.ruby .code:before { + content: "Ruby"; +} +.md-text .highlight.makefile .code:before { + content: "Makefile"; +} +.md-text .highlight.go .code:before { + content: "Go"; +} +.md-text .highlight.typescript .code:before, +.md-text .highlight.ts .code:before { + content: "TS"; +} +.md-text .highlight.matlab .code:before { + content: "MATLAB"; +} +.code>pre .code:before { + display: none; +} +.code>pre .line, +.code>pre .params { + color: var(--text-p1); +} +.code>pre .line .addition { + color: #3fa33f; +} +.code>pre .line .deletion { + color: #ee2b29; +} +.code>pre .marked { + background-color: rgba(254,213,66,0.4); + padding: 2px 8px 2px 0; + border-radius: 2px; + width: 100%; +} +.code>pre .title, +.code>pre .attr, +.code>pre .attribute { + color: #3f51b5; +} +.code>pre .comment { + color: var(--text-p4); + font-style: italic; +} +.code>pre .keyword, +.code>pre .meta-keyword, +.code>pre .javascript .function { + color: #8959a8; +} +.code>pre .type, +.code>pre .built_in, +.code>pre .tag .name { + color: #2196f3; +} +.code>pre .variable, +.code>pre .regexp, +.code>pre .ruby .constant, +.code>pre .xml .tag .title, +.code>pre .xml .pi, +.code>pre .xml .doctype, +.code>pre .html .doctype, +.code>pre .css .id, +.code>pre .css .class, +.code>pre .css .pseudo { + color: #fd8607; +} +.code>pre .number, +.code>pre .preprocessor, +.code>pre .literal, +.code>pre .constant { + color: #fd8607; +} +.code>pre .class, +.code>pre .ruby .class .title, +.code>pre .css .rules .attribute { + color: #ff9800; +} +.code>pre .string, +.code>pre .meta-string { + color: #449e48; +} +.code>pre .value, +.code>pre .inheritance, +.code>pre .header, +.code>pre .ruby .symbol, +.code>pre .xml .cdata { + color: #4caf50; +} +.code>pre .css .hexcolor { + color: #6cc; +} +.code>pre .function, +.code>pre .python .decorator, +.code>pre .python .title, +.code>pre .ruby .function .title, +.code>pre .ruby .title .keyword, +.code>pre .perl .sub, +.code>pre .javascript .title, +.code>pre .coffeescript .title { + color: #69c; +} +.highlight.html .line .tag .name, +.highlight.css .line .tag .name, +.highlight.less .line .tag .name, +.highlight.stylus .line .tag .name, +.highlight.html .line .selector-tag, +.highlight.css .line .selector-tag, +.highlight.less .line .selector-tag, +.highlight.stylus .line .selector-tag { + color: #ee2b29; +} +.highlight.html .line .selector-class, +.highlight.css .line .selector-class, +.highlight.less .line .selector-class, +.highlight.stylus .line .selector-class, +.highlight.html .line .selector-attr, +.highlight.css .line .selector-attr, +.highlight.less .line .selector-attr, +.highlight.stylus .line .selector-attr { + color: #fd8607; +} +.highlight.html .line .attribute, +.highlight.css .line .attribute, +.highlight.less .line .attribute, +.highlight.stylus .line .attribute { + color: #3f51b5; +} +.highlight.html .line .number, +.highlight.css .line .number, +.highlight.less .line .number, +.highlight.stylus .line .number { + color: #17afca; +} +.highlight.objc .line .meta, +.highlight.objectivec .line .meta, +.highlight.swift .line .meta, +.highlight.c .line .meta { + color: #8959a8; +} +.highlight.objc .line .class, +.highlight.objectivec .line .class, +.highlight.swift .line .class, +.highlight.c .line .class { + color: var(--text-p1); +} +.highlight.json .line .attr { + color: #e24f5a; +} +.highlight.json .line .literal { + color: #3f51b5; +} +.highlight.yaml .line .attr { + color: #e24f5a; +} +* { + outline: none; +} +html { + font-family: system-ui, "Microsoft Yahei", "Segoe UI", -apple-system, Roboto, Ubuntu, "Helvetica Neue", Arial, "WenQuanYi Micro Hei", sans-serif; + font-size: 16px; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; + scroll-padding-top: 8px; +} +body { + background: var(--site-bg); + margin: 0; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + text-rendering: optimizelegibility; + -webkit-tap-highlight-color: rgba(0,0,0,0); +} +div.lazy.img { + width: 100%; + height: 100%; + background-position: center; + background-size: cover; +} +input { + background: none; + border: none; +} +input.copy-area { + display: block; + font-family: Menlo, Monaco, Consolas, system-ui, "Courier New", monospace, sans-serif; + font-size: 0.8125rem; + font-weight: 700; + color: var(--text-p3); +} +.flex { + display: flex; + align-items: center; +} +.flex.column { + flex-direction: column; +} +svg.loading { + display: block; + position: absolute; + color: var(--text-p3); + z-index: -1; + width: 100%; + height: 2rem; + margin: auto; + animation: spin infinite 2s; + animation-timing-function: linear; +} +@-moz-keyframes spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} +@-webkit-keyframes spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} +@-o-keyframes spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} +@keyframes spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} +.loading-wrap { + margin: 0; + text-align: center; + background: var(--block); + border-radius: 12px; + position: relative; + padding: 2rem; +} +.loading-wrap svg { + margin: 4px; +} +.loading-wrap:after { + content: '正在加载'; + color: var(--text-p1); + display: block; + font-size: 14px; +} +.loading-wrap.error:after { + content: '加载失败，请稍后重试。'; +} +audio, +video { + max-width: 100%; +} +video { + z-index: 1; +} +pre:not([class]):has(>code) { + display: block; + padding: 1rem; + overflow: auto; +} +pre:not([class]):has(>code) code { + padding: 0; +} +span.dot, +span.sep { + font-size: 0.9em; + margin: 0 0.25em; +} +span.dot:before { + content: '·'; + font-weight: 900; +} +span.sep:before { + content: '/'; + padding-left: 2px; + padding-right: 2px; +} +svg.icon { + width: 1em; + height: 1em; + vertical-align: middle; + fill: currentColor; + overflow: hidden; +} +svg.active-icon { + color: #1cd0fd; +} +h1, +.h1 { + font-size: var(--fsh2); + font-weight: 700; +} +@media screen and (max-width: 500px) { + h1, + .h1 { + font-size: var(--fsh2); + } +} +h2, +.h2 { + font-size: var(--fsh2); + margin-top: 1.5em; +} +h3, +.h3 { + font-size: var(--fsh3); +} +h4, +.h4 { + font-size: var(--fsh4); +} +h5 { + font-size: calc(var(--fsp) + 1px); +} +h6 { + font-size: calc(var(--fsp) + 0px); +} +.fs15 { + --fsp: 0.9375rem; + font-size: var(--fsp); +} +.fs14 { + --fsp: 0.875rem; + font-size: var(--fsp); +} +.footnote { + --fsp: 0.8125rem; + font-size: var(--fsp); +} +.widgets .post-title { + margin: 0.75rem 0; + line-height: 1.2; + display: block; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +.widgets .post-title .cap { + margin-bottom: 2px; + opacity: 0.5; +} +.widgets .post-title a { + color: inherit; + font-weight: 500; +} +.widgets .post-title a:hover { + color: #ff5724; +} +div.toast { + max-width: 60%; + padding: 1rem 2rem; + line-height: 1.5; + color: var(--text-p1); + font-weight: 500; + text-align: center; + border-radius: 8px; + background: var(--card); + position: fixed; + left: 50%; + top: 32px; + transform: translateX(-50%); + z-index: 9; + -moz-user-select: none; + -ms-user-select: none; + -webkit-user-select: none; + user-select: none; + box-shadow: 0 4px 8px 0px rgba(0,0,0,0.1), 0 12px 16px -4px rgba(0,0,0,0.2); + visibility: hidden; +} +div.toast.show { + visibility: visible; + -webkit-animation: fadein 0.5s, fadeout 0.5s 2s; + animation: fadein 0.5s, fadeout 0.5s 2s; + animation-fill-mode: forwards; +} +@-webkit-keyframes fadein { + from { + top: -64px; + opacity: 0; + } + to { + top: 32px; + opacity: 1; + } +} +@-webkit-keyframes fadeout { + from { + top: 32px; + opacity: 1; + } + to { + top: -64px; + opacity: 0; + } +} +@-moz-keyframes fadein { + from { + top: -64px; + opacity: 0; + } + to { + top: 32px; + opacity: 1; + } +} +@-webkit-keyframes fadein { + from { + top: -64px; + opacity: 0; + } + to { + top: 32px; + opacity: 1; + } +} +@-o-keyframes fadein { + from { + top: -64px; + opacity: 0; + } + to { + top: 32px; + opacity: 1; + } +} +@keyframes fadein { + from { + top: -64px; + opacity: 0; + } + to { + top: 32px; + opacity: 1; + } +} +@-moz-keyframes fadeout { + from { + top: 32px; + opacity: 1; + } + to { + top: -64px; + opacity: 0; + } +} +@-webkit-keyframes fadeout { + from { + top: 32px; + opacity: 1; + } + to { + top: -64px; + opacity: 0; + } +} +@-o-keyframes fadeout { + from { + top: 32px; + opacity: 1; + } + to { + top: -64px; + opacity: 0; + } +} +@keyframes fadeout { + from { + top: 32px; + opacity: 1; + } + to { + top: -64px; + opacity: 0; + } +} +.article.banner { + --text-banner: var(--text); + background: var(--block); + margin: 0; + height: unset; +} +.article.banner .bg+.content { + min-height: 224px; + --text-banner: #fff; + --button-hover-bg: rgba(255,255,255,0.25); +} +.article.banner .content .top { + align-items: flex-start; + margin: 1rem calc(1rem - 4px); +} +.article.banner .content .title { + font-size: calc(17px + 9px); + color: var(--text-banner); +} +.article.banner .content h1 { + line-height: 1.2; + margin: 0.25rem 0; +} +.l_body .article.banner .content .bottom.only-title .title { + padding: 0.75rem 0; +} +.l_body[text-indent] .article.banner .content .bottom.only-title { + justify-content: center; +} +.article.banner .bg+.content { + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; + --blur-bg: rgba(0,0,0,0); + --blur-px: 0px; + --blur-sat: 100%; + background: var(--blur-bg); +} +@supports ((-webkit-backdrop-filter: blur(var(--blur-px))) or (backdrop-filter: blur(var(--blur-px)))) { + .article.banner .bg+.content { + background: var(--blur-bg); + backdrop-filter: saturate(var(--blur-sat)) blur(var(--blur-px)); + -webkit-backdrop-filter: saturate(var(--blur-sat)) blur(var(--blur-px)); + } +} +.article.banner:hover .bg+.content { + --blur-bg: rgba(0,0,0,0.1); + --blur-px: 20px; + --blur-sat: 150%; +} +.article.banner { + --button-hover-bg: rgba(0,0,0,0.05); +} +:root[data-theme="dark"] .article.banner { + --button-hover-bg: rgba(255,255,255,0.15); +} +@media (prefers-color-scheme: dark) { + :root:not([data-theme]) .article.banner { + --button-hover-bg: rgba(255,255,255,0.15); + } +} +.md-text .article-footer { + margin-top: 4rem; + padding: 1rem; + background: var(--block); + border-radius: 12px; + border: 1px solid var(--block-border); +} +.md-text .article-footer:empty { + display: none; +} +.md-text .article-footer .header { + font-weight: 500; + color: var(--text-p2); + font-size: calc(17px + 2px); +} +.md-text .article-footer .body { + --fsp: calc(17px - 2px); +} +.md-text .article-footer .body input.copy-area { + margin: 0.75rem 0; + padding: 0; + width: 100%; +} +.md-text .article-footer .body p { + color: var(--text-p2); + margin: 0.5em 0; +} +.md-text .article-footer .body p a { + font-weight: unset; +} +.md-text .article-footer .body ul { + margin: 0; + overflow: hidden; +} +.md-text .article-footer .body .post-title { + margin: 2px 0; + line-height: 1.2; + word-break: break-all; +} +.md-text .article-footer .body .post-title p { + --fsp: calc(17px - 2px); +} +.md-text .article-footer section+section { + margin-top: 1rem; + padding-top: 1rem; + border-top: 1px solid var(--block-border); +} +.md-text .article-footer .social-wrap { + grid-gap: 0.5rem 1rem; + margin: 0; +} +.md-text .article-footer .qrcode { + width: 128px; + padding: 4px; + background: #fff; + border-radius: 4px; + box-shadow: 0 4px 8px 0px rgba(0,0,0,0.1), 0 0 32px 0px rgba(0,0,0,0.1); + overflow: hidden; + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; + height: 0; + margin: 0 auto; + transform: scale(0.01); +} +.md-text .article-footer .qrcode img { + object-fit: contain; +} +.md-text .article-footer .qrcode.display { + margin: 2rem auto 1rem; + height: 128px !important; + opacity: 1 !important; + transform: scale(1); +} +.bread-nav { + font-weight: 500; + display: flex; + justify-content: space-between; + color: var(--text-banner); +} +.bread-nav .flex-row { + display: flex; + align-items: baseline; + flex-direction: row; +} +.bread-nav a { + color: var(--text-banner); + padding: 4px; + border-radius: 2px; +} +.bread-nav a:hover { + background: var(--button-hover-bg); +} +.bread-nav span { + color: var(--text-banner); +} +.bread-nav span.sep { + opacity: 0.5; + margin: 0; +} +.bread-nav span.text { + padding: 4px; +} +.bread-nav div#post-meta span.sep:before { + content: '|'; +} +.bread-nav div#post-meta span.updated { + visibility: hidden; +} +.bread-nav:hover div#post-meta span.updated { + visibility: visible; +} +.bread-nav .ghrepo { + font-size: 0.8125rem; + display: flex; + flex-direction: column; + align-items: flex-start; + border-left: 1px solid var(--text-meta); + padding-left: 8px; +} +.bread-nav .ghrepo a { + display: flex; + align-items: center; + color: var(--text-banner); +} +.bread-nav .ghrepo a svg { + margin-right: 4px; +} +.bread-nav .ghrepo a.bold { + font-weight: 600; + color: var(--text-banner); +} +.bread-nav .ghrepo a span { + margin-left: 4px; +} +.bread-nav .ghrepo a:hover { + opacity: 1; +} +.l_cover { + height: 100vh; + text-align: center; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + position: relative; +} +.l_cover.post { + height: inherit; +} +.l_cover .cover-wrap { + margin-bottom: 0; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + font-size: var(--fsp); +} +.l_cover .cover-wrap .cover-title { + font-weight: 700; + font-size: 1.5rem; + margin: 1rem 0; + line-height: 1.2; + color: var(--text); +} +.l_cover .cover-wrap .description { + margin: 1rem 0; +} +.l_cover .cover-wrap .start-wrap { + margin: 2rem 0; + flex-shrink: 0; +} +.l_cover .cover-wrap .start-wrap a.start { + display: inline-block; +} +.l_cover.post .cover { + z-index: -1; + width: 100%; + height: 30vh; + max-width: 2048px; + min-height: 150px; + max-height: 400px; +} +@media screen and (max-width: 768px) { + .l_cover.post .cover { + height: 25vh; + } +} +@media screen and (max-width: 500px) { + .l_cover.post .cover { + height: 20vh; + } +} +@media screen and (min-width: 2048px) { + .l_cover.post .cover { + margin-top: 4rem; + } + .l_cover.post .cover .img { + border-radius: 2rem; + } +} +.l_cover.wiki .cover-wrap { + max-width: 500px; +} +.l_cover.wiki .cover-wrap .preview { + margin-bottom: 2rem; +} +.l_cover.wiki .cover-wrap .preview img { + object-fit: contain; + min-width: 96px; + min-height: 96px; + max-height: 35vh; + max-width: 100%; +} +@media screen and (max-width: 500px) { + .l_cover.wiki .cover-wrap .preview img { + max-width: 60%; + } +} +.l_cover.wiki .cover-wrap .cover-title:first-child { + font-size: 3rem; +} +.page-footer { + margin: 4rem 1rem 3rem; + color: var(--text-p2); +} +.page-footer a { + color: var(--text-p2); + border-radius: 4px; + transition: background 0.2s ease-out; +} +.page-footer a:hover { + color: var(--text); + background: var(--block-hover); +} +.page-footer .sitemap { + margin: 0.5rem -4px 2rem; + display: grid; + scrollbar-width: none; + grid-gap: 1rem 1rem; + grid-auto-flow: column dense; + grid-template-columns: repeat(4, 1fr); + overflow: scroll; +} +.page-footer .sitemap::-webkit-scrollbar { + height: 0; + width: 0; +} +.page-footer .sitemap::-webkit-scrollbar-track-piece { + background: transparent; +} +.page-footer .sitemap::-webkit-scrollbar-thumb { + background: var(--text-meta); + cursor: pointer; + border-radius: 0; +} +.page-footer .sitemap::-webkit-scrollbar-thumb:hover { + background: var(--text-p3); +} +.page-footer .sitemap .sitemap-group { + display: flex; + flex-direction: column; + align-items: flex-start; +} +.page-footer .sitemap .sitemap-group >span, +.page-footer .sitemap .sitemap-group >a { + text-decoration: none; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + padding: 4px; +} +.page-footer .sitemap .sitemap-group >span { + font-weight: 500; + color: var(--text-p1); + margin: 4px 0; +} +.page-footer .text p { + margin: 4px 0; + line-height: 1.5; +} +.page-footer .text a:not([class]) { + font-weight: 500; +} +.navbar { + padding: 0 1rem; + z-index: 8; + top: 0; + background: var(--site-bg); + position: sticky; + position: -webkit-sticky; + margin-bottom: 1px; + margin-top: -8px; +} +.navbar:after { + content: ''; + height: 2px; + border-radius: 2px; + position: absolute; + bottom: 0; + left: 1rem; + right: 1rem; + background: var(--block-hover); +} +.navbar nav { + display: flex; + overflow: scroll visible; + font-size: 0.875rem; +} +.navbar nav::-webkit-scrollbar { + height: 0; + width: 0; +} +.navbar nav::-webkit-scrollbar-track-piece { + background: transparent; +} +.navbar nav::-webkit-scrollbar-thumb { + background: var(--text-meta); + cursor: pointer; + border-radius: 0; +} +.navbar nav::-webkit-scrollbar-thumb:hover { + background: var(--text-p3); +} +.navbar nav >p { + margin: 0; +} +.navbar nav a { + padding: 2px 0.75rem; + margin: 10px 0.25rem 8px 0.25rem; + line-height: 2; + color: var(--text-p3); + border-radius: 4px; + font-weight: 500; + white-space: nowrap; + position: relative; + z-index: 1; +} +.navbar nav a:after { + height: 2px; + position: absolute; + bottom: -8px; + left: 0.75rem; + right: 0.75rem; + background: #1cd0fd; + border-radius: 2px; + pointer-events: none; +} +.navbar nav a:hover { + background: var(--block-hover); +} +.navbar nav a.active, +.navbar nav a:hover { + color: var(--text-p1); +} +.navbar nav a.active { + background: var(--card); + box-shadow: 0 0 2px 0px rgba(0,0,0,0.04), 0 0 8px 0px rgba(0,0,0,0.04); + cursor: default; + pointer-events: none; +} +.navbar nav a.active:after { + content: ''; +} +.navbar nav a+a { + margin-left: 4px; +} +@media screen and (max-width: 667px) { + .navbar.top { + margin-top: 0; + padding-left: 0; + padding-right: 0; + } + .navbar.top nav a:first-child { + margin-left: 1rem; + } + .navbar.top nav a:last-child { + margin-right: 1rem; + } +} +.paginator-wrap { + margin: 1rem; + display: flex; + justify-content: space-between; + align-items: center; + font-size: 1rem; + font-weight: 700; + background: var(--card); + border-radius: 12px; + overflow: hidden; + box-shadow: 0 2px 8px 0px rgba(0,0,0,0.03); + color: var(--text-p3); +} +.paginator-wrap .page-number { + padding: 4px 8px; + border-radius: 8px; + margin: 2px; +} +.paginator-wrap a.page-number { + color: var(--text-p3); +} +.paginator-wrap a.page-number:hover { + color: var(--text-p1); + background: var(--block); +} +.paginator-wrap .extend { + text-align: center; + background-size: contain; + width: 1rem; + height: 1rem; + background-origin: content-box; + background-clip: content-box; +} +.paginator-wrap .extend.next { + border-left: 1px dashed var(--block-border); + background-image: url("https://gcore.jsdelivr.net/gh/cdn-x/placeholder@1.0.12/arrow/064b95430caf4.svg"); +} +.paginator-wrap .extend.prev { + border-right: 1px dashed var(--block-border); + background-image: url("https://gcore.jsdelivr.net/gh/cdn-x/placeholder@1.0.12/arrow/f049bbd4e88ec.svg"); +} +.paginator-wrap .current { + font-family: Menlo, Monaco, Consolas, system-ui, "Courier New", monospace, sans-serif; + background: var(--block); +} +.paginator-wrap .extend { + padding: 1rem; + line-height: 0; + filter: grayscale(100%); +} +.paginator-wrap .extend img { + height: 1rem; +} +.paginator-wrap .extend.disable { + pointer-events: none; +} +.paginator-wrap span.extend { + opacity: 0.25; +} +.paginator-wrap a.extend:hover { + filter: unset; +} +.related-wrap { + padding: 0 1rem; + margin: 4rem 0; +} +.related-wrap:empty { + display: none; +} +.related-wrap section.header { + display: flex; + justify-content: space-between; + align-items: center; +} +.related-wrap section.header >span.title { + padding: 0.25rem 0; +} +.related-wrap section.footer { + margin-top: 1rem; +} +.related-wrap a.more { + padding: 0.25rem 0.5rem; + border-radius: 8px; + color: var(--text-p1); +} +article.md-text.content+.related-wrap { + margin-top: 0; +} +.related-posts { + max-width: 100%; + margin: 1rem 0; +} +.related-posts .item { + line-height: 1.2; + display: block; + border-left: 0; + margin-top: 1rem; +} +.related-posts .item .title { + color: var(--text-p1); + font-weight: 500; + --fsp: calc(17px - 1px); + font-size: var(--fsp); + transition: color 0.2s ease-out, border 0.2s ease-out; + -moz-transition: color 0.2s ease-out, border 0.2s ease-out; + -webkit-transition: color 0.2s ease-out, border 0.2s ease-out; + -o-transition: color 0.2s ease-out, border 0.2s ease-out; + position: relative; + padding-bottom: 2px; + border-bottom: 1px dashed var(--text-meta); + line-height: 1.6; +} +.related-posts .item .excerpt { + color: var(--text-p3); + --fsp: calc(17px - 3px); + font-size: var(--fsp); + margin-top: 0.5rem; + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 2; +} +.related-posts .item.active .title { + border-bottom: 1px dashed #1cd0fd; +} +.related-posts .item:hover .title { + color: #ff5724; + border-bottom: 1px solid #ff5724; +} +.related-wrap#read-next .body { + display: grid; + grid-gap: 16px; + grid-template-columns: repeat(auto-fill, calc((100% - 1 * 16px) / 2)); +} +.related-wrap#read-next .body .item { + border-top: 1px dashed var(--block-border); + border-bottom: 1px dashed var(--block-border); + padding: 1rem 0; +} +.related-wrap#read-next .body .note { + margin-bottom: 0.75rem; + font-size: 0.8125rem; + color: var(--text-p4); + font-weight: 500; +} +.related-wrap#read-next .body a { + margin: 0; + line-height: 1.2; + color: var(--text-p1); + font-size: calc(17px + 2px); +} +.related-wrap#read-next .body a:hover { + color: #ff5724 !important; +} +.related-wrap#read-next .body #next { + text-align: right; +} +.wiki+.related-wrap#read-next .item a { + font-size: calc(17px + 7px); +} +.wiki+.related-wrap#read-next .item#prev a { + color: var(--text-p3); +} +.related-wrap#comments { + padding: 0 1rem; +} +.related-wrap#comments .cmt-title p { + margin: 0; + font-size: inherit; +} +.related-wrap#comments .cmt-title p a { + --theme-link: #1cd0fd; + --theme-link-opa: rgba(28,208,253,0.2); +} +.related-wrap#comments .cmt-body { + min-height: 150px; + position: relative; +} +.related-wrap#comments .cmt-body svg.loading { + top: 60px; +} +.related-wrap#comments .cmt-body iframe { + border-radius: 12px; + border: none; + width: 100%; +} +.tag-plugin.about { + background: var(--block); + border-radius: 12px; + padding: 2rem; + position: relative; +} +.tag-plugin.about .nav-back { + display: none; + position: absolute; + line-height: 1; + overflow: hidden; + left: 0.75rem; + top: 0.75rem; + align-items: center; +} +@media screen and (max-width: 667px) { + .tag-plugin.about .nav-back { + display: flex; + } +} +.tag-plugin.about .nav-back svg { + width: 1rem; + height: 1rem; +} +.tag-plugin.about .about-header { + display: flex; + justify-content: center; + flex-wrap: wrap; + margin: 1.5rem 0; +} +.tag-plugin.about .about-header img { + object-fit: contain; +} +.tag-plugin.about .about-header >img { + margin: auto 0; +} +.tag-plugin.about .about-header >p { + font-size: 0.75rem; + font-weight: 500; + color: var(--text-p3); + padding-top: 0.75rem; +} +.tag-plugin.about .about-header >p strong:first-child { + font-size: 3rem; + font-weight: 700; + color: var(--text-p1); + margin-right: 0.75rem; +} +.tag-plugin.about .about-header .avatar { + display: inline-flex; + margin: 0 1rem; +} +.tag-plugin.about .about-body >p { + line-height: 1.5; +} +.tag-plugin.about .about-body >p:first-child { + margin-top: 2.5rem; +} +.tag-plugin.about .about-body p+.tag-plugin.navbar .cap { + margin-top: 1rem; +} +.tag-plugin.about .about-header+.about-body { + margin-top: 2rem; +} +@media screen and (max-width: 500px) { + .tag-plugin.about { + padding: 2rem 1rem; + } + .tag-plugin.about .about-header p { + width: 100%; + } +} +.banner { + border-radius: 12px; + position: relative; + overflow: hidden; + display: flex; + flex-direction: column; + justify-content: flex-end; + align-items: flex-start; + height: 220px; +} +.banner.top { + border-radius: 16px; +} +@media screen and (max-width: 667px) { + .banner { + height: 180px; + } +} +.banner .bg { + z-index: 0; +} +.banner .content { + z-index: 1; + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + justify-content: space-between; +} +.banner .content .top { + display: flex; + justify-content: space-between; + align-items: center; + line-height: 1; + margin: 1rem; +} +.banner .content .top .tag-plugin.navbar { + margin: 0; + border-radius: 6px; + padding: 2px; + background: rgba(0,0,0,0.2); + overflow: hidden; +} +.banner .content .top .tag-plugin.navbar:after { + content: none; +} +.banner .content .top .tag-plugin.navbar .link { + margin: 0; + border-radius: 4px; + color: rgba(255,255,255,0.8); + padding: 2px 6px; + background: none; + line-height: 1.5; + font-size: 0.9375rem; + text-shadow: 0 0 1px rgba(0,0,0,0.12); +} +.banner .content .top .tag-plugin.navbar .link+.link { + margin-left: 2px; +} +.banner .content .top .tag-plugin.navbar .link:after { + content: none; +} +.banner .content .top .tag-plugin.navbar .link:hover { + color: #fff; + background: rgba(255,255,255,0.25); +} +.banner .content .top .tag-plugin.navbar .link.active { + color: #fff; + background: rgba(255,255,255,0.25); +} +.banner .content .top .back { + background: none; + padding: 0; + line-height: 0; + visibility: hidden; +} +@media screen and (max-width: 667px) { + .banner .content .top .back { + visibility: visible; + } +} +.banner .content .top .back svg { + width: 20px; + height: 20px; + fill: #fff; +} +.banner .banner-link { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + opacity: 0; + z-index: 2; +} +.banner img { + object-fit: cover; + -moz-user-select: none; + -ms-user-select: none; + -webkit-user-select: none; + user-select: none; + margin: 0; + height: 100%; + width: 100%; +} +.banner img.bg { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; +} +.banner img.avatar { + border-radius: 50%; + width: 48px; + height: 48px; +} +.banner .bottom { + display: flex; + padding: 1rem; + width: 100%; + box-sizing: border-box; +} +.banner .title { + font-size: 1.5rem; + font-weight: 600; +} +.banner .avatar+.text-area { + margin-left: 0.75rem; +} +.banner .text-area .text { + line-height: 1.2; + margin-top: 0.25rem; + margin-bottom: 0.25rem; +} +.banner .avatar+.text-area .title { + font-size: 1.2rem; +} +.banner .subtitle { + font-size: 0.875rem; +} +.banner .content:only-child { + color: var(--text-p1); +} +.banner .bg+.content { + color: #fff; +} +.banner .bg+.content .avatar { + border: 2px solid #fff; + margin: 0; +} +.banner .bg+.content .bottom { + background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.2)); + text-shadow: 0 0 1px rgba(0,0,0,0.12); +} +.tag-plugin.banner { + transition: transform 2s ease-out; + -moz-transition: transform 2s ease-out; + -webkit-transition: transform 2s ease-out; + -o-transition: transform 2s ease-out; +} +.tag-plugin.banner:hover img.bg { + transform: scale(1.01); +} +.tag-plugin.banner .navbar a.active { + background: var(--blur-bg); +} +@supports ((-webkit-backdrop-filter: blur(var(--blur-px))) or (backdrop-filter: blur(var(--blur-px)))) { + .tag-plugin.banner .navbar a.active { + background: var(--blur-bg) !important; + backdrop-filter: saturate(200%) blur(var(--blur-px)); + -webkit-backdrop-filter: saturate(200%) blur(var(--blur-px)); + } +} +.tag-plugin.banner .navbar a.active:hover { + background: var(--card); +} +@media screen and (max-width: 667px) { + .banner.top { + border-radius: 0; + } +} +a.tag-plugin.button { + background: var(--theme); + color: var(--alpha100); + display: inline-flex; + align-items: center; + justify-content: center; + padding: 0 4px; + transition: background 0.2s ease-out; + -moz-transition: background 0.2s ease-out; + -webkit-transition: background 0.2s ease-out; + -o-transition: background 0.2s ease-out; + margin-top: 8px; + margin-bottom: 8px; +} +a.tag-plugin.button svg, +a.tag-plugin.button img { + height: 24px; + width: auto; + margin: 0 -0.5em 0 1em; + flex-shrink: 0; +} +a.tag-plugin.button span { + text-indent: 0; + line-height: 24px; + margin: 8px 1em; +} +a.tag-plugin.button[size='xs'] { + margin: 0; + border-radius: 2px; +} +a.tag-plugin.button[size='xs'] svg, +a.tag-plugin.button[size='xs'] img { + margin: 0 2px 0 0; + height: 1em; +} +a.tag-plugin.button[size='xs'] span { + margin: 0; +} +a.tag-plugin.button:hover { + --theme: #ff5724; +} +.tag-plugin.grid a.tag-plugin.button { + width: 100%; + box-sizing: border-box; +} +.md-text .tag-plugin.checkbox { + display: flex; + align-items: center; + font-size: 0.9375rem; + line-height: 1.2; + --gap-p: calc(var(--gap-p-compact) / 2); +/* Checkbox */ +/* Radio */ +/* Colors */ +} +.md-text .tag-plugin.checkbox input { + -webkit-appearance: none; + -moz-appearance: none; + -ms-appearance: none; + -o-appearance: none; + appearance: none; + position: relative; + height: 16px; + width: 16px; + cursor: pointer; + display: inline-block; + outline: none; + border-radius: 2px; + flex-shrink: 0; + margin-right: 8px; + pointer-events: none; +} +.md-text .tag-plugin.checkbox input[type=checkbox]:before, +.md-text .tag-plugin.checkbox input[type=checkbox]:after { + position: absolute; + content: ""; + background: var(--site-bg); +} +.md-text .tag-plugin.checkbox input[type=checkbox]:before { + left: 1px; + top: 5px; + width: 0px; + height: 2px; + transform: rotate(45deg); + -webkit-transform: rotate(45deg); + -moz-transform: rotate(45deg); + -ms-transform: rotate(45deg); + -o-transform: rotate(45deg); +} +.md-text .tag-plugin.checkbox input[type=checkbox]:after { + right: 7px; + bottom: 3px; + width: 2px; + height: 0px; + transform: rotate(40deg); + -webkit-transform: rotate(40deg); + -moz-transform: rotate(40deg); + -ms-transform: rotate(40deg); + -o-transform: rotate(40deg); +} +.md-text .tag-plugin.checkbox input[type=checkbox]:checked:before { + left: 0px; + top: 7px; + width: 6px; + height: 2px; +} +.md-text .tag-plugin.checkbox input[type=checkbox]:checked:after { + right: 3px; + bottom: 1px; + width: 2px; + height: 10px; +} +.md-text .tag-plugin.checkbox[symbol=minus] input[type=checkbox]:before { + transform: rotate(0); + left: 1px; + top: 5px; + width: 0px; + height: 2px; +} +.md-text .tag-plugin.checkbox[symbol=minus] input[type=checkbox]:after { + transform: rotate(0); + left: 1px; + top: 5px; + width: 0px; + height: 2px; +} +.md-text .tag-plugin.checkbox[symbol=minus] input[type=checkbox]:checked:before { + left: 1px; + top: 5px; + width: 10px; + height: 2px; +} +.md-text .tag-plugin.checkbox[symbol=minus] input[type=checkbox]:checked:after { + left: 1px; + top: 5px; + width: 10px; + height: 2px; +} +.md-text .tag-plugin.checkbox[symbol=plus] input[type=checkbox]:before { + transform: rotate(0); + left: 1px; + top: 5px; + width: 0px; + height: 2px; +} +.md-text .tag-plugin.checkbox[symbol=plus] input[type=checkbox]:after { + transform: rotate(0); + left: 5px; + top: 1px; + width: 2px; + height: 0px; +} +.md-text .tag-plugin.checkbox[symbol=plus] input[type=checkbox]:checked:before { + left: 1px; + top: 5px; + width: 10px; + height: 2px; +} +.md-text .tag-plugin.checkbox[symbol=plus] input[type=checkbox]:checked:after { + left: 5px; + top: 1px; + width: 2px; + height: 10px; +} +.md-text .tag-plugin.checkbox[symbol=times] input[type=checkbox]:before { + transform: rotate(45deg); + left: 3px; + top: 1px; + width: 0px; + height: 2px; +} +.md-text .tag-plugin.checkbox[symbol=times] input[type=checkbox]:after { + transform: rotate(135deg); + right: 3px; + top: 1px; + width: 0px; + height: 2px; +} +.md-text .tag-plugin.checkbox[symbol=times] input[type=checkbox]:checked:before { + left: 1px; + top: 5px; + width: 10px; + height: 2px; +} +.md-text .tag-plugin.checkbox[symbol=times] input[type=checkbox]:checked:after { + right: 1px; + top: 5px; + width: 10px; + height: 2px; +} +.md-text .tag-plugin.checkbox input[type=radio] { + border-radius: 50%; + transform: translateY(-1px); +} +.md-text .tag-plugin.checkbox input[type=radio]:before { + content: ""; + display: block; + width: 8px; + height: 8px; + border-radius: 50%; + margin: 2px; + transform: scale(0); +} +.md-text .tag-plugin.checkbox input[type=radio]:checked:before { + transform: scale(1); +} +.md-text .tag-plugin.checkbox input { + border: 2px solid var(--theme); +} +.md-text .tag-plugin.checkbox input[type=checkbox]:checked { + background: var(--theme); +} +.md-text .tag-plugin.checkbox input[type=radio]:checked:before { + background: var(--theme); +} +.tag-plugin.checkbox:not([color]) { + --theme: #2196f3; +} +.tag-plugin { + --theme: var(--text-p1); + --theme-border: var(--block-border); + --theme-block: var(--block); + --theme-codeblock: var(--block); +} +.colorful[color='red'] { + --theme: #f44336; + --theme-border: #e6b6b3; + --theme-block: #fddbd8; + --theme-codeblock: #f9edec; + --text: #3f1512; + --text-p1: #4f1b17; + --text-p2: #740e06; +} +.colorful[color='orange'] { + --theme: #fa6400; + --theme-border: #e6c7b3; + --theme-block: #fde7d8; + --theme-codeblock: #f9f1ec; + --text: #3f2412; + --text-p1: #4f2d17; + --text-p2: #743206; +} +.colorful[color='amber'] { + --theme: #ffbd2b; + --theme-border: #e6d6b3; + --theme-block: #fdf2d8; + --theme-codeblock: #f9f5ec; + --text: #3f3112; + --text-p1: #4f3e17; + --text-p2: #745206; +} +.colorful[color='yellow'] { + --theme: #f2e03d; + --theme-border: #e6e0b3; + --theme-block: #fdf9d8; + --theme-codeblock: #f9f7ec; + --text: #3f3b12; + --text-p1: #4f4917; + --text-p2: #746906; +} +.colorful[color='green'] { + --theme: #3dc550; + --theme-border: #b3e6ba; + --theme-block: #d8fddd; + --theme-codeblock: #ecf9ee; + --text: #123f19; + --text-p1: #174f1f; + --text-p2: #067416; +} +.colorful[color='cyan'] { + --theme: #1bcdfc; + --theme-border: #b3dbe6; + --theme-block: #d8f5fd; + --theme-codeblock: #ecf6f9; + --text: #12363f; + --text-p1: #17434f; + --text-p2: #065d74; +} +.colorful[color='blue'] { + --theme: #2196f3; + --theme-border: #b3cfe6; + --theme-block: #d8edfd; + --theme-codeblock: #ecf3f9; + --text: #122b3f; + --text-p1: #17364f; + --text-p2: #064374; +} +.colorful[color='purple'] { + --theme: #9c27b0; + --theme-border: #deb3e6; + --theme-block: #f8d8fd; + --theme-codeblock: #f7ecf9; + --text: #39123f; + --text-p1: #47174f; + --text-p2: #640674; +} +.colorful[color='theme'] { + --theme: #1cd0fd; + --theme-border: #b3dbe6; + --theme-block: #d8f6fd; + --theme-codeblock: #ecf6f9; + --text: #12363f; + --text-p1: #17444f; + --text-p2: #065e74; +} +.colorful[color='accent'] { + --theme: #ff5724; + --theme-border: #e6beb3; + --theme-block: #fde1d8; + --theme-codeblock: #f9efec; + --text: #3f1d12; + --text-p1: #4f2417; + --text-p2: #742006; +} +.colorful[color='light'] { + --theme-block: #fff; + --text: #000; + --text-p1: #111; + --text-p2: #1f1f1f; + --text-p3: #555; + --text-code: #fff; +} +.colorful[color='dark'] { + --theme-block: #333; + --text: #fff; + --text-p1: #fff; + --text-p2: #e0e0e0; + --text-p3: #ddd; + --text-code: #fff; +} +.colorful[color='warning'] { + --theme: #f2e03d; + --theme-border: #ffe659; + --theme-block: #ffe659; + --theme-link: #ff453a; +} +.colorful[color='error'] { + --theme: #f2e03d; + --theme-border: #ff453a; + --theme-block: #ff453a; + --theme-link: #ffe659; + --text: #fff; + --text-p1: #fff; + --text-p2: #e0e0e0; + --text-p3: #ddd; + --text-code: #fff; +} +:root[data-theme="dark"] .tag-plugin.tag { + --theme: #1cd0fd; + --theme-border: #1f505c; + --theme-block: #222d2f; + --theme-codeblock: #283133; + --text: #b3f0ff; + --text-p1: #9fd2df; + --text-p2: #7edaf1; +} +:root[data-theme="dark"] .colorful[color='red'] { + --theme: #f44336; + --theme-border: #5c231f; + --theme-block: #2f2322; + --theme-codeblock: #332928; + --text: #ffb8b3; + --text-p1: #dfa49f; + --text-p2: #f1867e; +} +:root[data-theme="dark"] .colorful[color='orange'] { + --theme: #fa6400; + --theme-border: #5c371f; + --theme-block: #2f2722; + --theme-codeblock: #332d28; + --text: #ffd1b3; + --text-p1: #dfb99f; + --text-p2: #f1ac7e; +} +:root[data-theme="dark"] .colorful[color='amber'] { + --theme: #ffbd2b; + --theme-border: #5c491f; + --theme-block: #2f2b22; + --theme-codeblock: #333028; + --text: #ffe7b3; + --text-p1: #dfcb9f; + --text-p2: #f1cd7e; +} +:root[data-theme="dark"] .colorful[color='yellow'] { + --theme: #f2e03d; + --theme-border: #5c561f; + --theme-block: #2f2e22; + --theme-codeblock: #333228; + --text: #fff7b3; + --text-p1: #dfd99f; + --text-p2: #f1e57e; +} +:root[data-theme="dark"] .colorful[color='green'] { + --theme: #3dc550; + --theme-border: #1f5c27; + --theme-block: #222f24; + --theme-codeblock: #28332a; + --text: #b3ffbd; + --text-p1: #9fdfa8; + --text-p2: #7ef18e; +} +:root[data-theme="dark"] .colorful[color='cyan'] { + --theme: #1bcdfc; + --theme-border: #1f4f5c; + --theme-block: #222d2f; + --theme-codeblock: #283133; + --text: #b3efff; + --text-p1: #9fd2df; + --text-p2: #7ed9f1; +} +:root[data-theme="dark"] .colorful[color='blue'] { + --theme: #2196f3; + --theme-border: #1f415c; + --theme-block: #222a2f; + --theme-codeblock: #282f33; + --text: #b3ddff; + --text-p1: #9fc3df; + --text-p2: #7ebef1; +} +:root[data-theme="dark"] .colorful[color='purple'] { + --theme: #9c27b0; + --theme-border: #531f5c; + --theme-block: #2d222f; + --theme-codeblock: #322833; + --text: #f4b3ff; + --text-p1: #d69fdf; + --text-p2: #e07ef1; +} +:root[data-theme="dark"] .colorful[color='light'] { + --theme-border: #fff; + --theme-block: #fff; + --text: #000; + --text-p1: #111; + --text-p2: #1f1f1f; + --text-p3: #555; + --text-code: #fff; +} +:root[data-theme="dark"] .colorful[color='dark'] { + --theme-border: #000; + --theme-block: #111; + --text: #fff; + --text-p1: #fff; + --text-p2: #e0e0e0; + --text-p3: #ddd; + --text-code: #fff; +} +:root[data-theme="dark"] .colorful[color='warning'], +:root[data-theme="dark"] .colorful[color='light'] { + --text: #000; + --text-p1: #111; + --text-p2: #1f1f1f; + --text-p3: #555; + --text-code: #fff; +} +@media (prefers-color-scheme: dark) { + :root:not([data-theme]) .tag-plugin.tag { + --theme: #1cd0fd; + --theme-border: #1f505c; + --theme-block: #222d2f; + --theme-codeblock: #283133; + --text: #b3f0ff; + --text-p1: #9fd2df; + --text-p2: #7edaf1; + } + :root:not([data-theme]) .colorful[color='red'] { + --theme: #f44336; + --theme-border: #5c231f; + --theme-block: #2f2322; + --theme-codeblock: #332928; + --text: #ffb8b3; + --text-p1: #dfa49f; + --text-p2: #f1867e; + } + :root:not([data-theme]) .colorful[color='orange'] { + --theme: #fa6400; + --theme-border: #5c371f; + --theme-block: #2f2722; + --theme-codeblock: #332d28; + --text: #ffd1b3; + --text-p1: #dfb99f; + --text-p2: #f1ac7e; + } + :root:not([data-theme]) .colorful[color='amber'] { + --theme: #ffbd2b; + --theme-border: #5c491f; + --theme-block: #2f2b22; + --theme-codeblock: #333028; + --text: #ffe7b3; + --text-p1: #dfcb9f; + --text-p2: #f1cd7e; + } + :root:not([data-theme]) .colorful[color='yellow'] { + --theme: #f2e03d; + --theme-border: #5c561f; + --theme-block: #2f2e22; + --theme-codeblock: #333228; + --text: #fff7b3; + --text-p1: #dfd99f; + --text-p2: #f1e57e; + } + :root:not([data-theme]) .colorful[color='green'] { + --theme: #3dc550; + --theme-border: #1f5c27; + --theme-block: #222f24; + --theme-codeblock: #28332a; + --text: #b3ffbd; + --text-p1: #9fdfa8; + --text-p2: #7ef18e; + } + :root:not([data-theme]) .colorful[color='cyan'] { + --theme: #1bcdfc; + --theme-border: #1f4f5c; + --theme-block: #222d2f; + --theme-codeblock: #283133; + --text: #b3efff; + --text-p1: #9fd2df; + --text-p2: #7ed9f1; + } + :root:not([data-theme]) .colorful[color='blue'] { + --theme: #2196f3; + --theme-border: #1f415c; + --theme-block: #222a2f; + --theme-codeblock: #282f33; + --text: #b3ddff; + --text-p1: #9fc3df; + --text-p2: #7ebef1; + } + :root:not([data-theme]) .colorful[color='purple'] { + --theme: #9c27b0; + --theme-border: #531f5c; + --theme-block: #2d222f; + --theme-codeblock: #322833; + --text: #f4b3ff; + --text-p1: #d69fdf; + --text-p2: #e07ef1; + } + :root:not([data-theme]) .colorful[color='light'] { + --theme-border: #fff; + --theme-block: #fff; + --text: #000; + --text-p1: #111; + --text-p2: #1f1f1f; + --text-p3: #555; + --text-code: #fff; + } + :root:not([data-theme]) .colorful[color='dark'] { + --theme-border: #000; + --theme-block: #111; + --text: #fff; + --text-p1: #fff; + --text-p2: #e0e0e0; + --text-p3: #ddd; + --text-code: #fff; + } + :root:not([data-theme]) .colorful[color='warning'], + :root:not([data-theme]) .colorful[color='light'] { + --text: #000; + --text-p1: #111; + --text-p2: #1f1f1f; + --text-p3: #555; + --text-code: #fff; + } +} +.md-text .tag-plugin.copy { + display: flex; + justify-content: space-between; + box-sizing: border-box; + background: var(--card); + border-radius: 8px; + border: 1px solid var(--block-border); + overflow: hidden; + width: 100%; + min-width: 200px; +} +.md-text .tag-plugin.copy span { + line-height: 3; + padding: 0 1rem; + background: var(--block); + border-right: 1px solid var(--block-border); + color: var(--text-p3); + font-family: Menlo, Monaco, Consolas, system-ui, "Courier New", monospace, sans-serif; + font-size: 0.8125rem; + font-weight: 700; + flex-shrink: 0; +} +.md-text .tag-plugin.copy input.copy-area { + display: inline-block; + padding: 0; + width: 100%; + color: var(--text-p2); + line-height: 3; + text-indent: 1rem; +} +.md-text .tag-plugin.copy button.copy-btn { + margin: 2px; + border-radius: calc(8px - 2px); + display: inline-block; + background: none; + line-height: 0; + font-size: 1rem; + padding: 0 0.75rem; + color: var(--text-p2); +} +.md-text .tag-plugin.copy button.copy-btn:hover { + background: var(--block-hover); +} +.md-text .tag-plugin.emoji { + display: inline-block; + margin: -4px 2px 0; + vertical-align: middle; +} +.md-text .tag-plugin.emoji img { + display: block; + object-fit: contain; + height: 1.75em; + border-radius: 0; +} +.tag-plugin.folders { + margin: var(--gap-p) 0; + --fsp: calc(17px - 2px); + font-size: var(--fsp); + border-top: 1px solid var(--block-border); + overflow: hidden; +} +.tag-plugin.folders .folder { + border-bottom: 1px solid var(--block-border); + padding: 1rem; +} +.tag-plugin.folders summary { + cursor: pointer; + color: var(--text-p2); + font-weight: 500; + position: relative; + line-height: 1.2; + outline: none; + padding: 1rem; + margin: -1rem; +} +.tag-plugin.folders summary:last-child { + border-bottom: none; +} +.tag-plugin.folders summary > span { + margin-left: 0.25em; +} +.tag-plugin.folders summary > p, +.tag-plugin.folders summary > h1, +.tag-plugin.folders summary > h2, +.tag-plugin.folders summary > h3, +.tag-plugin.folders summary > h4, +.tag-plugin.folders summary > h5, +.tag-plugin.folders summary > h6 { + display: inline; + border-bottom: none !important; +} +.tag-plugin.folders summary:hover { + color: var(--text); +} +.tag-plugin.folders summary:after { + position: absolute; + content: '+'; + text-align: center; + top: 50%; + transform: translateY(-50%); + right: 1rem; +} +.tag-plugin.folders details[open] >summary { + color: var(--text-p1); + font-weight: 700; +} +.tag-plugin.folders details[open] >summary:after { + content: '-'; +} +.tag-plugin.folders details[open] >div.body { + --fsp: calc(17px - 1px); +} +.tag-plugin.folders details[open] >div.body >:first-child { + margin-top: 1rem; +} +.tag-plugin.folders details[open] >div.body >:last-child { + margin-bottom: 0; +} +details.folding { + display: block; + padding: 1rem; + margin: 1rem 0; + border-radius: 12px; + background: var(--theme-block); + border: 1px solid var(--theme-border); +} +details.folding summary { + cursor: pointer; + padding: 1rem; + margin: -1rem; + color: var(--text-p2); + font-weight: 500; + --fsp: calc(17px - 2px); + font-size: var(--fsp); + position: relative; + line-height: 1.2; + outline: none; +} +details.folding summary > span { + margin-left: 0.25em; +} +details.folding summary > p, +details.folding summary > h1, +details.folding summary > h2, +details.folding summary > h3, +details.folding summary > h4, +details.folding summary > h5, +details.folding summary > h6 { + display: inline; + border-bottom: none !important; +} +details.folding summary:hover { + color: var(--text); +} +details.folding summary:after { + position: absolute; + content: '+'; + text-align: center; + top: 50%; + transform: translateY(-50%); + right: 1rem; + line-height: 1; +} +details.folding[open] >summary { + color: var(--text-p1); + font-weight: 700; + z-index: 1; +} +details.folding[open] >summary:after { + content: '-'; +} +details.folding[open] >div.body { + padding: 0 1rem 1rem; + margin: 0 -1rem -1rem; + color: var(--text-p1); + --fsp: calc(17px - 1px); +} +details.folding[open] >div.body >:first-child { + margin-top: 1rem; +} +details.folding[open] >div.body >:last-child { + margin-bottom: 0; +} +details.folding[child=codeblock]>div.body { + padding: 0; + background: transparent; + overflow: hidden; +} +details.folding[child=codeblock]>div.body .highlight { + border: none; + border-radius: 0; + background: transparent; + margin: 0; +} +details.folding[child=codeblock]>div.body .highlight figcaption { + display: none; +} +details.folding[child=codeblock]>div.body .highlight figcaption span { + background: var(--theme-block); +} +details.folding[child=codeblock]>div.body .highlight .code:before { + content: none; +} +details.folding[child=codeblock]>div.body .highlight+.highlight { + border-top: 1px dashed var(--theme-border); + border-top-left-radius: 0; + border-top-right-radius: 0; +} +details.folding[child=iframe] { + overflow: hidden; + background: none; +} +details.folding[child=iframe] >summary { + background: none; +} +details.folding[child=iframe] >div.body { + padding: 0; + background: none; + overflow: hidden; +} +.md-text .frame-wrap { + position: relative; + overflow: hidden; + margin: 0 auto; + max-width: 100%; + display: flex; + flex-direction: column; + align-items: center; +} +.md-text .frame-wrap img, +.md-text .frame-wrap video { + border-radius: 0; +} +.md-text .frame-wrap .frame { + z-index: 1; + display: block; + position: absolute; + background-size: 100%; + background-repeat: no-repeat; + overflow: hidden; +} +.md-text .tag-plugin.img-wrap .frame-wrap[focus] { + height: auto; +} +.md-text .frame-wrap#iphone11 img, +.md-text .frame-wrap#iphone11 video { + width: 287px; + margin-top: 19px; + margin-bottom: 20px; +} +.md-text .frame-wrap#iphone11 .frame { + background-image: url("https://gcore.jsdelivr.net/gh/cdn-x/placeholder@1.0.12/frame/iphone11.svg"); + width: 329px; + height: 658px; +} +.md-text .frame-wrap[focus='top'] img, +.md-text .frame-wrap[focus='top'] video { + margin-bottom: 0 !important; +} +.md-text .frame-wrap:not([focus='bottom']) .frame { + top: 0; +} +.md-text .frame-wrap[focus='bottom'] img, +.md-text .frame-wrap[focus='bottom'] video { + bottom: 0; + margin-top: 0 !important; +} +.md-text .frame-wrap[focus='bottom'] .frame { + bottom: 0; +} +@media screen and (max-width: 500px) { + .md-text .frame-wrap#iphone11 img, + .md-text .frame-wrap#iphone11 video { + width: 208px; + margin-top: 13px; + margin-bottom: 14px; + } + .md-text .frame-wrap#iphone11 .frame { + width: 238px; + height: 476px; + } +} +.users-wrap .grid-box { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); +} +.users-wrap .user-card .card-link { + color: var(--text-p1); + font-size: 10px; + font-weight: 500; + display: flex; + justify-content: flex-start; + flex-direction: column; + align-items: center; + text-align: center; + line-height: 1.2; + border-radius: 4px; + overflow: hidden; + position: relative; + padding: 1rem 0.5rem; +} +.users-wrap .user-card .card-link .name { + max-width: 100%; + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 2; +} +.users-wrap .user-card .card-link img { + object-fit: cover; + display: block; + width: 48px; + height: 48px; + background: var(--card); + border-radius: 64px; + margin: 0 0 0.5rem; +} +.users-wrap .user-card .card-link >img { + transition: transform 0.2s ease-out, box-shadow 0.2s ease-out; + -moz-transition: transform 0.2s ease-out, box-shadow 0.2s ease-out; + -webkit-transition: transform 0.2s ease-out, box-shadow 0.2s ease-out; + -o-transition: transform 0.2s ease-out, box-shadow 0.2s ease-out; +} +.users-wrap .user-card .card-link:hover { + background: var(--block-hover); +} +.users-wrap .user-card .card-link:hover img { + transform: scale(1.2) rotate(8deg); + box-shadow: 0 12px 16px -4px rgba(0,0,0,0.2); +} +.tag-plugin.gallery .grid-cell, +.tag-plugin.gallery .flow-cell { + display: block; + overflow: hidden; + z-index: 0; + position: relative; +} +.tag-plugin.gallery .grid-cell:hover .image-meta, +.tag-plugin.gallery .flow-cell:hover .image-meta { + background: rgba(0,0,0,0.5); +} +.tag-plugin.gallery .grid-cell:hover .image-caption, +.tag-plugin.gallery .flow-cell:hover .image-caption { + color: #fff; +} +.tag-plugin.gallery img { + object-fit: cover; + max-height: 100%; + display: block; +} +.tag-plugin.gallery .image-meta { + position: absolute; + z-index: 1; + top: 0; + left: 0; + right: 0; + bottom: 0; + pointer-events: none; + background: transparent; + transition: background 0.2s ease-out; + -moz-transition: background 0.2s ease-out; + -webkit-transition: background 0.2s ease-out; + -o-transition: background 0.2s ease-out; + display: flex; + flex-direction: column; + justify-content: flex-end; +} +.tag-plugin.gallery .image-meta .image-caption { + display: block; + font-size: 0.8125rem; + color: transparent; + pointer-events: none; + line-height: 1.2; + margin: 0.5rem; + transition: color 0.2s ease-out; + -moz-transition: color 0.2s ease-out; + -webkit-transition: color 0.2s ease-out; + -o-transition: color 0.2s ease-out; + text-align: left; +} +.tag-plugin.gallery .image-meta .image-caption:empty { + display: none; +} +.tag-plugin.gallery .grid-cell >img { + transition: transform 0.5s ease-out; + -moz-transition: transform 0.5s ease-out; + -webkit-transition: transform 0.5s ease-out; + -o-transition: transform 0.5s ease-out; +} +.tag-plugin.gallery .grid-cell:hover >img { + transform: scale(1.1); +} +.tag-plugin.gallery.grid-box { + display: grid; +} +.tag-plugin.gallery.grid-box[size='xs'] { + grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); + grid-gap: 2px; +} +.tag-plugin.gallery.grid-box[size='xs'] .grid-cell, +.tag-plugin.gallery.grid-box[size='xs'] img { + border-radius: 2px; +} +.tag-plugin.gallery.grid-box[size='xs'] .image-caption { + font-size: 0.75rem; +} +.tag-plugin.gallery.grid-box[size='s'] { + grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); + grid-gap: 2px; +} +.tag-plugin.gallery.grid-box[size='s'] .grid-cell, +.tag-plugin.gallery.grid-box[size='s'] img { + border-radius: 2px; +} +.tag-plugin.gallery.grid-box[size='m'] { + grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); + grid-gap: 4px; +} +.tag-plugin.gallery.grid-box[size='m'] .grid-cell, +.tag-plugin.gallery.grid-box[size='m'] img { + border-radius: 4px; +} +.tag-plugin.gallery.grid-box[size='l'] { + grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); + grid-gap: 8px; +} +.tag-plugin.gallery.grid-box[size='l'] .grid-cell, +.tag-plugin.gallery.grid-box[size='l'] img { + border-radius: 8px; +} +.tag-plugin.gallery.grid-box[size='xl'] { + grid-template-columns: repeat(2, 1fr); + grid-gap: 16px; +} +.tag-plugin.gallery.grid-box[size='xl'] .grid-cell, +.tag-plugin.gallery.grid-box[size='xl'] img { + border-radius: 16px; +} +.tag-plugin.gallery.grid-box[size='mix'] { + grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); + grid-gap: 4px; +} +.tag-plugin.gallery.grid-box[size='mix'] .grid-cell, +.tag-plugin.gallery.grid-box[size='mix'] img { + border-radius: 4px; +} +.tag-plugin.gallery.grid-box[size='mix'] .grid-cell:nth-child(3n+1) { + grid-column: auto/span 2; + grid-row: auto/span 2; +} +.tag-plugin.gallery.grid-box[ratio='square'] .grid-cell { + aspect-ratio: 1; +} +.tag-plugin.gallery.grid-box[ratio='portrait'] .grid-cell { + aspect-ratio: 2/3; +} +.tag-plugin.gallery.grid-box .grid-cell { + background: var(--block); +} +.tag-plugin.gallery.grid-box .grid-cell img { + width: 100%; + height: 100%; +} +.tag-plugin.gallery.flow-box { + column-count: 3; + column-gap: 8px; +} +.tag-plugin.gallery.flow-box .flow-cell { + border-radius: 8px; + padding-bottom: 8px; +} +.tag-plugin.gallery.flow-box .flow-cell img { + width: 100%; + height: 100%; +} +.tag-plugin.gallery.flow-box .image-meta { + border-radius: 8px; + margin-bottom: 8px; +} +.tag-plugin.ghcard { + line-height: 0; +} +.tag-plugin.ghcard a.ghcard { + display: inline-block; +} +.tag-plugin.grid { + display: grid; + grid-gap: 16px; +} +.tag-plugin.grid[bg]>.cell> p { + line-height: 1.5; +} +.tag-plugin.grid[bg]>.cell> :first-child { + margin-top: 0; +} +.tag-plugin.grid[bg]>.cell> :last-child { + margin-bottom: 0; +} +.tag-plugin.grid[bg]>.cell> p:first-child { + margin-top: -0.25em; +} +.tag-plugin.grid[bg]>.cell> p:last-child { + margin-bottom: -0.25em; +} +.tag-plugin.grid[bg]>.cell { + padding: 1rem; + border-radius: 12px; +} +.tag-plugin.grid[bg='box']>.cell { + background: var(--block); +} +.tag-plugin.grid[bg='card']>.cell { + background: var(--card); + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; +} +:root[data-theme="light"] .tag-plugin.grid[bg='card']>.cell { + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); +} +:root[data-theme="light"] .tag-plugin.grid[bg='card']>.cell:hover { + box-shadow: 0 12px 20px -4px rgba(0,0,0,0.15); + transform: translate3d(0, -2px, 0); +} +:root[data-theme="dark"] .tag-plugin.grid[bg='card']>.cell:hover { + box-shadow: 0 0 4px -2px #1cd0fd, 0 0 24px -8px #1cd0fd; +} +:root:not([data-theme]) .tag-plugin.grid[bg='card']>.cell { + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); +} +:root:not([data-theme]) .tag-plugin.grid[bg='card']>.cell:hover { + box-shadow: 0 12px 20px -4px rgba(0,0,0,0.15); + transform: translate3d(0, -2px, 0); +} +@media (prefers-color-scheme: dark) { + :root:not([data-theme]) .tag-plugin.grid[bg='card']>.cell:hover { + box-shadow: 0 0 4px -2px #1cd0fd, 0 0 24px -8px #1cd0fd; + } +} +.md-text .tag-plugin.hashtag { + padding: 0px 8px; + border-radius: 100px; + background: var(--theme-block); + color: var(--text-p2); + margin: 2px 0; + display: inline-flex; + align-items: center; + --fsp: calc(17px - 2px); + font-size: var(--fsp); + font-weight: 500; + transition: background 0.2s ease-out, color 0.2s ease-out; + -moz-transition: background 0.2s ease-out, color 0.2s ease-out; + -webkit-transition: background 0.2s ease-out, color 0.2s ease-out; + -o-transition: background 0.2s ease-out, color 0.2s ease-out; +} +.md-text .tag-plugin.hashtag span { + margin: 0 2px; +} +.md-text .tag-plugin.hashtag:hover { + background: var(--text-p2); + color: var(--theme-block); +} +span.tag-plugin.icon { + display: inline-block; + margin: -4px 1px 0; + vertical-align: middle; +} +span.tag-plugin.icon svg, +span.tag-plugin.icon img { + display: block; + height: 1.5em; + width: auto; +} +span.tag-plugin.icon svg { + color: var(--theme); +} +span.tag-plugin.icon img { + object-fit: contain; +} +p>strong>span.tag-plugin.icon { + margin: -4px 4px 0 0; +} +.tag-plugin.icon-wrap span.tag-plugin.icon { + margin-right: 4px; +} +.tag-plugin.image { + margin-top: 1rem; + margin-bottom: 1rem; +} +.tag-plugin.image .image-bg { + text-align: center; + border-radius: 12px; + position: relative; + overflow: hidden; +} +.tag-plugin.image .image-bg:hover .image-download { + opacity: 1 !important; +} +.tag-plugin.image .image-bg img { + display: block; + object-fit: cover; +} +.tag-plugin.image .image-bg .image-download { + position: absolute; + bottom: 8px; + right: 8px; + font-size: 1.125rem; + padding: 6px; + line-height: 0; + border-radius: 40px; + transition: color 0.2s ease-out, opacity 0.2s ease-out, background 0.2s ease-out; + -moz-transition: color 0.2s ease-out, opacity 0.2s ease-out, background 0.2s ease-out; + -webkit-transition: color 0.2s ease-out, opacity 0.2s ease-out, background 0.2s ease-out; + -o-transition: color 0.2s ease-out, opacity 0.2s ease-out, background 0.2s ease-out; + color: var(--text-p1); +} +.tag-plugin.image .image-bg .image-download:hover { + background: var(--card) !important; + color: #1cd0fd; +} +.tag-plugin.image .image-meta { + display: flex; + justify-content: center; + padding: 0.5rem 0; +} +.tag-plugin.image .image-meta .image-caption { + display: inline-block; + font-size: 0.8125rem; + color: var(--text-p2); + line-height: 1.5; + text-align: justify; +} +.tag-plugin.image .image-meta .image-caption:empty { + display: none; +} +.md-text .tag-plugin.paper { + display: flex; + flex-direction: column; + align-items: center; + padding-top: var(--gap-padding); + padding-bottom: var(--gap-padding); +} +.md-text .tag-plugin.paper >.content { + border-left: 1px dashed var(--text-meta); + border-right: 1px dashed var(--text-meta); + border-bottom: 1px dashed var(--text-meta); + border-bottom-left-radius: 12px; + border-bottom-right-radius: 12px; + padding: 1rem; + max-width: calc(95%); +} +.md-text .tag-plugin.paper >.content >.title { + font-weight: 500; + text-align: center; +} +.md-text .tag-plugin.paper >.content >.meta { + color: var(--text-p2); + font-size: 0.75rem; + font-weight: 500; +} +.md-text .tag-plugin.paper >.content >.body >.paragraph { + text-indent: 2em; +} +.md-text .tag-plugin.paper >.content >.body >.section >.section-title { + text-align: center; +} +.md-text .tag-plugin.paper >.content >.body >.section >.section-content { + text-indent: 2em; +} +.md-text .tag-plugin.paper >.content >.body >.line.right >p { + text-align: right; +} +.md-text .tag-plugin.paper >.content >.body .tag-plugin { + margin: 0; +} +.md-text .tag-plugin.paper >.content >.footer { + color: var(--text-p4); + font-size: 0.75rem; + text-align: right; +} +.md-text .tag-plugin.paper >.content >.footer >.author-date { + text-align: right; +} +.md-text .tag-plugin.paper >.content >.footer >.author-date >span { + color: var(--text-p2); + font-size: 0.75rem; + font-weight: 500; +} +.md-text .tag-plugin.paper >.content >.footer >.author-date >.author { + margin-right: calc(0.5 * var(--gap-p)); +} +.md-text .tag-plugin.paper>.content { + position: relative; +} +.md-text .tag-plugin.paper>.content:before { + content: ''; + position: absolute; + height: 4px; + left: -16px; + top: -4px; + right: -16px; + border-radius: 4px; + background: var(--block); +} +.md-text .tag-plugin.paper>.content >.title { + position: relative; +} +.md-text .tag-plugin.paper>.content >.title:before { + content: ''; + position: absolute; + height: 4px; + left: calc(-1rem - 6px); + top: calc(-1rem - 4px); + right: calc(100% + 1rem - 6px); + border-radius: 4px; + background: #ff5724; +} +.md-text .tag-plugin.paper>.content >.title:after { + content: ''; + position: absolute; + height: 4px; + right: calc(-1rem - 6px); + top: calc(-1rem - 4px); + left: calc(100% + 1rem - 6px); + border-radius: 4px; + background: #ff5724; +} +.md-text .tag-plugin.paper > .content.underline > .title, +.md-text .tag-plugin.paper > .content.underline > .meta, +.md-text .tag-plugin.paper > .content.underline > .author-date, +.md-text .tag-plugin.paper > .content.underline > .footer, +.md-text .tag-plugin.paper > .content.underline > .body { + background: linear-gradient(transparent 1.5rem, var(--text-meta) 1px); + background-size: 100% calc(1.5rem + 1px); + line-height: calc(1.5rem + 1px); + padding: 0 3px; +} +.md-text .tag-plugin.paper > .content.underline p { + margin: 0; +} +.md-text .tag-plugin.paper > .content.underline >.title { + border-top: 1px solid var(--text-meta); +} +.md-text .tag-plugin.reel { + display: flex; + flex-direction: column; + align-items: center; + padding-top: var(--gap-padding); + padding-bottom: var(--gap-padding); +} +.md-text .tag-plugin.reel >.content { + display: flex; + flex-direction: column; + writing-mode: vertical-rl; + border-top: 1px dashed var(--text-meta); + border-bottom: 1px dashed var(--text-meta); + max-width: calc(100% - 80px); + padding: 1rem; +} +.md-text .tag-plugin.reel >.content >.title { + font-weight: 500; + font-size: 1rem; +} +.md-text .tag-plugin.reel >.content >.meta { + color: var(--text-p2); + font-size: 0.75rem; + font-weight: 500; +} +.md-text .tag-plugin.reel >.content >.body { + overflow: auto; + margin: calc(var(--gap-padding) - 4px); +} +.md-text .tag-plugin.reel >.content >.body::-webkit-scrollbar { + height: 4px; + width: 4px; +} +.md-text .tag-plugin.reel >.content >.body::-webkit-scrollbar-track-piece { + background: transparent; +} +.md-text .tag-plugin.reel >.content >.body::-webkit-scrollbar-thumb { + background: var(--text-meta); + cursor: pointer; + border-radius: 2px; +} +.md-text .tag-plugin.reel >.content >.body::-webkit-scrollbar-thumb:hover { + background: var(--text-p3); +} +.md-text .tag-plugin.reel >.content >.body .main p { + margin: 0; + font-size: 0.875rem; +} +.md-text .tag-plugin.reel >.content >.date { + color: var(--text-p2); + font-size: 0.75rem; + font-weight: 500; + text-align: right; +} +.md-text .tag-plugin.reel >.content >.footer { + color: var(--text-p4); + font-size: 0.75rem; + text-align: right; +} +.md-text .tag-plugin.reel>.content { + position: relative; +} +.md-text .tag-plugin.reel>.content:before { + content: ''; + position: absolute; + width: 4px; + left: -4px; + top: -16px; + bottom: -16px; + border-radius: 4px; + background: var(--block); +} +.md-text .tag-plugin.reel>.content:after { + content: ''; + position: absolute; + width: 4px; + left: calc(100%); + top: -16px; + bottom: -16px; + border-radius: 4px; + background: var(--block); +} +.md-text .tag-plugin.reel>.content >.title { + position: relative; +} +.md-text .tag-plugin.reel>.content >.title:before { + content: ''; + position: absolute; + width: 4px; + right: calc(-1rem - 4px); + top: calc(-1rem - 6px); + bottom: calc(100% + 1rem - 6px); + border-radius: 4px; + background: #ff5724; + z-index: 1; +} +.md-text .tag-plugin.reel>.content >.title:after { + content: ''; + position: absolute; + width: 4px; + right: calc(-1rem - 4px); + top: calc(100% + 1rem - 6px); + bottom: calc(-1rem - 6px); + border-radius: 4px; + background: #ff5724; + z-index: 1; +} +.md-text .tag-plugin.reel>.content >.footer { + position: relative; +} +.md-text .tag-plugin.reel>.content >.footer:before { + content: ''; + position: absolute; + width: 4px; + left: calc(-1rem - 4px); + top: calc(-1rem - 6px); + bottom: calc(100% + 1rem - 6px); + border-radius: 4px; + background: #ff5724; +} +.md-text .tag-plugin.reel>.content >.footer:after { + content: ''; + position: absolute; + width: 4px; + left: calc(-1rem - 4px); + top: calc(100% + 1rem - 6px); + bottom: calc(-1rem - 6px); + border-radius: 4px; + background: #ff5724; +} +.md-text u { + text-decoration: none; + border-bottom: 2px solid #ff5724; +} +.md-text emp { + width: fit-content; + text-decoration: none; + border-bottom: 4px dotted #ff5724; +} +.md-text wavy { + text-decoration: underline wavy #ff5724; +} +.md-text del { + color: var(--text-p3); + text-decoration: line-through var(--text-p3); +} +.md-text kbd { + border-radius: 4px; + border: 1px solid #d2d2d2; + border-bottom-width: 2px; + background: var(--card); + padding: 2px 4px 1px 4px; + font-family: Menlo, Monaco, Consolas, system-ui, "Courier New", monospace, sans-serif; + font-weight: 700; +} +.md-text psw { + color: transparent; + background: #a1a1a1; + border-radius: 2px; + transition: background 0.2s ease-out; + -moz-transition: background 0.2s ease-out; + -webkit-transition: background 0.2s ease-out; + -o-transition: background 0.2s ease-out; + margin: auto 2px; +} +.md-text psw:hover { + color: inherit; + background: none; +} +.md-text sup, +.md-text sub { + color: var(--theme); + line-height: 1; + font-weight: 700; + font-family: Menlo, Monaco, Consolas, system-ui, "Courier New", monospace, sans-serif; +} +.md-text h1 sup, +.md-text h2 sup, +.md-text h3 sup, +.md-text h4 sup, +.md-text h1 sub, +.md-text h2 sub, +.md-text h3 sub, +.md-text h4 sub { + font-size: 0.85rem; +} +.md-text .tag-plugin.link { + margin: 1em auto; + display: flex; + justify-content: center; +} +.md-text .link-card { + background: var(--card); + display: inline-flex; + justify-content: space-between; + align-items: center; + cursor: pointer; + width: 300px; + max-width: 100%; + border-radius: 12px; + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; +} +:root[data-theme="light"] .md-text .link-card { + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); +} +:root[data-theme="light"] .md-text .link-card:hover { + box-shadow: 0 12px 20px -4px rgba(0,0,0,0.15); + transform: translate3d(0, -2px, 0); +} +:root[data-theme="dark"] .md-text .link-card:hover { + box-shadow: 0 0 4px -2px #1cd0fd, 0 0 24px -8px #1cd0fd; +} +:root:not([data-theme]) .md-text .link-card { + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); +} +:root:not([data-theme]) .md-text .link-card:hover { + box-shadow: 0 12px 20px -4px rgba(0,0,0,0.15); + transform: translate3d(0, -2px, 0); +} +@media (prefers-color-scheme: dark) { + :root:not([data-theme]) .md-text .link-card:hover { + box-shadow: 0 0 4px -2px #1cd0fd, 0 0 24px -8px #1cd0fd; + } +} +.md-text .link-card.plain { + flex-direction: row; + align-items: center; +} +.md-text .link-card.rich { + flex-direction: column; + align-items: stretch; + width: 460px; + text-align: justify; +} +.md-text .link-card >.left { + overflow: hidden; + margin: 0.75rem 0 0.75rem 0.75rem; +} +.md-text .link-card >.left .title { + font-size: 0.875rem; +} +.md-text .link-card >.left span+span { + margin-top: 0.25rem; +} +.md-text .link-card >.right { + width: 2.75rem; + height: 2.75rem; + margin: 0.75rem; + overflow: hidden; + flex-shrink: 0; +} +.md-text .link-card >.top { + display: flex; + margin: 1rem 1rem 0.75rem; + overflow: hidden; + max-width: calc(100% - 1rem * 2); + align-items: center; +} +.md-text .link-card >.top .img { + line-height: 0; + height: 16px; + width: 16px; + border-radius: 16px; + margin-right: 8px; + background-repeat: no-repeat; + background-size: contain; + background-position: left center; +} +.md-text .link-card >.top span { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + max-width: 100%; +} +.md-text .link-card >.bottom { + margin: 0 1rem 1rem; +} +.md-text .link-card >.bottom .title { + font-size: 1rem; + margin-bottom: 0.5rem; +} +.md-text .link-card { + line-height: 1.2; +} +.md-text .link-card .title { + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 2; +} +.md-text .link-card .cap { + flex-shrink: 0; + color: var(--text-p3); +} +.md-text .link-card .link { + line-height: 1.5; + opacity: 0.75; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +.md-text .link-card .desc { + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 3; +} +.md-text .link-card .img { + border-radius: 4px; +} +.md-text .link-card span { + margin: 0; + display: block; +} +.md-text .link-card .title { + font-weight: 500; + color: var(--text-p1); +} +.md-text .tag-plugin.mark { + padding: 1px 2px; + border-radius: 2px; + background: var(--theme-block); + color: var(--text); +} +.tag-plugin.video { + line-height: 0; + margin: auto; +} +.tag-plugin.video video, +.tag-plugin.video iframe { + border-radius: 12px; + box-shadow: 0 12px 16px -4px rgba(0,0,0,0.2); + z-index: 1; + background: var(--block); + width: 100%; + height: 100%; + margin: 0; +} +.tag-plugin.navbar { + padding: 0; +} +.tag-plugin.navbar:after { + left: 0; + right: 0; +} +@media screen and (min-width: 667px) { + .tag-plugin.navbar nav a { + margin-top: 2px; + } +} +.md-text .tag-plugin.note { + position: relative; + padding: 0.25rem 1rem; + border-radius: 12px; + background: var(--theme-block); + overflow: hidden; + border: 1px solid var(--theme-border); + color: var(--text-p1); +} +.md-text .tag-plugin.note >.title { + --fsp: calc(17px - 1px); + font-size: var(--fsp); + line-height: 1.5; + margin-top: var(--gap-p-compact); + font-weight: 500; + color: var(--text); +} +.md-text .tag-plugin.note >.body { + margin-top: var(--gap-p-compact); + margin-bottom: var(--gap-p-compact); +} +.md-text .tag-plugin.note >.body, +.md-text .tag-plugin.note >.body p { + --fsp: calc(17px - 2px); + font-size: var(--fsp); + line-height: 1.5; +} +.md-text .tag-plugin.note >.body:only-child { + margin: calc(var(--gap-p) - 0.25rem) 0; +} +.md-text .tag-plugin.note[color] code { + background: none; +} +.md-text .tag-plugin.note:not([color]) .highlight { + background: var(--block-hover); +} +.md-text .tag-plugin.note[child=codeblock] { + padding: 0; + background: var(--theme-codeblock); +} +.md-text .tag-plugin.note[child=codeblock] >.title, +.md-text .tag-plugin.note[child=codeblock] >.body:only-child { + margin-top: 0; +} +.md-text .tag-plugin.note[child=codeblock] >.body { + margin-bottom: 0; +} +.md-text .tag-plugin.note[child=codeblock] .highlight { + margin: 0; + border: none; + background: none; +} +.md-text .tag-plugin.note[child=codeblock] .highlight figcaption span { + background: var(--theme-block); +} +.md-text .tag-plugin.note[child=codeblock] .highlight+.highlight { + border-top: 1px dashed var(--theme-border); + border-top-left-radius: 0; + border-top-right-radius: 0; +} +.md-text .tag-plugin.note[child=tabs] >.body { + margin: 0; +} +.md-text .tag-plugin.note[child=tabs] >.body >.tabs { + margin-top: 0.5rem; +} +.md-text .tag-plugin.note[child=iframe] { + padding: 0; +} +.md-text .tag-plugin.note[child=iframe] >.body { + margin: 0; +} +.md-text .tag-plugin.note[child=iframe] >.body iframe { + margin: 0; +} +.md-text .tag-plugin .tag-plugin.note { + --gap-p: 1rem; +} +.md-text .tag-plugin.okr { + position: relative; + border-radius: 12px; + background: var(--theme-block); + border: 1px solid var(--theme-border); + overflow: hidden; + color: var(--text-p1); + line-height: 1.5; +} +.md-text .tag-plugin.okr .o .title { + font-size: 0.9375rem; +} +.md-text .tag-plugin.okr .o .note { + font-size: 0.875rem; +} +.md-text .tag-plugin.okr .o .note p { + font-size: 0.875rem; +} +.md-text .tag-plugin.okr .kr .title { + font-size: 0.875rem; +} +.md-text .tag-plugin.okr .kr .note { + font-size: 0.875rem; +} +.md-text .tag-plugin.okr .kr .note p, +.md-text .tag-plugin.okr .kr .note li, +.md-text .tag-plugin.okr .kr .note .tag-plugin { + font-size: 0.875rem; +} +.md-text .tag-plugin.okr .title { + font-weight: 600; + display: block; +} +.md-text .tag-plugin.okr .note { + font-weight: 400; + display: block; + margin-top: 0.5rem; +} +.md-text .tag-plugin.okr .note >p, +.md-text .tag-plugin.okr .note >ul { + margin-top: 0.25rem; + margin-bottom: 0.25rem; +} +.md-text .tag-plugin.okr .note >.tag-plugin { + margin-top: 0.25rem; + margin-bottom: 0.25rem; +} +.md-text .tag-plugin.okr .note >*:last-child { + margin-bottom: 0; +} +.md-text .tag-plugin.okr .status { + font-size: 0.75rem; + padding: 2px 4px; + border-radius: 2px; +} +.md-text .tag-plugin.okr .okr-item.o { + border-bottom: 4px solid var(--theme-border); +} +.md-text .tag-plugin.okr .okr-item.kr+.okr-item.kr { + border-top: 1px dashed var(--theme-border); +} +.tag-plugin.okr .okr-item { + display: grid; + grid-template-columns: 3.2rem auto 100px; + grid-column-gap: 0.75rem; + padding: 1rem; +} +.tag-plugin.okr .okr-item .okr-left .title { + background: var(--card); + border-radius: 1rem; + text-align: center; + padding: 0 0.5rem; +} +.tag-plugin.okr .okr-item .labels { + display: flex; + justify-content: space-between; + align-items: flex-start; + position: relative; + flex-wrap: wrap; +} +.tag-plugin.okr .okr-item .labels .label { + background: var(--theme-block); + color: var(--text-p1); +} +.tag-plugin.okr .okr-item .progress { + margin-top: 4px; + height: 4px; + border-radius: 2px; + position: relative; + background: var(--card); +} +.tag-plugin.okr .okr-item .progress .fill { + position: absolute; + background: var(--theme); + border-radius: 2px; + top: 0; + left: 0; + bottom: 0; +} +.tag-plugin.okr .okr-item .progress .fill:before { + content: ''; + position: absolute; + top: -4px; + bottom: -4px; + right: -4px; + width: 8px; + height: 12px; + border-radius: 8px; + background: #fff; + box-shadow: 0 0 2px 0px rgba(0,0,0,0.04), 0 0 8px 0px rgba(0,0,0,0.04); +} +.tag-plugin.okr .okr-item .progress .fill:after { + content: ''; + position: absolute; + top: -2px; + bottom: -2px; + right: -2px; + width: 4px; + height: 8px; + border-radius: 4px; + background: var(--theme); +} +@media screen and (max-width: 667px) { + .tag-plugin.okr .okr-item { + grid-template-columns: 2.8rem auto 50px; + grid-column-gap: 0.5rem; + padding: 0.5rem; + } + .tag-plugin.okr .okr-item .okr-left .title { + padding: 0 0.25rem; + } + .tag-plugin.okr .okr-item .label { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } +} +.tag-plugin.note blockquote, +.tag-plugin.folding blockquote { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + background: none; + padding-top: 0; + padding-bottom: 0; +} +.tag-plugin.note table:not([class]) th, +.tag-plugin.folding table:not([class]) th { + background: var(--block-hover); +} +.tag-plugin.note table:not([class]) td, +.tag-plugin.folding table:not([class]) td, +.tag-plugin.note table:not([class]) th, +.tag-plugin.folding table:not([class]) th { + border-color: var(--block-border); +} +.md-text .tag-plugin.poetry { + display: flex; + flex-direction: column; + align-items: center; +} +.md-text .tag-plugin.poetry .content >.title { + font-weight: 500; + margin-top: var(--gap-p); +} +.md-text .tag-plugin.poetry .content >.meta { + color: var(--text-p2); + --fsp: calc(17px - 3px); + font-size: var(--fsp); + font-weight: 500; +} +.md-text .tag-plugin.poetry .content >.meta span+span { + margin-left: 4px; +} +.md-text .tag-plugin.poetry .content >.body { + margin: var(--gap-p) 0; + border-top: 1px dashed var(--block-border); + border-bottom: 1px dashed var(--block-border); + line-height: 2; +} +.md-text .tag-plugin.poetry .content >.footer { + font-style: italic; + color: var(--text-p4); + margin: var(--gap-p) 0; + --fsp: calc(17px - 3px); + font-size: var(--fsp); +} +.md-text .tag-plugin.poetry .content { + padding-left: 1rem; + position: relative; +} +.md-text .tag-plugin.poetry .content:before { + content: ''; + position: absolute; + width: 4px; + left: -4px; + top: 4px; + bottom: 4px; + border-radius: 4px; + background: var(--block); +} +.md-text .tag-plugin.poetry .content >.title { + position: relative; +} +.md-text .tag-plugin.poetry .content >.title:before { + content: ''; + position: absolute; + width: 4px; + left: calc(-1rem - 4px); + top: 6px; + bottom: 6px; + border-radius: 4px; + background: #ff5724; +} +.md-text .tag-plugin.quot { + text-align: center; + align-items: center; + display: flex; + flex-direction: column; + --gap-p: 2rem; + margin: var(--gap-p) 1rem; +} +.md-text .tag-plugin.quot .content { + display: flex; + align-items: center; + border-bottom: none; + font-weight: 700; + padding: 0 24px; + line-height: 1.2; +} +@media screen and (max-width: 500px) { + .md-text .tag-plugin.quot .content { + padding: 0 20px; + } +} +.md-text .tag-plugin.quot .content { + position: relative; +} +.md-text.content .tag-plugin.quot h1, +.md-text.content .tag-plugin.quot h2 { + font-size: calc(17px + 11px); + font-weight: 900; + padding: 4px 32px 0; +} +@media screen and (max-width: 500px) { + .md-text.content .tag-plugin.quot h1, + .md-text.content .tag-plugin.quot h2 { + padding: 4px 24px 0; + } +} +.md-text.content .tag-plugin.quot h3, +.md-text.content .tag-plugin.quot h4, +.md-text.content .tag-plugin.quot h5, +.md-text.content .tag-plugin.quot h6 { + font-size: calc(17px + 7px); +} +.md-text.content .tag-plugin.quot p { + font-size: calc(var(--fsp) + 2px); + color: var(--text); +} +.md-text .tag-plugin.quot .content[type=text]:before, +.md-text .tag-plugin.quot .content[type=text]:after { + content: ""; + position: absolute; + width: 8px; + height: 14px; +} +.md-text .tag-plugin.quot .content[type=text]:before { + top: -8px; + left: 0; + border-top: 6px solid #ff5724; + border-left: 6px solid #ff5724; +} +.md-text .tag-plugin.quot .content[type=text]:after { + right: 0; + bottom: -8px; + border-right: 6px solid #ff5724; + border-bottom: 6px solid #ff5724; +} +.md-text .tag-plugin.quot h1.content[type=text]:before, +.md-text .tag-plugin.quot h1.content[type=text]:after { + width: 12px; + height: 20px; + border-width: 8px; +} +.md-text .tag-plugin.quot .content[type=icon] img, +.md-text .tag-plugin.quot .content[type=icon] svg { + height: 1.5em; + display: inline-block; + color: #ff5724; + border-radius: 0; + flex-shrink: 0; +} +.md-text .tag-plugin.quot .content[type=icon] span.text { + margin: 0 0.5rem; + padding-top: 1px; +} +.md-text .tag-plugin.quot .content[type=icon] span.empty { + padding: 0 8px; +} +.sites-wrap .grid-box { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); + grid-gap: 1rem 1rem; +} +.sites-wrap .grid-box .grid-cell { + aspect-ratio: 1.5; +} +.sites-wrap .site-card .card-link { + width: 100%; + display: flex; + flex-direction: column; +} +.sites-wrap .site-card .card-link >img { + object-fit: cover; + aspect-ratio: 1.5; + width: 100%; + height: 100%; + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.2); +} +.sites-wrap .site-card .card-link .info { + margin-top: 0.5rem; + line-height: 1.2; +} +.sites-wrap .site-card .card-link .info >img { + width: 28px; + height: 28px; + border-radius: 28px; + float: left; + margin-right: 8px; + margin-top: 2px; +} +.sites-wrap .site-card .card-link .info span { + display: block; +} +.sites-wrap .site-card .card-link .info .title { + font-weight: 500; + color: var(--text-p1); + font-size: 0.875rem; + margin-top: 1px; + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 1; +} +.sites-wrap .site-card .card-link .info .desc { + font-size: 10px; + margin-top: 2px; + word-wrap: break-word; + color: var(--text-p3); + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 1; +} +.sites-wrap .site-card .card-link >img { + transition: transform 0.2s ease-out, box-shadow 0.2s ease-out; + -moz-transition: transform 0.2s ease-out, box-shadow 0.2s ease-out; + -webkit-transition: transform 0.2s ease-out, box-shadow 0.2s ease-out; + -o-transition: transform 0.2s ease-out, box-shadow 0.2s ease-out; +} +.sites-wrap .site-card .card-link:hover >img { + box-shadow: 0 12px 20px -4px rgba(0,0,0,0.15); + transform: translate3d(0, -2px, 0); +} +.tag-plugin.tabs { + position: relative; + margin-top: 1rem; + margin-bottom: 1rem; + display: flex; + flex-direction: column; +} +.tag-plugin.tabs[align=left] { + align-items: flex-start; +} +.tag-plugin.tabs[align=left] .nav-tabs { + align-self: flex-start; +} +.tag-plugin.tabs[align=center] { + align-items: center; +} +.tag-plugin.tabs[align=right] { + align-items: flex-end; +} +.tag-plugin.tabs[align=right] .nav-tabs { + align-self: flex-end; +} +.tag-plugin.tabs .nav-tabs { + display: flex; + align-self: center; + overflow: scroll visible; + max-width: 100%; + white-space: nowrap; + margin: 0 !important; + line-height: 1.5; + position: relative; + padding: 8px 0; +} +.tag-plugin.tabs .nav-tabs::-webkit-scrollbar { + height: 0; + width: 0; +} +.tag-plugin.tabs .nav-tabs::-webkit-scrollbar-track-piece { + background: transparent; +} +.tag-plugin.tabs .nav-tabs::-webkit-scrollbar-thumb { + background: var(--text-meta); + cursor: pointer; + border-radius: 0; +} +.tag-plugin.tabs .nav-tabs::-webkit-scrollbar-thumb:hover { + background: var(--text-p3); +} +.tag-plugin.tabs .nav-tabs:after { + content: ''; + position: absolute; + background: var(--block-hover); + width: 100%; + height: 2px; + bottom: 0; + left: 0; + border-radius: 2px; +} +.tag-plugin.tabs .nav-tabs .tab { + list-style-type: none; +} +.tag-plugin.tabs .nav-tabs .tab a { + display: block; + cursor: pointer; + padding: 0.25rem 0.75rem; + --fsp: calc(17px - 3px); + font-size: var(--fsp); + line-height: inherit; + font-weight: 500; + color: var(--text-p3); + border-radius: 4px; + position: relative; + margin: 0 2px; +} +.tag-plugin.tabs .nav-tabs .tab a:hover { + color: var(--text-p1); + background: var(--block-hover); +} +.tag-plugin.tabs .nav-tabs .tab a i { + pointer-events: none; +} +.tag-plugin.tabs .nav-tabs .tab.active a { + cursor: default; + color: var(--text-p1); + background: var(--card); + box-shadow: 0 0 2px 0px rgba(0,0,0,0.04), 0 0 8px 0px rgba(0,0,0,0.04); +} +.tag-plugin.tabs .nav-tabs .tab.active a:after { + content: ''; + z-index: 1; + position: absolute; + background: #1cd0fd; + height: 2px; + bottom: -8px; + left: 0.75rem; + right: 0.75rem; + border-radius: 2px; +} +.tag-plugin.tabs .tab-content { + max-width: 100%; + text-align: justify; + margin-top: 0.5rem; +} +.tag-plugin.tabs .tab-content .tab-pane:not(.active) { + display: none; +} +.tag-plugin.tabs .tab-content .tab-pane.active { + display: block; +} +.tag-plugin.tabs .tab-content:has(.grid-box) { + width: 100%; +} +.l_body[text-indent] .md-text .tag-plugin.tabs .tab-content .tab-pane>p:not([class]) { + text-indent: calc(var(--fsp) * 2); +} +.l_body[text-indent] .md-text .tag-plugin.tabs .tab-content .tab-pane>p:not([class]) a { + text-indent: 0; +} +.tag-plugin.timeline { + position: relative; + padding-left: 16px; +} +.tag-plugin.timeline:before { + content: ''; + position: absolute; + z-index: 0; + background: var(--block-hover); + width: 4px; + left: 0px; + border-radius: 8px; + top: 0.5rem; + bottom: 0; +} +.tag-plugin.timeline:has(.loading-wrap) { + padding-left: 0; +} +.tag-plugin.timeline:has(.loading-wrap):before { + display: none; +} +.tag-plugin.timeline .timenode { + position: relative; + display: flex; + flex-direction: column; + align-items: flex-start; + box-sizing: border-box; + max-width: 100%; +} +.tag-plugin.timeline .timenode >.header, +.tag-plugin.timeline .timenode >.body { + box-sizing: border-box; + max-width: 100%; +} +.tag-plugin.timeline .timenode[highlight] .header:before { + background: #1cd0fd; +} +.tag-plugin.timeline .timenode+.timenode { + margin-top: 1rem; +} +.tag-plugin.timeline .timenode:hover .header span { + color: var(--text-p1); +} +.tag-plugin.timeline .timenode:hover .header:before { + background: #1cd0fd; + height: 16px; + top: calc(50% - 0.5 * 16px); + transform: scale(1); +} +.tag-plugin.timeline .timenode .header { + display: flex; + align-items: center; + position: relative; + margin: 0.25rem 0; + font-size: 0.8125rem; +} +.tag-plugin.timeline .timenode .header a.user-info span { + font-weight: 600; +} +.tag-plugin.timeline .timenode .header .user-info { + display: flex; + align-items: center; + font-size: 0.8125rem; + font-weight: 500; + color: var(--text-p1); + margin-right: 8px; + line-height: 1; + border-radius: 16px; +} +.tag-plugin.timeline .timenode .header .user-info img { + background: #fff; + height: 16px; + border-radius: 16px; + display: inline; + margin: 0 4px 0 0; + object-fit: contain; +} +.tag-plugin.timeline .timenode .header, +.tag-plugin.timeline .timenode .header span { + font-weight: 500; + color: var(--text-p3); + line-height: 1; +} +.tag-plugin.timeline .timenode .header:before { + content: ''; + position: absolute; + left: -16px; + width: 4px; + border-radius: 12px; + height: 4px; + top: calc(50% - 0.5 * 4px); + background: var(--text-meta); + transition: background 0.2s ease-out, height 0.2s ease-out, top 0.2s ease-out, transform 0.2s ease-out; + -moz-transition: background 0.2s ease-out, height 0.2s ease-out, top 0.2s ease-out, transform 0.2s ease-out; + -webkit-transition: background 0.2s ease-out, height 0.2s ease-out, top 0.2s ease-out, transform 0.2s ease-out; + -o-transition: background 0.2s ease-out, height 0.2s ease-out, top 0.2s ease-out, transform 0.2s ease-out; + transform: scale(2); +} +.tag-plugin.timeline .body { + background: var(--card); + border-radius: 12px; + border-top-left-radius: 2px; + padding: 0.5rem 1rem; + margin-top: 4px; + box-shadow: 0 1px 4px 0px rgba(0,0,0,0.02), 0 2px 8px 0px rgba(0,0,0,0.02); +} +.tag-plugin.timeline .body p { + --fsp: calc(17px - 1px); +} +.tag-plugin.timeline .body p img { + display: block; +} +.tag-plugin.timeline .body:empty { + display: none; +} +.tag-plugin.timeline .body p, +.tag-plugin.timeline .body .highlight, +.tag-plugin.timeline .body ol, +.tag-plugin.timeline .body ul, +.tag-plugin.timeline .body .tag-plugin { + margin: 0.5rem 0; +} +.tag-plugin.timeline .body .tag-plugin.copy { + width: 240px; +} +.tag-plugin.timeline[api] a.body { + display: block; + color: var(--text-p1); + line-height: 1.25; + padding: 0.75rem 1rem; + --fsp: calc(17px - 1px); + font-size: var(--fsp); +} +.tag-plugin.timeline[api] .body p.title { + font-weight: 700; + margin: 0.5rem 0 0.75rem; + line-height: 1.25; +} +.tag-plugin.timeline[api] .body p.title:only-child { + margin-bottom: 0.5rem; + font-weight: 500; +} +.tag-plugin.timeline[api] .body p.title a { + color: inherit; + text-decoration: none; + border-bottom: 2px solid #1cd0fd; + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; + background: none; +} +.tag-plugin.timeline[api] .body p.title a:hover { + background: none; + border-radius: 0; + border-bottom: 2px solid #ff5724; +} +.tag-plugin.timeline[api] .body >p:first-child:not([class]) a:not([class]) { + padding: 0; + margin: 0; + color: inherit; + text-decoration: none; + border-bottom: 2px solid #1cd0fd; + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; + background: none; +} +.tag-plugin.timeline[api] .body >p:first-child:not([class]) a:not([class]):hover { + background: none; + border-radius: 0; + border-bottom: 2px solid #ff5724; +} +.tag-plugin.timeline[api] .body a:has(img):after { + display: none; +} +.tag-plugin.timeline[api] .body a img { + margin: 0 auto; +} +.tag-plugin.timeline[api] .body img { + margin: 0.5rem auto; +} +.tag-plugin.timeline[api] .body pre code { + font-size: 0.8125rem; +} +.tag-plugin.timeline[api] .body .footer { + margin: 0 0 -0.5rem; + padding: 0.5rem 0 1rem; + user-select: none; + font-weight: 500; + display: flex; + flex-wrap: wrap; + justify-content: space-between; + align-items: stretch; + background: var(--card); +} +.tag-plugin.timeline[api] .body .footer span { + line-height: 1.8; +} +.tag-plugin.timeline[api] .body .footer:empty { + display: none; +} +.tag-plugin.timeline[api] .body .footer .flex { + display: flex; + flex-wrap: wrap; + font-size: 0.8125rem; + align-items: stretch; +} +.tag-plugin.timeline[api] .body .footer .left+.right { + margin-left: 4px; +} +.tag-plugin.timeline[api] .body .footer .item { + border-width: 1px; + border-style: solid; + margin: 2px; + border-radius: 4px; + padding: 0 0.5rem; + display: flex; + align-items: center; + border-color: #2094f3; +} +.tag-plugin.timeline[api] .body .footer .item:first-child { + margin-left: 0; +} +.tag-plugin.timeline[api] .body .footer .item:last-child { + margin-right: 0; +} +.tag-plugin.timeline[api] .body .footer a.item { + background: var(--block); + border-color: var(--block-border); + color: inherit; +} +.tag-plugin.timeline[api] .body .footer a.item:hover { + background: var(--block-hover); +} +.tag-plugin.timeline[api] .body .footer .reaction { + border-color: var(--block); +} +.tag-plugin.timeline .body blockquote { + background: none; + border-radius: 0; + padding: 0 0.5rem; + margin: 0.75rem 0; +} +.tag-plugin.timeline .body blockquote p { + --fsp: calc(17px - 2px); + margin: 0.25rem; +} +.tag-plugin.timeline .body { + line-height: 1.5; +} +.tag-plugin.timeline .body h1, +.tag-plugin.timeline .body h2 { + font-size: 1.25rem; + margin: 1rem 0; + line-height: 1.2; +} +.tag-plugin.timeline .body h3, +.tag-plugin.timeline .body h4 { + font-size: 1rem; + margin: 0.75rem 0; + line-height: 1.2; +} +.tag-plugin.timeline .body h5, +.tag-plugin.timeline .body h6 { + font-size: 0.9375rem; + margin: 0.5rem 0; + line-height: 1.2; +} +.tag-plugin.timeline.ds-memos .body p:first-child { + margin-top: 2px; +} +.tag-plugin.timeline.ds-memos .body p:last-child { + margin-bottom: 2px; +} +.tag-plugin.timeline.ds-memos .body img { + margin: 0.5rem 0; + max-height: 128px; + cursor: zoom-in; +} +.tag-plugin.timeline.ds-memos .body .tag-plugin.image { + display: flex; +} +.tag-plugin.timeline.ds-memos .body .tag-plugin.image .image-bg+.image-bg { + margin-left: 4px; +} +details.toc { + background: var(--block); + border: 1px solid var(--block-border); + border-radius: 12px; + overflow: hidden; + color: var(--text-p2); +} +details.toc summary { + cursor: pointer; + padding: 0 0.5rem; + line-height: 2; + color: var(--text-p2); + font-size: 0.8125rem; + font-weight: 500; +} +details.toc summary:hover { + background: var(--block-hover); +} +details.toc >div.body { + margin: var(--gap-p) 1rem 1rem; +} +details.toc[open] >summary { + border-bottom: 1px solid transparent; +} +details.toc[open] >summary:hover { + border-bottom-color: var(--block-border); +} +details.toc[open] >div.body section+section { + margin-top: 1rem; +} +details.toc[open] >div.body section .header { + line-height: 2; + font-weight: 500; +} +details.toc[open] >div.body section .header+.doc_tree { + margin-top: 0; +} +@media screen and (max-width: 667px) { + .tag-plugin.toc[display=mobile] { + display: block !important; + } +} +.l_left footer.footer { + margin: 0.5rem var(--gap-max) 1rem; +} +.social-wrap { + display: grid; + grid-gap: 0.25rem 0.25rem; + grid-template-columns: repeat(auto-fill, 32px); + text-align: center; +} +.social-wrap .social { + line-height: 0; + display: inline-block; + padding: 6px; + border-radius: 32px; + filter: grayscale(100%); + overflow: hidden; + background: transparent; + transition: box-shadow 0.2s ease-out, background 0.2s ease-out, transform 0.2s ease-out; + -moz-transition: box-shadow 0.2s ease-out, background 0.2s ease-out, transform 0.2s ease-out; + -webkit-transition: box-shadow 0.2s ease-out, background 0.2s ease-out, transform 0.2s ease-out; + -o-transition: box-shadow 0.2s ease-out, background 0.2s ease-out, transform 0.2s ease-out; +} +.social-wrap .social:hover { + z-index: 1; + filter: unset; + background: var(--alpha100); +} +.social-wrap .social img { + border-radius: 2px; +} +.logo-wrap { + display: flex; + align-items: center; + overflow: hidden; + min-height: 48px; +} +.logo-wrap img.avatar { + object-fit: cover; +} +.logo-wrap img.icon { + object-fit: contain; +} +.logo-wrap .icon { + width: 48px; + height: 48px; + margin-right: 1rem; + border-radius: 4px; + flex-shrink: 0; +} +.logo-wrap a { + color: inherit; + display: flex; + align-items: center; +} +.logo-wrap a.avatar { + display: block; + position: relative; + width: 48px; + height: 48px; + flex-shrink: 0; + border-radius: 48px; + overflow: hidden; + margin-right: 1rem; +} +.logo-wrap a.avatar div.bg { + width: 100%; + height: 100%; + background-size: cover; +} +.logo-wrap a.avatar img.avatar { + margin: 2px; + width: calc(100% - 2 * 2px); + height: calc(100% - 2 * 2px); + border-radius: calc(100% - 2 * 2px); +} +.logo-wrap a.avatar div.bg { + transition: opacity 0.2s ease-out; + -moz-transition: opacity 0.2s ease-out; + -webkit-transition: opacity 0.2s ease-out; + -o-transition: opacity 0.2s ease-out; + position: absolute; + opacity: 0 !important; + z-index: -1; +} +@-moz-keyframes spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} +@-webkit-keyframes spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} +@-o-keyframes spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} +@keyframes spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} +.logo-wrap a.avatar:hover div.bg { + opacity: 1 !important; + animation: spin infinite 4s; + animation-timing-function: linear; +} +.logo-wrap a.title { + font-size: 1.5rem; + font-weight: 900; + color: inherit; + line-height: 1.2; + display: block; + position: relative; +} +.logo-wrap a.title .main { + color: var(--text); +} +.logo-wrap a.title .sub { + color: var(--text-p1); + transition: opacity 0.2s ease-out, transform 0.2s ease-out; + -moz-transition: opacity 0.2s ease-out, transform 0.2s ease-out; + -webkit-transition: opacity 0.2s ease-out, transform 0.2s ease-out; + -o-transition: opacity 0.2s ease-out, transform 0.2s ease-out; + white-space: nowrap; +} +.logo-wrap a.title .hover { + position: absolute; + bottom: 0; + transform: translateY(8px); + overflow: visible; +} +.logo-wrap a.title:hover .normal { + opacity: 0; + transform: translateY(-8px); +} +.logo-wrap a.title:hover .hover { + transform: translateY(0); + opacity: 1 !important; +} +.nav-area .menu { + width: 100%; + display: grid; + margin: 8px 0; + grid-template-columns: repeat(4, 1fr); + grid-gap: 8px; +} +.nav-area .menu::-webkit-scrollbar { + display: none; +} +.nav-area .menu::-webkit-scrollbar-track-piece { + background: transparent; +} +.nav-area .menu::-webkit-scrollbar-thumb { + display: none; +} +.nav-area .menu .nav-item { + box-sizing: border-box; + width: 100%; + min-height: 40px; + border-radius: 8px; + font-size: 0.9375rem; + font-weight: 500; + color: var(--text-p3); + text-align: center; + background: var(--alpha50); + transition: background 0.2s ease-out; + -moz-transition: background 0.2s ease-out; + -webkit-transition: background 0.2s ease-out; + -o-transition: background 0.2s ease-out; + position: relative; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} +.nav-area .menu .nav-item img, +.nav-area .menu .nav-item svg { + height: 28px; + object-fit: contain; + filter: grayscale(100%) brightness(0.8) opacity(0.8); + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; +} +.nav-area .menu .nav-item span { + text-overflow: ellipsis; + word-break: keep-all; +} +.nav-area .menu .nav-item.active, +.nav-area .menu .nav-item:hover { + color: var(--text-p1); + background: var(--alpha100); +} +.nav-area .menu .nav-item.active img, +.nav-area .menu .nav-item:hover img, +.nav-area .menu .nav-item.active svg, +.nav-area .menu .nav-item:hover svg { + filter: unset; +} +.nav-area .menu .nav-item.active:after { + content: ''; + position: absolute; + width: 16px; + height: 2px; + left: 50%; + transform: translateX(-50%); + border-radius: 2px; + bottom: 2px; + background: currentColor; +} +.nav-area { + margin: 32px var(--gap-margin) 0; +} +.search-wrapper { + width: 100%; +} +.search-wrapper >.search-form { + position: sticky; + margin-bottom: 8px; + top: 1rem; + height: 40px; + display: flex; + flex-direction: row; + align-items: center; + transition: 0.38s ease-out; + z-index: 0; + border-radius: 8px; + color: var(--text); + background: var(--alpha50); +} +.search-wrapper >.search-form:has(input:focus) { + background: var(--alpha100); +} +.search-wrapper .search-input { + width: 100%; + box-sizing: border-box; + font-family: system-ui, "Microsoft Yahei", "Segoe UI", -apple-system, Roboto, Ubuntu, "Helvetica Neue", Arial, "WenQuanYi Micro Hei", sans-serif; + font-size: 0.875rem; + padding: 12px 0; + color: var(--text); +} +.search-wrapper .search-button { + border-radius: 8px; + display: flex; + align-items: center; + height: 40px; +} +.search-wrapper .search-button svg { + height: 1rem; + width: 40px; + margin-left: 4px; + color: var(--text-p2); + fill: currentColor; +} +.search-wrapper .search-button svg path[p-id="1562"] { + color: #1cd0fd; +} +.search-wrapper[searching='true'] .search-button path[p-id="1562"] { + color: #3dc550; +} +.search-wrapper.noresult[searching='true'] .search-button path[p-id="1562"] { + color: #f44336; +} +.search-wrapper .search-no-result { + display: none; + color: var(--text-p1); + text-align: center; + font-size: 0.875rem; + padding: 2rem; + background: var(--alpha20); + border-radius: 12px; +} +.search-wrapper #search-result { + max-height: 60vh; + overflow: scroll; + scrollbar-width: none; + border-radius: 12px; +} +.search-wrapper #search-result::-webkit-scrollbar { + height: 0; + width: 0; +} +.search-wrapper #search-result::-webkit-scrollbar-track-piece { + background: transparent; +} +.search-wrapper #search-result::-webkit-scrollbar-thumb { + background: var(--text-meta); + cursor: pointer; + border-radius: 0; +} +.search-wrapper #search-result::-webkit-scrollbar-thumb:hover { + background: var(--text-p3); +} +.search-wrapper #search-result:empty { + display: none; +} +.search-wrapper #search-result .search-result-list { + padding: 0; + margin: 0; + list-style-type: none; +} +.search-wrapper #search-result li a { + display: block; + background: var(--alpha20); + line-height: 1.2; + padding: 0.75rem 1rem; + border-radius: 12px; + transition: background 0.2s ease-out; + -moz-transition: background 0.2s ease-out; + -webkit-transition: background 0.2s ease-out; + -o-transition: background 0.2s ease-out; +} +.search-wrapper #search-result li a:hover { + background: var(--alpha100); +} +.search-wrapper #search-result li+li { + margin-top: 8px; +} +.search-wrapper #search-result .search-result-title { + color: var(--text-p1); + font-weight: 700; + font-size: 0.9375rem; +} +.search-wrapper #search-result .search-result-content { + overflow: hidden; + color: var(--text-p3); + margin: 4px 0 0; + max-height: 13em; + text-align: justify; + font-size: 0.8125rem; + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 2; +} +.search-wrapper #search-result .search-keyword { + color: #f44336; + border-bottom: 1px dashed #f44336; + font-weight: bold; + filter: grayscale(25%); +} +.search-wrapper.noresult[searching='true'] .search-no-result { + display: block; + margin-bottom: 8px; +} +.l_left { + margin: 8px; + height: calc(100vh - 16px); + border-radius: 16px; + overflow: hidden; + overflow: clip; + overflow-clip-margin: 0.5px; +} +.l_left .header { + margin: var(--gap-max) var(--gap-margin) 0; +} +.l_right { + margin: 8px; + border-radius: 16px; +} +@media screen and (min-width: 2048px) { + .l_left { + margin-left: auto; + margin-right: calc(2 * var(--gap-max)); + } + .l_right { + margin-left: var(--gap-max); + margin-right: auto; + } +} +.l_left { + background-size: cover; + background-image: url("https://gcore.jsdelivr.net/gh/cdn-x/placeholder@1.0.13/image/sidebar-bg1@small.jpg"); +} +.l_left .leftbar-container { + height: 100%; + display: flex; + flex-direction: column; + word-break: break-all; + text-align: justify; + --blur-px: 100px; + --blur-bg: var(--alpha60); +} +@supports ((-webkit-backdrop-filter: blur(var(--blur-px))) or (backdrop-filter: blur(var(--blur-px)))) { + .l_left .leftbar-container { + background: var(--blur-bg); + backdrop-filter: saturate(240%) blur(var(--blur-px)); + -webkit-backdrop-filter: saturate(240%) blur(var(--blur-px)); + } +} +.widget-body .linklist { + display: grid; + grid-gap: 8px; +} +.linklist .link { + border-radius: 8px; + color: var(--text-p2); + min-height: 32px; + padding: 0 4px; + transition: background 0.2s ease-out; + -moz-transition: background 0.2s ease-out; + -webkit-transition: background 0.2s ease-out; + -o-transition: background 0.2s ease-out; + display: flex; + justify-content: center; + align-items: center; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +.linklist .link.active { + background: var(--alpha50); +} +.linklist .link.active svg, +.linklist .link.active img { + filter: unset; +} +.linklist .link span { + padding: 0 4px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +.linklist .link svg, +.linklist .link img { + padding: 0 2px; + max-height: 18px; + width: auto; + filter: grayscale(100%) brightness(0.8) opacity(0.8); + transition: filter 0.2s ease-out; + -moz-transition: filter 0.2s ease-out; + -webkit-transition: filter 0.2s ease-out; + -o-transition: filter 0.2s ease-out; + flex-shrink: 0; +} +.linklist .link svg:not([class='active-icon']), +.linklist .link img:not([class='active-icon']) { + color: #1cd0fd; +} +.widget-body .linklist.left { + grid-gap: 2px; +} +.linklist.left .link { + justify-content: space-between; + padding: 0 16px; +} +.linklist.left .link img, +.linklist.left .link svg { + width: 1em; + height: 1em; + transform: scale(1.2); +} +.linklist.left .link span { + padding: 0 8px; +} +.linklist .link:hover { + background: var(--alpha100); +} +.linklist .link:hover svg { + filter: unset; +} +.widget-wrapper.ghrepo .repo { + display: block; + padding: 0.75rem 0.5rem; + color: var(--text-p2); + background: var(--card); + border-radius: 12px; + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; +} +:root[data-theme="light"] .widget-wrapper.ghrepo .repo { + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); +} +:root[data-theme="light"] .widget-wrapper.ghrepo .repo:hover { + box-shadow: 0 12px 20px -4px rgba(0,0,0,0.15); + transform: translate3d(0, -2px, 0); +} +:root[data-theme="dark"] .widget-wrapper.ghrepo .repo:hover { + box-shadow: 0 0 4px -2px #1cd0fd, 0 0 24px -8px #1cd0fd; +} +:root:not([data-theme]) .widget-wrapper.ghrepo .repo { + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); +} +:root:not([data-theme]) .widget-wrapper.ghrepo .repo:hover { + box-shadow: 0 12px 20px -4px rgba(0,0,0,0.15); + transform: translate3d(0, -2px, 0); +} +@media (prefers-color-scheme: dark) { + :root:not([data-theme]) .widget-wrapper.ghrepo .repo:hover { + box-shadow: 0 0 4px -2px #1cd0fd, 0 0 24px -8px #1cd0fd; + } +} +.widget-wrapper.ghrepo .repo >div+div { + margin-top: 0.5rem; +} +.widget-wrapper.ghrepo .repo span { + color: var(--text-p2); +} +.widget-wrapper.ghrepo .repo svg { + margin-right: 4px; +} +.widget-wrapper.ghrepo .repo .flex-row { + display: flex; + align-items: center; +} +.widget-wrapper.ghrepo .repo .repo-name { + font-size: 0.875rem; + font-weight: 700; + color: var(--text-p1); +} +.widget-wrapper.ghrepo .repo .repo-desc { + font-size: 0.8125rem; + margin-left: 2px; + margin-right: 2px; +} +.widget-wrapper.ghrepo .repo .grid { + font-size: 0.8125rem; + display: grid; + grid-gap: 2px; + grid-template-columns: repeat(auto-fill, calc((100% - 2 * 2px) / 3)); +} +.widget-wrapper.user-card .widget-header+.widget-body { + margin: 0.75rem 0; +} +.widget-wrapper.user-card .widget-body { + text-align: center; + background: var(--card); + border-radius: 12px; + padding: 1rem; + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); +} +.widgets .widget-wrapper.user-card .avatar { + display: block; + border-radius: 100%; + margin: 1rem auto 1.25rem auto; + max-width: 128px; + overflow: hidden; +} +.widgets .widget-wrapper.user-card .avatar img { + display: block; + aspect-ratio: 1; +} +@media screen and (max-width: 768px) { + .widgets .widget-wrapper.user-card .avatar { + max-width: 50%; + } +} +.widgets .widget-wrapper.user-card p.username { + font-weight: 900; + font-size: calc(17px + 11px); + color: var(--text); + margin: 0; +} +.widgets .widget-wrapper.user-card p.bio { + font-size: 0.8125rem; + margin: 0; +} +.widgets .widget-wrapper.user-card .follow { + font-weight: 500; + border-radius: 64px; + margin: 1rem 0 0; + padding: 0.5rem 1rem; + background: #1cd0fd; + color: var(--card); + font-size: 1rem; + align-self: stretch; + text-align: center; + line-height: 1.5; + display: flex; + align-items: center; + justify-content: center; + transition: background 0.2s ease-out; + -moz-transition: background 0.2s ease-out; + -webkit-transition: background 0.2s ease-out; + -o-transition: background 0.2s ease-out; +} +.widgets .widget-wrapper.user-card .follow svg { + margin-right: 6px; + height: 1.5em; + width: auto; +} +.widgets .widget-wrapper.user-card .follow:hover { + background: #ff5724; +} +.widgets .widget-wrapper.user-card .buttons { + margin: 1rem 0; + align-self: stretch; + display: grid; + grid-gap: 2px; + grid-template-columns: repeat(auto-fill, calc((100% - 2 * 2px) / 3)); +} +.widgets .widget-wrapper.user-card .btn { + display: flex; + flex-direction: column; + align-items: center; + color: inherit; + border: 1px solid transparent; + border-radius: 4px; + padding: 0.25rem 0; + transition: background 0.2s ease-out; + -moz-transition: background 0.2s ease-out; + -webkit-transition: background 0.2s ease-out; + -o-transition: background 0.2s ease-out; +} +.widgets .widget-wrapper.user-card .btn:hover { + background: var(--block); +} +.widgets .widget-wrapper.user-card .btn .title { + font-size: 1rem; + font-weight: 700; +} +.widgets .widget-wrapper.user-card .btn .desc { + font-size: 0.75rem; + color: var(--text-p3); + font-weight: 500; +} +.widget-wrapper.post-list .widget-body a { + font-size: 0.875rem; + padding: 8px 16px; + display: block; + border-radius: 8px; + color: var(--text-p1); + transition: background 0.2s ease-out; + -moz-transition: background 0.2s ease-out; + -webkit-transition: background 0.2s ease-out; + -o-transition: background 0.2s ease-out; +} +.widget-wrapper.post-list .widget-body a.active { + background: var(--alpha50); +} +.widget-wrapper.post-list .widget-body a:hover { + background: var(--alpha100); +} +.widget-wrapper.post-list .widget-body a+a { + margin-top: 2px; +} +.widget-wrapper.post-list .widget-body a { + display: flex; + justify-content: space-between; + align-items: center; +} +.widget-wrapper.post-list .widget-body a .title { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +.widget-wrapper.post-list .widget-body a svg { + flex-shrink: 0; + height: 1em; + width: auto; + transform: scale(1.2); +} +.widget-wrapper.post-list .widget-body+.widget-header { + margin-top: 28px; +} +.widget-wrapper.markdown .widget-body { + border-radius: 12px; + padding: 4px 16px; + background: var(--alpha50); +} +.widget-wrapper.markdown .widget-body a:not([class]) { + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; + border-bottom: 1px solid var(--text); + color: var(--text); +} +.widget-wrapper.markdown .widget-body a:not([class]):hover { + color: #ff5724; + border-bottom: 1px solid #ff5724; +} +.widget-wrapper.markdown .linklist { + margin: 1em 0; +} +.widget-wrapper.markdown .linklist .link { + background: var(--alpha50); +} +.widget-wrapper.markdown .linklist .link:hover { + background: var(--alpha100); +} +.widget-wrapper.post-card .widget-body { + max-width: 100%; +} +.widget-wrapper.post-card .widget-body .item+.item { + margin-top: 8px; +} +.widget-wrapper.post-card .widget-body .item { + line-height: 1.2; + background: var(--alpha20); + padding: 10px 16px; + border-radius: 12px; + display: block; + border-left: 0; + box-sizing: border-box; +} +.widget-wrapper.post-card .widget-body .title { + color: var(--text-p1); + font-weight: 500; + font-size: 1rem; + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 1; + font-weight: 700; + font-size: 0.875rem; +} +.widget-wrapper.post-card .widget-body .excerpt { + color: var(--text-p3); + font-size: 0.75rem; + margin-top: 0.5rem; + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; + -webkit-line-clamp: 2; +} +.widget-wrapper.post-card .widget-body .item { + transition: background 0.2s ease-out; + -moz-transition: background 0.2s ease-out; + -webkit-transition: background 0.2s ease-out; + -o-transition: background 0.2s ease-out; +} +.widget-wrapper.post-card .widget-body .item.active { + background: var(--alpha50); +} +.widget-wrapper.post-card .widget-body .item:hover { + background: var(--alpha50); +} +.widget-wrapper.tagcloud .widget-body { + border-radius: 12px; + padding: 12px 16px; + background: var(--alpha50); +} +.widget-wrapper.tagcloud .widget-body a { + word-break: break-word; + color: var(--text-p2); + line-height: 1.5; +} +.widget-wrapper.tagcloud .widget-body a:hover { + color: #ff5724; +} +.widget-wrapper.timeline .tag-plugin.timeline { + padding-left: 0; +} +.widget-wrapper.timeline .tag-plugin.timeline:before { + left: 6px; +} +.widget-wrapper.timeline .widget-body { + overflow: hidden; +} +.widget-wrapper.timeline .body a { + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; + word-break: break-all; + --fsp: calc(17px - 2px); +} +.widget-wrapper.timeline .tag-plugin.timeline .timenode { + z-index: 1; + margin-top: 0.25rem; +} +.widget-wrapper.timeline .tag-plugin.timeline .timenode .header { + margin: 0.25rem var(--gap-padding); +} +.widget-wrapper.timeline .tag-plugin.timeline .timenode .header .user-info { + background: none; + padding-right: 0; +} +.widget-wrapper.timeline .tag-plugin.timeline .timenode .header img { + display: none; +} +.widget-wrapper.timeline .tag-plugin.timeline .timenode .header:before { + left: calc(6px - var(--gap-padding)); +} +.widget-wrapper.timeline .tag-plugin.timeline .timenode .body { + border-radius: 12px; + padding: 0.5rem 1rem; +} +.widget-wrapper.timeline .tag-plugin.timeline .timenode .body p, +.widget-wrapper.timeline .tag-plugin.timeline .timenode .body li { + --fsp: calc(17px - 3px); +} +.widget-wrapper.timeline .tag-plugin.timeline .timenode .body code { + background: none; + padding: 0; + margin: 0; +} +.widget-wrapper.timeline .tag-plugin.timeline .timenode .body .highlight, +.widget-wrapper.timeline .tag-plugin.timeline .timenode .body pre:not([class]):has(>code) { + background: var(--alpha50); +} +.widget-wrapper.timeline .tag-plugin.timeline[api] .body .footer { + background: none; +} +.l_left .widget-wrapper.timeline .tag-plugin.timeline { + padding-left: 0; +} +.l_left .widget-wrapper.timeline .tag-plugin.timeline:before { + content: none; +} +.l_left .widget-wrapper.timeline .body { + box-shadow: none; + background: var(--alpha50); +} +.widget-wrapper.toc { + background: var(--site-bg); + z-index: 3; +} +.widget-wrapper.toc .widget-body { + position: relative; +} +.widget-wrapper.toc .widget-body:before { + content: ''; + position: absolute; + top: 6px; + bottom: 6px; + left: 0; + width: 4px; + background: var(--block); + border-radius: 4px; +} +.widget-wrapper.toc .toc { + --fsp: calc(17px - 2px); + padding: 0; + margin: 0; + position: relative; + list-style: none; +} +.widget-wrapper.toc .toc li { + margin: 0; + list-style: none; +} +.widget-wrapper.toc .toc a { + --padding: calc(var(--gap-padding) / 2); + --padding-offset: calc(0 - var(--padding)); + padding: 6px var(--padding); + margin: 0 var(--padding); + color: var(--text-p3); + display: block; + position: relative; + border-radius: 8px; + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; +} +.widget-wrapper.toc .toc a.active:before { + content: ''; + position: absolute; + top: 6px; + bottom: 6px; + left: -8px; + width: 4px; + background: #1cd0fd; + border-radius: 4px; +} +.widget-wrapper.toc .toc a:hover { + background: var(--block-hover); + color: var(--text); +} +.l_right .widgets .widget-wrapper.toc { + margin-top: 0; + position: sticky; + position: -webkit-sticky; + top: 0; + padding: 16px 0; +} +.l_right .widgets .widget-wrapper.toc:first-child { + top: 8px; + padding-top: 8px; +} +.l_right .widgets .widget-wrapper.toc .widget-body .toc { + max-height: 70vh; + overflow: auto; +} +@media screen and (max-width: 1180px) { + .l_right .widgets .widget-wrapper.toc .widget-body .toc { + max-height: unset; + } +} +.l_right .widgets .widget-wrapper.toc .widget-body .toc::-webkit-scrollbar { + height: 0; + width: 0; +} +.l_right .widgets .widget-wrapper.toc .widget-body .toc::-webkit-scrollbar-track-piece { + background: transparent; +} +.l_right .widgets .widget-wrapper.toc .widget-body .toc::-webkit-scrollbar-thumb { + background: var(--text-meta); + cursor: pointer; + border-radius: 0; +} +.l_right .widgets .widget-wrapper.toc .widget-body .toc::-webkit-scrollbar-thumb:hover { + background: var(--text-p3); +} +.widget-wrapper.toc .toc .toc-item { + font-weight: 500; + --fsp: calc(17px - 1px); +} +.widget-wrapper.toc .toc .toc-item .toc-item { + font-weight: 400; + --fsp: calc(17px - 2px); +} +.widget-wrapper.toc .toc ol { + padding-left: 0; +} +.widget-wrapper.toc .toc .toc-child .toc-link { + padding-left: 1.5rem; +} +.widget-wrapper.toc .toc .toc-child .toc-child .toc-link { + padding-left: 2.5rem; +} +.widget-wrapper.toc .toc .toc-child .toc-child .toc-child .toc-link { + padding-left: 3.5rem; +} +.widget-wrapper.toc .toc .toc-child .toc-child .toc-child .toc-child .toc-link { + padding-left: 4.5rem; +} +.widget-wrapper.toc .toc .toc-child .toc-child .toc-child .toc-child .toc-child .toc-link { + padding-left: 5rem; +} +.widget-wrapper.toc .toc a.toc-link.active { + color: var(--text); +} +.widget-wrapper.toc .toc a.toc-link.active:before, +.widget-wrapper.toc .toc a.toc-link.active:after { + content: ''; +} +.widget-wrapper.toc[collapse='true'] .toc-item a.toc-link+ol { + display: none; +} +.widget-wrapper.toc[collapse='true'] .toc a.toc-link.active+ol { + display: block; +} +.widget-wrapper.toc[collapse='auto'] .toc-item a.toc-link+ol { + display: none; +} +.widget-wrapper.toc[collapse='auto'] .toc a.toc-link.active+ol { + display: block; +} +.widget-wrapper.toc[collapse='auto']:hover a.toc-link+ol { + display: block; +} +.widget-wrapper.toc[collapse='true'] ol:has(> .toc-item a.active) { + display: block; +} +.widget-wrapper.toc[collapse='auto'] ol:has(> .toc-item a.active) { + display: block; +} +.widget-wrapper.toc .widget-body { + display: grid; + grid-template-rows: 1fr; + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; + overflow: hidden; +} +.l_right .widgets .widget-wrapper.toc .widget-header .cap-action:hover { + background: var(--block-border); +} +.l_right .widgets .widget-wrapper.toc.collapse .widget-header .cap-action { + background: var(--block-border); +} +.l_right .widgets .widget-wrapper.toc.collapse .widget-body { + grid-template-rows: 0fr; +} +.widget-wrapper.toc .widget-body+.widget-footer:before { + content: ''; + position: absolute; + background: var(--block-border); + top: 0; + height: 1px; + left: var(--gap-padding); + right: var(--gap-padding); +} +.widget-wrapper.toc .widget-footer { + margin-top: 8px; + color: var(--text-p2); + position: relative; + padding-top: 8px; +} +.widget-wrapper.toc .widget-footer a { + display: flex; + align-items: center; + color: inherit; + font-size: 0.875rem; + padding: 8px var(--gap-padding); + border-radius: 8px; + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; +} +.widget-wrapper.toc .widget-footer a svg, +.widget-wrapper.toc .widget-footer a img { + height: 16px; + width: auto; + margin-right: 8px; +} +.widget-wrapper.toc .widget-footer a:hover { + background: var(--block-hover); + color: var(--text); +} +.widget-wrapper.toc+.widget-wrapper { + padding-top: 32px; +} +@media screen and (max-width: 1180px) { + .l_right { + background: var(--blur-bg); + } + @supports ((-webkit-backdrop-filter: blur(var(--blur-px))) or (backdrop-filter: blur(var(--blur-px)))) { + .l_right { + background: var(--blur-bg) !important; + backdrop-filter: saturate(200%) blur(var(--blur-px)); + -webkit-backdrop-filter: saturate(200%) blur(var(--blur-px)); + } + } + .l_right:hover { + background: var(--card); + } + .l_right .widgets .widget-wrapper.toc { + position: static; + background: none; + } + .widget-wrapper.toc .toc a { + color: var(--text-p2); + } + .widget-wrapper.toc .widget-footer a { + background: var(--alpha100); + } + .widget-wrapper.toc .widget-footer a+a { + margin-top: 4px; + } +} +.widgets .loading-wrap { + margin: 0.5rem 0; + background: var(--alpha50); +} +.widgets { + overflow: scroll; + flex-grow: 1; + scrollbar-width: none; + z-index: 1; + line-height: 1.2; + margin: 0 var(--gap-margin); +} +.widgets::-webkit-scrollbar { + height: 0; + width: 0; +} +.widgets::-webkit-scrollbar-track-piece { + background: transparent; +} +.widgets::-webkit-scrollbar-thumb { + background: var(--text-meta); + cursor: pointer; + border-radius: 0; +} +.widgets::-webkit-scrollbar-thumb:hover { + background: var(--text-p3); +} +.widgets .widget-wrapper .widget-header { + padding-left: var(--gap-padding); + padding-right: var(--gap-padding); + display: flex; + justify-content: space-between; + align-items: baseline; + line-height: 28px; + font-weight: 500; + font-size: 0.8125rem; + color: var(--text-p1); +} +.widgets .widget-wrapper .widget-header .item { + display: block; +} +.widgets .widget-wrapper .widget-header >span { + text-align: left; + opacity: 0.6; +} +.widgets .widget-wrapper .widget-header:empty { + display: none; +} +.widgets .widget-wrapper .widget-header .cap-action { + line-height: 0; + color: inherit; + opacity: 0.6; + transition: opacity 0.2s ease-out, background 0.2s ease-out; + -moz-transition: opacity 0.2s ease-out, background 0.2s ease-out; + -webkit-transition: opacity 0.2s ease-out, background 0.2s ease-out; + -o-transition: opacity 0.2s ease-out, background 0.2s ease-out; + border-radius: 4px; + padding: 6px; + margin-right: -6px; +} +.widgets .widget-wrapper .widget-header .cap-action svg { + height: 1em; + width: auto; + transform: scale(1.2); + fill: var(--text-p2); +} +.widgets .widget-wrapper .widget-header .cap-action:hover { + color: #ff5724; + background: var(--alpha100); + opacity: 1; +} +.widgets .widget-wrapper .widget-header .cap-action:hover svg { + fill: #ff5724; +} +.widgets .widget-wrapper .widget-body { + color: var(--text-p1); +} +.widgets .widget-wrapper .widget-body p { + margin-top: 0.5em; + margin-bottom: 0.5em; + line-height: 1.5; +} +.widget-wrapper { + display: block; + padding-bottom: 32px; +} +.l_left .widgets .widget-wrapper:first-child { + margin-top: 32px; +} +.l_right .widgets:empty { + display: none; +} +.l_right .widgets .widget-wrapper .widget-header { + padding-left: var(--gap-padding); + padding-right: var(--gap-padding); +} +@media screen and (max-width: 1180px) { + .l_right .widgets .widget-wrapper { + margin-top: var(--gap-margin); + border-radius: 12px; + } +} +@media screen and (min-width: 1180px) { + .l_right .widgets .widget-wrapper.markdown .widget-body { + background: var(--block); + } +} +.post-list #archive { + padding: 1rem; +} +.post-list #archive .archive-header { + display: inline-block; + font-family: Menlo, Monaco, Consolas, system-ui, "Courier New", monospace, sans-serif; + font-weight: 700; + line-height: 1.2; + margin-bottom: 0.5em; + position: relative; + padding: 4px 0; + color: var(--text-p1); +} +.post-list #archive .archive-header:after { + content: ""; + position: absolute; + height: 4px; + bottom: 0; + left: 0; + right: 0; + z-index: -1; + border-radius: 4px; + background: #1cd0fd; +} +.post-list #archive a.post { + display: inline-flex; + align-items: baseline; + margin: 0.25rem 0; + color: var(--text-p1); + transition: color 0.2s ease-out, border 0.2s ease-out; + -moz-transition: color 0.2s ease-out, border 0.2s ease-out; + -webkit-transition: color 0.2s ease-out, border 0.2s ease-out; + -o-transition: color 0.2s ease-out, border 0.2s ease-out; + border-bottom: 1px dashed var(--text-meta); +} +.post-list #archive a.post time { + font-family: Menlo, Monaco, Consolas, system-ui, "Courier New", monospace, sans-serif; + margin-right: 1em; + font-weight: 700; + flex-shrink: 0; + color: var(--text-p4); +} +.post-list #archive a.post:hover { + border-bottom: 1px solid #1cd0fd; + color: var(--text); +} +.post-list #archive a.post:hover time { + color: #1cd0fd; +} +.post-list #cats { + padding: 0; +} +.post-list #cats a.cat { + display: flex; + padding: 0.5em 1rem; + border-radius: 8px; + color: var(--text-p2); + align-items: center; + justify-content: space-between; + font-weight: 500; + font-size: calc(17px - 2px); +} +.post-list #cats a.cat.child { + padding-left: 2rem; +} +.post-list #cats a.cat span { + display: flex; + align-items: center; +} +.post-list #cats a.cat svg { + height: 1em; + width: auto; + transform: scale(1.2); + margin-right: 8px; +} +.post-list #cats a.cat .badge { + font-weight: 700; + font-family: Menlo, Monaco, Consolas, system-ui, "Courier New", monospace, sans-serif; + opacity: 0.5; + font-size: 0.75rem; +} +.post-list #cats a.cat:hover { + background: var(--block-hover); + color: var(--text); +} +.post-list #cats a.cat:hover .badge { + opacity: 1; + color: #1cd0fd; +} +.post-list #tags { + display: flex; + flex-wrap: wrap; + padding: 0; + margin: 0 -4px; +} +.post-list #tags a.tag { + display: inline-flex; + align-items: center; + position: relative; + color: var(--text-p2); + margin: 4px; + padding: 0.5em 0.75rem; + border-radius: 4px; + background: var(--block); + font-size: 0.8125rem; + font-weight: 500; +} +.post-list #tags a.tag:before { + content: "#"; + margin-left: -2px; + margin-right: 2px; + opacity: 0.4; +} +.post-list #tags a.tag:hover { + color: var(--text); + background: var(--block-hover); +} +.post-list #tags a.tag:hover:before { + color: #1cd0fd; + opacity: 1; +} +@media screen and (min-width: 500px) { + .post-list.author #archive { + padding: 1rem 0; + } +} +.md-text.error-page { + text-align: center; + margin-top: 2rem; +} +.md-text.error-page img#error { + width: 30vw; + max-height: 150px; + margin-bottom: 2rem; +} +.md-text.error-page h1 { + font-size: 4rem; + margin-bottom: 0; +} +.md-text.error-page p.what, +.md-text.error-page p.why { + margin: 0.5em; +} +.md-text.error-page p.why { + font-size: 0.8125rem; +} +.md-text.error-page a#back { + margin: 2rem 0; + display: inline-block; + background: #fdb62f; + color: #000; + border: 2px solid #000; +} +@media screen and (max-width: 768px) { + .md-text.error-page { + margin-top: 4rem; + } +} +.md-text .tag-list { + display: flex; + flex-wrap: wrap; + padding: 0; + margin-top: 2rem; +} +.md-text .tag-list a.tag { + display: inline-flex; + align-items: center; + position: relative; + color: var(--text-p2); + margin: 4px; + padding: 0.5em 0.75rem; + border-radius: 4px; + background: var(--block); + font-size: 0.8125rem; + font-weight: 500; +} +.md-text .tag-list a.tag:before { + content: "#"; + margin-left: -2px; + margin-right: 2px; + opacity: 0.4; +} +.md-text .tag-list a.tag:hover { + color: var(--text); + background: var(--block-hover); +} +.md-text .tag-list a.tag:hover:before { + color: #1cd0fd; + opacity: 1; +} +.post-list .post-card .meta.cap .tag:before { + content: "#"; + margin-left: -2px; + margin-right: 2px; + opacity: 0.4; +} +.widget-body.tag-tree .tag-subtree > a > .tag-switcher-wrapper { + width: 1.75rem; + height: 0.875rem; + display: flex; + justify-content: end; + align-items: center; +} +.widget-body.tag-tree .tag-subtree > a > .tag-switcher-wrapper:hover { + color: #1cd0fd; +} +.widget-body.tag-tree .tag-subtree.parent-tag > a .tag-switcher { + display: inline-block; + height: 0.5rem; + width: 0.5rem; + border-width: 1px; + border-style: none solid solid none; + transform: translateX(-25%) rotate(-45deg); +} +.widget-body.tag-tree .tag-subtree.parent-tag.expanded > a .tag-switcher { + transform: translateY(-25%) rotate(45deg); +} +.widget-body.tag-tree .tag-subtree.parent-tag > .tag-subtree { + display: none; +} +.widget-body.tag-tree .tag-subtree.parent-tag.expanded > .tag-subtree { + display: block; +} +.widget-body.tag-tree .tag-subtree .tagcon { + font-size: smaller; + opacity: 0.4; + margin-right: 0.25rem; +} +.l_body { + display: grid; + grid-template-columns: 1fr minmax(200px, var(--width-main)) 1fr; + grid-gap: var(--gap-margin); + margin: auto; + font-size: var(--fsp); +} +.l_body aside { + z-index: 8; + flex-shrink: 0; + position: sticky; + position: -webkit-sticky; + --width-sidebar: calc(var(--gap-margin) * 2 + var(--gap-padding) * 2 + var(--side-content-width)); + width: var(--width-sidebar); +} +.l_body .l_left { + justify-self: right; + top: 8px; +} +.l_body .l_right { + justify-self: left; + --gap-margin: 0px; + max-height: calc(100% - 8px * 2); +} +.l_body .l_right .widgets { + height: 100%; + overflow: visible; +} +@media screen and (max-width: 1180px) { + .l_body .l_right { + --gap-margin: 16px; + } + .laptop-only { + display: block !important; + } + .l_body .l_right { + top: 8px; + position: fixed; + max-height: calc(100% - 8px * 2); + transform: translateX(320px); + transition: transform 0.38s ease-out; + margin: 0; + right: 8px; + box-shadow: 0 12px 16px -4px rgba(0,0,0,0.2); + z-index: 10; + background: var(--site-bg); + overflow: auto; + --blur-bg: var(--alpha60); + --blur-px: 50px; + } + .l_body .l_right::-webkit-scrollbar { + height: 0; + width: 0; + } + .l_body .l_right::-webkit-scrollbar-track-piece { + background: transparent; + } + .l_body .l_right::-webkit-scrollbar-thumb { + background: var(--text-meta); + cursor: pointer; + border-radius: 0; + } + .l_body .l_right::-webkit-scrollbar-thumb:hover { + background: var(--text-p3); + } + .l_body[rightbar] .l_right { + transform: translateX(0px); + } + .l_body[rightbar] .main-mask { + pointer-events: inherit; + } +} +@media screen and (max-width: 667px) { + .mobile-only { + display: block !important; + } + .l_body { + padding: 0; + display: block; + } + .l_body .l_left { + position: fixed; + transform: translateX(-320px); + transition: transform 0.38s ease-out; + margin: 0; + left: 8px; + box-shadow: 0 12px 16px -4px rgba(0,0,0,0.2); + z-index: 10; + } + .l_body .l_main { + max-width: 100%; + } + .l_body[leftbar] .l_left { + transform: translateX(0px); + } + .l_body[leftbar] .main-mask { + opacity: 1; + pointer-events: inherit; + } +} +.main-mask { + position: fixed; + pointer-events: none; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(0,0,0,0.1); + z-index: 9; + opacity: 0; + transition: opacity 0.2s ease-out; + -moz-transition: opacity 0.2s ease-out; + -webkit-transition: opacity 0.2s ease-out; + -o-transition: opacity 0.2s ease-out; +} +.l_main .post-list { + margin: 1rem; +} +.l_main .post-list .post-title:first-child { + margin-top: 0.5rem; +} +.l_main .post-list .post-title { + font-weight: 500; + margin: 1.25rem auto 0.75rem 0; + line-height: 1.2; + font-size: calc(17px + 4px); + border-bottom: none; + color: var(--text); + transition: color 0.2s ease-out; + -moz-transition: color 0.2s ease-out; + -webkit-transition: color 0.2s ease-out; + -o-transition: color 0.2s ease-out; +} +@media screen and (max-width: 500px) { + .l_main .post-list .post-title { + font-size: calc(17px + 2px); + margin: 0.5rem 0; + } +} +.l_main .post-list .wiki .post-title { + margin-top: 0.5rem; +} +.post-list .post-card { + display: block; + margin: 1rem 0; + border-radius: 12px; + background: var(--card); + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; + overflow: hidden; + z-index: 0; + position: relative; +} +:root[data-theme="light"] .post-list .post-card { + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); +} +:root[data-theme="light"] .post-list .post-card:hover { + box-shadow: 0 12px 20px -4px rgba(0,0,0,0.15); + transform: translate3d(0, -2px, 0); +} +:root[data-theme="dark"] .post-list .post-card:hover { + box-shadow: 0 0 4px -2px #1cd0fd, 0 0 24px -8px #1cd0fd; +} +:root:not([data-theme]) .post-list .post-card { + box-shadow: 0 1px 2px 0px rgba(0,0,0,0.1); +} +:root:not([data-theme]) .post-list .post-card:hover { + box-shadow: 0 12px 20px -4px rgba(0,0,0,0.15); + transform: translate3d(0, -2px, 0); +} +@media (prefers-color-scheme: dark) { + :root:not([data-theme]) .post-list .post-card:hover { + box-shadow: 0 0 4px -2px #1cd0fd, 0 0 24px -8px #1cd0fd; + } +} +.post-list .post-card .excerpt { + margin: 1rem 0; +} +@media screen and (max-width: 500px) { + .post-list .post-card .excerpt { + margin: 0.5rem 0; + } +} +.post-list .post-card .excerpt >p { + margin: 1rem 0; + line-height: 1.5; +} +@media screen and (max-width: 500px) { + .post-list .post-card .excerpt >p { + margin: 0.5rem 0; + } +} +.post-list .post-card .meta.cap { + flex-wrap: wrap; + margin: 0; + line-height: 2; + --fsp: calc(17px - 1px); + font-size: var(--fsp); +} +.post-list .post-card .meta.cap, +.post-list .post-card .meta.cap span { + display: flex; + align-items: center; +} +.post-list .post-card .meta.cap svg { + height: 1em; + width: auto; + line-height: 0; + transform: scale(1.2); + margin-right: 8px; +} +.post-list .post-card .meta.cap >span+span { + margin-left: 1.5rem; +} +.post-list .post-card .meta.cap span.pin img { + object-fit: contain; +} +.post-list .post-card .meta.cap span.pin svg { + color: #f44336; +} +.post-list.post .post-card:hover img { + filter: brightness(50%); +} +.post-list .md-text { + padding: 1rem; +} +@media screen and (max-width: 500px) { + .post-list .md-text { + padding: 0.5rem 1rem; + } +} +.post-list .md-text p { + color: var(--text-p2); + font-size: 0.875rem; +} +.post-list .post-card .post-cover { + overflow: hidden; + width: calc(100% + 2 * 1rem); + border-radius: 0; + margin-left: -1rem; + margin-top: -1rem; + margin-right: -1rem; + background: var(--block); +} +.post-list .post-card .post-cover:not(.lazy) { + transition: transform 1s ease-out; + -moz-transition: transform 1s ease-out; + -webkit-transition: transform 1s ease-out; + -o-transition: transform 1s ease-out; +} +.post-list .post-card .post-cover img { + object-fit: cover; + width: 100%; + border-radius: 0; + aspect-ratio: 2.4; +} +.post-list .post-card.post.photo .cover { + position: relative; + line-height: 0; +} +.post-list .post-card.post.photo .cover img { + width: 100%; + object-fit: cover; + aspect-ratio: 2.4; +} +.post-list .post-card.post.photo .cover .cover-info { + padding: 1.5rem 1rem; + position: absolute; + line-height: 1.2; + width: calc(100% - 1rem * 2); + --text-banner: #fff; + color: var(--text-banner); +} +.post-list .post-card.post.photo .cover .cover-info[position=top] { + top: 0; + background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0)); +} +.post-list .post-card.post.photo .cover .cover-info[position=bottom] { + bottom: 0; + background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.2)); +} +.post-list .post-card.post.photo .cover .cover-info div+div { + margin-top: 4px; +} +.post-list .post-card.post.photo .cover .cover-info .cap { + font-size: 0.8125rem; + color: unset; +} +.post-list .post-card.post.photo .cover .cover-info .title { + font-weight: 500; + font-size: calc(17px + 7px); +} +@media screen and (max-width: 500px) { + .post-list .post-card.post.photo .cover .cover-info { + padding: 1rem; + } + .post-list .post-card.post.photo .cover .cover-info div+div { + margin-top: 2px; + } + .post-list .post-card.post.photo .cover .cover-info .title { + font-size: calc(17px + 4px); + } + .post-list .post-card.post.photo .cover .cover-info .cap { + font-size: 0.75rem; + } +} +.post-list .post-card.post.photo h2 { + margin: 0.25rem 0; + font-size: calc(17px + 4px); +} +.post-list .post-card.wiki article { + display: flex; + flex-wrap: wrap; + transition: box-shadow 0.2s ease-out; + -moz-transition: box-shadow 0.2s ease-out; + -webkit-transition: box-shadow 0.2s ease-out; + -o-transition: box-shadow 0.2s ease-out; + justify-content: center; + padding: 1rem 0.5rem; +} +.post-list .post-card.wiki article .preview { + display: flex; + margin: 1rem 3rem; + align-items: center; +} +.post-list .post-card.wiki article .preview img { + width: 96px; + max-height: 96px; + object-fit: contain; +} +.post-list .post-card.wiki article .preview img:not(.lazy) { + transition: transform 0.75s ease-out; + -moz-transition: transform 0.75s ease-out; + -webkit-transition: transform 0.75s ease-out; + -o-transition: transform 0.75s ease-out; +} +.post-list .post-card.wiki article .excerpt { + margin: 1rem 0.5rem; + min-width: 280px; + flex: 1; + overflow: hidden; + word-wrap: break-word; +} +@media screen and (min-width: 950px) { + .post-list .post-card.wiki article .excerpt { + margin-right: 2rem; + } +} +.post-list .post-card.wiki article .excerpt .caps { + line-height: 1; + margin-bottom: 0.75rem; +} +.post-list .post-card.wiki article .excerpt .cap { + --theme-block: var(--block); + background: var(--theme-block); + padding: 2px 4px; + border-radius: 2px; +} +.post-list .post-card.wiki article .excerpt p:last-child { + margin-bottom: 0; +} +.post-list .post-card.wiki article .excerpt .cap+.cap { + margin-left: 4px; +} +@media screen and (max-width: 500px) { + .post-list.archives { + margin: 1rem 0; + } +} +.l_main { + position: relative; + padding-bottom: var(--gap-max); +} +@media screen and (min-width: 667px) { + .l_main { + padding-top: 8px; + } +} +.l_main header { + margin: 2rem 1rem 1rem; +} +.l_main header .logo-wrap { + margin: 0; +} +@media screen and (max-width: 667px) { + .l_body.index .l_main { + padding-top: 0; + } +} +body>.sitebg { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-size: cover; +} +body>.sitebg .siteblur { + width: 100%; + height: 100%; + background: var(--blur-bg); + --blur-px: 100px; + --blur-bg: var(--alpha75); +} +@supports ((-webkit-backdrop-filter: blur(var(--blur-px))) or (backdrop-filter: blur(var(--blur-px)))) { + body>.sitebg .siteblur { + background: var(--blur-bg) !important; + backdrop-filter: saturate(200%) blur(var(--blur-px)); + -webkit-backdrop-filter: saturate(200%) blur(var(--blur-px)); + } +} +body>.sitebg .siteblur:hover { + background: var(--card); +} +.md-text { + max-width: 100%; + padding: 1rem; + color: var(--text-p1); + line-height: 1.6; + word-break: break-word; +} +.md-text.excerpt p { + font-size: 0.875rem; + margin: 1em 0; +} +.md-text.content { + position: relative; + padding-top: 0; + padding-bottom: 2rem; + overflow: hidden; +} +.l_body[text-indent] .md-text.content p:not([class]) { + text-indent: calc(var(--fsp) * 2); + text-align: justify; +} +.l_body[text-indent] .md-text.content p:not([class]) a { + text-indent: 0; +} +.l_body[text-indent] .md-text.content ol, +.l_body[text-indent] .md-text.content ul { + margin-left: 0.5em; +} +.l_body[text-indent] .md-text.content h1, +.l_body[text-indent] .md-text.content h2, +.l_body[text-indent] .md-text.content h3, +.l_body[text-indent] .md-text.content h4, +.l_body[text-indent] .md-text.content h5, +.l_body[text-indent] .md-text.content h6 { + text-align: center; +} +.l_body[text-indent] .md-text.content h1 >a:first-child, +.l_body[text-indent] .md-text.content h2 >a:first-child, +.l_body[text-indent] .md-text.content h3 >a:first-child, +.l_body[text-indent] .md-text.content h4 >a:first-child, +.l_body[text-indent] .md-text.content h5 >a:first-child, +.l_body[text-indent] .md-text.content h6 >a:first-child { + display: none; +} +.l_body[text-indent] .md-text.content h2 { + margin: 2em 0 1.5em; +} +.l_body[text-indent] .md-text.content blockquote p:not([class]), +.l_body[text-indent] .md-text.content .poetry p:not([class]), +.l_body[text-indent] .md-text.content .okr p:not([class]), +.l_body[text-indent] .md-text.content .timeline p:not([class]), +.l_body[text-indent] .md-text.content li p:not([class]), +.l_body[text-indent] .md-text.content .article-footer p:not([class]) { + text-indent: 0; + text-align: left; +} +.md-text ul:not(:last-child), +.md-text ol:not(:last-child) { + padding-bottom: 0.5rem; + margin: 0; +} +.md-text blockquote p, +.md-text ul p, +.md-text ol p, +.md-text blockquote ul, +.md-text ul ul, +.md-text ol ul, +.md-text blockquote ol, +.md-text ul ol, +.md-text ol ol { + --fsp: calc(17px - 1px); + font-size: var(--fsp); + line-height: 1.5; +} +.md-text blockquote p code, +.md-text ul p code, +.md-text ol p code, +.md-text blockquote ul code, +.md-text ul ul code, +.md-text ol ul code, +.md-text blockquote ol code, +.md-text ul ol code, +.md-text ol ol code { + font-size: inherit; + padding: 0; + background: none; +} +.md-text p *, +.md-text blockquote *, +.md-text .tag-plugin *, +.md-text ul *, +.md-text ol *, +.md-text .highlight *, +.md-text table * { + --gap-p: var(--gap-p-compact); +} +.md-text p, +.md-text ul, +.md-text ol { + margin-top: calc(var(--gap-p) - 4px); + margin-bottom: calc(var(--gap-p) - 4px); +} +.md-text .tag-plugin, +.md-text iframe { + margin-top: var(--gap-p); + margin-bottom: var(--gap-p); +} +.md-text iframe { + display: block; +} +.md-text.content h1, +.md-text.content h2, +.md-text.content h3, +.md-text.content h4, +.md-text.content h5, +.md-text.content h6 { + color: var(--text); + line-height: 1.8; +} +.md-text.content h1 >a:first-child, +.md-text.content h2 >a:first-child, +.md-text.content h3 >a:first-child, +.md-text.content h4 >a:first-child, +.md-text.content h5 >a:first-child, +.md-text.content h6 >a:first-child { + background: #1cd0fd; + border-radius: 2px; + margin-right: 8px; + transition: background 0.2s ease-out; + -moz-transition: background 0.2s ease-out; + -webkit-transition: background 0.2s ease-out; + -o-transition: background 0.2s ease-out; +} +.md-text.content h1 >a:first-child:hover, +.md-text.content h2 >a:first-child:hover, +.md-text.content h3 >a:first-child:hover, +.md-text.content h4 >a:first-child:hover, +.md-text.content h5 >a:first-child:hover, +.md-text.content h6 >a:first-child:hover { + background: #ff5724; +} +.md-text.content h1 >a:first-child:before, +.md-text.content h2 >a:first-child:before, +.md-text.content h3 >a:first-child:before, +.md-text.content h4 >a:first-child:before, +.md-text.content h5 >a:first-child:before, +.md-text.content h6 >a:first-child:before { + content: ''; + color: #fff; + font-weight: 700; + padding: 0 2px; + font-size: 0.75rem; +} +.md-text.content h2 { + font-weight: 500; +} +.md-text.content h2 >a:first-child:before { + content: ':'; +} +.md-text.content blockquote h2, +.md-text.content .tag-plugin h2, +.md-text.content blockquote h3, +.md-text.content .tag-plugin h3, +.md-text.content blockquote h4, +.md-text.content .tag-plugin h4, +.md-text.content blockquote h5, +.md-text.content .tag-plugin h5, +.md-text.content blockquote h6, +.md-text.content .tag-plugin h6 { + margin-top: 0.25em; + margin-bottom: 0.25em; +} +.md-text.content:first-child .tag-plugin:first-child { + margin-top: 0; +} +.md-text p { + font-size: var(--fsp); +} +.md-text pre { + -webkit-font-smoothing: auto; + -moz-osx-font-smoothing: auto; +} +.md-text pre.mermaid { + overflow: auto; +} +.md-text .center { + align-self: center; +} +.md-text>div { + margin: var(--gap-p) 0; +} +.md-text img { + border-radius: 12px; + margin: auto; + display: block; +} +li:not([class]) a:not([class]), +p:not([class]) a:not([class]), +table a:not([class]) { + position: relative; + text-decoration: none; + transition: all 0.2s ease-out; + -moz-transition: all 0.2s ease-out; + -webkit-transition: all 0.2s ease-out; + -o-transition: all 0.2s ease-out; + padding: 0 2px; + border-radius: 0; + color: inherit; + background: linear-gradient(0deg, var(--theme-link), var(--theme-link)) no-repeat left 100%/100% 1px; +} +li:not([class]) a:not([class]):hover, +p:not([class]) a:not([class]):hover, +table a:not([class]):hover { + text-decoration: none; + color: var(--theme-link); + border-radius: 4px; + background: linear-gradient(0deg, var(--theme-link-opa), var(--theme-link-opa)) no-repeat left 100%/100% 100%; +} +li:not([class]) a:not([class]):has(img), +p:not([class]) a:not([class]):has(img), +table a:not([class]):has(img) { + background: none; + padding: 0; +} +li:not([class]) a:not([class]):has(img):hover, +p:not([class]) a:not([class]):has(img):hover, +table a:not([class]):has(img):hover { + background: none; +} +.md-text .aplayer { + border-radius: 12px; +} +img.lazy { + transition: all 0.38s ease-out; + -moz-transition: all 0.38s ease-out; + -webkit-transition: all 0.38s ease-out; + -o-transition: all 0.38s ease-out; +} +img.lazy:not(.loaded) { + opacity: 0; +} +img.lazy.loaded, +img.lazy.error { + opacity: 1; +} +:root { + --swiper-theme-color: #1cd0fd !important; +} +.swiper { + width: 100%; + border-radius: 4px; + --gap-p: 2rem; +} +.swiper:not(.swiper-initialized) { + display: none; +} +div.swiper-slide { + text-align: center; + display: -webkit-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + align-self: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + width: 50%; +} +div.swiper-slide img { + border-radius: 4px; +} +.swiper[width='max'] .swiper-slide { + width: 100%; +} +.swiper[width='min'] .swiper-slide { + width: 25%; +} +.swiper[effect='cards'] .swiper-slide { + max-width: 75%; +} +.swiper-button-prev, +.swiper-button-next { + padding: 1rem 0.25rem; + margin-top: -2rem !important; + border-radius: 40px; + background: rgba(255,255,255,0.25); + transition: background 0.2s ease-out; + -moz-transition: background 0.2s ease-out; + -webkit-transition: background 0.2s ease-out; + -o-transition: background 0.2s ease-out; + --swiper-theme-color: var(--text) !important; +} +.swiper-button-prev:after, +.swiper-button-next:after { + font-size: 1.2rem !important; + font-weight: 700 !important; + color: var(--swiper-theme-color); +} +.swiper-button-prev:hover, +.swiper-button-next:hover { + background: #fff !important; + --swiper-theme-color: #ff5724 !important; +} +.swiper-button-prev:after { + transform: translateX(-1px); +} +.swiper-button-next:after { + transform: translateX(1px); +} +img[data-fancybox], +a[data-fancybox] { + cursor: zoom-in; +} +.highlight { + position: relative; +} +.highlight .code .copy-btn { + position: absolute; + top: 0; + right: 0; + padding: 0px 0.5rem; + font-weight: 700; + visibility: hidden; + border-bottom-left-radius: 8px; + border-bottom-right-radius: 8px; + background: var(--card); + display: block; + cursor: pointer; + margin-right: 4px; + margin-top: 4px; + border-radius: calc(12px - 4px); +} +.highlight:hover .code:before { + visibility: hidden; +} +.highlight:hover .copy-btn { + visibility: visible; +} +.highlight .code .copy-btn.success { + background: #3dc550; + color: #fff; + visibility: visible; +} +.highlight .code .copy-btn.warning { + background: #fa6400; + color: #fff; + visibility: visible; +} +.md-text .folding[child=codeblock] .code .copy-btn { + z-index: 1; + margin-right: 1rem; + border-radius: 8px; +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..40d9a79 --- /dev/null +++ b/index.html @@ -0,0 +1,546 @@ + + + + + + + + + + + + + + + + + + + + KyonQi + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
KyonQi
+ + + + +
+
+

Hello World

Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, yo...

+
+ + +

本站由 Qi 使用 Stellar 1.29.1 主题创建。
本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。

+
+
+ + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
diff --git a/js/main.js b/js/main.js new file mode 100644 index 0000000..4894426 --- /dev/null +++ b/js/main.js @@ -0,0 +1,210 @@ +// utils +const util = { + + // https://github.com/jerryc127/hexo-theme-butterfly + diffDate: (d, more = false) => { + const dateNow = new Date() + const datePost = new Date(d) + const dateDiff = dateNow.getTime() - datePost.getTime() + const minute = 1000 * 60 + const hour = minute * 60 + const day = hour * 24 + + let result + if (more) { + const dayCount = dateDiff / day + const hourCount = dateDiff / hour + const minuteCount = dateDiff / minute + + if (dayCount > 14) { + result = null + } else if (dayCount >= 1) { + result = parseInt(dayCount) + ' ' + ctx.date_suffix.day + } else if (hourCount >= 1) { + result = parseInt(hourCount) + ' ' + ctx.date_suffix.hour + } else if (minuteCount >= 1) { + result = parseInt(minuteCount) + ' ' + ctx.date_suffix.min + } else { + result = ctx.date_suffix.just + } + } else { + result = parseInt(dateDiff / day) + } + return result + }, + + copy: (id, msg) => { + const el = document.getElementById(id); + if (el) { + el.select(); + document.execCommand("Copy"); + if (msg && msg.length > 0) { + hud.toast(msg, 2500); + } + } + }, + + toggle: (id) => { + const el = document.getElementById(id); + if (el) { + el.classList.toggle("display"); + } + }, + + scrollTop: () => { + window.scrollTo({top: 0, behavior: "smooth"}); + }, + + scrollComment: () => { + document.getElementById('comments').scrollIntoView({behavior: "smooth"}); + }, + + viewportLazyload: (target, func, enabled = true) => { + if (!enabled || !("IntersectionObserver" in window)) { + func(); + return; + } + const observer = new IntersectionObserver((entries) => { + if (entries[0].intersectionRatio > 0) { + func(); + observer.disconnect(); + } + }); + observer.observe(target); + } +} + +const hud = { + toast: (msg, duration) => { + const d = Number(isNaN(duration) ? 2000 : duration); + var el = document.createElement('div'); + el.classList.add('toast'); + el.classList.add('show'); + el.innerHTML = msg; + document.body.appendChild(el); + + setTimeout(function(){ document.body.removeChild(el) }, d); + + }, + +} + +// defines + +const l_body = document.querySelector('.l_body'); + + +const init = { + toc: () => { + utils.jq(() => { + const scrollOffset = 32; + var segs = []; + $("article.md-text :header").each(function (idx, node) { + segs.push(node); + }); + function activeTOC() { + var scrollTop = $(this).scrollTop(); + var topSeg = null; + for (var idx in segs) { + var seg = $(segs[idx]); + if (seg.offset().top > scrollTop + scrollOffset) { + continue; + } + if (!topSeg) { + topSeg = seg; + } else if (seg.offset().top >= topSeg.offset().top) { + topSeg = seg; + } + } + if (topSeg) { + $("#data-toc a.toc-link").removeClass("active"); + var link = "#" + topSeg.attr("id"); + if (link != '#undefined') { + const highlightItem = $('#data-toc a.toc-link[href="' + encodeURI(link) + '"]'); + if (highlightItem.length > 0) { + highlightItem.addClass("active"); + } + } else { + $('#data-toc a.toc-link:first').addClass("active"); + } + } + } + function scrollTOC() { + const e0 = document.querySelector('#data-toc .toc'); + const e1 = document.querySelector('#data-toc .toc a.toc-link.active'); + if (e0 == null || e1 == null) { + return; + } + const offsetBottom = e1.getBoundingClientRect().bottom - e0.getBoundingClientRect().bottom + 100; + const offsetTop = e1.getBoundingClientRect().top - e0.getBoundingClientRect().top - 64; + if (offsetTop < 0) { + e0.scrollBy({top: offsetTop, behavior: "smooth"}); + } else if (offsetBottom > 0) { + e0.scrollBy({top: offsetBottom, behavior: "smooth"}); + } + } + + var timeout = null; + window.addEventListener('scroll', function() { + activeTOC(); + if(timeout !== null) clearTimeout(timeout); + timeout = setTimeout(function() { + scrollTOC(); + }.bind(this), 50); + }); + }) + }, + sidebar: () => { + utils.jq(() => { + $("#data-toc a.toc-link").click(function (e) { + sidebar.dismiss(); + }); + }) + }, + relativeDate: (selector) => { + selector.forEach(item => { + const $this = item + const timeVal = $this.getAttribute('datetime') + let relativeValue = util.diffDate(timeVal, true) + if (relativeValue) { + $this.innerText = relativeValue + } + }) + }, + /** + * Tabs tag listener (without twitter bootstrap). + */ + registerTabsTag: function () { + // Binding `nav-tabs` & `tab-content` by real time permalink changing. + document.querySelectorAll('.tabs .nav-tabs .tab').forEach(element => { + element.addEventListener('click', event => { + event.preventDefault(); + // Prevent selected tab to select again. + if (element.classList.contains('active')) return; + // Add & Remove active class on `nav-tabs` & `tab-content`. + [...element.parentNode.children].forEach(target => { + target.classList.toggle('active', target === element); + }); + // https://stackoverflow.com/questions/20306204/using-queryselector-with-ids-that-are-numbers + const tActive = document.getElementById(element.querySelector('a').getAttribute('href').replace('#', '')); + [...tActive.parentNode.children].forEach(target => { + target.classList.toggle('active', target === tActive); + }); + // Trigger event + tActive.dispatchEvent(new Event('tabs:click', { + bubbles: true + })); + }); + }); + + window.dispatchEvent(new Event('tabs:register')); + }, + +} + + +// init +init.toc() +init.sidebar() +init.relativeDate(document.querySelectorAll('#post-meta time')) +init.registerTabsTag() diff --git a/js/plugins/copycode.js b/js/plugins/copycode.js new file mode 100644 index 0000000..3f3f62a --- /dev/null +++ b/js/plugins/copycode.js @@ -0,0 +1,32 @@ +window.codeElements.forEach((codeElement) => { + // 创建复制按钮 + const codeCopyBtn = document.createElement('div'); + codeCopyBtn.className = 'copy-btn'; + codeCopyBtn.textContent = ctx.copycode.default_text; + codeElement.appendChild(codeCopyBtn); + + // 添加点击事件监听 + codeCopyBtn.addEventListener('click', async () => { + const codeToCopy = codeElement.querySelector('pre')?.innerText || ''; + if (navigator.clipboard) { + try { + await navigator.clipboard.writeText(codeToCopy); + codeCopyBtn.textContent = ctx.copycode.success_text; + codeCopyBtn.classList.add('success'); + hud.toast(ctx.copycode.toast, 2500); + } catch (error) { + codeCopyBtn.textContent = '未获得用户许可'; + codeCopyBtn.classList.add('warning'); + } + } else { + codeCopyBtn.textContent = '浏览器不支持/非HTTPS'; + codeCopyBtn.classList.add('warning'); + } + + // 3秒后恢复默认文本 + setTimeout(() => { + codeCopyBtn.textContent = ctx.copycode.default_text; + codeCopyBtn.classList.remove('success', 'warning'); + }, 3000); + }); +}); \ No newline at end of file diff --git a/js/search/algolia-search.js b/js/search/algolia-search.js new file mode 100644 index 0000000..2398bf0 --- /dev/null +++ b/js/search/algolia-search.js @@ -0,0 +1,75 @@ +utils.jq(() => { + var $inputArea = $("input#search-input"); + if ($inputArea.length === 0) { + return; + } + + var $resultArea = $("#search-result"); + var $searchWrapper = $("#search-wrapper"); + var client = algoliasearch(window.searchConfig.appId, window.searchConfig.apiKey); + var index = client.initIndex(window.searchConfig.indexName); + + function filterResults(hits, filterPath) { + if (!filterPath || filterPath === '/') return hits; + var regex = new RegExp(filterPath); + return hits.filter(hit => regex.test(hit.url)); + } + + function displayResults(hits) { + var $resultList = $("