diff options
| author | Pinapelz <yukais@pinapelz.com> | 2026-05-27 00:53:18 -0700 |
|---|---|---|
| committer | Pinapelz <yukais@pinapelz.com> | 2026-05-27 00:55:26 -0700 |
| commit | 36e053f4f0a2f63c08f7c28b9492c067f1ca42bc (patch) | |
| tree | c28973073c8e26775ee4d18d1016df44afdfeceb /micro.pinapelz.moe/css/style.css | |
| parent | a01e0666fd66c367745cdaff76fcd6ea7568c31c (diff) | |
migrate pinapelz.moe -> pinapelz.com
Diffstat (limited to 'micro.pinapelz.moe/css/style.css')
| -rw-r--r-- | micro.pinapelz.moe/css/style.css | 296 |
1 files changed, 0 insertions, 296 deletions
diff --git a/micro.pinapelz.moe/css/style.css b/micro.pinapelz.moe/css/style.css deleted file mode 100644 index 4a930c1..0000000 --- a/micro.pinapelz.moe/css/style.css +++ /dev/null @@ -1,296 +0,0 @@ -html { - overflow-y: scroll; -} - -/* 🌸 PASTEL PALETTE */ -:root { - --bgcolor: #fff7fb; - --fontcolor: #3a2c3d; - - --linkcolor: #ff77c8; - --visitedcolor: #d76dff; - - --precolor: #4a3e4f; - --prebgcolor: #ffe6f4; - - --alertbgcolor: #ffe0f1; - --hrcolor: #ffbde6; - - --blockquotecolor: #ffe8f6; - --pcodecolor: #f7d2f0; - - --sitetitlecolor: #ff99dd; - --titlecolor: #c77fff; -} - -/* 🌙 DARK MODE PASTEL NIGHT */ -@media (prefers-color-scheme: dark) { - :root { - --bgcolor: #241b2b; - --fontcolor: #f8e8ff; - - --linkcolor: #ff9be9; - --visitedcolor: #e49cff; - - --precolor: #ffeefe; - --prebgcolor: #35263f; - - --alertbgcolor: #3f304a; - --hrcolor: #f4cfff; - - --blockquotecolor: #3a2b45; - --pcodecolor: #614c70; - - --sitetitlecolor: #ffd1f6; - --titlecolor: #d9a7ff; - } -} - -/* 🌸 TYPO + BASE */ -body { - max-width: 800px; - margin: 40px auto; - padding: 0 10px; - - font: 15px/1.6 "IBM Plex Mono", "Fira Mono", monospace; - color: var(--fontcolor); - background: var(--bgcolor); - - transition: background 0.3s ease, color 0.3s ease; -} - -/* 🌸 LINKS */ -a { - color: var(--linkcolor); - text-decoration: none; - transition: color 0.2s ease, text-shadow 0.2s ease; -} - -a:hover { - color: var(--visitedcolor); - text-shadow: 0 0 6px currentColor; -} - -a:visited { - color: var(--visitedcolor); -} - -/* 🌸 HEADERS */ -h1, h2, h3 { - line-height: 1.25; - color: var(--titlecolor); - margin-top: 1.6rem; - font-weight: 700; -} - -h1.site-title { - color: var(--sitetitlecolor); - text-align: center; - font-size: 2rem; - margin-bottom: 1rem; -} - -/* 🌸 PARAGRAPHS */ -p { - margin-top: 1.3rem; -} - -/* 🌸 INLINE CODE */ -p > code, -li > code { - color: var(--precolor); - background: var(--pcodecolor); - padding: 3px 5px; - border-radius: 6px; -} - -/* 🌸 FULL CODE */ -code { - color: var(--precolor); - background: var(--prebgcolor); - padding: 3px 5px; - border-radius: 6px; -} - -pre { - color: var(--precolor); - background: var(--prebgcolor); - padding: 24px; - overflow-x: auto; - border-radius: 12px; - box-shadow: 0 0 10px rgba(255, 180, 220, 0.25); -} - -/* 🌸 ARTICLES */ -article { - padding: 24px 0; -} - -/* 🌸 IMAGES */ -img { - display: block; - max-width: 100%; - height: auto; - margin: auto; - border-radius: 12px; -} - -/* cute avatar */ -.avatar { - width: 100px; - height: 100px; - border-radius: 50%; - box-shadow: 0 0 8px rgba(255, 140, 200, 0.4); - border: 4px solid var(--bgcolor); - transition: transform 0.3s ease; -} - -/* Banner with overlay avatar */ -.banner { - position: relative; - margin-bottom: 1rem; -} - -.banner img:first-child { - width: 100%; - max-width: 600px; - height: auto; - border-radius: 8px; - opacity: 0.85; -} - -.banner .avatar { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - z-index: 2; - width: 120px; - height: 120px; - box-shadow: 0 0 20px rgba(255, 140, 200, 0.6); -} - -.banner .avatar:hover { - transform: translate(-50%, -50%) scale(1.05); -} - -/* 🌸 ALERTS */ -.alert { - color: var(--fontcolor); - background: var(--alertbgcolor); - padding: 20px; - border-radius: 12px; - box-shadow: 0 0 12px rgba(255, 180, 220, 0.3); - overflow-x: auto; -} - -/* 🌸 NEXT/PREV */ -.article-nextprev { - display: flex; - flex-flow: row wrap-reverse; - justify-content: space-between; -} - -/* 🌸 DIVIDERS */ -hr { - margin: 35px 33% 15px; - border-color: var(--hrcolor); - border-width: 3px; - border-radius: 3px; -} - -hr.small { - margin: 35px 44% 25px; - border: 1px dashed var(--hrcolor); -} - -/* 🌸 BLOCKQUOTE */ -blockquote { - background: var(--blockquotecolor); - margin: 1.2rem 0; - padding: 12px 20px; - border-radius: 12px; - box-shadow: 0 0 8px rgba(255, 200, 240, 0.25); - border-left: 4px solid var(--hrcolor); -} - -/* 🌸 LISTS */ -ol, ul { - padding-left: 1.1rem; -} - -ol > li, -ul > li { - margin-bottom: 0.8rem; -} - -ul > li { - list-style-type: disclosure-closed; -} - -/* 🌸 TABLES */ -table { - text-align: left; - border: 1px solid var(--hrcolor); - border-radius: 10px; - overflow: hidden; -} - -thead th, tfoot th, tfoot td { - padding: 6px 10px; - background-color: var(--alertbgcolor); - color: var(--titlecolor); -} - -td { - padding: 8px 10px; -} - -tbody tr:nth-child(even) { - background-color: var(--alertbgcolor); -} - -/* 🌸 RESPONSIVE MOE */ -@media all and (max-width: 800px) { - .bio-card .bio { - justify-content: space-around; - flex-direction: column; - } - .bio-card .bio > img { - align-self: center; - margin: auto; - } - .bio-card .bio > p { - align-self: center; - text-align: center; - } - - /* Smaller avatar on mobile */ - .banner .avatar { - width: 90px; - height: 90px; - } - - .banner img:first-child { - border-radius: 6px; - } -} - -/* PRINT */ -@media print { - a, a:visited { - color: #000; - text-decoration: none; - } - a::after { - content: " (" attr(href) ") "; - } - nav, footer, hr, .noprint { - display: none !important; - } - pre, blockquote, code { - background: #fff; - border: none; - box-shadow: none; - } -} |
