feat: glass cards for all media + library items, more transparent slides
This commit is contained in:
parent
84766cad5a
commit
5dcb9edcf0
1 changed files with 42 additions and 7 deletions
|
|
@ -171,15 +171,15 @@ body:has(#itemDetailPage) html::after,
|
|||
|
||||
/* --- Media Bar Plugin --- */
|
||||
|
||||
/* Slide card: glass surface instead of solid */
|
||||
/* Slide card: more transparent glass */
|
||||
.slide {
|
||||
background: rgba(8, 9, 12, 0.3) !important;
|
||||
backdrop-filter: blur(8px) !important;
|
||||
-webkit-backdrop-filter: blur(8px) !important;
|
||||
border: 1px solid rgba(56, 189, 248, 0.12) !important;
|
||||
background: rgba(8, 9, 12, 0.12) !important;
|
||||
backdrop-filter: blur(12px) !important;
|
||||
-webkit-backdrop-filter: blur(12px) !important;
|
||||
border: 1px solid rgba(56, 189, 248, 0.1) !important;
|
||||
box-shadow:
|
||||
0 0 0 1px rgba(255, 255, 255, 0.04) inset,
|
||||
0 8px 32px rgba(0, 0, 0, 0.4) !important;
|
||||
0 0 0 1px rgba(255, 255, 255, 0.03) inset,
|
||||
0 8px 32px rgba(0, 0, 0, 0.25) !important;
|
||||
}
|
||||
|
||||
/* Soften the dark bottom overlay — let the backdrop bleed through */
|
||||
|
|
@ -213,6 +213,41 @@ body:has(#itemDetailPage) html::after,
|
|||
) !important;
|
||||
}
|
||||
|
||||
/* --- Glass Cards --- */
|
||||
|
||||
/* All show/movie/episode cards */
|
||||
.cardScalable {
|
||||
background: rgba(8, 9, 12, 0.15) !important;
|
||||
border: 1px solid rgba(56, 189, 248, 0.12) !important;
|
||||
box-shadow:
|
||||
0 0 0 1px rgba(255, 255, 255, 0.04) inset,
|
||||
0 8px 24px rgba(0, 0, 0, 0.35) !important;
|
||||
backdrop-filter: blur(8px) !important;
|
||||
-webkit-backdrop-filter: blur(8px) !important;
|
||||
}
|
||||
|
||||
.card-hoverable:hover .cardScalable {
|
||||
border-color: rgba(56, 189, 248, 0.3) !important;
|
||||
box-shadow:
|
||||
0 0 0 1px rgba(255, 255, 255, 0.07) inset,
|
||||
0 12px 32px rgba(56, 189, 248, 0.1),
|
||||
0 8px 24px rgba(0, 0, 0, 0.4) !important;
|
||||
}
|
||||
|
||||
/* Library cards (visualCardBox) */
|
||||
.visualCardBox,
|
||||
.paperList {
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, transparent 40%),
|
||||
rgba(8, 9, 12, 0.25) !important;
|
||||
backdrop-filter: blur(16px) saturate(1.6) !important;
|
||||
-webkit-backdrop-filter: blur(16px) saturate(1.6) !important;
|
||||
border: 1px solid rgba(56, 189, 248, 0.14) !important;
|
||||
box-shadow:
|
||||
0 0 0 1px rgba(255, 255, 255, 0.05) inset,
|
||||
0 8px 32px rgba(0, 0, 0, 0.4) !important;
|
||||
}
|
||||
|
||||
/* Frutiger Aero glassmorphism drawer */
|
||||
.mainDrawer {
|
||||
background:
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue