diff options
author | crupest <crupest@outlook.com> | 2024-11-11 01:12:29 +0800 |
---|---|---|
committer | Yuqian Yang <crupest@crupest.life> | 2024-12-19 21:42:01 +0800 |
commit | f9aa02ec1a4c24e80a206857d4f68198bb027bb4 (patch) | |
tree | 5994f0a62733b13f9f330e3515260ae20dc4a0bd /docker/crupest-nginx/sites/www/src/style.css | |
parent | 7b4d49e4bbdff6ddf1f8f7e937130e700024d5e9 (diff) | |
download | crupest-f9aa02ec1a4c24e80a206857d4f68198bb027bb4.tar.gz crupest-f9aa02ec1a4c24e80a206857d4f68198bb027bb4.tar.bz2 crupest-f9aa02ec1a4c24e80a206857d4f68198bb027bb4.zip |
HALF WORK: 2024.12.19
Re-organize file structure.
Diffstat (limited to 'docker/crupest-nginx/sites/www/src/style.css')
-rw-r--r-- | docker/crupest-nginx/sites/www/src/style.css | 185 |
1 files changed, 0 insertions, 185 deletions
diff --git a/docker/crupest-nginx/sites/www/src/style.css b/docker/crupest-nginx/sites/www/src/style.css deleted file mode 100644 index 1f9c9ed..0000000 --- a/docker/crupest-nginx/sites/www/src/style.css +++ /dev/null @@ -1,185 +0,0 @@ -html { - width: 100%; - line-height: 1.5; - font-family: ui-sans-serif; -} - -body { - width: 100%; - margin: 0; - box-sizing: border-box; -} - -a.mono { - font-family: ui-monospace; -} - -.h-note { - font-size: 0.6em; - color: gray; -} - -@keyframes article-enter { - from { - opacity: 0; - transform: translateY(100px); - } - - to { - opacity: 1; - transform: translateY(0); - } -} - -:root { - --main-article-horizontal-padding: 1em; - --main-article-horizontal-margin-shrink: -1em; - - --im-me: deepskyblue; - --im-happy: dodgerblue; - --im-angry: orangered; - --im-good: hsl(120, 85%, 85%); - --im-active: hsl(20, 85%, 85%); -} - -@media (min-width: 576px) { - :root { - --main-article-horizontal-padding: 2em; - --main-article-horizontal-margin-shrink: -2em; - } -} - -#main-article { - padding: 0 var(--main-article-horizontal-padding); - animation: article-enter 1s; -} - -#title { - font-size: 2em; -} - -@keyframes title-name-enter { - from { - background-color: white; - } - - to { - background-color: var(--im-me); - } -} - -#title-name { - font-family: ui-monospace; - border-radius: 8px; - background-color: white; - animation: title-name-enter 3s 2s forwards; -} - -@keyframes avatar-enter { - from { - opacity: 0; - transform: translateX(calc(100% + var(--main-article-horizontal-padding))); - } - - to { - opacity: 1; - transform: translateX(0); - } -} - -#avatar { - float: right; - transform: translateX(calc(100% + var(--main-article-horizontal-padding))); - animation: avatar-enter 0.5s 1s forwards; -} - -.slogan-container { - width: 100%; - position: fixed; - z-index: 1; - top: 0; -} - -.slogan { - width: 100%; - padding: 0.5em 1em; - text-align: center; - box-sizing: border-box; - position: absolute; - transform: translateY(-100%); - transition: transform 1s; -} - -.slogan.happy { - background-color: var(--im-happy); -} - -.slogan.angry { - background-color: var(--im-angry); -} - -.slogan-container[data-slogan-emotion="happy"] .slogan.happy { - transform: translateY(0); -} - -.slogan-container[data-slogan-emotion="angry"] .slogan.angry { - transform: translateY(0); -} - -.slogan-text { - display: inline-block; - text-align: initial; - color: white; - font-size: 1.2em; -} - -#todo-container { - list-style: none; - margin-block: 0; - padding-inline: 0; -} - -@keyframes todo-enter { - from { - opacity: 0; - transform: translateX(-100%); - } - - to { - opacity: 1; - transform: translateX(0); - } -} - -#todo-container li { - margin: 0 var(--main-article-horizontal-margin-shrink); - padding: 0.25em 3em; - transform: translateX(-100%); - animation: todo-enter 1s forwards; -} - -#todo-container li[data-status="closed"] { - background-color: var(--im-good); -} - -#todo-container li[data-status="open"] { - background-color: var(--im-active); -} - -.friend-link { - display: inline-block; -} - -.friend-img { - display: block; - width: 80px; - height: 80px; - object-fit: cover; - border-radius: 50%; -} - -.friend-name { - display: block; - text-align: center; - font-size: 1.2em; -} |