mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2026-04-16 22:24:49 +00:00
[ACS-10335] Grouped input controls with radio buttons for search date range component (#11507)
* [ACS-10335] Grouped input controls with radio buttons for search date range component * [ACS-10335] Change role group to fieldset element
This commit is contained in:
@@ -5,9 +5,13 @@
|
||||
{{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.ANYTIME' | translate }}
|
||||
</mat-radio-button>
|
||||
</span>
|
||||
<span class="adf-search-date-range-container-row">
|
||||
<fieldset
|
||||
class="adf-search-date-range-container-row"
|
||||
aria-labelledby="adf-search-date-range-in-last-radio-button">
|
||||
<mat-radio-button [value]="DateRangeType.IN_LAST" data-automation-id="date-range-in-last">
|
||||
{{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.IN_LAST' | translate }}
|
||||
<span id="adf-search-date-range-in-last-radio-button">
|
||||
{{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.IN_LAST' | translate }}
|
||||
</span>
|
||||
</mat-radio-button>
|
||||
<mat-form-field class="adf-search-date-range-form-field adf-search-date-range-input-field" subscriptSizing="dynamic" floatLabel="always">
|
||||
<mat-label id="adf-search-date-range-quantity-label">{{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.QUANTITY' | translate }}</mat-label>
|
||||
@@ -26,10 +30,14 @@
|
||||
<mat-option data-automation-id="date-range-in-last-option-months" [value]="InLastDateType.MONTHS">{{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.MONTHS' | translate }}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</span>
|
||||
<span class="adf-search-date-range-container-row adf-search-date-range-container-row-date">
|
||||
</fieldset>
|
||||
<fieldset
|
||||
class="adf-search-date-range-container-row adf-search-date-range-container-row-date"
|
||||
aria-labelledby="adf-search-date-range-between-radio-button">
|
||||
<mat-radio-button [value]="DateRangeType.BETWEEN" data-automation-id="date-range-between">
|
||||
{{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.BETWEEN' | translate }}
|
||||
<span id="adf-search-date-range-between-radio-button">
|
||||
{{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.BETWEEN' | translate }}
|
||||
</span>
|
||||
</mat-radio-button>
|
||||
<mat-form-field class="adf-search-date-range-form-field" subscriptSizing="dynamic" floatLabel="always">
|
||||
<mat-label>{{ 'SEARCH.DATE_RANGE_ADVANCED.BETWEEN_PLACEHOLDERS.DATE_RANGE' | translate }}</mat-label>
|
||||
@@ -47,6 +55,6 @@
|
||||
<mat-error *ngIf="betweenEndDateFormControl.errors?.invalidDate">{{ 'SEARCH.DATE_RANGE_ADVANCED.ERROR.END_DATE.INVALID_FORMAT' | translate : { requiredFormat: dateFormat } }}</mat-error>
|
||||
<mat-error *ngIf="betweenEndDateFormControl.errors?.required">{{ 'SEARCH.DATE_RANGE_ADVANCED.ERROR.END_DATE.REQUIRED' | translate }}</mat-error>
|
||||
</mat-form-field>
|
||||
</span>
|
||||
</fieldset>
|
||||
</mat-radio-group>
|
||||
</div>
|
||||
|
||||
@@ -13,8 +13,10 @@ adf-search-date-range {
|
||||
&-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding-bottom: 21px;
|
||||
padding: 0 0 21px;
|
||||
align-items: center;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
|
||||
&-date {
|
||||
margin-top: 8px;
|
||||
|
||||
Reference in New Issue
Block a user