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

AAE-23556 Fix search text input component styles (#9895)

Browse Source
This commit is contained in:
Ehsan Rezaei 2024-07-01 17:10:39 +02:00 committed by GitHub
parent df8404e1b0
commit 54b34f513e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 9 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
lib/core/src/lib/search-text/search-text-input.component.html
View File

@ -27,13 +27,10 @@
(ngModelChange)="inputChange($event)"
[searchAutocomplete]="searchAutocomplete ? searchAutocomplete : null"
(keyup.enter)="searchSubmit($event)">
<button mat-icon-button matSuffix
<mat-icon *ngIf="canShowClearSearch()" matSuffix
data-automation-id="adf-clear-search-button"
class="adf-clear-search-button"
*ngIf="canShowClearSearch()"
(mousedown)="resetSearch()">
<mat-icon>clear</mat-icon>
</button>
(mousedown)="resetSearch()">clear</mat-icon>
</mat-form-field>
</div>
</div>

9
lib/core/src/lib/search-text/search-text-input.component.scss
View File

@ -21,12 +21,9 @@
line-height: normal;
}
&-input-form-field-divider {
#{$mat-line-ripple} {
background-color: var(--adf-theme-primary-50);
}
font-size: var(--theme-subheading-2-font-size);
&-clear-search-button {
font-size: var(--theme-button-font-size);
cursor: pointer;
}
}

9
lib/core/src/lib/search-text/search-text-input.component.ts
View File

@ -99,7 +99,6 @@ export class SearchTextInputComponent implements OnInit, OnDestroy {
@Input()
placeholder: string = '';
/** Label text to show over the input field */
@Input()
label: string = '';
@ -144,11 +143,11 @@ export class SearchTextInputComponent implements OnInit, OnDestroy {
animationStates: SearchAnimationDirection = {
ltr: {
active: { value: 'active', params: { 'margin-left': 13 } },
inactive: { value: 'inactive', params: { transform: 'translateX(82%)' } }
inactive: { value: 'inactive', params: { transform: 'translateX(95%)' } }
},
rtl: {
active: { value: 'active', params: { 'margin-right': 13 } },
inactive: { value: 'inactive', params: { transform: 'translateX(-82%)' } }
inactive: { value: 'inactive', params: { transform: 'translateX(-95%)' } }
}
};
@ -202,11 +201,11 @@ export class SearchTextInputComponent implements OnInit, OnDestroy {
if (this.dir === 'ltr') {
return this.subscriptAnimationState.value === 'inactive'
? { value: 'active', params: { 'margin-left': 13 } }
: { value: 'inactive', params: { transform: 'translateX(82%)' } };
: { value: 'inactive', params: { transform: 'translateX(95%)' } };
} else {
return this.subscriptAnimationState.value === 'inactive'
? { value: 'active', params: { 'margin-right': 13 } }
: { value: 'inactive', params: { transform: 'translateX(-82%)' } };
: { value: 'inactive', params: { transform: 'translateX(-95%)' } };
}
}