inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ACS-7535][ACS-7537][ACS-7536][ACA] Move/Copy dialogs, Share dialog, Aspects dialog (#9553)

Browse Source
This commit is contained in:
jacekpluta
2024-04-15 12:19:23 +02:00
committed by VitoAlbano
parent 65cc703eaa
commit 7e467d6f6e
10 changed files with 116 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
lib/content-services/src/lib/aspect-list/aspect-list-dialog.component.scss
View File

@@ -2,7 +2,10 @@
adf-aspect-list-dialog {
display: block;
padding: 24px 24px 8px;
#{$mat-expansion-panel-body} {
margin-top: -2px;
}
}
.adf {
@@ -20,7 +23,7 @@ adf-aspect-list-dialog {
&-aspect-list-dialog-information {
display: flex;
justify-content: space-between;
padding-top: 10px;
padding-bottom: 4px;
padding-left: 4px;
padding-right: 4px;
font-size: small;
@@ -42,7 +45,6 @@ adf-aspect-list-dialog {
}
&-aspect-dialog-content {
padding-top: 3px;
margin-bottom: 8px;
.adf-aspect-property-table {

6
lib/content-services/src/lib/aspect-list/aspect-list.component.scss
View File

@@ -46,7 +46,7 @@ $dialog-list-height: calc(65vh - ($dialog-title-height + $dialog-information-hei
&-header {
font-size: smaller;
padding-left: 16px;
padding-left: 12px;
}
&-header-title {
@@ -77,14 +77,18 @@ $dialog-list-height: calc(65vh - ($dialog-title-height + $dialog-information-hei
.adf-aspect-property-table-column {
&-name {
width: 15%;
padding-left: 24px;
padding-right: 0;
}
&-title {
width: 65%;
padding: 0;
}
&-data-type {
width: 20%;
padding-right: 24px;
padding-left: 10px;
}
}

7
lib/content-services/src/lib/content-node-selector/content-node-selector-panel.component.html
View File

@@ -1,10 +1,13 @@
<div class="adf-content-node-selector-content">
<mat-form-field floatPlaceholder="never" class="adf-content-node-selector-content-input" *ngIf="showSearch">
<mat-form-field floatPlaceholder="never"
class="adf-content-node-selector-content-input"
subscriptSizing="dynamic"
*ngIf="showSearch">
<mat-label>{{'NODE_SELECTOR.SEARCH' | translate}}</mat-label>
<input matInput
id="searchInput"
[formControl]="searchInput"
type="text"
placeholder="{{'NODE_SELECTOR.SEARCH' | translate}}"
[value]="searchTerm"
adf-auto-focus
data-automation-id="content-node-selector-search-input">

35
lib/content-services/src/lib/content-node-selector/content-node-selector-panel.component.scss
View File

@@ -1,3 +1,5 @@
@import 'styles/mat-selectors';
/* stylelint-disable no-descending-specificity */
$content-node-selector-thumbnail-width: 35px !default;
$content-node-selector-thumbnail-max-width: 40px !default;
@@ -13,6 +15,13 @@ h2.adf-search-results-label {
color: var(--adf-theme-foreground-text-color-087);
}
#{$mdc-dialog} {
#{$mat-dialog-surface}:is(div) {
padding-bottom: 0;
}
}
.adf-content-node-selector-panel {
.adf-toolbar .adf-toolbar-container.adf-toolbar-container-row {
max-height: 48px;
@@ -28,6 +37,7 @@ h2.adf-search-results-label {
}
&-document-list-container {
margin-top: 16px;
width: 100%;
}
@@ -50,9 +60,22 @@ h2.adf-search-results-label {
.adf-site-dropdown-container {
display: block;
margin-bottom: 15px;
#{$mat-form-field-label} {
padding-top: 16px;
}
#{$mat-floating-label-above} {
padding-top: 0;
}
}
}
.adf-sites-dropdown-form-field {
margin-top: 4px;
margin-bottom: 16px;
}
.adf-site-dropdown-list-element {
width: 100%;
margin-bottom: 0;
@@ -84,6 +107,7 @@ h2.adf-search-results-label {
}
}
&-content-list,
&-list {
height: 40vh;
overflow: auto;
@@ -147,8 +171,7 @@ h2.adf-search-results-label {
.adf-datatable-body .adf-datatable-row {
min-height: 40px;
@media screen and (-ms-high-contrast: active),
screen and (-ms-high-contrast: none) {
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
padding-top: 15px;
}
@@ -166,11 +189,17 @@ h2.adf-search-results-label {
}
}
.adf-datatable-list {
.adf-name-location-cell-location {
display: none;
}
}
&-searchLayout {
.adf-datatable-list .adf-datatable-body .adf-datatable-row {
min-height: 65px;
.adf-datatable-cell {
.adf-datatable-cell-container {
.adf-name-location-cell-location {
padding: 0 10px;
display: block;

45
lib/content-services/src/lib/content-node-selector/content-node-selector.component.scss
View File

@@ -1,3 +1,5 @@
@import 'styles/mat-selectors';
adf-content-node-selector {
.adf-upload-dialog {
box-shadow: none;
@@ -40,7 +42,48 @@ adf-content-node-selector {
}
.adf-content-node-selector-dialog {
#{$mat-form-field} {
width: 100%;
#{$mat-select-arrow-wrapper} {
transform: translateY(2px);
padding-right: 4px;
}
#{$mat-form-field-infix} {
border-top: 0.85em solid transparent;
padding-bottom: 6px;
padding-top: 20px;
}
#{$mat-floating-label} {
padding-top: 8px;
}
}
.adf-content-node-selector-content-input-icon {
font-size: 21px;
padding: 18px 0 0 0;
margin-right: -4px;
}
.adf-dropdown-breadcrumb-icon {
color: var(--adf-theme-foreground-base-color-045);
}
#{$mat-dialog-title} {
margin-bottom: 0;
padding: 0;
&::before {
display: none
}
}
.adf-content-node-selector-dialog-title {
padding-bottom: 4px;
padding-left: 0;
padding-right: 0;
font-size: var(--theme-title-font-size);
font-weight: 600;
font-style: normal;
@@ -57,7 +100,7 @@ adf-content-node-selector {
.adf-content-node-selector-dialog-actions {
padding: 8px;
height: 61px;
height: 77px;
background-color: var(--theme-background-color);
display: flex;
flex-direction: row;

4
lib/content-services/src/lib/content-node-share/content-node-share.dialog.html
View File

@@ -31,7 +31,7 @@
[style.display]="isExpiryDateToggleChecked ? 'block' : 'none'"
data-automation-id="adf-slide-toggle-checked"
class="adf-share-link__date-time-container">
<mat-form-field class="adf-full-width" subscriptSizing="dynamic" data-automation-id="adf-content-share-expiration-field" floatLabel="always">
<mat-form-field class="adf-full-width" subscriptSizing="dynamic" data-automation-id="adf-content-share-expiration-field">
<mat-label>{{ 'SHARE.EXPIRATION-PLACEHOLDER' | translate }}</mat-label>
<mat-datepicker-toggle
[disabled]="time.disabled"
@@ -89,7 +89,7 @@
formControlName="sharedUrl"
readonly="readonly">
<mat-icon
class="adf-input-action adf-share-link__icon"
class="adf-input-action adf-share-link__icon adf-share-link__copy-icon"
role="button"
matSuffix
[clipboard-notification]="'SHARE.CLIPBOARD-MESSAGE' | translate"

15
lib/content-services/src/lib/content-node-share/content-node-share.dialog.scss
View File

@@ -73,7 +73,7 @@
}
&--header {
padding: 16px 24px 0;
padding: 16px 24px 0 24px;
}
&--dialog-content {
@@ -98,6 +98,7 @@
&__icon {
color: var(--adf-theme-foreground-icon-color-054);
padding-bottom: 0;
padding-right: 0;
}
&__para {
@@ -110,9 +111,20 @@
font-size: var(--theme-subheading-2-font-size);
}
&__copy-icon {
padding-top: 18px;
font-size: 22px;
}
&__calender-icon {
top: 12px;
position: relative;
right: -6px;
svg {
height: 18px;
width: 18px;
}
}
&__date-time-container {
@@ -131,6 +143,7 @@
.adf-full-width {
width: 100%;
border-radius: 6px;
margin-top: -6px;
}
.adf-sharable-link {

2
lib/content-services/src/lib/content-node-share/content-node-share.dialog.spec.ts
View File

@@ -297,7 +297,7 @@ describe('ShareDialogComponent', () => {
fixture.detectChanges();
expect(fixture.debugElement.query(By.css('[data-automation-id="adf-content-share-expiration-field"]')).componentInstance.floatLabel).toBe(
'always'
'auto'
);
});

2
lib/content-services/src/lib/site-dropdown/sites-dropdown.component.html
View File

@@ -1,5 +1,5 @@
<div id="site-dropdown-container" class="adf-site-dropdown-container">
<mat-form-field class="adf-sites-dropdown-form-field">
<mat-form-field class="adf-sites-dropdown-form-field" subscriptSizing="dynamic">
<mat-label>{{ 'NODE_SELECTOR.LOCATION' | translate }}</mat-label>
<mat-select
adf-infinite-select-scroll

7
lib/core/src/lib/styles/_mat-selectors.scss
View File

@@ -93,4 +93,11 @@ $mat-toolbar: '.mat-toolbar';
$mat-slide-toggle: '.mat-mdc-slide-toggle';
$mat-checkbox-background: '.mdc-checkbox__background';
$mat-dialog-content: '.mdc-dialog__content';
$mat-floating-label: '.mdc-floating-label';
$mat-floating-label-above: '.mdc-floating-label--float-above';
$mat-form-field-infix: '.mat-mdc-form-field-infix';
$mat-select-arrow-wrapper: '.mat-mdc-select-arrow-wrapper';
$mat-dialog-title: '.mdc-dialog__title';
$mat-expansion-panel-body: '.mat-expansion-panel-body';
$mat-dialog-surface: '.mat-mdc-dialog-surface';
$mdc-dialog: '.mdc-dialog'