diff --git a/public/background-md-dark.svg b/public/background-md-dark.svg new file mode 100644 index 0000000..943ec8f --- /dev/null +++ b/public/background-md-dark.svg @@ -0,0 +1,111 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/background.svg b/public/background.svg index 8fccff6..15c3a25 100644 --- a/public/background.svg +++ b/public/background.svg @@ -1,346 +1,314 @@ - - - - - - + + + + + + - - - - - + + + + + - + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - + + + + + + + + + + - - - - - - - + + + + + + - - + + - - - - + + + + - + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - + + + + + + + + + + - - - - - - - - - + + + + + + + - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - + - + - + - + - + - + - + - + - + - + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + diff --git a/src/pages/restaurant/restaurant.module.css b/src/pages/restaurant/restaurant.module.css index 816a6db..ec939f9 100644 --- a/src/pages/restaurant/restaurant.module.css +++ b/src/pages/restaurant/restaurant.module.css @@ -34,6 +34,13 @@ overflow: hidden; } +/* Enhanced Dark Theme Styles */ +:global(.darkApp) .homeContainer { + background-image: url("/background-dark.svg"); + background-color: #0a0a0a; + color: #ffffff; +} + .homeServiceCard { width: 100%; height: 48px; @@ -150,6 +157,13 @@ display: none; } + /* Enhanced Dark Theme Styles */ + :global(.darkApp) .homeContainer { + background-image: url("/background-md-dark.svg"); + background-color: #0a0a0a; + color: #ffffff; + } + .homeContainer { padding: 6vh 6vw; height: 100vh; @@ -318,6 +332,13 @@ text-align: center; } + /* Enhanced Dark Theme Styles */ + :global(.darkApp) .homeContainer { + background-image: url("/background-md-dark.svg"); + background-color: #0a0a0a; + color: #ffffff; + } + .homeContainerContent { margin: 6vh 0; display: flex; @@ -504,6 +525,13 @@ gap: 32px; } + /* Enhanced Dark Theme Styles */ + :global(.darkApp) .homeContainer { + background-image: url("/background-md-dark.svg"); + background-color: #0a0a0a; + color: #ffffff; + } + .homeContainerContent { margin: 12vh 0 !important; display: flex; @@ -614,6 +642,12 @@ gap: 40px; } + :global(.darkApp) .homeContainer { + background-image: url("/background-md-dark.svg"); + background-color: #0a0a0a; + color: #ffffff; + } + .logo { width: 160px; height: 160px; @@ -706,42 +740,6 @@ } } -/* =========================================== - HEIGHT-BASED MEDIA QUERIES - =========================================== */ - -/* Very tall screens */ -@media (min-height: 1000px) { - .homeContainer { - justify-content: center; - /* padding-top: 15vh; */ - } -} - -/* Very short screens */ -@media (max-height: 600px) { - .homeContainer { - gap: 20px; - padding: 4vh 6vw; - } - - .logo { - width: 80px; - height: 80px; - margin-bottom: 16px; - border-radius: 12px !important; - border: 2px solid rgba(255, 255, 255, 0.6); - } - - .servicesGrid { - margin: 16px 0; - } - - .socialIconsContainer { - bottom: 16px; - } -} - /* =========================================== ORIENTATION-BASED MEDIA QUERIES =========================================== */ @@ -790,14 +788,6 @@ DARK THEME STYLES =========================================== */ -/* Enhanced Dark Theme Styles */ -:global(.darkApp) .homeContainer { - background-image: url("/background-dark.svg"); - background-color: #0a0a0a; - color: #ffffff; -} - - :global(.darkApp) .homeContainer p, :global(.darkApp) .homeContainer span { color: #b0b0b0;