UX: Improve theme colors photoprism#3168

Signed-off-by: Michael Mayer <michael@photoprism.app>

Author: lastzero

frontend/src/component/photo/edit/dialog.vue

@@ -11,7 +11,7 @@
     @after-leave="afterLeave"
   >
     <v-card ref="content" :tile="$vuetify.display.smAndDown" tabindex="1">
-      <v-toolbar flat color="surface" :density="$vuetify.display.smAndDown ? 'compact' : 'comfortable'">
+      <v-toolbar flat color="navigation" :density="$vuetify.display.smAndDown ? 'compact' : 'comfortable'">
         <v-btn icon class="action-close" @click.stop="onClose">
           <v-icon>mdi-close</v-icon>
         </v-btn>

frontend/src/options/themes.js

@@ -100,15 +100,15 @@ let themes = {
     name: "carbon",
     colors: {
       "background": "#16141c",
-      "surface": "#0a090d",
+      "surface": "#24212E",
       "card": "#292732",
       "primary": "#8a6eff",
       "highlight": "#53478a",
       "surface-variant": "#7f63fd",
       "secondary": "#0E0D12",
       "secondary-light": "#292733",
       "table": "#1D1B26",
-      "button": "#292733",
+      "button": "#2C273E",
       "switch": "#707070",
       "selected": "#53478a",
       "accent": "#262238",
@@ -129,6 +129,7 @@ let themes = {
       "navigation-home": "#0E0D12",
     },
     variables: {
+      "overlay-color": "#24212E",
       "disabled-opacity": 0.6,
       "hover-opacity": 0.03,
     },
@@ -139,15 +140,15 @@ let themes = {
     name: "chrome",
     colors: {
       "background": "#1d1d1d",
-      "surface": "#1a1a1a",
+      "surface": "#1f1f1f",
       "card": "#1f1f1f",
       "primary": "#ffffff",
       "highlight": "#393939",
       "surface-variant": "#ffffff",
       "on-surface-variant": "#000000",
-      "secondary": "#1f1f1f",
+      "secondary": "#1c1c1c",
       "secondary-light": "#292929",
-      "button": "#292929",
+      "button": "#2a2b2c",
       "table": "#262626",
       "switch": "#707070",
       "selected": "#494949",
@@ -165,10 +166,11 @@ let themes = {
       "share": "#9575cd",
       "love": "#dd3f3e",
       "terminal": "#2f3131",
-      "navigation": "#1e2122",
-      "navigation-home": "#1e2122",
+      "navigation": "#1a1b1c",
+      "navigation-home": "#1a1b1c",
     },
     variables: {
+      "overlay-color": "#292929",
       "disabled-opacity": 0.55,
       "hover-opacity": 0.03,
     },
@@ -178,18 +180,18 @@ let themes = {
     name: "gemstone",
     dark: true,
     colors: {
-      "background": "#2f2f31",
-      "surface": "#161617",
-      "card": "#2b2b2d",
+      "background": "#2b2c2f",
+      "surface": "#323337",
+      "card": "#26272e",
       "primary": "#AFB4D4",
-      "highlight": "#545465",
+      "highlight": "#474859",
       "surface-variant": "#9BA0C5",
       "on-surface-variant": "#f6f7e8",
-      "secondary": "#272727",
+      "secondary": "#242628",
       "secondary-light": "#37373a",
       "table": "#333336",
-      "button": "#37373A",
-      "selected": "#696c7f",
+      "button": "#47474e",
+      "selected": "#5c5e79",
       "accent": "#333",
       "error": "#e57373",
       "info": "#00acc1",
@@ -204,10 +206,11 @@ let themes = {
       "share": "#9575cd",
       "love": "#ef5350",
       "terminal": "#4A464F",
-      "navigation": "#1C1C21",
-      "navigation-home": "#131316",
+      "navigation": "#1C1C20",
+      "navigation-home": "#131315",
     },
     variables: {
+      "overlay-color": "#303132",
       "disabled-opacity": 0.65,
       "hover-opacity": 0.03,
     },
@@ -256,23 +259,24 @@ let themes = {
     name: "lavender",
     dark: false,
     colors: {
-      "background": "#fafafa",
-      "surface": "#e7e8f2",
+      "background": "#F3F3F5",
+      "surface": "#DDDEE6",
+      "on-surface": "#17171b",
       "card": "#DFE0E8",
       "primary": "#9ca2c9",
-      "highlight": "#7c81a0",
-      "surface-variant": "#475185",
-      "secondary": "#E2E5F3",
+      "highlight": "#6E7189",
+      "surface-variant": "#8A8CA8",
+      "secondary": "#51526D",
       "secondary-light": "#eef0f6",
       "selected": "#7c81a0",
-      "table": "#FFFFFF",
-      "button": "#EEF0F6",
+      "table": "#DBDBE2",
+      "button": "#8A8CA8",
       "switch": "#707070",
       "accent": "#EAEAF3",
       "error": "#e57373",
-      "info": "#00acc1",
+      "info": "#6E7189",
       "success": "#26A69A",
-      "warning": "#ffd740",
+      "warning": "#bfa965",
       "remove": "#e57373",
       "restore": "#64b5f6",
       "album": "#ffab00",
@@ -282,8 +286,8 @@ let themes = {
       "share": "#9575cd",
       "love": "#ef5350",
       "terminal": "#e7e8f2",
-      "navigation": "#1b1e32",
-      "navigation-home": "#121421",
+      "navigation": "#393B4B",
+      "navigation-home": "#2C2D3B",
     },
     variables: {
       "disabled-opacity": 0.65,