(overrides/angular-material) Use @apply whenever it's possible

This commit is contained in:
sercan 2021-05-16 15:55:17 +03:00
parent d0876eb80c
commit 837f444cc9

View File

@ -178,11 +178,7 @@
/* Add hover and focus style on all buttons */ /* Add hover and focus style on all buttons */
.mat-button-focus-overlay { .mat-button-focus-overlay {
@apply bg-gray-400 bg-opacity-20 #{'!important'}; @apply bg-gray-400 bg-opacity-20 dark:bg-black dark:bg-opacity-5 #{'!important'};
.dark & {
background-color: rgba(0, 0, 0, 0.05) !important;
}
} }
/* On palette colored buttons, use a darker color */ /* On palette colored buttons, use a darker color */
@ -253,11 +249,7 @@
/* Add hover and focus styles */ /* Add hover and focus styles */
.mat-button-focus-overlay { .mat-button-focus-overlay {
@apply bg-gray-400 bg-opacity-20 #{'!important'}; @apply bg-gray-400 bg-opacity-20 dark:bg-black dark:bg-opacity-5 #{'!important'};
.dark & {
background-color: rgba(0, 0, 0, 0.05) !important;
}
} }
/* On primary colored buttons, use the primary color as focus overlay */ /* On primary colored buttons, use the primary color as focus overlay */
@ -330,19 +322,11 @@
/* Border color */ /* Border color */
&:not(.mat-button-disabled) { &:not(.mat-button-disabled) {
@apply border-gray-300 #{'!important'}; @apply border-gray-300 dark:border-gray-500 #{'!important'};
.dark & {
@apply border-gray-500 #{'!important'};
}
} }
&.mat-button-disabled { &.mat-button-disabled {
@apply border-gray-200 #{'!important'}; @apply border-gray-200 dark:border-gray-600 #{'!important'};
.dark & {
@apply border-gray-600 #{'!important'};
}
} }
} }
@ -542,13 +526,7 @@
border-radius: 6px; border-radius: 6px;
padding: 0 16px; padding: 0 16px;
border-width: 1px; border-width: 1px;
background-color: white; @apply shadow-sm bg-white border-gray-300 dark:bg-black dark:bg-opacity-5 dark:border-gray-500 #{'!important'};
@apply border-gray-300 shadow-sm #{'!important'};
.dark & {
background-color: rgba(0, 0, 0, 0.05) !important;
@apply border-gray-500 #{'!important'};
}
.mat-form-field-prefix { .mat-form-field-prefix {
@ -1049,11 +1027,7 @@
.mat-form-field-prefix, .mat-form-field-prefix,
.mat-form-field-suffix { .mat-form-field-suffix {
@apply border-gray-300 bg-default #{'!important'}; @apply bg-default border-gray-300 dark:border-gray-500 #{'!important'};
.dark & {
@apply border-gray-500 #{'!important'};
}
} }
} }
} }