Merge pull request #1189 from Alfresco/sdirla-remove-css-overrides

[ACA-2140][ACA-2361] remove ADF style overrides

src/app/components/permissions/permission-manager/permission-manager.component.theme.scss

@@ -6,19 +6,6 @@
     height: 400px;
   }
 
-  // ADF FIXES
-  adf-permission-list {
-    .adf-display-permission-container {
-      flex: 1;
-
-      .adf-datatable-permission {
-        .adf-datatable-cell--icon {
-          width: auto;
-        }
-      }
-    }
-  }
-
   .aca-node-permissions-dialog {
     .mat-dialog-title {
       font-size: 20px;

src/app/components/search/search-results/search-results.component.scss

@@ -41,10 +41,6 @@
     }
   }
 
-  .text--bold {
-    font-weight: 600;
-  }
-
   .content {
     @include flex-row;
     flex: unset;
@@ -58,4 +54,23 @@
       height: unset;
     }
   }
+
+  .adf-datatable {
+    .adf-datatable-row {
+      padding: 0 15px;
+    }
+
+    .adf-datatable-cell {
+      margin: 0 5px;
+      padding-left: 5px;
+      padding-top: 9px;
+      padding-bottom: 9px;
+      min-height: auto;
+
+      .adf-datatable-cell-value {
+        display: inline-block;
+        padding: 0;
+      }
+    }
+  }
 }

src/app/components/search/search-results/search-results.component.ts

@@ -23,7 +23,7 @@
  * along with Alfresco. If not, see <http://www.gnu.org/licenses/>.
  */
 
-import { Component, OnInit, ViewChild } from '@angular/core';
+import { Component, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
 import { NodePaging, Pagination, MinimalNodeEntity } from '@alfresco/js-api';
 import { ActivatedRoute, Params, Router } from '@angular/router';
 import {
@@ -46,6 +46,7 @@ import { Observable } from 'rxjs';
 @Component({
   selector: 'aca-search-results',
   templateUrl: './search-results.component.html',
+  encapsulation: ViewEncapsulation.None,
   styleUrls: ['./search-results.component.scss']
 })
 export class SearchResultsComponent extends PageComponent implements OnInit {

src/app/ui/custom-theme.scss

@@ -11,7 +11,7 @@
 @import '../components/create-menu/create-menu.component.scss';
 @import '../components/layout/layout.theme.scss';
 
-@import './overrides/adf-document-list.theme';
+@import './overrides/adf-style-fixes.theme';
 
 @import 'snackbar';
 
@@ -58,7 +58,7 @@ $foreground: map-get($custom-theme, foreground);
 $warn: map-get($custom-theme, warn);
 
 @mixin custom-theme($theme) {
-  @include adf-document-list-theme($theme);
+  @include adf-style-fixes($theme);
 
   @include layout-theme($theme);
   @include aca-search-input-theme($theme);
@@ -79,7 +79,15 @@ $warn: map-get($custom-theme, warn);
 //Custom variables - ACA specific styling:
 $document-list-selection-color: mat-color($alfresco-ecm-blue, 500);
 $document-list-background: white;
+$data-table-dividers-wrapper-border: none;
 $data-table-thumbnail-width: 35px;
+$data-table-cell-min-width: 150px;
+$data-table-cell-min-width--no-grow: 120px;
+$data-table-cell-min-width--fileSize: 80px !important;
+$data-table-cell-text-color: mat-color($foreground, text, 0.54);
+$data-table-cell-link-color: mat-color($foreground, text);
+$data-table-hover-color: #e0f7fa;
+$data-table-selection-color: #e0f7fa;
 
 $adf-pagination--border: 1px solid mat-color($foreground, text, 0.07);
 $adf-pagination__empty--height: 0;

src/app/ui/overrides/adf-document-list.theme.scss

@@ -1,123 +0,0 @@
-@import 'mixins';
-
-@mixin adf-document-list-theme($theme) {
-  $background: map-get($theme, background);
-  $foreground: map-get($theme, foreground);
-  $primary: map-get($theme, primary);
-
-  $document-list-selection-color: mat-color($primary) !default;
-  $document-list-selection-background: #e0f7fa !default;
-  $document-list-background: mat-color($background, background) !default;
-  $document-list-text-color: mat-color($foreground, text, 0.54) !default;
-  $document-list-name-text-color: mat-color($foreground, text) !default;
-  $data-table-thumbnail-width: 50px !default;
-
-  .adf-datatable-list {
-    border: none;
-
-    .adf-ellipsis-cell {
-      overflow: hidden;
-    }
-
-    .adf-dynamic-column .adf-datatable-link:hover {
-      text-decoration: none;
-
-      .adf-datatable-cell-value {
-        text-decoration: underline;
-      }
-    }
-
-    .adf-datatable-cell,
-    .adf-datatable-cell-header {
-      .adf-datatable-link .adf-datatable-cell-value {
-        padding: 0 10px;
-      }
-    }
-  }
-
-  .mat-icon.adf-datatable-selected > svg {
-    fill: $document-list-selection-color;
-  }
-
-  adf-document-list {
-    @include flex-column;
-    background-color: $document-list-background;
-  }
-
-  .adf-datatable {
-    @include flex-column;
-    overflow-y: scroll;
-
-    .adf-datatable-cell-header,
-    .adf-datatable-cell {
-      min-width: 120px;
-
-      &.adf-no-grow-cell {
-        min-width: 120px;
-      }
-
-      &.adf-datatable-cell--fileSize {
-        min-width: 80px;
-      }
-
-      &:first-child {
-        min-width: $data-table-thumbnail-width;
-      }
-
-      &:focus {
-        outline: none !important;
-      }
-    }
-
-    .adf-datatable-cell {
-      color: $document-list-text-color;
-    }
-
-    .adf-datatable-body .adf-datatable-row {
-      &:hover,
-      &:focus {
-        background-color: $document-list-selection-background;
-      }
-
-      &.adf-is-selected,
-      &.adf-is-selected:hover {
-        background-color: $document-list-selection-background;
-      }
-    }
-
-    .adf-datatable--empty {
-      .adf-datatable-row {
-        &:hover,
-        &:focus {
-          background-color: unset;
-        }
-      }
-    }
-  }
-
-  .adf-search-results .adf-datatable .adf-datatable-cell {
-    padding-top: 9px;
-    padding-bottom: 9px;
-    min-height: auto;
-
-    .adf-datatable-cell-value {
-      display: inline-block;
-      padding-left: 0;
-    }
-  }
-
-  .adf-content-node-selector-content-list .adf-datatable-list {
-    .adf-datatable-cell {
-      flex: 0 1 auto;
-      min-width: 1px;
-
-      &:nth-child(2) {
-        flex: 1 0 200px;
-      }
-
-      &.adf-content-selector-visibility-cell {
-        display: initial;
-      }
-    }
-  }
-}

src/app/ui/overrides/adf-style-fixes.theme.scss

@@ -0,0 +1,31 @@
+@import 'mixins';
+
+@mixin adf-style-fixes($theme) {
+  $background: map-get($theme, background);
+  $foreground: map-get($theme, foreground);
+  $primary: map-get($theme, primary);
+
+  $data-table-cell-link-color: mat-color($foreground, text) !default;
+
+  .adf-datatable {
+    .adf-datatable-link,
+    .adf-location-cell a {
+      color: $data-table-cell-link-color;
+    }
+  }
+
+  adf-permission-list {
+    .adf-display-permission-container {
+      flex: 1;
+
+      .adf-datatable-permission {
+        width: 100%;
+
+        .adf-datatable-cell--icon,
+        .adf-datatable-cell--image {
+          min-width: $data-table-thumbnail-width;
+        }
+      }
+    }
+  }
+}