Untitled
unknown
plain_text
2 years ago
2.2 kB
17
Indexable
// CUSTOM APPEARANCE FORM FIELD
.mat-mdc-form-field {
@include mat.all-component-densities(-3);
.mdc-text-field--filled {
padding: 0;
&:not(.mdc-text-field--disabled) {
background-color: transparent;
}
}
.mdc-text-field--focused {
background-color: transparent;
}
> div {
.mat-mdc-form-field-focus-overlay {
background-color: transparent;
}
}
.mat-mdc-form-field-infix {
padding-bottom: 0 !important;
min-height: 40px !important;
}
.mdc-text-field__input {
margin-top: 5px !important;
font-size: 14px !important;
}
.mat-mdc-select-value {
margin-top: 6px;
}
.mat-mdc-select-arrow {
margin-top: 16px;
}
.mat-mdc-form-field-hint-wrapper, .mat-mdc-form-field-error-wrapper {
padding: 0;
}
.mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-floating-label {
display: inline;
}
.mat-mdc-form-field-icon-suffix > .mat-icon {
padding: 5px;
box-sizing: content-box;
transform: scale(.8);
color: #7a7676;
}
// CUSTOM APPEARANCE INPUT COLOR
.mdc-text-field--disabled.mdc-text-field--filled {
background-color: #fafafa;
}
// MAT LABEL
.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-floating-label {
color: $primary-color-sec;
}
.mdc-floating-label {
color: $primary-color-sec !important;
font-size: 13px !important;
}
.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-floating-label {
color: var(--mdc-theme-error, #f44336) !important;
}
.mdc-text-field--disabled .mdc-floating-label {
color: rgba(0, 0, 0, 0.38) !important;
}
// LINE RIPPLE
.mdc-text-field--filled .mdc-line-ripple::after {
border-bottom-color: $primary-color-sec;
}
.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple::after {
border-bottom-color: red;
}
// MARKER REQUIRED ICON
.mat-mdc-form-field-required-marker {
//color: red;
}
//INPUT ICON
.mat-mdc-icon-button svg {
color: $secondary-color;
transform: scale(.8);
margin-top: 5px;
}
}
Editor is loading...