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

[ACS-7375] - Share link dialog issues

Browse Source
This commit is contained in:
Jacek Pluta 2024-04-08 15:35:05 +02:00 committed by VitoAlbano
parent 9054a6f4a5
commit 66f8f5a62b
9 changed files with 55 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,6 +1,6 @@
<div class="adf-share-link__dialog-content">
<div class="adf-share-link__dialog-container">
<div class="adf-share-link--row">
<div class="adf-share-link--header adf-share-link--row">
<div
data-automation-id="adf-share-dialog-title"
class="adf-share-link__title adf-share-link__label adf-share-link__heading"
@ -10,10 +10,10 @@
</div>
<mat-icon mat-dialog-close class="adf-share-link__close adf-share-link__icon">close</mat-icon>
</div>
<mat-dialog-content>
<mat-dialog-content class="adf-share-link--dialog-content">
<hr class="adf-share-link__separation-line" />
<form [formGroup]="form" class="adf-share-link__form">
<div class="adf-share-link--row">
<div class="adf-share-link--row adf-share-link--row-sharable">
<mat-icon class="adf-share-link__icon">timer</mat-icon>
<div class="adf-share-link__label adf-sharable-link">{{ 'SHARE.LINK-EXPIRY-DATE' | translate }}
</div>
@ -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" 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"
@ -47,7 +47,6 @@
class="adf-share-link__input"
#datePickerInput
matInput
placeholder="{{ 'SHARE.EXPIRATION-PLACEHOLDER' | translate }}"
[attr.aria-label]="'SHARE.EXPIRATION-LABEL' | translate"
[min]="minDate"
formControlName="time"
@ -60,10 +59,11 @@
</mat-form-field>
</div>
<p class="adf-share-link__info adf-share-link__para">{{ 'SHARE.SHARE-LINK' | translate }}</p>
<div class="adf-share-link--row">
<div class="adf-share-link--row adf-share-link--sharable-container">
<mat-slide-toggle
color="primary"
data-automation-id="adf-share-toggle"
class="adf-share-link--row__slide-toggle"
aria-label="{{ 'SHARE.TITLE' | translate }}"
[checked]="isFileShared"
[disabled]="!canUpdate || isDisabled"
@ -73,8 +73,9 @@
</div>
</div>
<mat-form-field
subscriptSizing="dynamic"
floatLabel="always"
class="adf-full-width"
class="adf-full-width adf-share-link__form--field"
data-automation-id="adf-content-share-public-link-field"
[ngClass]="isLinkWithExpiryDate? 'adf-share-link__border-color' : ''">
<input

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

@ -1,5 +1,11 @@
@import 'styles/mat-selectors';
.adf-share-link-dialog {
.adf-share-link {
#{$mat-form-field-flex} {
height: 48px;
}
&__dialog-content {
display: flex;
flex-direction: column;
@ -8,7 +14,6 @@
&__dialog-container {
background-color: var(--theme-card-background-color);
border-radius: 16px;
padding: 16px 24px;
}
&__label,
@ -29,6 +34,15 @@
&__form {
padding-top: 8px;
#{$mat-form-field-infix}:has(.adf-share-link__input) {
border-top: 0.9375em solid transparent;
height: 16px;
}
&--field {
padding-bottom: 16px;
}
}
&__public-content {
@ -48,6 +62,23 @@
flex-wrap: wrap;
align-items: center;
margin: 8px 0;
&-sharable {
margin-bottom: 0;
}
}
&--sharable-container {
margin-bottom: 0;
}
&--header {
padding: 16px 24px 0 24px;
}
&--dialog-content {
padding-top: 0;
padding-bottom: 0;
}
&__input {
@ -66,6 +97,7 @@
&__icon {
color: var(--adf-theme-foreground-icon-color-054);
padding-bottom: 0;
}
&__para {
@ -79,11 +111,12 @@
}
&__calender-icon {
font-size: 18px;
top: 12px;
position: relative;
}
&__date-time-container {
padding-bottom: 8px;
padding-bottom: 20px;
}
&__border-color {
@ -101,12 +134,13 @@
}
.adf-sharable-link {
margin-top: 2px;
margin-left: 8px;
}
.adf-share-link__actions {
justify-content: flex-end;
padding: 0;
padding: 8px 24px 32px 0;
margin: 8px 0 0;
& > button {

2
lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.scss
View File

@ -6,7 +6,7 @@ adf-search-chip-autocomplete-input {
width: 100%;
}
#{$mat-form-field-infix} {
#{$mat-form--text-field-infix} {
border: none;
}

4
lib/content-services/src/lib/search/components/search-properties/search-properties.component.scss
View File

@ -21,14 +21,14 @@ adf-search-properties {
.adf-search-properties-file-size-operator,
.adf-search-properties-file-size-unit {
#{$mat-form-field-infix} {
#{$mat-form--text-field-infix} {
border: 1px solid var(--adf-theme-mat-grey-color-a400);
border-radius: 5px;
padding: 9px;
}
&#{$mat-focused} {
#{$mat-form-field-infix} {
#{$mat-form--text-field-infix} {
outline: 2px auto -webkit-focus-ring-color;
}
}

2
lib/core/src/lib/card-view/components/card-view/card-view.component.scss
View File

@ -47,7 +47,7 @@
}
}
#{$mat-form-field-infix} {
#{$mat-form--text-field-infix} {
border-top-width: 0;
padding: 0;
}

2
lib/core/src/lib/form/components/inplace-form-input/inplace-form-input.component.scss
View File

@ -8,7 +8,7 @@ $adf-inplace-input-padding: 7px;
display: none;
}
#{$mat-form-field-infix} {
#{$mat-form--text-field-infix} {
display: flex;
border-top: 0;
}

2
lib/core/src/lib/form/components/widgets/date-time/date-time.widget.scss
View File

@ -17,7 +17,7 @@
top: 0;
}
#{$mat-form-field-infix} {
#{$mat-form--text-field-infix} {
width: 100%;
}
}

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

@ -45,7 +45,7 @@ $mat-form-field-underline: '.mdc-line-ripple';
$mat-form-field-subscript-wrapper: '.mat-mdc-form-field-subscript-wrapper';
$mat-form-field-prefix: '.mat-mdc-form-field-text-prefix';
$mat-form-field-suffix: '.mat-mdc-form-field-text-suffix';
$mat-form-field-infix: '.mat-mdc-form-text-infix';
$mat-form--text-field-infix: '.mat-mdc-form-text-infix';
$mat-form-field-label: '.mat-mdc-floating-label';
$mat-form-field-invalid: '.mat-form-field-invalid';
$mat-form-field-appearance-outline: '.mat-form-field-appearance-outline';
@ -93,3 +93,4 @@ $mat-toolbar: '.mat-toolbar';
$mat-slide-toggle: '.mat-mdc-slide-toggle';
$mat-checkbox-background: '.mdc-checkbox__background';
$mat-dialog-content: '.mdc-dialog__content';
$mat-form-field-infix: '.mat-mdc-form-field-infix';

2
lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.scss
View File

@ -18,7 +18,7 @@
top: 0;
}
#{$mat-form-field-infix} {
#{$mat-form--text-field-infix} {
width: 100%;
}
}