aboutsummaryrefslogtreecommitdiff
path: root/www/assets
diff options
context:
space:
mode:
Diffstat (limited to 'www/assets')
-rw-r--r--www/assets/base-style.css115
-rw-r--r--www/assets/catppuccin-latte.css88
-rw-r--r--www/assets/catppuccin-mocha.css88
-rw-r--r--www/assets/color-scheme.ts90
-rw-r--r--www/assets/github-mark.pngbin0 -> 6393 bytes
-rw-r--r--www/assets/partials/preview/article.css42
-rw-r--r--www/assets/real-home.css61
-rw-r--r--www/assets/single.css18
8 files changed, 502 insertions, 0 deletions
diff --git a/www/assets/base-style.css b/www/assets/base-style.css
new file mode 100644
index 0000000..4ee87d6
--- /dev/null
+++ b/www/assets/base-style.css
@@ -0,0 +1,115 @@
+html {
+ width: 100%;
+}
+
+* {
+ box-sizing: border-box;
+}
+
+body {
+ width: 100%;
+ margin: 0;
+ --fg-color: black;
+ --bg-color: white;
+ color: var(--fg-color);
+ background-color: var(--bg-color);
+}
+
+.mono {
+ font-family: monospace;
+}
+
+a.mono-link,
+.mono-link a,
+.mono-link .fake-link {
+ font-family: monospace;
+}
+
+.toast {
+ font-size: large;
+ font-family: monospace;
+ color: var(--bg-color);
+ background-color: var(--fg-color);
+ padding: 0.5em 0.3em;
+ border-radius: 6px;
+
+ position: fixed;
+ z-index: 1;
+ top: 4px;
+ left: 50vw;
+ transform: translateX(-50%);
+}
+
+.chroma {
+ overflow-x: scroll;
+ padding-left: 1px;
+ padding-right: 4px;
+ border-radius: 3px;
+}
+
+nav {
+ font-size: large;
+}
+
+#slogan {
+ color: white;
+ width: 100%;
+ padding: 0.5em 1em;
+ text-align: center;
+ background-color: dodgerblue;
+ user-select: none;
+
+ & > * {
+ user-select: text;
+ }
+}
+
+#main-article {
+ position: relative;
+ left: 50%;
+ transform: translateX(-50%);
+ max-width: 880px;
+ padding: 0 1em;
+ margin-top: 1em;
+}
+
+#license a {
+ font-family: initial;
+ text-decoration: none;
+}
+
+#license-text {
+ font-family: monospace;
+ text-decoration: initial;
+}
+
+#license-img-container img {
+ height: 1em;
+ vertical-align: middle;
+}
+
+body[data-theme="dark"] {
+ --fg-color: white;
+ --bg-color: black;
+
+ & a:link {
+ color:#34ffd9;
+ }
+
+ & a:visited {
+ color:#abcac4;
+ }
+
+ & #slogan {
+ color: var(--fg-color);
+ background-color: midnightblue;
+ }
+
+ & :is(.chroma,.chroma *) {
+ background-color: hsl(0, 0%, 1.5%);
+
+ & .n {
+ color: var(--fg-color);
+ }
+ }
+}
diff --git a/www/assets/catppuccin-latte.css b/www/assets/catppuccin-latte.css
new file mode 100644
index 0000000..00c0669
--- /dev/null
+++ b/www/assets/catppuccin-latte.css
@@ -0,0 +1,88 @@
+/* Generated using: hugo gen chromastyles --style=catppuccin-latte */
+
+/* Background */ .bg { color:#4c4f69;background-color:#eff1f5; }
+/* PreWrapper */ .chroma { color:#4c4f69;background-color:#eff1f5; }
+/* Other */ .chroma .x { }
+/* Error */ .chroma .err { color:#d20f39 }
+/* CodeLine */ .chroma .cl { }
+/* LineLink */ .chroma .lnlinks { outline:none;text-decoration:none;color:inherit }
+/* LineTableTD */ .chroma .lntd { vertical-align:top;padding:0;margin:0;border:0; }
+/* LineTable */ .chroma .lntable { border-spacing:0;padding:0;margin:0;border:0; }
+/* LineHighlight */ .chroma .hl { background-color:#bcc0cc }
+/* LineNumbersTable */ .chroma .lnt { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#8c8fa1 }
+/* LineNumbers */ .chroma .ln { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#8c8fa1 }
+/* Line */ .chroma .line { display:flex; }
+/* Keyword */ .chroma .k { color:#8839ef }
+/* KeywordConstant */ .chroma .kc { color:#fe640b }
+/* KeywordDeclaration */ .chroma .kd { color:#d20f39 }
+/* KeywordNamespace */ .chroma .kn { color:#179299 }
+/* KeywordPseudo */ .chroma .kp { color:#8839ef }
+/* KeywordReserved */ .chroma .kr { color:#8839ef }
+/* KeywordType */ .chroma .kt { color:#d20f39 }
+/* Name */ .chroma .n { }
+/* NameAttribute */ .chroma .na { color:#1e66f5 }
+/* NameBuiltin */ .chroma .nb { color:#04a5e5 }
+/* NameBuiltinPseudo */ .chroma .bp { color:#04a5e5 }
+/* NameClass */ .chroma .nc { color:#df8e1d }
+/* NameConstant */ .chroma .no { color:#df8e1d }
+/* NameDecorator */ .chroma .nd { color:#1e66f5;font-weight:bold }
+/* NameEntity */ .chroma .ni { color:#179299 }
+/* NameException */ .chroma .ne { color:#fe640b }
+/* NameFunction */ .chroma .nf { color:#1e66f5 }
+/* NameFunctionMagic */ .chroma .fm { color:#1e66f5 }
+/* NameLabel */ .chroma .nl { color:#04a5e5 }
+/* NameNamespace */ .chroma .nn { color:#fe640b }
+/* NameOther */ .chroma .nx { }
+/* NameProperty */ .chroma .py { color:#fe640b }
+/* NameTag */ .chroma .nt { color:#8839ef }
+/* NameVariable */ .chroma .nv { color:#dc8a78 }
+/* NameVariableClass */ .chroma .vc { color:#dc8a78 }
+/* NameVariableGlobal */ .chroma .vg { color:#dc8a78 }
+/* NameVariableInstance */ .chroma .vi { color:#dc8a78 }
+/* NameVariableMagic */ .chroma .vm { color:#dc8a78 }
+/* Literal */ .chroma .l { }
+/* LiteralDate */ .chroma .ld { }
+/* LiteralString */ .chroma .s { color:#40a02b }
+/* LiteralStringAffix */ .chroma .sa { color:#d20f39 }
+/* LiteralStringBacktick */ .chroma .sb { color:#40a02b }
+/* LiteralStringChar */ .chroma .sc { color:#40a02b }
+/* LiteralStringDelimiter */ .chroma .dl { color:#1e66f5 }
+/* LiteralStringDoc */ .chroma .sd { color:#9ca0b0 }
+/* LiteralStringDouble */ .chroma .s2 { color:#40a02b }
+/* LiteralStringEscape */ .chroma .se { color:#1e66f5 }
+/* LiteralStringHeredoc */ .chroma .sh { color:#9ca0b0 }
+/* LiteralStringInterpol */ .chroma .si { color:#40a02b }
+/* LiteralStringOther */ .chroma .sx { color:#40a02b }
+/* LiteralStringRegex */ .chroma .sr { color:#179299 }
+/* LiteralStringSingle */ .chroma .s1 { color:#40a02b }
+/* LiteralStringSymbol */ .chroma .ss { color:#40a02b }
+/* LiteralNumber */ .chroma .m { color:#fe640b }
+/* LiteralNumberBin */ .chroma .mb { color:#fe640b }
+/* LiteralNumberFloat */ .chroma .mf { color:#fe640b }
+/* LiteralNumberHex */ .chroma .mh { color:#fe640b }
+/* LiteralNumberInteger */ .chroma .mi { color:#fe640b }
+/* LiteralNumberIntegerLong */ .chroma .il { color:#fe640b }
+/* LiteralNumberOct */ .chroma .mo { color:#fe640b }
+/* Operator */ .chroma .o { color:#04a5e5;font-weight:bold }
+/* OperatorWord */ .chroma .ow { color:#04a5e5;font-weight:bold }
+/* Punctuation */ .chroma .p { }
+/* Comment */ .chroma .c { color:#9ca0b0;font-style:italic }
+/* CommentHashbang */ .chroma .ch { color:#9ca0b0;font-style:italic }
+/* CommentMultiline */ .chroma .cm { color:#9ca0b0;font-style:italic }
+/* CommentSingle */ .chroma .c1 { color:#9ca0b0;font-style:italic }
+/* CommentSpecial */ .chroma .cs { color:#9ca0b0;font-style:italic }
+/* CommentPreproc */ .chroma .cp { color:#9ca0b0;font-style:italic }
+/* CommentPreprocFile */ .chroma .cpf { color:#9ca0b0;font-weight:bold;font-style:italic }
+/* Generic */ .chroma .g { }
+/* GenericDeleted */ .chroma .gd { color:#d20f39;background-color:#ccd0da }
+/* GenericEmph */ .chroma .ge { font-style:italic }
+/* GenericError */ .chroma .gr { color:#d20f39 }
+/* GenericHeading */ .chroma .gh { color:#fe640b;font-weight:bold }
+/* GenericInserted */ .chroma .gi { color:#40a02b;background-color:#ccd0da }
+/* GenericOutput */ .chroma .go { }
+/* GenericPrompt */ .chroma .gp { }
+/* GenericStrong */ .chroma .gs { font-weight:bold }
+/* GenericSubheading */ .chroma .gu { color:#fe640b;font-weight:bold }
+/* GenericTraceback */ .chroma .gt { color:#d20f39 }
+/* GenericUnderline */ .chroma .gl { text-decoration:underline }
+/* TextWhitespace */ .chroma .w { }
diff --git a/www/assets/catppuccin-mocha.css b/www/assets/catppuccin-mocha.css
new file mode 100644
index 0000000..4d9a04c
--- /dev/null
+++ b/www/assets/catppuccin-mocha.css
@@ -0,0 +1,88 @@
+/* Generated using: hugo gen chromastyles --style=catppuccin-mocha */
+
+/* Background */ .bg { color:#cdd6f4;background-color:#1e1e2e; }
+/* PreWrapper */ .chroma { color:#cdd6f4;background-color:#1e1e2e; }
+/* Other */ .chroma .x { }
+/* Error */ .chroma .err { color:#f38ba8 }
+/* CodeLine */ .chroma .cl { }
+/* LineLink */ .chroma .lnlinks { outline:none;text-decoration:none;color:inherit }
+/* LineTableTD */ .chroma .lntd { vertical-align:top;padding:0;margin:0;border:0; }
+/* LineTable */ .chroma .lntable { border-spacing:0;padding:0;margin:0;border:0; }
+/* LineHighlight */ .chroma .hl { background-color:#45475a }
+/* LineNumbersTable */ .chroma .lnt { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f849c }
+/* LineNumbers */ .chroma .ln { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f849c }
+/* Line */ .chroma .line { display:flex; }
+/* Keyword */ .chroma .k { color:#cba6f7 }
+/* KeywordConstant */ .chroma .kc { color:#fab387 }
+/* KeywordDeclaration */ .chroma .kd { color:#f38ba8 }
+/* KeywordNamespace */ .chroma .kn { color:#94e2d5 }
+/* KeywordPseudo */ .chroma .kp { color:#cba6f7 }
+/* KeywordReserved */ .chroma .kr { color:#cba6f7 }
+/* KeywordType */ .chroma .kt { color:#f38ba8 }
+/* Name */ .chroma .n { }
+/* NameAttribute */ .chroma .na { color:#89b4fa }
+/* NameBuiltin */ .chroma .nb { color:#89dceb }
+/* NameBuiltinPseudo */ .chroma .bp { color:#89dceb }
+/* NameClass */ .chroma .nc { color:#f9e2af }
+/* NameConstant */ .chroma .no { color:#f9e2af }
+/* NameDecorator */ .chroma .nd { color:#89b4fa;font-weight:bold }
+/* NameEntity */ .chroma .ni { color:#94e2d5 }
+/* NameException */ .chroma .ne { color:#fab387 }
+/* NameFunction */ .chroma .nf { color:#89b4fa }
+/* NameFunctionMagic */ .chroma .fm { color:#89b4fa }
+/* NameLabel */ .chroma .nl { color:#89dceb }
+/* NameNamespace */ .chroma .nn { color:#fab387 }
+/* NameOther */ .chroma .nx { }
+/* NameProperty */ .chroma .py { color:#fab387 }
+/* NameTag */ .chroma .nt { color:#cba6f7 }
+/* NameVariable */ .chroma .nv { color:#f5e0dc }
+/* NameVariableClass */ .chroma .vc { color:#f5e0dc }
+/* NameVariableGlobal */ .chroma .vg { color:#f5e0dc }
+/* NameVariableInstance */ .chroma .vi { color:#f5e0dc }
+/* NameVariableMagic */ .chroma .vm { color:#f5e0dc }
+/* Literal */ .chroma .l { }
+/* LiteralDate */ .chroma .ld { }
+/* LiteralString */ .chroma .s { color:#a6e3a1 }
+/* LiteralStringAffix */ .chroma .sa { color:#f38ba8 }
+/* LiteralStringBacktick */ .chroma .sb { color:#a6e3a1 }
+/* LiteralStringChar */ .chroma .sc { color:#a6e3a1 }
+/* LiteralStringDelimiter */ .chroma .dl { color:#89b4fa }
+/* LiteralStringDoc */ .chroma .sd { color:#6c7086 }
+/* LiteralStringDouble */ .chroma .s2 { color:#a6e3a1 }
+/* LiteralStringEscape */ .chroma .se { color:#89b4fa }
+/* LiteralStringHeredoc */ .chroma .sh { color:#6c7086 }
+/* LiteralStringInterpol */ .chroma .si { color:#a6e3a1 }
+/* LiteralStringOther */ .chroma .sx { color:#a6e3a1 }
+/* LiteralStringRegex */ .chroma .sr { color:#94e2d5 }
+/* LiteralStringSingle */ .chroma .s1 { color:#a6e3a1 }
+/* LiteralStringSymbol */ .chroma .ss { color:#a6e3a1 }
+/* LiteralNumber */ .chroma .m { color:#fab387 }
+/* LiteralNumberBin */ .chroma .mb { color:#fab387 }
+/* LiteralNumberFloat */ .chroma .mf { color:#fab387 }
+/* LiteralNumberHex */ .chroma .mh { color:#fab387 }
+/* LiteralNumberInteger */ .chroma .mi { color:#fab387 }
+/* LiteralNumberIntegerLong */ .chroma .il { color:#fab387 }
+/* LiteralNumberOct */ .chroma .mo { color:#fab387 }
+/* Operator */ .chroma .o { color:#89dceb;font-weight:bold }
+/* OperatorWord */ .chroma .ow { color:#89dceb;font-weight:bold }
+/* Punctuation */ .chroma .p { }
+/* Comment */ .chroma .c { color:#6c7086;font-style:italic }
+/* CommentHashbang */ .chroma .ch { color:#6c7086;font-style:italic }
+/* CommentMultiline */ .chroma .cm { color:#6c7086;font-style:italic }
+/* CommentSingle */ .chroma .c1 { color:#6c7086;font-style:italic }
+/* CommentSpecial */ .chroma .cs { color:#6c7086;font-style:italic }
+/* CommentPreproc */ .chroma .cp { color:#6c7086;font-style:italic }
+/* CommentPreprocFile */ .chroma .cpf { color:#6c7086;font-weight:bold;font-style:italic }
+/* Generic */ .chroma .g { }
+/* GenericDeleted */ .chroma .gd { color:#f38ba8;background-color:#313244 }
+/* GenericEmph */ .chroma .ge { font-style:italic }
+/* GenericError */ .chroma .gr { color:#f38ba8 }
+/* GenericHeading */ .chroma .gh { color:#fab387;font-weight:bold }
+/* GenericInserted */ .chroma .gi { color:#a6e3a1;background-color:#313244 }
+/* GenericOutput */ .chroma .go { }
+/* GenericPrompt */ .chroma .gp { }
+/* GenericStrong */ .chroma .gs { font-weight:bold }
+/* GenericSubheading */ .chroma .gu { color:#fab387;font-weight:bold }
+/* GenericTraceback */ .chroma .gt { color:#f38ba8 }
+/* GenericUnderline */ .chroma .gl { text-decoration:underline }
+/* TextWhitespace */ .chroma .w { }
diff --git a/www/assets/color-scheme.ts b/www/assets/color-scheme.ts
new file mode 100644
index 0000000..62a1b5c
--- /dev/null
+++ b/www/assets/color-scheme.ts
@@ -0,0 +1,90 @@
+const key = "color-scheme"
+
+type scheme = "dark" | "light" | null
+
+function createResetTimer(cleanup: () => void, timeout = 1) {
+ let tag = 0
+ return () => {
+ clearTimeout(tag)
+ tag = setTimeout(() => {
+ cleanup()
+ }, timeout * 1000)
+ }
+}
+
+let current = localStorage.getItem(key) as scheme
+
+let inited = false
+
+function createToast(duration: number = 1): (text: string) => void {
+ const toast = document.createElement("div")
+ toast.className = "toast"
+
+ const reset = createResetTimer(() => {
+ toast.remove()
+ }, duration)
+
+ return (text) => {
+ if (!toast.isConnected) {
+ document.body.appendChild(toast)
+ }
+ toast.textContent = text
+ reset()
+ }
+}
+
+const themeToast = createToast()
+
+function setTheme(value: scheme) {
+ let message = ""
+ current = value
+
+ if (value == null) {
+ const prefersDarkScheme = window.matchMedia("(prefers-color-scheme: dark)").matches
+ value = prefersDarkScheme ? "dark" : "light"
+ message = `theme: system(${value})`
+ localStorage.removeItem(key)
+ } else {
+ message = `theme: force(${value})`
+ localStorage.setItem(key, value)
+ }
+
+ document.body.dataset["theme"] = value
+
+ if (inited) {
+ themeToast(message)
+ }
+}
+
+setTheme(current)
+inited = true
+
+function next(scheme: scheme): scheme {
+ switch (scheme) {
+ case "dark":
+ return "light"
+ case "light":
+ return null
+ default:
+ return "dark"
+ }
+}
+
+window.addEventListener("load", () => {
+ const slogon = document.getElementById("slogan")!
+ let clicks: number = 0
+
+ const reset = createResetTimer(() => {
+ clicks = 0
+ })
+
+ slogon.addEventListener("click", () => {
+ reset()
+ clicks += 1
+ if (clicks === 3) {
+ setTheme(next(current))
+ clicks = 0
+ }
+ })
+})
+
diff --git a/www/assets/github-mark.png b/www/assets/github-mark.png
new file mode 100644
index 0000000..6cb3b70
--- /dev/null
+++ b/www/assets/github-mark.png
Binary files differ
diff --git a/www/assets/partials/preview/article.css b/www/assets/partials/preview/article.css
new file mode 100644
index 0000000..6e93669
--- /dev/null
+++ b/www/assets/partials/preview/article.css
@@ -0,0 +1,42 @@
+.article-preview {
+ font-size: 0.95em;
+ padding-inline: 0.5em;
+ padding-block: 0.5em;
+ margin-block-end: 0.5em;
+ border-radius: 3px;
+ background-color: hsl(33, 100%, 98%);
+
+ & > p {
+ font-size: 0.9em;
+ line-height: 1.4;
+ margin-inline-start: 0.3em;
+ margin-block: 0;
+ }
+
+ & > .title {
+ margin-block-start: 0;
+ margin-block-end: 0.3em;
+ }
+
+ & > .date {
+ font-size: small;
+ float: right;
+ margin-inline-end: 1.5em;
+ color: hsl(0, 0%, 25%);
+ }
+
+ & > .content {
+ overflow: hidden;
+ height: 3lh;
+ }
+}
+
+body[data-theme="dark"] {
+ & .article-preview {
+ background-color: hsl(0, 0%, 3%);
+
+ & > .date {
+ color: hsl(0, 0%, 75%);
+ }
+ }
+}
diff --git a/www/assets/real-home.css b/www/assets/real-home.css
new file mode 100644
index 0000000..c1355b5
--- /dev/null
+++ b/www/assets/real-home.css
@@ -0,0 +1,61 @@
+#slogan {
+ position: sticky;
+ z-index: 1;
+ top: 0;
+}
+
+#title-name {
+ font-family: monospace;
+ color: var(--bg-color);
+ background-color: var(--fg-color);
+}
+
+#avatar {
+ float: right;
+}
+
+#recent-posts {
+ margin-block-end: 1.5em;
+}
+
+#friends-container {
+ display: flex;
+ gap: 1em;
+}
+
+.friend {
+ flex-grow: 0;
+ text-align: center;
+}
+
+.friend a {
+ font-family: unset;
+}
+
+.friend-avatar {
+ object-fit: cover;
+}
+
+.friend-github {
+ width: 1em;
+ vertical-align: middle;
+ margin-right: -0.5em;
+}
+
+.friend-tag {
+ font-size: 0.8em;
+}
+
+.citation {
+ margin: auto;
+}
+
+.citation figcaption {
+ text-align: right;
+}
+
+body[data-theme="dark"] {
+ & .friend-github {
+ filter: invert(1);
+ }
+}
diff --git a/www/assets/single.css b/www/assets/single.css
new file mode 100644
index 0000000..09a0e29
--- /dev/null
+++ b/www/assets/single.css
@@ -0,0 +1,18 @@
+.post-info {
+ margin-block: 0;
+ font-size: 0.9em;
+ display: flex;
+ flex-wrap: wrap;
+
+ & > .created {
+ margin-inline-end: auto;
+ }
+}
+
+.end-hr {
+ border: none;
+ width: 8em;
+ margin-block-start: 1.5em;
+ margin-inline-start: 0;
+ border-top: 1px dashed black;
+}
generated by cgit v1.2.3 (git 2.39.1) at 2025-04-10 21:59:54 +0000