💄 Improved styling variables for config editor

src/styles/color-palette.scss

@@ -48,18 +48,23 @@
   --item-group-outer-background: var(--primary);
   --item-group-heading-text-color: var(--item-group-background);
   --item-group-heading-text-color-hover: var(--background);
-  // Settings and config
-  --settings-background: var(--background);
+  // Homepage settings
   --settings-text-color: var(--primary);
-  --config-code-background: #fff;
-  --config-code-color: var(--background);
+  --settings-background: var(--background);
+  // Config menu
   --config-settings-color: var(--primary);
   --config-settings-background: var(--background-darker);
+  --config-code-color: var(--background);
+  --config-code-background: #fff;
   --code-editor-color: var(--black);
   --code-editor-background: var(--white);
+  // Interactive editor
   --interactive-editor-color: var(--primary);
   --interactive-editor-background: var(--background);
   --interactive-editor-background-darker: var(--background-darker);
+  // Cloud backup/ restore menu
+  --cloud-backup-color: var(--config-settings-color);
+  --cloud-backup-background: var(--config-settings-background);
   // Search bar (on homepage)
   --search-container-background: var(--background-darker);
   --search-field-background: var(--background);

src/styles/color-themes.scss

@@ -378,9 +378,6 @@ html[data-theme='material'], html[data-theme='material-dark'] {
     margin: 0;
     padding: 0;
   }
-  .item-wrapper.add-new-item {
-    flex-grow: inherit;
-  }
   /* Custom layout for medium and large icons */
   .item-wrapper .item:not(.size-small) {
     display: flex;
@@ -416,6 +413,13 @@ html[data-theme='material'], html[data-theme='material-dark'] {
       }	
     }
   }
+  .item-wrapper.add-new-item {
+    flex-grow: inherit;
+  }
+  .add-new-item a {
+    flex-grow: inherit;
+    flex-basis: inherit;
+  }
   .tooltip.item-description-tooltip:not(.tooltip-is-small) {
     display: none !important;
   }