From 3d9119411697b0a0e6241df94f3f7d3e2dafcf43 Mon Sep 17 00:00:00 2001 From: 186526 Date: Mon, 26 Feb 2024 21:55:56 +0800 Subject: [PATCH] update --- index.html | 2 + src/main.ts | 2 +- src/styles/base.css | 224 ++++++++++++++++++++++---------------------- vercel.json | 125 ++++++++++++------------ 4 files changed, 182 insertions(+), 171 deletions(-) diff --git a/index.html b/index.html index 4786d6e..687a238 100644 --- a/index.html +++ b/index.html @@ -190,6 +190,8 @@

「長い夜の終わりを信じながら」
“仍信长夜终破晓”

「人生全部が馬鹿みたいなのに」
“人生什么的全部明明愚蠢至极”

「牡丹は散っても花だ 夏が去っても追慕は切だ」
“牡丹落尽亦是花,夏去秋来思愈切。”

+

「きっと、人生最後の日も愛をうたうのだろう」
“我一定也会在人生最后的日子讴歌着爱”

+

「もうちょっとだけ貴方を探せたら もう一歩だけ歩いてみれるかな」
“如果再稍稍去寻找一下你的话,我就能再向前踏出一步了吧”

人生、二十七で死ねるならロックンロールは僕を救った

diff --git a/src/main.ts b/src/main.ts index a9130e9..ac8333e 100644 --- a/src/main.ts +++ b/src/main.ts @@ -10,7 +10,7 @@ import Tippy from 'tippy.js'; import 'tippy.js/dist/tippy.css'; import 'tippy.js/animations/scale.css'; -window.addEventListener("load", (_ev) => { +window.addEventListener("DOMContentLoaded", (_ev) => { new Typed(document.querySelector("description") ?? "description", { stringsElement: "#description-list", shuffle: true, diff --git a/src/styles/base.css b/src/styles/base.css index 46e468c..69c9d4e 100644 --- a/src/styles/base.css +++ b/src/styles/base.css @@ -1,160 +1,160 @@ :root { - --background-color: #fff; - --font-color: #000; - --font-color-lighter: rgb(87, 89, 88); - --font-size-main: 3.045rem; - --font-size-description: 1.245rem; - --lineheight-description: 1.845rem; - --box-color: rgba(242, 242, 242, 0.5); - --working-color: #137333; - --working-color-background: #e6f4ea; - --error-color-background: #fce8e6; - --error-color: #c5221f; - --working-with-error-color: #b05a00; - --working-with-error-color-background: #fef7e0; - --linear-start-color: #f37335; - --linear-end-color: #ff4200fc; - --icon-size: 48px; - --mask-color: rgba(255, 255, 255, 0.5); + --background-color: #fff; + --font-color: #000; + --font-color-lighter: rgb(87, 89, 88); + --font-size-main: 3.045rem; + --font-size-description: 1.245rem; + --lineheight-description: 1.845rem; + --box-color: rgba(242, 242, 242, 0.5); + --working-color: #137333; + --working-color-background: #e6f4ea; + --error-color-background: #fce8e6; + --error-color: #c5221f; + --working-with-error-color: #b05a00; + --working-with-error-color-background: #fef7e0; + --linear-start-color: #f37335; + --linear-end-color: #ff4200fc; + --icon-size: 48px; + --mask-color: rgba(255, 255, 255, 0.5); } h2, h1 { - font-family: "Google Sans", Roboto, Noto Sans SC, sans-serif; - background-image: linear-gradient( - 90deg, - var(--linear-start-color), - var(--linear-end-color) - ) !important; - color: transparent !important; - -webkit-background-clip: text; - background-clip: text; - -webkit-text-fill-color: transparent; + font-family: "Google Sans", Roboto, Noto Sans SC, sans-serif; + color: var(--linear-end-color); + background-image: linear-gradient( + 90deg, + var(--linear-start-color), + var(--linear-end-color) + ); + -webkit-background-clip: text; + background-clip: text; + -webkit-text-fill-color: transparent; } div, p { - font-family: Roboto, Noto Sans SC, sans-serif; - line-height: 140%; + font-family: Roboto, Noto Sans SC, sans-serif; + line-height: 140%; } body { - margin: 20vh calc(10vw - 0.5rem); - font-family: Roboto, Noto Sans SC, sans-serif; - color: var(--font-color); - background-color: var(--background-color); + margin: 20vh calc(10vw - 0.5rem); + font-family: Roboto, Noto Sans SC, sans-serif; + color: var(--font-color); + background-color: var(--background-color); } background > p { - visibility: hidden; - position: absolute; - top: 69vh; - right: 0; - color: var(--font-color-lighter); - font-size: calc(var(--font-size-description) - 0.4rem); + visibility: hidden; + position: absolute; + top: 69vh; + right: 0; + color: var(--font-color-lighter); + font-size: calc(var(--font-size-description) - 0.4rem); } background:hover > p { - visibility: visible; + visibility: visible; } a { - text-decoration: none; - color: #1e7dff; + text-decoration: none; + color: #1e7dff; } @media screen and (max-width: 480px) { - body { - margin: 20vh calc(4vw - 0.5rem); - } + body { + margin: 20vh calc(4vw - 0.5rem); + } - .toast { - margin: 0 2vw !important; - } + .toast { + margin: 0 2vw !important; + } - :root { - --font-size-main: 2.25rem; - --font-size-description: 1.045rem; - } + :root { + --font-size-main: 2.25rem; + --font-size-description: 1.045rem; + } } code { - font-family: Fira Mono, monospace; + font-family: Fira Mono, monospace; } none { - display: none; + display: none; } icon { - vertical-align: middle; - font-size: 48px; - font-family: "Material Icons Outlined"; - font-weight: normal; - font-style: normal; - line-height: 1; - letter-spacing: normal; - text-transform: none; - display: inline-block; - white-space: nowrap; - word-wrap: normal; - direction: ltr; - -webkit-font-feature-settings: "liga"; - font-feature-settings: "liga"; - -webkit-font-smoothing: antialiased; + vertical-align: middle; + font-size: 48px; + font-family: "Material Icons Outlined"; + font-weight: normal; + font-style: normal; + line-height: 1; + letter-spacing: normal; + text-transform: none; + display: inline-block; + white-space: nowrap; + word-wrap: normal; + direction: ltr; + -webkit-font-feature-settings: "liga"; + font-feature-settings: "liga"; + -webkit-font-smoothing: antialiased; } background { - top: 0px; - right: 0px; - float: right; - position: absolute; - width: 100%; - height: 95%; - max-height: 86vh; - background-size: cover; - background-image: url(/resources/background.webp), - url(/resources/background.png); - z-index: -1; - border-radius: 0 0 15px 15px; - filter: blur(0.2px); + top: 0px; + right: 0px; + float: right; + position: absolute; + width: 100%; + height: 95%; + max-height: 86vh; + background-size: cover; + background-image: url(/resources/background.webp), + url(/resources/background.png); + z-index: -1; + border-radius: 0 0 15px 15px; + filter: blur(0.2px); } @media (prefers-color-scheme: dark) { - :root { - --font-color: #e8eaed; - --font-color-lighter: #9aa0a6; - --background-color: #121212; - --box-color: rgb(40 40 40 / 73%); - --working-color-background: rgba(129, 201, 149, 0.24); - --error-color-background: rgba(242, 139, 130, 0.24); - --working-with-error-color-background: rgba(253, 214, 99, 0.24); - --working-color: #81c995; - --error-color: #f28b82; - --working-with-error-color: #fdd663; - --linear-start-color: #0c8cca; - --linear-end-color: #00bdff; - --mask-color: rgba(0, 0, 0, 0.5); - } + :root { + --font-color: #e8eaed; + --font-color-lighter: #9aa0a6; + --background-color: #121212; + --box-color: rgb(40 40 40 / 73%); + --working-color-background: rgba(129, 201, 149, 0.24); + --error-color-background: rgba(242, 139, 130, 0.24); + --working-with-error-color-background: rgba(253, 214, 99, 0.24); + --working-color: #81c995; + --error-color: #f28b82; + --working-with-error-color: #fdd663; + --linear-start-color: #0c8cca; + --linear-end-color: #00bdff; + --mask-color: rgba(0, 0, 0, 0.5); + } - background { - filter: brightness(50%); - } + background { + filter: brightness(50%); + } } .toast { - background: var(--mask-color); - border-radius: 8px; - display: block; - padding: 0.4rem; - width: 100%; + background: var(--mask-color); + border-radius: 8px; + display: block; + padding: 0.4rem; + width: 100%; - left: 0px; - position: absolute; - top: 8px; - right: 0px; - width: stretch; - margin: 0 5vw; + left: 0px; + position: absolute; + top: 8px; + right: 0px; + width: stretch; + margin: 0 5vw; - backdrop-filter: blur(15px); + backdrop-filter: blur(15px); } diff --git a/vercel.json b/vercel.json index f5912f8..51bae08 100644 --- a/vercel.json +++ b/vercel.json @@ -1,59 +1,68 @@ { - "routes": [ - { - "src": "/(.*)", - "headers": { - "Cache-Control": "s-maxage=1209600, max-age=86400, public", - "Strict-Transport-Security": "max-age=63072000; includeSubDomains; preload", - "Access-Control-Allow-Origin": "*", - "Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, OPTIONS", - "Access-Control-Allow-Headers": "Accept, Authorization, Cache-Control, Content-Type, DNT, If-Modified-Since, Keep-Alive, Origin, User-Agent, X-Requested-With, Token, x-access-token" - }, - "continue": true - }, - { - "src": "/goto/github", - "status": 302, - "headers": { - "Location": "https://github.com/186526" - } - }, - { - "src": "/goto/telegram", - "status": 302, - "headers": { - "Location": "https://t.me/real186526" - } - }, - { - "src": "/goto/blog", - "status": 302, - "headers": { - "Location": "https://blog.186526.xyz" - } - }, - { - "src": "/goto/email", - "status": 302, - "headers": { - "Location": "mailto:i@186526.xyz" - } - }, - { - "src": "/generate_204", - "status": 204, - "headers": { - "X-Powered-By": "SW2Express", - "Server": "sw=>express" - } - }, - { - "src": "/v2/(.*)", - "dest": "https://registry.186526.xyz/v2/$1" - }, - { - "src": "/shields.io/(.*)", - "dest": "https://img.shields.io/$1" - } - ] -} \ No newline at end of file + "routes": [ + { + "src": "/(.*)", + "headers": { + "Cache-Control": "s-maxage=1209600, max-age=86400, public", + "Strict-Transport-Security": "max-age=63072000; includeSubDomains; preload", + "Access-Control-Allow-Origin": "*", + "Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, OPTIONS", + "Access-Control-Allow-Headers": "Accept, Authorization, Cache-Control, Content-Type, DNT, If-Modified-Since, Keep-Alive, Origin, User-Agent, X-Requested-With, Token, x-access-token" + }, + "continue": true + }, + { "handle": "filesystem" }, + { + "src": "/goto/github", + "status": 302, + "headers": { + "Location": "https://github.com/186526" + } + }, + { + "src": "/goto/telegram", + "status": 302, + "headers": { + "Location": "https://t.me/real186526" + } + }, + { + "src": "/goto/blog", + "status": 302, + "headers": { + "Location": "https://blog.186526.xyz" + } + }, + { + "src": "/goto/email", + "status": 302, + "headers": { + "Location": "mailto:i@186526.xyz" + } + }, + { + "src": "/generate_204", + "status": 204, + "headers": { + "X-Powered-By": "SW2Express", + "Server": "sw=>express" + } + }, + { + "src": "/v2/(.*)", + "dest": "https://registry.186526.xyz/v2/$1" + }, + { + "src": "/shields.io/(.*)", + "dest": "https://img.shields.io/$1" + }, + { + "src": "/(.*)", + "status": 302, + "headers": { + "Location": "/?from=$1" + }, + "continue": false + } + ] +}