From 837f444cc9da8b5367621014d0b24c9fa067d953 Mon Sep 17 00:00:00 2001
From: sercan <sercanyemen@gmail.com>
Date: Sun, 16 May 2021 15:55:17 +0300
Subject: [PATCH] (overrides/angular-material) Use @apply whenever it's
 possible

---
 .../styles/overrides/angular-material.scss    | 38 +++----------------
 1 file changed, 6 insertions(+), 32 deletions(-)

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