style(web): refine Frutiger Aero liquid glass to clear 3D bevel-rimmed glass (v2.2.18)
This commit is contained in:
parent
12e717448b
commit
ee745a3619
7 changed files with 185 additions and 144 deletions
|
|
@ -56,7 +56,7 @@ frosted-glass **web** site, and an alternate KDE/Plasma **desktop simulation**
|
|||
utilities in the components (Tailwind is present via PostCSS but the look is
|
||||
hand-written CSS).
|
||||
- Path alias: `@/*` → `src/*`.
|
||||
- Version: `2.2.17` (see `package.json`).
|
||||
- Version: `2.2.18` (see `package.json`).
|
||||
|
||||
### Scripts
|
||||
```bash
|
||||
|
|
@ -179,8 +179,8 @@ Themes: `web` = default frosted-glass website (sidebar + content, light/dark),
|
|||
desktop mode is untouched): the icon swaps to `public/freezmo_aero.png`, the
|
||||
website background switches to `public/frutigerbackground.png`, floating glossy
|
||||
bubbles (`.web-aero-bubbles` / `.web-aero-bubble`) rise across the backdrop, and
|
||||
all `.glass` panels and interactive controls become refractive liquid glass /
|
||||
gel buttons. The two remaining feature panels (`.web-split`) stretch
|
||||
all `.glass` panels and interactive controls become crystal-clear 3D bevel-rimmed
|
||||
liquid glass. The two remaining feature panels (`.web-split`) stretch
|
||||
to equal height and share a fixed `16 / 10` `.fw` window (the `FeatureWindow`
|
||||
component) — decorative, **asset-free CSS mock-ups** rather than screenshots:
|
||||
Revival Inc. is a little necromancy game scene (night sky, moon, tombstones,
|
||||
|
|
|
|||
|
|
@ -46,8 +46,8 @@ more.
|
|||
- **Frutiger Aero easter egg (web shell)** — clicking the Freezmo app icon swaps it to
|
||||
`freezmo_aero.png` and transforms the web shell into a Frutiger Aero theme:
|
||||
`frutigerbackground.png` as the full-screen backdrop, floating glossy water/soap bubbles
|
||||
across the viewport, and refractive liquid-glass panels and gel buttons (leaving the
|
||||
desktop mode untouched).
|
||||
across the viewport, and crystal-clear 3D bevel-rimmed liquid-glass panels and buttons
|
||||
(leaving the desktop mode untouched).
|
||||
- **Draggable desktop icons** — free placement that snaps to a measured grid, one icon per
|
||||
cell, with a follow-the-cursor drag ghost. Icons shrink on cramped viewports so they never
|
||||
collide.
|
||||
|
|
@ -92,7 +92,7 @@ more.
|
|||
icons (`public/freezmo.png`, `public/freezmo_aero.png`), the Frutiger Aero wallpaper
|
||||
(`public/frutigerbackground.png`), the Joker easter egg and the Gentoo mark; all cards,
|
||||
feature/app previews and the desktop wallpaper are CSS.
|
||||
- **Version:** `2.2.17` (see `package.json`)
|
||||
- **Version:** `2.2.18` (see `package.json`)
|
||||
- **Dependencies:** `npm audit` reports **0 vulnerabilities**. `next` is kept at a patched
|
||||
release (`>=16.3.6`) for the `next/og` RCE, and `brace-expansion` is force-upgraded via
|
||||
`overrides`. `braces` (a transitive ESLint/`fast-glob` dependency) has **no upstream fix**,
|
||||
|
|
|
|||
|
|
@ -24,9 +24,9 @@
|
|||
"semantic_hash": "03388a201be8750ddcddb14dfbc34411"
|
||||
},
|
||||
"package.json": {
|
||||
"mtime": 1792099231.5153382,
|
||||
"seen": 1792099263.7669873,
|
||||
"ast_hash": "bb5daf478e875b6c5d5d2ec7def9b34b",
|
||||
"mtime": 1792099681.7033262,
|
||||
"seen": 1792099697.2859526,
|
||||
"ast_hash": "54ab7827bcc73a489e87842b63dc3ff2",
|
||||
"semantic_hash": ""
|
||||
},
|
||||
"postcss.config.mjs": {
|
||||
|
|
@ -114,9 +114,9 @@
|
|||
"semantic_hash": "20e25c727b4bb982e5a22d65efece143"
|
||||
},
|
||||
"src/app/components/WebLayout.tsx": {
|
||||
"mtime": 1792099104.6213684,
|
||||
"seen": 1792099263.767026,
|
||||
"ast_hash": "50f87afc8c92b67d8e83deaf0db4f4a6",
|
||||
"mtime": 1792099684.666372,
|
||||
"seen": 1792099697.2860098,
|
||||
"ast_hash": "c1ce20c375fe65ec25daa5ee3570b159",
|
||||
"semantic_hash": ""
|
||||
},
|
||||
"src/app/components/WinWindow.tsx": {
|
||||
|
|
@ -240,9 +240,9 @@
|
|||
"semantic_hash": "b81dea2175efa2b0b6c38451ab5a4bbd"
|
||||
},
|
||||
"README.md": {
|
||||
"mtime": 1792099238.3164437,
|
||||
"seen": 1792099263.7670863,
|
||||
"ast_hash": "3109d3679249509421774e43bea54df6",
|
||||
"mtime": 1792099686.846406,
|
||||
"seen": 1792099697.286089,
|
||||
"ast_hash": "56de572329691e8f09e3d591315d7f75",
|
||||
"semantic_hash": ""
|
||||
},
|
||||
"public/llms.txt": {
|
||||
|
|
@ -366,9 +366,9 @@
|
|||
"semantic_hash": "6f69e16823f10d9c7af1625eff2b32e8"
|
||||
},
|
||||
"AGENTS.md": {
|
||||
"mtime": 1792099254.9847023,
|
||||
"seen": 1792099263.7670813,
|
||||
"ast_hash": "401ce39abe80415b6a57cc5e55684160",
|
||||
"mtime": 1792099688.789436,
|
||||
"seen": 1792099697.2860813,
|
||||
"ast_hash": "b94f2124b7e2b2e682234e9fc12e0bd2",
|
||||
"semantic_hash": ""
|
||||
},
|
||||
"public/freezmo_aero.png": {
|
||||
|
|
|
|||
4
package-lock.json
generated
4
package-lock.json
generated
|
|
@ -1,12 +1,12 @@
|
|||
{
|
||||
"name": "dvorakmortonxd",
|
||||
"version": "2.2.17",
|
||||
"version": "2.2.18",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "dvorakmortonxd",
|
||||
"version": "2.2.17",
|
||||
"version": "2.2.18",
|
||||
"dependencies": {
|
||||
"next": "^16.3.8",
|
||||
"react": "^19.3.0",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "dvorakmortonxd",
|
||||
"version": "2.2.17",
|
||||
"version": "2.2.18",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "node scripts/dev-server.mjs",
|
||||
|
|
|
|||
|
|
@ -421,7 +421,7 @@ export default function WebLayout() {
|
|||
</Section>
|
||||
|
||||
<footer className="web-footer glass">
|
||||
<span className="web-footer-label">v2.2.17</span>
|
||||
<span className="web-footer-label">v2.2.18</span>
|
||||
© 2025-2026 Martin Dvořák. All rights reserved (not really I dont care, just
|
||||
follow the GPL3.0 License)
|
||||
</footer>
|
||||
|
|
|
|||
281
src/app/web.css
281
src/app/web.css
|
|
@ -1954,65 +1954,76 @@ html[data-theme="web"][data-scheme="dark"] .heatmap-legend-cell[data-level="4"]
|
|||
============================================================ */
|
||||
html[data-theme="web"][data-aero="true"],
|
||||
html[data-theme="web"][data-scheme="dark"][data-aero="true"] {
|
||||
--web-accent: #0078e8;
|
||||
--web-accent-2: #00c49a;
|
||||
--web-accent: #baf2ff;
|
||||
--web-accent-2: #7ce8ff;
|
||||
--web-page: #0a74cc;
|
||||
--web-ink: #03223a;
|
||||
--web-muted: #0d456c;
|
||||
--web-ink: #ffffff;
|
||||
--web-muted: rgba(236, 248, 255, 0.86);
|
||||
|
||||
--glass-hi: rgba(255, 255, 255, 0.72);
|
||||
--glass-lo: rgba(185, 238, 255, 0.34);
|
||||
--glass-border: rgba(255, 255, 255, 0.9);
|
||||
--glass-inset: rgba(255, 255, 255, 0.98);
|
||||
--pill-bg: rgba(230, 250, 255, 0.9);
|
||||
--glass-hi: rgba(255, 255, 255, 0.22);
|
||||
--glass-lo: rgba(255, 255, 255, 0.06);
|
||||
--glass-border: rgba(255, 255, 255, 0.78);
|
||||
--glass-inset: rgba(255, 255, 255, 0.95);
|
||||
--pill-bg: rgba(255, 255, 255, 0.16);
|
||||
--glass-shadow:
|
||||
0 24px 50px -18px rgba(0, 42, 92, 0.58),
|
||||
0 4px 16px rgba(0, 170, 255, 0.28);
|
||||
--hover: rgba(0, 168, 255, 0.22);
|
||||
--accent-soft: rgba(0, 168, 255, 0.45);
|
||||
inset 0 1.5px 1px rgba(255, 255, 255, 0.95),
|
||||
inset 0 -1.5px 1px rgba(255, 255, 255, 0.7),
|
||||
inset 1.5px 0 1px rgba(255, 255, 255, 0.5),
|
||||
inset -1.5px 0 1px rgba(255, 255, 255, 0.5),
|
||||
inset 0 4px 12px rgba(255, 255, 255, 0.26),
|
||||
inset 0 -4px 12px rgba(255, 255, 255, 0.18),
|
||||
inset 0 0 22px rgba(255, 255, 255, 0.12),
|
||||
0 14px 34px -10px rgba(0, 22, 56, 0.42),
|
||||
0 2px 8px rgba(0, 18, 48, 0.22);
|
||||
--hover: rgba(255, 255, 255, 0.18);
|
||||
--accent-soft: rgba(255, 255, 255, 0.45);
|
||||
--accent-line: rgba(255, 255, 255, 0.95);
|
||||
|
||||
--btn-bg: rgba(255, 255, 255, 0.68);
|
||||
--btn-bg-hi: rgba(255, 255, 255, 0.92);
|
||||
--btn-border: rgba(255, 255, 255, 0.92);
|
||||
--btn-bg: rgba(255, 255, 255, 0.1);
|
||||
--btn-bg-hi: rgba(255, 255, 255, 0.22);
|
||||
--btn-border: rgba(255, 255, 255, 0.8);
|
||||
--btn-shadow:
|
||||
0 10px 22px -10px rgba(0, 55, 110, 0.45),
|
||||
inset 0 1.5px 0 rgba(255, 255, 255, 0.98),
|
||||
inset 0 -2px 6px rgba(0, 165, 245, 0.28);
|
||||
inset 0 1.5px 1px rgba(255, 255, 255, 0.95),
|
||||
inset 0 -1.5px 1px rgba(255, 255, 255, 0.68),
|
||||
inset 1px 0 1px rgba(255, 255, 255, 0.45),
|
||||
inset -1px 0 1px rgba(255, 255, 255, 0.45),
|
||||
inset 0 3px 8px rgba(255, 255, 255, 0.24),
|
||||
inset 0 -3px 8px rgba(255, 255, 255, 0.14),
|
||||
0 8px 20px -8px rgba(0, 22, 56, 0.36);
|
||||
|
||||
--fg: var(--web-ink);
|
||||
--white: var(--web-ink);
|
||||
--gray: var(--web-muted);
|
||||
--bg: var(--web-page);
|
||||
--bg-hard: rgba(255, 255, 255, 0.42);
|
||||
--bg-hard: rgba(255, 255, 255, 0.16);
|
||||
--accent: var(--web-accent);
|
||||
--accent2: var(--web-accent-2);
|
||||
--accent3: var(--web-accent);
|
||||
--green: #0ea54a;
|
||||
--aqua: #009eb8;
|
||||
--blue: #006ee6;
|
||||
--purple: #6d4aff;
|
||||
--red: #e11d48;
|
||||
--darkpink: #d92682;
|
||||
--green: #7effb2;
|
||||
--aqua: #7ce8ff;
|
||||
--blue: #9ed4ff;
|
||||
--purple: #d8b4fe;
|
||||
--red: #fda4af;
|
||||
--darkpink: #f9a8d4;
|
||||
|
||||
--index-line: rgba(255, 255, 255, 0.55);
|
||||
--status-finished: #0b7a38;
|
||||
--status-live: #005ec4;
|
||||
--status-wip: #9a4700;
|
||||
--status-unfinished: #a83205;
|
||||
--status-discontinued: #a81313;
|
||||
--status-forgotten: #2f516c;
|
||||
--index-line: rgba(255, 255, 255, 0.28);
|
||||
--status-finished: #86efac;
|
||||
--status-live: #93c5fd;
|
||||
--status-wip: #fde047;
|
||||
--status-unfinished: #fdba74;
|
||||
--status-discontinued: #fca5a5;
|
||||
--status-forgotten: #e2e8f0;
|
||||
}
|
||||
|
||||
html[data-theme="web"][data-aero="true"] body {
|
||||
background: #0a74cc url("/frutigerbackground.png") center / cover fixed no-repeat;
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.55);
|
||||
text-shadow: 0 1px 3px rgba(0, 24, 58, 0.48);
|
||||
}
|
||||
|
||||
html[data-theme="web"][data-aero="true"] .web-bg {
|
||||
background:
|
||||
radial-gradient(56rem 38rem at 86% 6%, rgba(255, 255, 255, 0.42), transparent 65%),
|
||||
radial-gradient(50rem 40rem at 14% 92%, rgba(80, 255, 190, 0.24), transparent 68%),
|
||||
radial-gradient(56rem 38rem at 86% 6%, rgba(255, 255, 255, 0.28), transparent 65%),
|
||||
radial-gradient(50rem 40rem at 14% 92%, rgba(80, 255, 190, 0.18), transparent 68%),
|
||||
url("/frutigerbackground.png") center / cover no-repeat;
|
||||
}
|
||||
|
||||
|
|
@ -2101,56 +2112,56 @@ html[data-theme="web"][data-aero="true"] .web-bg {
|
|||
}
|
||||
}
|
||||
|
||||
/* ---------- Liquid glass panels & glossy gel surfaces ---------- */
|
||||
html[data-theme="web"][data-aero="true"] .glass {
|
||||
background-color: rgba(210, 245, 255, 0.36);
|
||||
background-image: linear-gradient(
|
||||
180deg,
|
||||
rgba(255, 255, 255, 0.82) 0%,
|
||||
rgba(240, 252, 255, 0.52) 44%,
|
||||
rgba(170, 232, 255, 0.34) 46%,
|
||||
rgba(130, 220, 255, 0.46) 86%,
|
||||
rgba(180, 255, 235, 0.56) 100%
|
||||
);
|
||||
border: 1.5px solid rgba(255, 255, 255, 0.92);
|
||||
box-shadow:
|
||||
0 24px 50px -18px rgba(0, 42, 92, 0.58),
|
||||
0 3px 14px rgba(0, 175, 255, 0.3),
|
||||
inset 0 2px 1px rgba(255, 255, 255, 1),
|
||||
inset 0 18px 28px rgba(255, 255, 255, 0.45),
|
||||
inset 0 -4px 12px rgba(0, 175, 255, 0.34);
|
||||
-webkit-backdrop-filter: blur(16px) saturate(200%) brightness(1.06);
|
||||
backdrop-filter: blur(16px) saturate(200%) brightness(1.06);
|
||||
}
|
||||
|
||||
/* ---------- Crystal-clear 3D bevel-rimmed liquid glass ---------- */
|
||||
html[data-theme="web"][data-aero="true"] .glass,
|
||||
html[data-theme="web"][data-aero="true"] .web-freezmo {
|
||||
background:
|
||||
radial-gradient(60% 90% at 12% 0%, rgba(255, 255, 255, 0.65), transparent 62%),
|
||||
radial-gradient(52% 82% at 94% 14%, rgba(0, 215, 255, 0.42), transparent 60%),
|
||||
radial-gradient(48% 72% at 76% 100%, rgba(70, 255, 180, 0.38), transparent 64%),
|
||||
linear-gradient(
|
||||
180deg,
|
||||
rgba(255, 255, 255, 0.85) 0%,
|
||||
rgba(220, 248, 255, 0.52) 48%,
|
||||
rgba(145, 225, 255, 0.44) 50%,
|
||||
rgba(175, 255, 230, 0.58) 100%
|
||||
);
|
||||
135deg,
|
||||
rgba(255, 255, 255, 0.24) 0%,
|
||||
rgba(255, 255, 255, 0.06) 40%,
|
||||
rgba(255, 255, 255, 0.02) 62%,
|
||||
rgba(255, 255, 255, 0.18) 100%
|
||||
)
|
||||
padding-box,
|
||||
linear-gradient(
|
||||
135deg,
|
||||
rgba(255, 255, 255, 0.98) 0%,
|
||||
rgba(255, 255, 255, 0.26) 28%,
|
||||
rgba(255, 255, 255, 0.9) 50%,
|
||||
rgba(255, 255, 255, 0.22) 74%,
|
||||
rgba(255, 255, 255, 0.98) 100%
|
||||
)
|
||||
border-box;
|
||||
border: 1.5px solid transparent;
|
||||
box-shadow:
|
||||
inset 0 1.5px 1px rgba(255, 255, 255, 0.95),
|
||||
inset 0 -1.5px 1px rgba(255, 255, 255, 0.72),
|
||||
inset 1.5px 0 1px rgba(255, 255, 255, 0.5),
|
||||
inset -1.5px 0 1px rgba(255, 255, 255, 0.5),
|
||||
inset 0 5px 14px rgba(255, 255, 255, 0.28),
|
||||
inset 0 -5px 14px rgba(255, 255, 255, 0.18),
|
||||
inset 0 0 24px rgba(255, 255, 255, 0.12),
|
||||
0 16px 36px -12px rgba(0, 22, 56, 0.42),
|
||||
0 2px 8px rgba(0, 18, 48, 0.22);
|
||||
-webkit-backdrop-filter: blur(12px) saturate(145%);
|
||||
backdrop-filter: blur(12px) saturate(145%);
|
||||
}
|
||||
|
||||
html[data-theme="web"][data-aero="true"] .web-freezmo-orb {
|
||||
border: 1.2px solid rgba(255, 255, 255, 0.9);
|
||||
background: radial-gradient(
|
||||
circle at 30% 26%,
|
||||
rgba(255, 255, 255, 0.98) 0%,
|
||||
rgba(255, 255, 255, 0.45) 16%,
|
||||
rgba(130, 235, 255, 0.2) 52%,
|
||||
rgba(0, 195, 255, 0.42) 82%,
|
||||
rgba(160, 255, 220, 0.78) 100%
|
||||
rgba(255, 255, 255, 0.96) 0%,
|
||||
rgba(255, 255, 255, 0.35) 16%,
|
||||
rgba(255, 255, 255, 0.06) 52%,
|
||||
rgba(255, 255, 255, 0.25) 82%,
|
||||
rgba(255, 255, 255, 0.82) 100%
|
||||
);
|
||||
box-shadow:
|
||||
inset 0 -8px 16px rgba(0, 180, 255, 0.4),
|
||||
inset 0 6px 12px rgba(255, 255, 255, 0.95),
|
||||
0 0 36px rgba(100, 230, 255, 0.6);
|
||||
inset 0 -6px 14px rgba(255, 255, 255, 0.35),
|
||||
inset 0 6px 12px rgba(255, 255, 255, 0.92),
|
||||
0 0 28px rgba(255, 255, 255, 0.45);
|
||||
}
|
||||
|
||||
html[data-theme="web"][data-aero="true"] .web-ctl,
|
||||
|
|
@ -2160,78 +2171,108 @@ html[data-theme="web"][data-aero="true"] .gym-item,
|
|||
html[data-theme="web"][data-aero="true"] .contribution-entry,
|
||||
html[data-theme="web"][data-aero="true"] .index-list,
|
||||
html[data-theme="web"][data-aero="true"] .heatmap-container,
|
||||
html[data-theme="web"][data-aero="true"] .web-freezmo-ghost {
|
||||
background-image: linear-gradient(
|
||||
180deg,
|
||||
rgba(255, 255, 255, 0.92) 0%,
|
||||
rgba(230, 250, 255, 0.68) 49%,
|
||||
rgba(168, 230, 255, 0.52) 51%,
|
||||
rgba(215, 250, 255, 0.82) 100%
|
||||
);
|
||||
border-color: rgba(255, 255, 255, 0.94);
|
||||
html[data-theme="web"][data-aero="true"] .web-freezmo-cta,
|
||||
html[data-theme="web"][data-aero="true"] .web-freezmo-ghost,
|
||||
html[data-theme="web"][data-aero="true"] .web-freezmo-badge,
|
||||
html[data-theme="web"][data-aero="true"] .web-switch,
|
||||
html[data-theme="web"][data-aero="true"] .web-footer-label,
|
||||
html[data-theme="web"][data-aero="true"] .fw,
|
||||
html[data-theme="web"][data-aero="true"] .fw-url,
|
||||
html[data-theme="web"][data-aero="true"] .fw-search,
|
||||
html[data-theme="web"][data-aero="true"] .fw-tab {
|
||||
background:
|
||||
linear-gradient(
|
||||
135deg,
|
||||
rgba(255, 255, 255, 0.26) 0%,
|
||||
rgba(255, 255, 255, 0.07) 42%,
|
||||
rgba(255, 255, 255, 0.03) 64%,
|
||||
rgba(255, 255, 255, 0.2) 100%
|
||||
)
|
||||
padding-box,
|
||||
linear-gradient(
|
||||
135deg,
|
||||
rgba(255, 255, 255, 0.98) 0%,
|
||||
rgba(255, 255, 255, 0.28) 30%,
|
||||
rgba(255, 255, 255, 0.9) 50%,
|
||||
rgba(255, 255, 255, 0.24) 74%,
|
||||
rgba(255, 255, 255, 0.98) 100%
|
||||
)
|
||||
border-box;
|
||||
border: 1.5px solid transparent;
|
||||
box-shadow:
|
||||
0 10px 22px -12px rgba(0, 52, 105, 0.48),
|
||||
inset 0 1.5px 0 rgba(255, 255, 255, 1),
|
||||
inset 0 -2px 6px rgba(0, 170, 255, 0.28);
|
||||
inset 0 1.5px 1px rgba(255, 255, 255, 0.95),
|
||||
inset 0 -1.5px 1px rgba(255, 255, 255, 0.7),
|
||||
inset 1px 0 1px rgba(255, 255, 255, 0.48),
|
||||
inset -1px 0 1px rgba(255, 255, 255, 0.48),
|
||||
inset 0 4px 10px rgba(255, 255, 255, 0.24),
|
||||
inset 0 -4px 10px rgba(255, 255, 255, 0.16),
|
||||
0 10px 24px -10px rgba(0, 22, 56, 0.38);
|
||||
-webkit-backdrop-filter: blur(12px) saturate(145%);
|
||||
backdrop-filter: blur(12px) saturate(145%);
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
html[data-theme="web"][data-aero="true"] .web-ctl:hover,
|
||||
html[data-theme="web"][data-aero="true"] .service-button:hover,
|
||||
html[data-theme="web"][data-aero="true"] .social-button:hover,
|
||||
html[data-theme="web"][data-aero="true"] .gym-item:hover,
|
||||
html[data-theme="web"][data-aero="true"] .web-freezmo-cta:hover,
|
||||
html[data-theme="web"][data-aero="true"] .web-freezmo-ghost:hover {
|
||||
background-image: linear-gradient(
|
||||
180deg,
|
||||
rgba(255, 255, 255, 0.98) 0%,
|
||||
rgba(235, 252, 255, 0.82) 49%,
|
||||
rgba(175, 238, 255, 0.68) 51%,
|
||||
rgba(210, 255, 242, 0.92) 100%
|
||||
);
|
||||
border-color: #ffffff;
|
||||
background:
|
||||
linear-gradient(
|
||||
135deg,
|
||||
rgba(255, 255, 255, 0.36) 0%,
|
||||
rgba(255, 255, 255, 0.12) 42%,
|
||||
rgba(255, 255, 255, 0.06) 64%,
|
||||
rgba(255, 255, 255, 0.28) 100%
|
||||
)
|
||||
padding-box,
|
||||
linear-gradient(
|
||||
135deg,
|
||||
#ffffff 0%,
|
||||
rgba(255, 255, 255, 0.45) 30%,
|
||||
#ffffff 50%,
|
||||
rgba(255, 255, 255, 0.4) 74%,
|
||||
#ffffff 100%
|
||||
)
|
||||
border-box;
|
||||
border-color: transparent;
|
||||
box-shadow:
|
||||
0 14px 28px -12px rgba(0, 95, 175, 0.55),
|
||||
0 0 14px rgba(80, 225, 255, 0.65),
|
||||
inset 0 2px 0 #ffffff;
|
||||
inset 0 2px 1.5px #ffffff,
|
||||
inset 0 -2px 1.5px rgba(255, 255, 255, 0.85),
|
||||
inset 0 5px 14px rgba(255, 255, 255, 0.36),
|
||||
inset 0 -5px 14px rgba(255, 255, 255, 0.24),
|
||||
0 14px 30px -10px rgba(0, 22, 56, 0.48),
|
||||
0 0 14px rgba(255, 255, 255, 0.35);
|
||||
}
|
||||
|
||||
html[data-theme="web"][data-aero="true"] .web-freezmo-cta,
|
||||
html[data-theme="web"][data-aero="true"] .web-freezmo-badge,
|
||||
html[data-theme="web"][data-aero="true"] .web-switch.on {
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
#9df8ff 0%,
|
||||
#28c8ff 48%,
|
||||
#0088eb 52%,
|
||||
#00dc9e 100%
|
||||
);
|
||||
border: 1px solid rgba(255, 255, 255, 0.95);
|
||||
box-shadow:
|
||||
0 12px 26px -10px rgba(0, 95, 175, 0.65),
|
||||
0 0 12px rgba(0, 210, 255, 0.45),
|
||||
inset 0 1.5px 0 rgba(255, 255, 255, 0.98);
|
||||
text-shadow: 0 1px 2px rgba(0, 55, 105, 0.65);
|
||||
html[data-theme="web"][data-aero="true"] .web-freezmo-name {
|
||||
background: linear-gradient(120deg, #ffffff, #baf2ff);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
html[data-theme="web"][data-aero="true"] .social-icon {
|
||||
filter: none;
|
||||
opacity: 0.85;
|
||||
filter: invert(1) brightness(1.8);
|
||||
opacity: 0.92;
|
||||
}
|
||||
|
||||
html[data-theme="web"][data-aero="true"] .heatmap-cell[data-level="1"],
|
||||
html[data-theme="web"][data-aero="true"] .heatmap-legend-cell[data-level="1"] {
|
||||
background-color: rgba(0, 168, 240, 0.28);
|
||||
background-color: rgba(255, 255, 255, 0.26);
|
||||
}
|
||||
html[data-theme="web"][data-aero="true"] .heatmap-cell[data-level="2"],
|
||||
html[data-theme="web"][data-aero="true"] .heatmap-legend-cell[data-level="2"] {
|
||||
background-color: rgba(0, 155, 235, 0.5);
|
||||
background-color: rgba(255, 255, 255, 0.46);
|
||||
}
|
||||
html[data-theme="web"][data-aero="true"] .heatmap-cell[data-level="3"],
|
||||
html[data-theme="web"][data-aero="true"] .heatmap-legend-cell[data-level="3"] {
|
||||
background-color: rgba(0, 140, 225, 0.76);
|
||||
background-color: rgba(255, 255, 255, 0.7);
|
||||
}
|
||||
html[data-theme="web"][data-aero="true"] .heatmap-cell[data-level="4"],
|
||||
html[data-theme="web"][data-aero="true"] .heatmap-legend-cell[data-level="4"] {
|
||||
background-color: #0078e8;
|
||||
background-color: rgba(255, 255, 255, 0.95);
|
||||
}
|
||||
|
||||
/* ============================================================
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue