CRM_ENVIROMENT/Newbie_CRM
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix Cuba theme: use body::before background with Malecón photo + transparency overrides
Build & Auto-Repair / build (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Rene
2026-07-02 17:14:57 +02:00
parent d1c62d940f
commit 12115644e9
1 changed files with 40 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Web_Backgrounds/cuba-theme.css
+40 -30
View File
@@ -1,6 +1,6 @@
/* ============================================================================
Cuba Theme — Classic Cuban car on a playa at golden hour (6pm sunset)
Warm sunset tones, turquoise Caribbean accents, pastel caribbean vibes
Malecón, Havana — warm sunset tones, turquoise Caribbean accents
============================================================================ */
.dark.theme-cuba {
@@ -83,55 +83,65 @@
--chart-5: 335 55% 50%;
}
.theme-cuba {
--background-image: url("https://images.unsplash.com/photo-1595268042087-d4766b03e9db?w=1920&q=80");
--background-attachment: fixed;
--background-size: cover;
--background-position: center;
--background-blend-mode: overlay;
/* ── Malecón, Havana at golden hour background ──────────────────── */
.dark.theme-cuba body::before {
content: "";
position: fixed;
inset: 0;
z-index: -1;
pointer-events: none;
background: url("https://images.unsplash.com/photo-1584098179114-7962ad5d6653?w=1920&q=80") no-repeat center center fixed;
background-size: cover;
background-attachment: fixed;
background-position: center;
}
.dark.theme-cuba {
--card-bg-opacity: 0.85;
--sidebar-bg-opacity: 0.9;
--card-backdrop: blur(12px);
.light.theme-cuba body::before {
content: "";
position: fixed;
inset: 0;
z-index: -1;
pointer-events: none;
background: hsl(30, 30%, 96%);
}
.light.theme-cuba {
--card-bg-opacity: 0.92;
--sidebar-bg-opacity: 0.95;
--card-backdrop: blur(8px);
/* ── Make main containers transparent so body::before shows ──────── */
.dark.theme-cuba .min-h-screen.bg-background {
background: transparent !important;
}
.dark.theme-cuba .min-h-screen.bg-\[\#F8F8F8\],
.dark.theme-cuba .dark\:bg-\[\#0A0A0A\] {
background: transparent !important;
}
.light.theme-cuba .min-h-screen {
background: hsl(30, 30%, 96%) !important;
}
/* ── Frosted glass cards ────────────────────────────────────────── */
.dark.theme-cuba .bg-card,
.dark.theme-cuba .bg-popover,
.dark.theme-cuba .bg-muted {
background-color: hsl(var(--card) / var(--card-bg-opacity, 1));
backdrop-filter: var(--card-backdrop, none);
background-color: hsl(var(--card) / 0.85);
backdrop-filter: blur(12px);
}
.dark.theme-cuba .bg-sidebar {
background-color: hsl(var(--sidebar) / var(--sidebar-bg-opacity, 1));
backdrop-filter: var(--card-backdrop, none);
background-color: hsl(var(--sidebar) / 0.9);
backdrop-filter: blur(12px);
}
.light.theme-cuba .bg-card,
.light.theme-cuba .bg-popover,
.light.theme-cuba .bg-muted {
background-color: hsl(var(--card) / var(--card-bg-opacity, 1));
backdrop-filter: var(--card-backdrop, none);
background-color: hsl(var(--card) / 0.92);
backdrop-filter: blur(8px);
}
.light.theme-cuba .bg-sidebar {
background-color: hsl(var(--sidebar) / var(--sidebar-bg-opacity, 1));
backdrop-filter: var(--card-backdrop, none);
}
.theme-cuba body,
.theme-cuba .min-h-screen {
background: var(--background-image) var(--background-attachment) var(--background-position) / var(--background-size);
background-color: hsl(var(--background));
background-blend-mode: var(--background-blend-mode);
background-color: hsl(var(--sidebar) / 0.95);
backdrop-filter: blur(8px);
}
@media (prefers-reduced-transparency: reduce) {