💄 Add hover color for home button

Author: AnandChowdhary

src/styles/services.scss

@@ -34,6 +34,7 @@
         padding: 1.15rem 0;
         border-radius: 0.2rem;
         text-align: center;
+        transition: 0.2s;
       }
       svg {
         display: block;

src/themes/dark.scss

@@ -44,6 +44,8 @@ $effectsLabelColor: inherit;
 
 $HomeNavItemBackground: $colorLightGray;
 $HomeNavItemForeground: $colorWhite;
+$HomeNavItemHoverBackground: $colorDarkGray;
+$HomeNavItemHoverForeground: $colorWhite;
 
 $loaderColor: #333;
 $dropAreaBorder: 3px dashed rgba(255, 255, 255, 0.1);

src/themes/light.scss

@@ -44,6 +44,8 @@ $effectsLabelColor: inherit;
 
 $HomeNavItemBackground: $colorLightGray;
 $HomeNavItemForeground: inherit;
+$HomeNavItemHoverBackground: $colorDarkGray;
+$HomeNavItemHoverForeground: inherit;
 
 $loaderColor: #333;
 $dropAreaBorder: 3px dashed rgba(0, 0, 0, 0.1);

src/themes/theme.scss

@@ -91,6 +91,10 @@
     .uppload-services button {
       background-color: $HomeNavItemBackground;
       color: $HomeNavItemForeground;
+      &:hover {
+        background-color: $HomeNavItemHoverBackground;
+        color: $HomeNavItemHoverForeground;
+      }
     }
   }