diff --git a/apps/frontend-mobile/assets/adaptive-icon.png b/apps/frontend-mobile/assets/adaptive-icon.png index 0eee0e4..be54010 100644 Binary files a/apps/frontend-mobile/assets/adaptive-icon.png and b/apps/frontend-mobile/assets/adaptive-icon.png differ diff --git a/apps/frontend-mobile/assets/android-icon-foreground.png b/apps/frontend-mobile/assets/android-icon-foreground.png index 0eee0e4..be54010 100644 Binary files a/apps/frontend-mobile/assets/android-icon-foreground.png and b/apps/frontend-mobile/assets/android-icon-foreground.png differ diff --git a/apps/frontend-mobile/assets/android-icon-monochrome.png b/apps/frontend-mobile/assets/android-icon-monochrome.png index 77484eb..be54010 100644 Binary files a/apps/frontend-mobile/assets/android-icon-monochrome.png and b/apps/frontend-mobile/assets/android-icon-monochrome.png differ diff --git a/apps/frontend-mobile/assets/farmaclic_logo.png b/apps/frontend-mobile/assets/farmaclic_logo.png index 10d428d..be54010 100644 Binary files a/apps/frontend-mobile/assets/farmaclic_logo.png and b/apps/frontend-mobile/assets/farmaclic_logo.png differ diff --git a/apps/frontend-mobile/assets/farmaclic_text.png b/apps/frontend-mobile/assets/farmaclic_text.png new file mode 100644 index 0000000..1c2bdac Binary files /dev/null and b/apps/frontend-mobile/assets/farmaclic_text.png differ diff --git a/apps/frontend-mobile/assets/favicon.png b/apps/frontend-mobile/assets/favicon.png index 9a7f025..be54010 100644 Binary files a/apps/frontend-mobile/assets/favicon.png and b/apps/frontend-mobile/assets/favicon.png differ diff --git a/apps/frontend-mobile/assets/icon.png b/apps/frontend-mobile/assets/icon.png index 0eee0e4..be54010 100644 Binary files a/apps/frontend-mobile/assets/icon.png and b/apps/frontend-mobile/assets/icon.png differ diff --git a/apps/frontend-mobile/assets/notification-icon.png b/apps/frontend-mobile/assets/notification-icon.png index 0eee0e4..be54010 100644 Binary files a/apps/frontend-mobile/assets/notification-icon.png and b/apps/frontend-mobile/assets/notification-icon.png differ diff --git a/apps/frontend-mobile/assets/splash-icon.png b/apps/frontend-mobile/assets/splash-icon.png index 03d6f6b..be54010 100644 Binary files a/apps/frontend-mobile/assets/splash-icon.png and b/apps/frontend-mobile/assets/splash-icon.png differ diff --git a/apps/frontend/public/farmaclic_logo.png b/apps/frontend/public/farmaclic_logo.png index 10d428d..be54010 100644 Binary files a/apps/frontend/public/farmaclic_logo.png and b/apps/frontend/public/farmaclic_logo.png differ diff --git a/apps/frontend/public/farmaclic_logo_home.png b/apps/frontend/public/farmaclic_logo_home.png index 5a3eb28..be54010 100644 Binary files a/apps/frontend/public/farmaclic_logo_home.png and b/apps/frontend/public/farmaclic_logo_home.png differ diff --git a/apps/frontend/public/farmaclic_text.png b/apps/frontend/public/farmaclic_text.png index 6966c7e..1c2bdac 100644 Binary files a/apps/frontend/public/farmaclic_text.png and b/apps/frontend/public/farmaclic_text.png differ diff --git a/apps/frontend/public/favicon.png b/apps/frontend/public/favicon.png index eae640a..be54010 100644 Binary files a/apps/frontend/public/favicon.png and b/apps/frontend/public/favicon.png differ diff --git a/apps/frontend/public/logo.png b/apps/frontend/public/logo.png index 8ef1d16..be54010 100644 Binary files a/apps/frontend/public/logo.png and b/apps/frontend/public/logo.png differ diff --git a/apps/frontend/src/assets/bg_dark.png b/apps/frontend/src/assets/bg_dark.png new file mode 100644 index 0000000..039e578 Binary files /dev/null and b/apps/frontend/src/assets/bg_dark.png differ diff --git a/apps/frontend/src/assets/farmaclic_logo.png b/apps/frontend/src/assets/farmaclic_logo.png new file mode 100644 index 0000000..be54010 Binary files /dev/null and b/apps/frontend/src/assets/farmaclic_logo.png differ diff --git a/apps/frontend/src/assets/farmaclic_text.png b/apps/frontend/src/assets/farmaclic_text.png new file mode 100644 index 0000000..1c2bdac Binary files /dev/null and b/apps/frontend/src/assets/farmaclic_text.png differ diff --git a/apps/frontend/src/components/SavedNotifications.css b/apps/frontend/src/components/SavedNotifications.css index a7d95ac..aa002b5 100644 --- a/apps/frontend/src/components/SavedNotifications.css +++ b/apps/frontend/src/components/SavedNotifications.css @@ -175,6 +175,41 @@ to { opacity: 1; transform: translateY(0) scale(1); } } +/* Dark mode adaptations */ +[data-theme="dark"] .saved-notifications-item { + background: var(--surface-container); + border-color: var(--border); +} + +[data-theme="dark"] .saved-notifications-item-name { + color: #b0d4b8; +} + +[data-theme="dark"] .saved-notifications-chip { + background: rgba(96, 165, 250, 0.15); + color: #93c5fd; +} + +[data-theme="dark"] .saved-notifications-chip--pharmacy { + background: rgba(142, 212, 160, 0.15); + color: #8ed4a0; +} + +[data-theme="dark"] .saved-notifications-address { + color: #9ca3af; +} + +[data-theme="dark"] .saved-notifications-remove { + border-color: var(--border); + color: var(--text-muted); +} + +[data-theme="dark"] .saved-notifications-remove:hover:not(:disabled) { + background: rgba(239, 68, 68, 0.12); + color: #fca5a5; + border-color: #f87171; +} + @media (max-width: 540px) { .saved-notifications-backdrop { padding: 2vh 0.5rem; diff --git a/apps/frontend/src/index.css b/apps/frontend/src/index.css index 0556329..711463d 100644 --- a/apps/frontend/src/index.css +++ b/apps/frontend/src/index.css @@ -103,14 +103,14 @@ --on-tertiary: #3b2a5a; --tertiary-container: #524070; --on-tertiary-container: #efe7ff; - --surface: #111417; + --surface: #1e2024; --on-surface: #e1e3e4; --on-surface-variant: #c0c9bb; - --surface-container-lowest: #0c0e10; - --surface-container-low: #191c1d; - --surface-container: #1e2122; - --surface-container-high: #282b2c; - --surface-container-highest: #333637; + --surface-container-lowest: #171a1d; + --surface-container-low: #252830; + --surface-container: #2c3038; + --surface-container-high: #383c44; + --surface-container-highest: #444850; --error: #ffb4ab; --on-error: #690005; --error-container: #93000a; @@ -122,8 +122,8 @@ --inverse-on-surface: #2e3132; --inverse-primary: #2e7d32; --surface-tint: #8ed4a0; - --surface-dim: #111417; - --surface-bright: #373a3b; + --surface-dim: #1e2024; + --surface-bright: #4a4e56; --surface-variant: #41493e; --primary-fixed: #acf4a4; --primary-fixed-dim: #91d78a; @@ -155,10 +155,10 @@ --fab-shadow: rgba(91, 139, 213, 0.35); --warning: #f59e0b; --warning-container: rgba(245, 158, 11, 0.15); - --suggestion-1: #1e2122; - --suggestion-2: #1a2332; - --suggestion-3: #1a2a3a; - --suggestion-4: #1a3040; + --suggestion-1: #2c3038; + --suggestion-2: #252d40; + --suggestion-3: #25334a; + --suggestion-4: #253a55; --suggestion-border-1: #333637; --suggestion-border-2: #2a4080; --suggestion-border-3: #2a4a8a; @@ -221,11 +221,12 @@ body::after { } [data-theme="dark"] body::before { - opacity: 0.15; + background-image: url('./assets/bg_dark.png'); + opacity: 0.55; } [data-theme="dark"] body::after { - background-color: rgba(0, 0, 0, 0.55); + background-color: rgba(0, 0, 0, 0.25); } #root { diff --git a/apps/frontend/src/views/AlertsView.css b/apps/frontend/src/views/AlertsView.css index 39a0e74..099d4cc 100644 --- a/apps/frontend/src/views/AlertsView.css +++ b/apps/frontend/src/views/AlertsView.css @@ -130,6 +130,42 @@ background: var(--surface-container-high); } +/* Dark mode adaptations */ +[data-theme="dark"] .alert-card { + background: var(--surface-container); +} + +[data-theme="dark"] .alert-badge--primary { + background: rgba(239, 68, 68, 0.2); + color: #fca5a5; +} + +[data-theme="dark"] .alert-badge--tertiary { + background: rgba(167, 139, 250, 0.2); + color: #c4b5fd; +} + +[data-theme="dark"] .alert-icon--primary { + background: rgba(142, 212, 160, 0.15); + color: #8ed4a0; +} + +[data-theme="dark"] .alert-icon--tertiary { + background: rgba(167, 139, 250, 0.15); + color: #a78bfa; +} + +[data-theme="dark"] .alert-delete { + border-color: var(--border); + color: var(--text-muted); +} + +[data-theme="dark"] .alert-delete:hover { + background: rgba(239, 68, 68, 0.12); + color: #fca5a5; + border-color: #f87171; +} + @media (max-width: 400px) { .alerts-title { font-size: 1.5rem;