[ACA-1447] style fixes (#403)

* style fixes

* style fixes

* fix 'New' label styles

src/app/ui/application.scss

@@ -28,8 +28,4 @@ ng-component {
 @import './overrides/adf-sidenav-layout';
 @import './overrides/alfresco-document-list';
 @import './overrides/alfresco-upload-drag-area';
-@import './overrides/alfresco-upload-button';
 @import './overrides/alfresco-upload-dialog';
-@import './overrides/toolbar';
-@import './overrides/_adf-sidebar-action-menu';
-

src/app/ui/custom-theme.scss

@@ -2,9 +2,11 @@
 @import '~@alfresco/adf-content-services/theming';
 
 @import '../components/sidenav/sidenav.component.theme';
-@import './overrides/toolbar';
+@import './overrides/adf-toolbar.theme';
 @import './overrides/adf-search-filter.theme';
 @import './overrides/adf-info-drawer.theme';
+@import './overrides/adf-upload-button.theme';
+@import './overrides/adf-sidebar-action-menu.theme';
 @import 'snackbar';
 
 $grey-scale: (
@@ -49,8 +51,10 @@ $custom-theme: mat-light-theme($custom-theme-primary, $custom-theme-accent);
 
 @mixin custom-theme($theme) {
     @include sidenav-component-theme($custom-theme);
-    @include toolbar-component-theme($custom-theme);
+    @include adf-toolbar-theme($custom-theme);
     @include snackbar-theme($custom-theme);
     @include adf-search-filter-theme($custom-theme);
     @include adf-info-drawer-theme($custom-theme);
+    @include adf-upload-button-theme($custom-theme);
+    @include adf-sidebar-action-menu-theme($custom-theme);
 }

src/app/ui/overrides/_adf-sidebar-action-menu.scss

@@ -1,39 +0,0 @@
-.adf-sidebar-action-menu-options div .mat-menu-item {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-}
-
-.mat-menu-item[disabled],
-.mat-menu-item[disabled]:hover {
-    color: rgba(0, 0, 0, 0.38);
-}
-
-.mat-menu-panel.adf-sidebar-action-menu-panel {
-    max-width: 290px !important;
-}
-
-.adf-sidebar-action-menu-panel {
-    width: 290px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-
-.adf-sidebar-action-menu-panel .mat-menu-content {
-    width: 100%;
-}
-
-.adf-sidebar-action-menu-icon {
-    margin: 0;
-}
-
-.adf-sidebar-action-menu-icon div[sidebar-menu-expand-icon] {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-
-.adf-sidebar-action-menu {
-    width: 100%;
-}

src/app/ui/overrides/_alfresco-upload-button.scss

@@ -1,49 +0,0 @@
-@import '../_variables.scss';
-
-adf-upload-button {
-    .mat-raised-button.mat-primary {
-        width: 100%;
-        border-radius: 0;
-        text-align: left;
-        line-height: 48px;
-        box-shadow: none;
-        transform: none;
-        transition: unset;
-        background-color: $alfresco-white;
-    }
-
-    .mat-raised-button.mat-primary:hover:not([disabled]) {
-        background-color: rgba(0, 0, 0, 0.04);
-    }
-
-    .mat-raised-button.mat-primary[disabled] {
-        background: none;
-    }
-
-    .mat-raised-button.mat-primary[disabled] label {
-        color: rgba(0, 0, 0, 0.38);
-    }
-
-    .mat-raised-button:not([disabled]):active {
-        box-shadow: none;
-    }
-
-    mat-icon {
-        color: rgba(0, 0, 0, 0.54);
-    }
-
-    label {
-        text-transform: capitalize;
-        font-family: Muli;
-        font-size: 16px;
-        font-weight: normal;
-        text-align: left;
-        margin-left: 12px;
-        color: $alfresco-primary-text-color;
-    }
-
-    &:hover label {
-        color: #ff9800;
-        opacity: inherit;
-    }
-}

src/app/ui/overrides/adf-sidebar-action-menu.theme.scss

@@ -0,0 +1,70 @@
+@mixin adf-sidebar-action-menu-theme($theme) {
+    $foreground: map-get($theme, foreground);
+    $accent: map-get($theme, accent);
+    $primary: map-get($theme, primary);
+
+    .adf-sidebar-action-menu {
+        .adf-sidebar-action-menu-button {
+            font-size: 12.7px;
+            font-weight: normal;
+            text-transform: uppercase;
+        }
+    }
+
+    .mat-menu-panel.adf-sidebar-action-menu-panel {
+        max-width: 290px !important;
+    }
+
+    .adf-sidebar-action-menu-panel {
+        width: 290px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+
+    .adf-sidebar-action-menu-panel .mat-menu-content {
+        width: 100%;
+    }
+
+    .adf-sidebar-action-menu-icon {
+        margin: 0;
+    }
+
+    .adf-sidebar-action-menu-icon div[sidebar-menu-expand-icon] {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+
+    .adf-sidebar-action-menu {
+        width: 100%;
+    }
+
+    .adf-sidebar-action-menu-options {
+        width: 100% !important;
+
+        .mat-menu-item {
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+            font-size: 14px;
+            color: mat-color($foreground, text, 0.54);
+            line-height: 48px;
+            box-shadow: none;
+            transform: none;
+            transition: unset;
+            font-weight: normal;
+            text-transform: capitalize;
+            color: mat-color($primary);
+
+            &:hover {
+                color: mat-color($accent);
+            }
+        }
+
+        .mat-menu-item[disabled],
+        .mat-menu-item[disabled]:hover {
+            color: mat-color($foreground, text, 0.38);
+        }
+    }
+}

src/app/ui/overrides/adf-toolbar.theme.scss

@@ -1,4 +1,4 @@
-@mixin toolbar-component-theme($theme) {
+@mixin adf-toolbar-theme($theme) {
 
     .adf-toolbar {
         @include angular-material-theme($theme);

src/app/ui/overrides/adf-upload-button.theme.scss

@@ -0,0 +1,53 @@
+@mixin adf-upload-button-theme($theme) {
+    $foreground: map-get($theme, foreground);
+    $accent: map-get($theme, accent);
+    $primary: map-get($theme, primary);
+
+    adf-upload-button {
+        .mat-raised-button.mat-primary {
+            width: 100%;
+            border-radius: 0;
+            text-align: left;
+            line-height: 48px;
+            box-shadow: none;
+            transform: none;
+            transition: unset;
+            background-color: transparent;
+        }
+
+        .mat-raised-button.mat-primary:hover:not([disabled]) {
+            background-color: mat-color($foreground, text, 0.04);
+        }
+
+        .mat-raised-button.mat-primary[disabled] {
+            background: none;
+        }
+
+        .mat-raised-button.mat-primary[disabled] label {
+            color: mat-color($foreground, text, 0.38);
+        }
+
+        .mat-raised-button:not([disabled]):active {
+            box-shadow: none;
+        }
+
+        mat-icon {
+            color: mat-color($foreground, text, 0.54);
+        }
+
+        label {
+            text-transform: capitalize;
+            font-family: Muli;
+            font-size: 14px;
+            font-weight: normal;
+            text-align: left;
+            margin-left: 12px;
+            color: mat-color($primary);
+        }
+
+        &:hover label {
+            color: mat-color($accent);
+            opacity: inherit;
+        }
+    }
+}