[ADF-4323] Add style fixes from ACA (#4546)

* [ADF-4323] add style fix for adf-search-sorting-picker

- moved from ACA

* [ADF-4323] use Flex Layout's media query mixin

* [ADF-4323] add style fix for adf-pagination

- moved from ACA

* [ADF-4323] add style fix for adf-version-manager

- which fixed issue [ACA-1750]

* [ADF-4323] remove not used property

* [ADF-4323] remove extra bottom-border

* [ADF-4323] upload-drag-area refactor to scss

* [ADF-4323] add style fix for adf file upload

- from ACA

* [ADF-4323] add style fix for adf-info-drawer

- from ACA

* [ADF-4323] add style fix for adf-toolbar

- from ACA

* [ADF-4323] add style fix for adf-sidenav-layout

- from ACA

* [ADF-4323] add style fix for adf-search-filter

- from ACA

* [ADF-4323] add style fix for adf-upload-drag-area

- from ACA

* [ADF-4323] add style fix for adf-info-drawer

- from ACA

* [ADF-4323] move style fix for adf-manage-versions from demo-shell

* [ADF-4323] use Flex Layout's media query mixin

* [ADF-4323] small fix to remove scrolling

* [ADF-4323] add adf-sidenav-layout host element class

* [ADF-4323] change 'inline' class name to 'adf-toolbar--inline'

- css lint was failing because of old naming

* [ADF-4323] set pagination empty state styling

* [ADF-4323] set pagination border to none

lib/content-services/search/components/search-filter/search-filter.component.scss

@@ -1,53 +1,66 @@
-.adf-search-filter {
+@mixin adf-search-filter-theme($theme) {
+    $foreground: map-get($theme, foreground);
 
-    .adf-checklist {
-        display: flex;
-        flex-direction: column;
+    .adf-search-filter {
 
-        .mat-checkbox-label {
-            text-overflow: ellipsis;
-            overflow: hidden;
-            width: 100%;
-        }
+        .adf-checklist {
+            display: flex;
+            flex-direction: column;
 
-        .mat-checkbox-layout {
-            width: 100%;
-        }
+            .mat-checkbox-label {
+                text-overflow: ellipsis;
+                overflow: hidden;
+                width: 100%;
+            }
 
-        .adf-facet-label {
-            text-overflow: ellipsis;
-            overflow: hidden;
-            white-space: nowrap;
-        }
+            .mat-checkbox-layout {
+                width: 100%;
+            }
 
-        .mat-checkbox {
-            margin: 5px;
+            .adf-facet-label {
+                text-overflow: ellipsis;
+                overflow: hidden;
+                white-space: nowrap;
+            }
 
-            &.mat-checkbox-checked .mat-checkbox-label {
-                font-weight: bold;
+            .mat-checkbox {
+                margin: 5px;
+
+                &.mat-checkbox-checked .mat-checkbox-label {
+                    font-weight: bold;
+                }
             }
         }
-    }
 
-    .adf-facet-result-filter {
-        display: flex;
-        flex-direction: column;
+        .adf-facet-result-filter {
+            display: flex;
+            flex-direction: column;
 
-        & > * {
-            width: 100%;
-        }
-    }
-
-    .adf-facet-buttons {
-        text-align: right;
-
-        .mat-button {
-            text-transform: uppercase;
+            & > * {
+                width: 100%;
+            }
         }
 
-        &--topSpace {
-            padding-top: 15px;
+        .adf-facet-buttons {
+            text-align: right;
+
+            .mat-button {
+                text-transform: uppercase;
+            }
+
+            &--topSpace {
+                padding-top: 15px;
+            }
+        }
+
+        .mat-expansion-panel-header-title {
+            font-size: 14px;
+            color: mat-color($foreground, text, 0.87);
+        }
+
+        .mat-checkbox-label,
+        .mat-radio-label {
+            color: mat-color($foreground, text, 0.54);
         }
     }
-
 }

lib/content-services/search/components/search-sorting-picker/search-sorting-picker.component.scss

@@ -0,0 +1,9 @@
+@mixin adf-search-sorting-picker-theme($theme) {
+    $foreground: map-get($theme, foreground);
+
+    .adf-search-sorting-picker {
+        .mat-icon-button {
+            color: mat-color($foreground, text, 0.54);
+        }
+    }
+}

lib/content-services/search/components/search-sorting-picker/search-sorting-picker.component.ts

@@ -22,6 +22,7 @@ import { SearchSortingDefinition } from '../../search-sorting-definition.interfa
 @Component({
     selector: 'adf-search-sorting-picker',
     templateUrl: './search-sorting-picker.component.html',
+    styleUrls: ['./search-sorting-picker.component.scss'],
     encapsulation: ViewEncapsulation.None,
     host: { class: 'adf-search-sorting-picker' }
 })