diff --git a/style.css b/style.css index 25f321f..d62f53e 100644 --- a/style.css +++ b/style.css @@ -1840,3 +1840,169 @@ html[data-theme="dark"][data-design-theme="animal-crossing"] .beian a:hover { transform: none !important; } } + +/* ─── Minecraft — Stone & Cave / Overworld Day ──────────────── */ +html[data-design-theme="minecraft"] { + color-scheme: dark; + + --accent: #5aaa3a; + --accent-rgb: 90, 170, 58; + --accent-2: #3d8a2a; + --accent-3: #2a6e1a; + --accent-secondary-rgb: 91, 191, 232; + + --page-gradient: #1a1a1a; + --page-texture: none; + --title-gradient: linear-gradient(135deg, #5bbfe8 0%, #5aaa3a 100%); + + --control-bg: rgba(62, 62, 62, 0.92); + --control-border: #1a1a1a; + --control-inset: rgba(255, 255, 255, 0.2); + --control-fg: #f0f0f0; +} + +html[data-theme="dark"][data-design-theme="minecraft"] { + color-scheme: dark; + + --accent: #5aaa3a; + --accent-rgb: 90, 170, 58; + --accent-2: #3d8a2a; + --accent-3: #2a6e1a; + --accent-secondary-rgb: 91, 191, 232; + + --page-gradient: #1a1a1a; + --page-texture: none; + --title-gradient: linear-gradient(135deg, #5bbfe8 0%, #5aaa3a 100%); + + --control-bg: rgba(62, 62, 62, 0.92); + --control-border: #1a1a1a; + --control-inset: rgba(255, 255, 255, 0.2); + --control-fg: #f0f0f0; +} + +html[data-design-theme="minecraft"] body { + font-family: ui-monospace, "Courier New", Courier, monospace; + letter-spacing: 0.04em; + color: #f0f0f0; +} + +html[data-theme="dark"][data-design-theme="minecraft"] body { + color: #f0f0f0; +} + +html[data-design-theme="minecraft"] body::before { + background-image: + linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px), + linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px); + background-size: 16px 16px; +} + +html[data-design-theme="minecraft"] .design-theme-button, +html[data-design-theme="minecraft"] .theme-toggle { + border-radius: 0; + backdrop-filter: none; + -webkit-backdrop-filter: none; + box-shadow: + inset 2px 2px 0 rgba(255, 255, 255, 0.25), + inset -2px -2px 0 rgba(0, 0, 0, 0.5); + transition: all 0.1s steps(2, end); +} + +html[data-design-theme="minecraft"] .design-theme-button:hover, +html[data-design-theme="minecraft"] .theme-toggle:hover { + background: rgba(82, 82, 82, 0.95); + box-shadow: + inset 2px 2px 0 rgba(255, 255, 255, 0.35), + inset -2px -2px 0 rgba(0, 0, 0, 0.4); + transform: none; + border-color: rgba(var(--accent-rgb), 0.7); +} + +html[data-design-theme="minecraft"] .design-theme-button:active, +html[data-design-theme="minecraft"] .theme-toggle:active { + box-shadow: + inset 2px 2px 0 rgba(0, 0, 0, 0.4), + inset -2px -2px 0 rgba(255, 255, 255, 0.12); +} + +html[data-design-theme="minecraft"] .design-theme-list { + border-radius: 0; + backdrop-filter: none; + -webkit-backdrop-filter: none; + background: rgba(30, 30, 30, 0.96); + border: 2px solid #111111; + box-shadow: + inset 2px 2px 0 rgba(255, 255, 255, 0.1), + inset -2px -2px 0 rgba(0, 0, 0, 0.6); +} + +html[data-design-theme="minecraft"] .design-theme-list [role="option"] { + border-radius: 0; +} + +html[data-design-theme="minecraft"] + .design-theme-list + [role="option"]:hover, +html[data-design-theme="minecraft"] + .design-theme-list + [role="option"][aria-selected="true"] { + background: rgba(var(--accent-rgb), 0.25); + color: var(--control-fg); +} + +html[data-theme="dark"][data-design-theme="minecraft"] .card { + background: #3c3c3c; + border: 2px solid #111111; + border-radius: 0; + backdrop-filter: none; + -webkit-backdrop-filter: none; + box-shadow: + inset 2px 2px 0 rgba(255, 255, 255, 0.2), + inset -2px -2px 0 rgba(0, 0, 0, 0.5); + transition: all 0.1s steps(2, end); + transform: none; +} + +html[data-theme="dark"][data-design-theme="minecraft"] .card::before { + display: none; +} + +html[data-theme="dark"][data-design-theme="minecraft"] .card.pin { + background: #454545; +} + +html[data-theme="dark"][data-design-theme="minecraft"] .card h2 { + color: #f0f0f0; +} + +html[data-theme="dark"][data-design-theme="minecraft"] .card p { + color: #c8c8c8; +} + +html[data-theme="dark"][data-design-theme="minecraft"] .card:hover, +html[data-theme="dark"][data-design-theme="minecraft"] .card:focus { + background: #484848; + transform: none; + border-color: #5aaa3a; + box-shadow: + inset 2px 2px 0 rgba(0, 0, 0, 0.35), + inset -2px -2px 0 rgba(255, 255, 255, 0.12); +} + +html[data-theme="dark"][data-design-theme="minecraft"] .card:hover h2, +html[data-theme="dark"][data-design-theme="minecraft"] .card:focus h2 { + color: #5aaa3a; +} + +html[data-theme="dark"][data-design-theme="minecraft"] .card:hover p, +html[data-theme="dark"][data-design-theme="minecraft"] .card:focus p { + color: #e0e0e0; +} + +html[data-theme="dark"][data-design-theme="minecraft"] .beian a { + color: #c8c8c8; +} + +html[data-theme="dark"][data-design-theme="minecraft"] .beian a:hover { + color: #5aaa3a; +}