diff --git a/webapp/src/app/routes/login/login.html b/webapp/src/app/routes/login/login.html
index 64a48e0..ae49562 100644
--- a/webapp/src/app/routes/login/login.html
+++ b/webapp/src/app/routes/login/login.html
@@ -9,7 +9,7 @@
Password
-
+
diff --git a/webapp/src/styles/_theme.scss b/webapp/src/styles/_theme.scss
index d5bf090..eabe869 100644
--- a/webapp/src/styles/_theme.scss
+++ b/webapp/src/styles/_theme.scss
@@ -4,32 +4,44 @@
--pico-font-family-monospace: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono',
monospace;
- --theme-light-color-primary: oklch(27.3% 0.076 236.7);
- --theme-light-color-primary-background: oklch(from var(--theme-light-color-primary) 34.8% c h);
+ --theme-light-color-primary: oklch(57.3% 0.076 236.7);
+ --theme-light-color-primary-background: oklch(from var(--theme-light-color-primary) 49.8% c h);
--theme-light-color-primary-background-hover: oklch(from var(--theme-light-color-primary) 42.3% c h);
- --theme-light-color-primary-focus: oklch(from var(--theme-light-color-primary) 72.3% c h);
- --theme-light-color-primary-hover: oklch(from var(--theme-light-color-primary) 87.3% c h);
+ --theme-light-color-primary-focus: oklch(from var(--theme-light-color-primary) 87.3% c h);
+ --theme-light-color-primary-hover: oklch(from var(--theme-light-color-primary) 72.3% c h);
- --theme-light-color-secondary: oklch(29.7% 0.116 324.2);
- --theme-light-color-secondary-background: oklch(from var(--theme-light-color-secondary) 52.2% c h);
- --theme-light-color-secondary-selection: oklch(74.7% 0.116 324.2 / 50%);
+ --theme-light-color-secondary: oklch(64.8% 0.076 146.7);
+ --theme-light-color-secondary-background: oklch(from var(--theme-light-color-secondary) 57.3% c h);
+ --theme-light-color-secondary-background-hover: oklch(from var(--theme-light-color-secondary) 49.8% c h);
+ --theme-light-color-secondary-focus: oklch(from var(--theme-light-color-secondary) 87.3% c h);
+ --theme-light-color-secondary-hover: oklch(from var(--theme-light-color-secondary) 72.3% c h);
+
+ --theme-light-color-accent: oklch(29.7% 0.116 324.2);
+ --theme-light-color-accent-background: oklch(from var(--theme-light-color-accent) 52.2% c h);
+ --theme-light-color-accent-selection: oklch(74.7% 0.116 324.2 / 50%);
}
// Light Theme
[data-theme='light'],
:root:not([data-theme='dark']),
:host:not([data-theme='dark']) {
- --pico-text-selection-color: var(--theme-light-color-secondary-selection);
+ --pico-text-selection-color: var(--theme-light-color-accent-selection);
+
--pico-primary: var(--theme-light-color-primary);
--pico-primary-background: var(--theme-light-color-primary-background);
--pico-primary-underline: var(--theme-light-color-primary-hover);
- --pico-primary-hover: #942d0d;
+ --pico-primary-hover: var(--theme-light-color-primary-hover);
--pico-primary-hover-background: var(--theme-light-color-primary-background-hover);
--pico-primary-focus: var(--theme-light-color-primary-focus);
--pico-primary-inverse: #fff;
--pico-secondary: var(--theme-light-color-secondary);
--pico-secondary-background: var(--theme-light-color-secondary-background);
+ --pico-secondary-underline: var(--theme-light-color-secondary-background-hover);
+ --pico-secondary-hover: var(--theme-light-color-secondary-hover);
+ --pico-secondary-hover-background: var(--theme-light-color-secondary-background-hover);
+ --pico-secondary-focus: var(--theme-light-color-secondary-focus);
+ --pico-secondary-inverse: #fff;
}
// Dark Theme