chore: aufacicenta theme

app/src/context/theme/ThemeContextController.tsx

@@ -7,10 +7,10 @@ import { LocalStorageKeys } from "hooks/useLocalStorage/useLocalStorage.types";
 import { ThemeContext } from "./ThemeContext";
 import { ThemeContextControllerProps } from "./ThemeContext.types";
 
-const themes: Theme[] = ["svpervnder"];
+const themes: Theme[] = ["aufacicenta"];
 
 export const ThemeContextController = ({ children }: ThemeContextControllerProps) => {
-  const [theme, setTheme] = useState<Theme>("svpervnder");
+  const [theme, setTheme] = useState<Theme>("aufacicenta");
 
   const localStorage = useLocalStorage();
 

app/src/theme/_variables.scss

@@ -1,8 +1,3 @@
-$navbar-height: 98px !default;
-$navbar-height-mobile: 80px !default;
-$navbar-logo-width: 124px !default;
-$navbar-logo-width-mobile: 70px !default;
-
 $footer-height: 77px !default;
 $footer-height-mobile: 48px !default;
 
@@ -220,39 +215,51 @@ $dropdown-item-height: 50px !default;
 /* 2dp elevation modified*/
 
 .z-depth-1 {
-  box-shadow: 0 2px 2px 0 rgba(91, 91, 101, 0.14), 0 3px 1px -2px rgba(91, 91, 101, 0.12),
+  box-shadow:
+    0 2px 2px 0 rgba(91, 91, 101, 0.14),
+    0 3px 1px -2px rgba(91, 91, 101, 0.12),
     0 1px 5px 0 rgba(91, 91, 101, 0.2);
 }
 
 .z-depth-1-half {
-  box-shadow: 0 3px 3px 0 rgba(91, 91, 101, 0.14), 0 1px 7px 0 rgba(91, 91, 101, 0.12),
+  box-shadow:
+    0 3px 3px 0 rgba(91, 91, 101, 0.14),
+    0 1px 7px 0 rgba(91, 91, 101, 0.12),
     0 3px 1px -1px rgba(91, 91, 101, 0.2);
 }
 
 /* 6dp elevation modified*/
 
 .z-depth-2 {
-  box-shadow: 0 4px 5px 0 rgba(91, 91, 101, 0.14), 0 1px 10px 0 rgba(91, 91, 101, 0.12),
+  box-shadow:
+    0 4px 5px 0 rgba(91, 91, 101, 0.14),
+    0 1px 10px 0 rgba(91, 91, 101, 0.12),
     0 2px 4px -1px rgba(91, 91, 101, 0.3);
 }
 
 /* 12dp elevation modified*/
 
 .z-depth-3 {
-  box-shadow: 0 8px 17px 2px rgba(91, 91, 101, 0.14), 0 3px 14px 2px rgba(91, 91, 101, 0.12),
+  box-shadow:
+    0 8px 17px 2px rgba(91, 91, 101, 0.14),
+    0 3px 14px 2px rgba(91, 91, 101, 0.12),
     0 5px 5px -3px rgba(91, 91, 101, 0.2);
 }
 
 /* 16dp elevation */
 
 .z-depth-4 {
-  box-shadow: 0 16px 24px 2px rgba(91, 91, 101, 0.14), 0 6px 30px 5px rgba(91, 91, 101, 0.12),
+  box-shadow:
+    0 16px 24px 2px rgba(91, 91, 101, 0.14),
+    0 6px 30px 5px rgba(91, 91, 101, 0.12),
     0 8px 10px -7px rgba(91, 91, 101, 0.2);
 }
 
 /* 24dp elevation */
 
 .z-depth-5 {
-  box-shadow: 0 24px 38px 3px rgba(91, 91, 101, 0.14), 0 9px 46px 8px rgba(91, 91, 101, 0.12),
+  box-shadow:
+    0 24px 38px 3px rgba(91, 91, 101, 0.14),
+    0 9px 46px 8px rgba(91, 91, 101, 0.12),
     0 11px 15px -7px rgba(91, 91, 101, 0.2);
 }

app/src/theme/globals.scss

@@ -2,7 +2,7 @@
 @import "./forms/forms";
 @import "./icons";
 @import "src/ui/table/reboot";
-@import "src/theme/variants/svpervnder";
+@import "src/theme/variants/aufacicenta";
 
 html {
   @media (max-width: $mq-medium) {

app/src/theme/variants/_aufacicenta.scss

@@ -0,0 +1,133 @@
+body[data-theme="aufacicenta"] {
+  --color-background: #e4e4d8;
+  --color-background-contrast: #6e7278;
+  --color-status-info: #5356fc;
+  --color-status-info-light: rgb(83 86 252 / 70%);
+  --color-status-info-lighter: rgb(83 86 252 / 40%);
+  --color-status-success: #3dd598;
+  --color-status-success-light: #d6fff5;
+  --color-status-success-lighter: #e6fff9;
+  --color-status-warning: #ffeea3;
+  --color-status-warning-light: #fffdb8;
+  --color-status-warning-lighter: #fffeeb;
+  --color-status-critical: #bd2d00;
+  --color-status-critical-light: #ffe2e0;
+  --color-status-critical-lighter: #fff5f5;
+  --color-status-unknown: #f4f6f8;
+  --color-white: #fff;
+  --color-black: #161b1c;
+  --color-dark-11: #222529;
+  --color-dark-10: #2c3035;
+  --color-dark-9: #2c3035;
+  --color-dark-8: #40404a;
+  --color-dark-7: #5b5b65;
+  --color-dark-6: #70707c;
+  --color-dark-5: #8a8a98;
+  --color-dark-4: #a9a9b7;
+  --color-dark-3: #d0d0da;
+  --color-dark-2: #f5f5ff;
+  --color-dark-1: #fff;
+  --color-primary: #4a4b6c;
+  --color-primary-shade-mid: #3d3e59;
+  --color-primary-shade-low: #373850;
+  --color-secondary: #fff;
+  --color-secondary-shade-mid: var(--color-dark-4);
+  --color-secondary-shade-low: var(--color-dark-7);
+  --color-sidebar-item: var(--color-white);
+  --color-sidebar-divider: var(--color-dark-8);
+  --color-navbar-logo: var(--color-primary);
+  --color-navbar-background: var(--color-background);
+  --color-button-primary: var(--color-primary);
+  --color-button-primary-text: var(--color-background);
+  --color-button-primary-hover: var(--color-primary);
+  --color-button-primary-hover-text: var(--color-background-contrast);
+  --color-button-primary-disabled: var(--color-dark-5);
+  --color-button-secondary: var(--color-white);
+  --color-button-secondary-text: var(--color-white);
+  --color-button-secondary-hover: var(--color-dark-10);
+  --color-button-secondary-hover-text: var(--color-white);
+  --color-button-status-critical: var(--color-status-critical);
+  --color-button-status-critical-text: var(--color-status-critical);
+  --color-button-status-critical-hover: var(--color-status-critical);
+  --color-button-status-critical-hover-text: var(--color-white);
+  --color-button-dark: var(--color-background);
+  --color-button-dark-text: var(--color-white);
+  --color-button-dark-hover: var(--color-background-contrast);
+  --color-button-dark-hover-text: var(--color-white);
+  --color-button-dark-disabled: var(--color-dark-5);
+  --color-button-outlined-primary-text: var(--color-primary);
+  --color-button-outlined-primary-hover: transparent;
+  --color-button-outlined-primary-hover-text: var(--color-dark-4);
+  --color-button-outlined-primary-border: var(--color-primary);
+  --color-button-outlined-primary-border-hover: var(--color-dark-4);
+  --color-button-outlined-secondary-text: var(--color-secondary);
+  --color-button-outlined-secondary-hover: transparent;
+  --color-button-outlined-secondary-hover-text: var(--color-dark-4);
+  --color-button-outlined-secondary-border: var(--color-secondary);
+  --color-button-outlined-secondary-border-hover: var(--color-dark-4);
+  --color-button-outlined-info: #ffd74b;
+  --color-button-outlined-info-text: #ffd74b;
+  --color-button-outlined-disabled: #5b5b65;
+  --color-button-outlined-disabled-text: #8a8a98;
+  --color-button-outlined-dark-text: var(--color-background);
+  --color-button-outlined-dark-hover: transparent;
+  --color-button-outlined-dark-hover-text: var(--color-background);
+  --color-button-outlined-dark-border: var(--color-background);
+  --color-button-outlined-dark-border-hover: var(--color-background-contrast);
+  --color-button-text-primary-text: var(--color-primary);
+  --color-button-text-primary-hover: transparent;
+  --color-button-text-primary-hover-text: var(--color-primary-shade-low);
+  --color-button-text-primary-border: var(--color-primary);
+  --color-button-text-primary-border-hover: var(--color-primary-shade-low);
+  --color-button-text-info: #ffd74b;
+  --color-button-text-info-text: #ffd74b;
+  --color-button-text-disabled: #5b5b65;
+  --color-button-text-disabled-text: #8a8a98;
+  --color-theme-button-light: #fff0;
+  --color-theme-button-dark: #ffffff40;
+  --color-theme-button-divider: var(--color-background-contrast);
+  --color-typography-headline-1: var(--color-white);
+  --color-typography-headline-2: var(--color-white);
+  --color-typography-headline-3: var(--color-dark-4);
+  --color-typography-headline-4: var(--color-dark-4);
+  --color-typography-headline-5: var(--color-dark-4);
+  --color-typography-headline-6: var(--color-white);
+  --color-typography-text: var(--color-white);
+  --color-typography-text-lead: var(--color-dark-4);
+  --color-typography-text-bold: var(--color-white);
+  --color-typography-subtitle: var(--color-dark-5);
+  --color-typography-button-label: var(--color-white);
+  --color-typography-mini-button-label: var(--color-white);
+  --color-typography-description: var(--color-dark-4);
+  --color-typography-mini-description: var(--color-dark-5);
+  --color-typography-link: var(--color-primary);
+  --color-typography-link-hover: var(--color-primary-shade-low);
+  --color-tab-navigation-border: var(--color-dark-7);
+  --color-tab-item-default: var(--color-dark-7);
+  --color-tab-item-active: var(--color-white);
+  --color-market-card-background: var(--color-background);
+  --color-market-card-background-contrast: var(--color-background);
+  --color-market-card-title: #fff;
+  --color-market-card-stat: #b1b1b1;
+  --color-market-fees-card-background: #ffd74b;
+  --color-market-fees-card-text: #fff;
+  --color-horizontal-line-background: var(--color-secondary-shade-mid);
+  --color-value-increase: #00d3a1;
+  --color-value-increase-bright: #00bb8e;
+  --color-value-decrease: #ff7c35;
+  --color-value-decrease-bright: #e76823;
+  --color-input-text: var(--color-typography-text);
+  --color-input-text-disabled: var(--color-typography-description);
+  --color-input-background: white;
+  --color-input-background-disabled: var(--color-background-contrast);
+  --color-input-border: var(--color-black);
+  --color-input-label: rgb(255 255 255 / 70%);
+  --color-input-placeholder: var(--color-typography-description);
+  --color-dropzone-border: var(--color-typography-description);
+  --color-dropzone-border-hover: var(--color-primary);
+  --color-chat-sidebar-background: var(--color-background-contrast);
+  --color-chat-sidebar-background-hover: var(--color-background);
+  --color-table-background: var(--color-background-contrast);
+  --border-radius-button-large: 30px;
+  --color-accordion-border: var(--color-dark-5);
+}

app/src/ui/fileagent/navbar/Navbar.module.scss

@@ -9,7 +9,6 @@
   left: 0;
   z-index: $z-index-content;
   width: 100%;
-  border-bottom: 1px solid var(--color-background-contrast);
   background-color: var(--color-navbar-background);
 
   &__sidebar-toggle {
@@ -145,6 +144,7 @@
         width: $navbar-logo-width;
       }
       width: $navbar-logo-width-mobile;
+      color: var(--color-primary);
     }
   }