[sc-2301] re align sistema neutral colors (#241)

* [sc-2301]: Re-align Sistema neutral colors

Move neutral colors to the right (so $color-neutral-strong becomes $color-neutral-regular) and $color-neutral-lightest will be out of palette and be used specifically as a background

* Add missing menu glyph

* Remove custom palette demo page

Author: mpellerin42

apps/dashboard/src/app/account/billing/plans/plans.component.scss

@@ -34,7 +34,7 @@ $column-header: 128px;
 }
 
 .parameter-group {
-  border-bottom: 1px solid $color-neutral-strong;
+  border-bottom: 1px solid $color-neutral-regular;
   &:last-child {
     border-bottom: 0;
   }
@@ -128,7 +128,7 @@ $column-header: 128px;
     right: 0;
     font-size: var(--stf-font-size-ssmall);
     font-weight: var(--stf-font-weight-light);
-    color: $color-neutral-strong;
+    color: $color-neutral-regular;
   }
 }
 

apps/dashboard/src/app/account/billing/settings/plan-settings.component.scss

@@ -16,7 +16,7 @@
 }
 
 .description {
-  color: $color-neutral-strong;
+  color: $color-neutral-regular;
 }
 
 input {

apps/dashboard/src/app/components/hint/hint.component.scss

@@ -18,7 +18,7 @@
 .hint-title {
   display: flex;
   align-items: center;
-  color: $color-neutral-strong;
+  color: $color-neutral-regular;
 
   pa-icon {
     display: inline-block;

apps/dashboard/src/app/components/topbar/kb-switch/kb-switch.component.scss

@@ -24,6 +24,6 @@
   }
 
   pa-option.demo-kb {
-    color: $color-neutral-strong;
+    color: $color-neutral-regular;
   }
 }

apps/desktop/src/app/connectors/folder-upload/folder-upload.component.scss

@@ -7,9 +7,9 @@
   width: 400px;
   height: rhythm(12);
   border: 2px dashed $color-neutral-regular;
-  color: $color-neutral-strong;
+  color: $color-neutral-regular;
   transition: border-color 0.15s;
   &.active {
     border: 2px dashed $color-primary-regular;
   }
-}
+}

apps/desktop/src/app/upload/select-files/select-files.component.scss

@@ -44,10 +44,10 @@ h3 {
 table {
   width: calc(100% - #{rhythm(2)});
   border-spacing: 0;
-  border-top: 2px solid $color-neutral-strong;
+  border-top: 2px solid $color-neutral-regular;
 }
 
 td {
   height: rhythm(3);
-  border-bottom: 1px solid $color-neutral-strong;
+  border-bottom: 1px solid $color-neutral-regular;
 }

apps/sistema-demo/src/app/app.component.ts

@@ -22,6 +22,7 @@ import {
   InfiniteScrollPageComponent,
   InputPageComponent,
   NativeTextFieldPageComponent,
+  PalettePageComponent,
   PopoverPageComponent,
   PopupPageComponent,
   SelectPageComponent,
@@ -44,7 +45,6 @@ import {
   SistemaConfirmationDialogComponent,
   SistemaIconsComponent,
   SistemaModalComponent,
-  SistemaPaletteComponent,
   SistemaScrollbarComponent,
   SistemaTableComponent,
   SistemaToastComponent,
@@ -62,7 +62,7 @@ export const menu: IDemoMenuSection[] = [
     title: 'Core',
     pages: [
       { view: 'icon', title: 'Icons', type: SistemaIconsComponent },
-      { view: 'palette', title: 'Palette', type: SistemaPaletteComponent },
+      { view: 'palette', title: 'Palette', type: PalettePageComponent },
       { view: 'typography', title: 'Typography', type: TypographyPageComponent },
       { view: 'focusable', title: 'Focusable', type: FocusablePageComponent },
       { view: 'accessibility', title: 'Accessibility', type: AccessibilityPageComponent },

apps/sistema-demo/src/app/sistema-pages/pastanaga-pages-override/index.ts

@@ -2,7 +2,6 @@ export * from './sistema-buttons/sistema-buttons.component';
 export * from './sistema-confirmation-dialog/sistema-confirmation-dialog.component';
 export * from './sistema-icons/sistema-icons.component';
 export * from './sistema-modal';
-export * from './sistema-palette/sistema-palette.component';
 export * from './sistema-scrollbar/sistema-scrollbar.component';
 export * from './sistema-tables/sistema-table.component';
 export * from './sistema-toasts/sistema-toast.component';

apps/sistema-demo/src/app/sistema-pages/pastanaga-pages-override/sistema-palette/sistema-palette.component.html

@@ -22,7 +22,6 @@ import {
   SistemaConfirmationDialogComponent,
   SistemaIconsComponent,
   SistemaModalComponent,
-  SistemaPaletteComponent,
   SistemaScrollbarComponent,
   SistemaTableComponent,
   SistemaToastComponent,
@@ -44,7 +43,6 @@ import { SistemaSpinnerComponent } from './sistema-spinner/sistema-spinner.compo
     ModalExampleComponent,
     SistemaIconsComponent,
     SistemaModalComponent,
-    SistemaPaletteComponent,
     SistemaScrollbarComponent,
     SistemaTableComponent,
     SistemaLabelComponent,

apps/sistema-demo/src/app/sistema-pages/pastanaga-pages-override/sistema-palette/sistema-palette.component.scss

@@ -1,3 +1,3 @@
 export const ICONS = 
-["search", "payment", "arrow-down", "list", "lock-off", "circle-chevron-right", "user", "account", "home", "more-horizontal", "chevron-down", "label", "square-arrow", "file", "knowledge-box", "chevron-up", "eye-closed", "lock", "chevron-right", "link", "key", "arrow-right", "log-out", "settings", "submenu", "circle-check", "code", "plus", "check", "warning", "info", "gear", "copy", "reload", "refresh", "image", "smile", "images", "search-plus", "play", "widget", "trash", "circle-plus", "circle-dash", "edit", "unlink", "upload-cloud", "unlock", "language", "forbidden", "eye", "add-user", "circle-cross", "more-vertical", "share", "arrow-up", "filter", "calendar", "arrow-left", "cross", "download-cloud", "upload", "add-file", "circle-minus", "help", "activity-log", "circle-chevron-left", "folder", "users", "chevron-left", "heart"]
+["search", "payment", "arrow-down", "list", "lock-off", "circle-chevron-right", "user", "account", "home", "more-horizontal", "chevron-down", "label", "square-arrow", "file", "knowledge-box", "chevron-up", "eye-closed", "lock", "chevron-right", "link", "key", "arrow-right", "log-out", "settings", "submenu", "circle-check", "code", "plus", "check", "warning", "info", "gear", "copy", "reload", "refresh", "image", "smile", "images", "search-plus", "play", "widget", "trash", "circle-plus", "circle-dash", "edit", "unlink", "upload-cloud", "unlock", "language", "forbidden", "eye", "add-user", "circle-cross", "more-vertical", "share", "arrow-up", "filter", "calendar", "arrow-left", "cross", "download-cloud", "upload", "add-file", "circle-minus", "help", "activity-log", "menu", "circle-chevron-left", "folder", "users", "chevron-left", "heart"]
 ;

apps/sistema-demo/src/app/sistema-pages/pastanaga-pages-override/sistema-palette/sistema-palette.component.ts

@@ -32,7 +32,7 @@
 }
 
 .login_policy {
-  color: $color-neutral-strong;
+  color: $color-neutral-regular;
   a {
     color: inherit;
   }
@@ -64,7 +64,7 @@
   .login_social_button {
     -webkit-appearance: none;
 
-    background-color: $color-neutral-lightest;
+    background-color: $color-neutral-background;
     border: none;
     border-radius: $border-radius-default;
     box-shadow: var(--stf-shadow-button) $color-neutral-light;

apps/sistema-demo/src/app/sistema-pages/sistema-pages.module.ts

@@ -8,6 +8,7 @@ overrides for:
     theme/layout
     theme/scrollbar
  */
+@import "tokens/palette.tokens";
 @import "tokens/spacing.tokens";
 @import "tokens/typography.tokens";
 @import "tokens/scrollbar.tokens";