[ADF-5406] SCSS and HTML template path fixes (#7063)

* remove useless mixin

* fix scss paths

* style fixes

* fix styles

* style fixes

* style fixes

* style fixes

* style fixes

* insights fixes

* css and template path fixes

* bug fixes
This commit is contained in:
Denys Vuika
2021-06-01 09:21:00 +01:00
committed by GitHub
parent 9e0000a307
commit e94b2f99bd
229 changed files with 557 additions and 934 deletions

View File

@@ -1,55 +1,40 @@
@mixin adf-aspect-list-dialog-theme($theme) {
$primary: map-get($theme, primary);
$accent: map-get($theme, accent);
$warn: map-get($theme, warn);
$foreground: map-get($theme, foreground);
$background: map-get($theme, background);
.adf {
&-aspect-list-dialog-title {
font-size: large;
font-weight: 200;
margin-top: 0;
}
&-aspect-list-dialog-description {
font-size: small;
line-height: normal;
}
&-aspect-list-dialog-information {
display: flex;
justify-content: space-between;
padding-left: 5px;
padding-right: 5px;
font-size: small;
}
&-aspect-list-dialog {
.mat-dialog-actions {
justify-content: space-between;
}
}
&-aspect-dialog-content {
padding-top: 3px;
.adf-aspect-property-table {
.mat-cell {
font-size: smaller;
}
.mat-column-name {
width: 30%;
}
}
}
.adf {
&-aspect-list-dialog-title {
font-size: large;
font-weight: 200;
margin-top: 0;
}
&-aspect-list-dialog-description {
font-size: small;
line-height: normal;
}
&-aspect-list-dialog-information {
display: flex;
justify-content: space-between;
padding-left: 5px;
padding-right: 5px;
font-size: small;
}
&-aspect-list-dialog {
.mat-dialog-actions {
justify-content: space-between;
}
}
&-aspect-dialog-content {
padding-top: 3px;
.adf-aspect-property-table {
.mat-cell {
font-size: smaller;
}
.mat-column-name {
width: 30%;
}
}
}
}

View File

@@ -1,10 +1,5 @@
@mixin adf-aspect-list-theme($theme) {
$primary: map-get($theme, primary);
$accent: map-get($theme, accent);
$warn: map-get($theme, warn);
$foreground: map-get($theme, foreground);
$background: map-get($theme, background);
.adf {

View File

@@ -25,7 +25,6 @@ import { AspectEntry } from '@alfresco/js-api';
@Component({
selector: 'adf-aspect-list',
templateUrl: './aspect-list.component.html',
styleUrls: ['./aspect-list.component.scss'],
encapsulation: ViewEncapsulation.None
})

View File

@@ -3,7 +3,6 @@
$accent: map-get($theme, accent);
$warn: map-get($theme, warn);
$foreground: map-get($theme, foreground);
$background: map-get($theme, background);
$breadcrumb-chevron-spacer: 2px;
$breadcrumb-outline: 1px solid mat-color($alfresco-ecm-blue, A200) !default;

View File

@@ -35,7 +35,6 @@ import { takeUntil } from 'rxjs/operators';
@Component({
selector: 'adf-breadcrumb',
templateUrl: './breadcrumb.component.html',
styleUrls: ['./breadcrumb.component.scss'],
encapsulation: ViewEncapsulation.None,
host: {
'class': 'adf-breadcrumb'

View File

@@ -23,7 +23,6 @@ import { BreadcrumbComponent } from './breadcrumb.component';
@Component({
selector: 'adf-dropdown-breadcrumb',
templateUrl: './dropdown-breadcrumb.component.html',
styleUrls: ['./dropdown-breadcrumb.component.scss'],
encapsulation: ViewEncapsulation.None,
host: {
'class': 'adf-dropdown-breadcrumb'

View File

@@ -1,6 +1,4 @@
@mixin adf-content-metadata-card-theme($theme) {
$primary: map-get($theme, primary);
$background: map-get($theme, background);
$foreground: map-get($theme, foreground);
.adf-content-metadata-card {

View File

@@ -22,7 +22,6 @@ import { NodeAspectService } from '../../../aspect-list/node-aspect.service';
@Component({
selector: 'adf-content-metadata-card',
templateUrl: './content-metadata-card.component.html',
styleUrls: ['./content-metadata-card.component.scss'],
encapsulation: ViewEncapsulation.None,
host: { 'class': 'adf-content-metadata-card' }
})

View File

@@ -36,7 +36,6 @@ import { takeUntil, debounceTime, catchError, map } from 'rxjs/operators';
@Component({
selector: 'adf-content-metadata',
templateUrl: './content-metadata.component.html',
styleUrls: ['./content-metadata.component.scss'],
host: { 'class': 'adf-content-metadata' },
encapsulation: ViewEncapsulation.None
})

View File

@@ -1,7 +1,6 @@
@mixin adf-content-node-selector-theme($theme) {
$primary: map-get($theme, primary);
$foreground: map-get($theme, foreground);
$background: map-get($theme, background);
$content-node-selector-thumbnail-width: 35px !default;
.adf-search-results-label {

View File

@@ -58,7 +58,6 @@ export const defaultValidation = () => true;
@Component({
selector: 'adf-content-node-selector-panel',
styleUrls: ['./content-node-selector-panel.component.scss'],
templateUrl: './content-node-selector-panel.component.html',
encapsulation: ViewEncapsulation.None,
host: { 'class': 'adf-content-node-selector-panel' },

View File

@@ -27,7 +27,6 @@ import { NodeAction } from '../document-list/models/node-action.enum';
@Component({
selector: 'adf-content-node-selector',
templateUrl: './content-node-selector.component.html',
styleUrls: ['./content-node-selector.component.scss'],
encapsulation: ViewEncapsulation.None
})
export class ContentNodeSelectorComponent implements OnInit {

View File

@@ -24,7 +24,6 @@ import { DataRow } from '@alfresco/adf-core';
<div class="adf-name-location-cell-name adf-datatable-cell-value" [title]="name">{{ name }}</div>
<div class="adf-name-location-cell-location adf-datatable-cell-value" [title]="path">{{ path }}</div>
`,
styleUrls: ['./name-location-cell.component.scss'],
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
host: { class: 'adf-name-location-cell adf-datatable-content-cell' }

View File

@@ -45,7 +45,6 @@ type DatePickerType = 'date' | 'time' | 'month' | 'datetime';
@Component({
selector: 'adf-share-dialog',
templateUrl: './content-node-share.dialog.html',
styleUrls: ['./content-node-share.dialog.scss'],
host: { class: 'adf-share-dialog' },
encapsulation: ViewEncapsulation.None
})

View File

@@ -1,10 +1,5 @@
@mixin adf-content-type-dialog-theme($theme) {
$primary: map-get($theme, primary);
$accent: map-get($theme, accent);
$warn: map-get($theme, warn);
$foreground: map-get($theme, foreground);
$background: map-get($theme, background);
.adf {

View File

@@ -24,7 +24,6 @@ import { ContentTypeService } from './content-type.service';
@Component({
selector: 'adf-content-type-dialog',
templateUrl: './content-type-dialog.component.html',
styleUrls: ['./content-type-dialog.component.scss'],
encapsulation: ViewEncapsulation.None
})
export class ContentTypeDialogComponent implements OnInit {

View File

@@ -1,31 +1,31 @@
.adf-fill-remaining-space {
flex: 1 1 auto;
}
.adf-full-width {
width: 100%;
}
.adf-lock-file-name {
.mat-checkbox-layout {
width: 100%;
}
.mat-checkbox-label {
text-overflow: ellipsis;
overflow: hidden;
}
.mat-checkbox-inner-container {
margin: auto 8px auto 0;
}
}
@mixin adf-dialog-theme($theme) {
$primary: map-get($theme, primary);
$foreground: map-get($theme, foreground);
.adf-fill-remaining-space {
flex: 1 1 auto;
}
.adf-full-width {
width: 100%;
}
.adf-lock-file-name {
.mat-checkbox-layout {
width: 100%;
}
.mat-checkbox-label {
text-overflow: ellipsis;
overflow: hidden;
}
.mat-checkbox-inner-container {
margin: auto 8px auto 0;
}
}
.adf-dialog-buttons button {
text-transform: uppercase;
}

View File

@@ -17,7 +17,7 @@
import { Observable } from 'rxjs';
import { Component, Inject, OnInit, Optional, EventEmitter, Output } from '@angular/core';
import { Component, Inject, OnInit, Optional, EventEmitter, Output, ViewEncapsulation } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
@@ -28,8 +28,8 @@ import { forbidEndingDot, forbidOnlySpaces, forbidSpecialCharacters } from './fo
@Component({
selector: 'adf-folder-dialog',
styleUrls: ['./folder.dialog.scss'],
templateUrl: './folder.dialog.html'
templateUrl: './folder.dialog.html',
encapsulation: ViewEncapsulation.None
})
export class FolderDialogComponent implements OnInit {

View File

@@ -17,7 +17,7 @@
import moment from 'moment-es6';
import { Component, Inject, OnInit, Optional } from '@angular/core';
import { Component, Inject, OnInit, Optional, ViewEncapsulation } from '@angular/core';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { FormBuilder, FormGroup } from '@angular/forms';
@@ -26,8 +26,8 @@ import { AlfrescoApiService } from '@alfresco/adf-core';
@Component({
selector: 'adf-node-lock',
styleUrls: ['./folder.dialog.scss'],
templateUrl: './node-lock.dialog.html'
templateUrl: './node-lock.dialog.html',
encapsulation: ViewEncapsulation.None
})
export class NodeLockDialogComponent implements OnInit {

View File

@@ -154,7 +154,7 @@
word-break: break-all;
white-space: pre-line;
@media screen and ($mat-xsmall) {
@media screen and (max-width: 599px) {
font-size: 48px;
}
}
@@ -176,7 +176,7 @@
object-fit: contain;
margin-top: 17px;
@media screen and ($mat-xsmall) {
@media screen and (max-width: 599px) {
width: 250px;
}
}

View File

@@ -65,7 +65,6 @@ import { takeUntil } from 'rxjs/operators';
@Component({
selector: 'adf-document-list',
styleUrls: ['./document-list.component.scss'],
templateUrl: './document-list.component.html',
encapsulation: ViewEncapsulation.None,
host: { class: 'adf-document-list' }

View File

@@ -24,7 +24,6 @@ import { MemberModel } from '../../models/member.model';
@Component({
selector: 'adf-add-permission-dialog',
templateUrl: './add-permission-dialog.component.html',
styleUrls: ['./add-permission-dialog.component.scss'],
encapsulation: ViewEncapsulation.None
})
export class AddPermissionDialogComponent {

View File

@@ -1,9 +1,6 @@
@mixin adf-add-permission-panel-theme($theme) {
$background: map-get($theme, background);
$foreground: map-get($theme, foreground);
$primary: map-get($theme, primary);
$accent: map-get($theme, accent);
$mat-menu-border-radius: 2px !default;
$search-result-height: calc(100% - 75px);

View File

@@ -26,7 +26,6 @@ import { SearchComponent } from '../../../search/components/search.component';
@Component({
selector: 'adf-add-permission-panel',
templateUrl: './add-permission-panel.component.html',
styleUrls: ['./add-permission-panel.component.scss'],
encapsulation: ViewEncapsulation.None,
providers: [
{ provide: SearchConfigurationService, useClass: SearchPermissionConfigurationService },

View File

@@ -24,7 +24,6 @@ import { RoleModel } from '../../models/role.model';
@Component({
selector: 'adf-add-permission',
templateUrl: './add-permission.component.html',
styleUrls: ['./add-permission.component.scss'],
encapsulation: ViewEncapsulation.None
})
/*

View File

@@ -1,36 +1,32 @@
@mixin adf-permission-container-theme($theme) {
$adf-permission-list-width: 100% !default;
.adf-datatable-permission {
display: flex;
min-width: 450px;
width: 100%;
.adf-datatable-permission {
display: flex;
min-width: 450px;
width: $adf-permission-list-width;
&.adf-datatable {
overflow: hidden;
&.adf-datatable {
overflow: hidden;
.adf-delete-permission-column {
min-width: 80px;
.adf-delete-permission-column {
min-width: 80px;
.adf-cell-value {
width: 80px;
padding-right: 10px;
place-content: flex-end;
}
.adf-cell-value {
width: 80px;
padding-right: 10px;
place-content: flex-end;
}
}
.adf-authorityId-column {
flex: 40%;
}
.adf-authorityId-column {
flex: 40%;
}
.adf-authority-icon-column {
min-width: 40px;
}
.adf-authority-icon-column {
min-width: 40px;
}
.adf-datatable-selected > svg {
width: 40px;
height: 40px;
}
.adf-datatable-selected > svg {
width: 40px;
height: 40px;
}
}
}

View File

@@ -1,9 +1,5 @@
@mixin adf-permission-list-theme($theme) {
$primary: map-get($theme, primary);
$accent: map-get($theme, accent);
$warn: map-get($theme, warn);
$foreground: map-get($theme, foreground);
$background: map-get($theme, background);
.adf {
&-permission-card {

View File

@@ -24,7 +24,6 @@ import { PermissionListService } from './permission-list.service';
@Component({
selector: 'adf-permission-list',
templateUrl: './permission-list.component.html',
styleUrls: ['./permission-list.component.scss'],
encapsulation: ViewEncapsulation.None
})
export class PermissionListComponent {

View File

@@ -1,6 +1,5 @@
@mixin adf-user-icon-column-theme($theme) {
$primary: map-get($theme, primary);
$document-list-selection-color: mat-color($accent) !default;
.adf {
&-people-initial {
@@ -31,7 +30,7 @@
&-people-select-icon {
margin: 0 !important;
svg {
fill: $document-list-selection-color;
fill: mat-color($accent);
width: 40px;
height: 40px;
}

View File

@@ -34,7 +34,6 @@ import { NodePermissionService } from '../../services/node-permission.service';
<mat-icon class="adf-people-select-icon adf-datatable-selected" svgIcon="selected"></mat-icon>
</div>
`,
styleUrls: ['./user-icon-column.component.scss'],
host: { class: 'adf-user-icon-column adf-datatable-content-cell' }
})
export class UserIconColumnComponent implements OnInit {

View File

@@ -1,5 +1,4 @@
@mixin user-name-column-theme($theme) {
$primary: map-get($theme, primary);
$foreground: map-get($theme, foreground);
.adf-user {

View File

@@ -32,8 +32,7 @@ import { EcmUserModel } from '@alfresco/adf-core';
</span>
</div>
`,
host: { class: 'adf-user-name-column adf-datatable-content-cell adf-expand-cell-5 adf-ellipsis-cell' },
styleUrls: [ './user-name-column.component.scss' ]
host: { class: 'adf-user-name-column adf-datatable-content-cell adf-expand-cell-5 adf-ellipsis-cell' }
})
export class UserNameColumnComponent implements OnInit {
@Input()

View File

@@ -21,7 +21,6 @@ import { SearchFilterComponent } from '../../components/search-filter/search-fil
@Component({
selector: 'adf-search-chip-list',
templateUrl: './search-chip-list.component.html',
styleUrls: ['./search-chip-list.component.scss'],
encapsulation: ViewEncapsulation.None,
host: { class: 'adf-search-chip-list' }
})

View File

@@ -1,8 +1,6 @@
@mixin adf-search-control-theme($theme) {
$background: map-get($theme, background);
$foreground: map-get($theme, foreground);
$primary: map-get($theme, primary);
$accent: map-get($theme, accent);
$mat-menu-border-radius: 2px !default;
$mat-menu-overlay-min-width: 112px !default; // 56 * 2
$mat-menu-overlay-max-width: 280px !default; // 56 * 5
@@ -29,7 +27,7 @@
background-color: mat-color($background, card);
border-radius: $mat-menu-border-radius;
@media screen and ($mat-small) {
@media screen and (max-width: 959px) {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;

View File

@@ -27,7 +27,6 @@ import { EmptySearchResultComponent } from './empty-search-result.component';
@Component({
selector: 'adf-search-control',
templateUrl: './search-control.component.html',
styleUrls: ['./search-control.component.scss'],
encapsulation: ViewEncapsulation.None,
host: { class: 'adf-search-control' }
})

View File

@@ -39,7 +39,6 @@ import { MatMenuTrigger } from '@angular/material/menu';
@Component({
selector: 'adf-search-filter-container',
templateUrl: './search-filter-container.component.html',
styleUrls: ['./search-filter-container.component.scss'],
encapsulation: ViewEncapsulation.None
})
export class SearchFilterContainerComponent implements OnInit, OnDestroy {

View File

@@ -35,7 +35,6 @@ export interface SelectedBucket {
@Component({
selector: 'adf-search-filter',
templateUrl: './search-filter.component.html',
styleUrls: ['./search-filter.component.scss'],
encapsulation: ViewEncapsulation.None,
host: { class: 'adf-search-filter' }
})

View File

@@ -23,7 +23,6 @@ import { SEARCH_QUERY_SERVICE_TOKEN } from '../../search-query-service.token';
@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' }
})

View File

@@ -1,19 +1,9 @@
@mixin adf-search-autocomplete-theme($theme) {
$primary: map-get($theme, primary);
$accent: map-get($theme, accent);
$warn: map-get($theme, warn);
$foreground: map-get($theme, foreground);
$background: map-get($theme, background);
$mat-menu-border-radius: 2px !default;
.adf {
&-search-hide {
visibility: hidden;
}
.adf {
&-search-hide {
visibility: hidden;
}
&-search-show {
visibility: visible;
}
&-search-show {
visibility: visible;
}
}

View File

@@ -1,11 +1,3 @@
@mixin selected {
color: #2196f3;
}
@mixin unselected {
color: #808080;
}
.adf-like-container {
display: flex;
overflow: hidden;
@@ -24,17 +16,17 @@
.adf-like-select {
cursor: pointer;
@include selected;
color: #2196f3;
&:hover {
@include unselected;
color: #808080;
}
}
.adf-like-grey {
cursor: pointer;
@include unselected;
color: #808080;
&:hover {
@include selected;
color: #2196f3;
}
}

View File

@@ -8,7 +8,6 @@
@import '../upload/components/file-uploading-dialog.component';
@import '../upload/components/upload-drag-area.component';
@import '../search/components/search.component';
@import '../search/components/search-control.component';
@import '../search/components/search-sorting-picker/search-sorting-picker.component';
@import '../search/components/search-filter/search-filter.component';
@@ -24,12 +23,9 @@
@import '../permission-manager/components/add-permission/add-permission.component';
@import '../permission-manager/components/add-permission/add-permission-dialog.component';
@import '../permission-manager/components/add-permission/add-permission-panel.component';
@import '../tree-view/components/tree-view.component';
@import '../version-manager/version-comparison.component';
@import '../content-type/content-type-dialog.component';
@import '../aspect-list/aspect-list.component';
@import '../aspect-list/aspect-list-dialog.component';
@import '../permission-manager/components/permission-container/permission-container.component';
@import '../permission-manager/components/user-icon-column/user-icon-column.component';
@import '../permission-manager/components/user-name-column/user-name-column.component';
@@ -44,24 +40,20 @@
@include adf-upload-dialog-theme($theme);
@include adf-upload-drag-area-theme($theme);
@include adf-search-control-theme($theme);
@include adf-search-autocomplete-theme($theme);
@include adf-search-sorting-picker-theme($theme);
@include adf-filter-menu-theme($theme);
@include adf-dialog-theme($theme);
@include adf-content-node-selector-dialog-theme($theme);
@include adf-content-metadata-module-theme($theme);
@include adf-permission-list-theme($theme);
@include adf-permission-container-theme($theme);
@include adf-user-icon-column-theme($theme);
@include user-name-column-theme($theme);
@include adf-add-permission-theme($theme);
@include adf-add-permission-dialog-theme($theme);
@include adf-add-permission-panel-theme($theme);
@include adf-tree-view-theme($theme);
@include adf-search-filter-theme($theme);
@include adf-search-chip-list-theme($theme);
@include adf-version-comparison-theme($theme);
@include adf-content-type-dialog-theme($theme);
@include adf-aspect-list-theme($theme);
@include adf-aspect-list-dialog-theme($theme);
}

View File

@@ -1,21 +1,15 @@
@mixin adf-tree-view-theme($theme) {
$primary: map-get($theme, primary);
$foreground: map-get($theme, foreground);
$background: map-get($theme, background);
.adf {
&-tree-view-icon {
color: #d9e022;
}
.adf {
&-tree-view-icon {
color: #d9e022;
}
&-tree-view-node.mat-tree-node {
min-height: 40px;
font-size: 12px;
align-items: baseline;
}
&-tree-view-node.mat-tree-node {
min-height: 40px;
font-size: 12px;
align-items: baseline;
}
&-tree-view-label {
cursor: pointer;
}
&-tree-view-label {
cursor: pointer;
}
}

View File

@@ -24,8 +24,8 @@ import { NodeEntry } from '@alfresco/js-api';
@Component({
selector: 'adf-tree-view-list',
templateUrl: 'tree-view.component.html',
styleUrls: ['tree-view.component.scss']
templateUrl: './tree-view.component.html',
styleUrls: ['./tree-view.component.scss']
})
export class TreeViewComponent implements OnChanges {

View File

@@ -24,8 +24,7 @@ import { takeUntil, delay } from 'rxjs/operators';
@Component({
selector: 'adf-file-uploading-dialog',
templateUrl: './file-uploading-dialog.component.html',
styleUrls: ['./file-uploading-dialog.component.scss']
templateUrl: './file-uploading-dialog.component.html'
})
export class FileUploadingDialogComponent implements OnInit, OnDestroy {
/** Dialog direction. Can be 'ltr' or 'rtl. */

View File

@@ -20,8 +20,7 @@ import { Component, EventEmitter, Input, Output } from '@angular/core';
@Component({
selector: 'adf-file-uploading-list-row',
templateUrl: './file-uploading-list-row.component.html',
styleUrls: ['./file-uploading-list-row.component.scss']
templateUrl: './file-uploading-list-row.component.html'
})
export class FileUploadingListRowComponent {
@Input()

View File

@@ -25,7 +25,6 @@ import { UploadBase } from './base-upload/upload-base';
@Component({
selector: 'adf-upload-drag-area',
templateUrl: './upload-drag-area.component.html',
styleUrls: ['./upload-drag-area.component.scss'],
host: {'class': 'adf-upload-drag-area'},
viewProviders: [
{provide: EXTENDIBLE_COMPONENT, useExisting: forwardRef(() => UploadDragAreaComponent)}

View File

@@ -21,8 +21,7 @@ import { ThumbnailService } from '@alfresco/adf-core';
@Component({
selector: 'adf-version-comparison',
templateUrl: './version-comparison.component.html',
styleUrls: ['./version-comparison.component.scss']
templateUrl: './version-comparison.component.html'
})
export class VersionComparisonComponent {

View File

@@ -40,7 +40,7 @@ import { Component, EventEmitter, Input, OnChanges, Output } from '@angular/core
*/
@Component({
selector: 'adf-webscript-get',
templateUrl: 'webscript.component.html'
templateUrl: './webscript.component.html'
})
export class WebscriptComponent implements OnChanges {