match bottom nav more closely to designs (#1734)

stellar · Dec 11, 2024 · d50b3e5 · d50b3e5
1 parent 4f4eef7
commit d50b3e5
Showing 1 changed file with 6 additions and 9 deletions.
diff --git a/extension/src/popup/components/BottomNav/styles.scss b/extension/src/popup/components/BottomNav/styles.scss
@@ -6,23 +6,19 @@
   justify-content: space-between;
   width: 100%;
   height: 100%;
-  padding: pxToRem(16px) pxToRem(24px);
+  padding: pxToRem(16px) 0;
 
   &__link {
     display: block;
-    width: pxToRem(30px);
+    width: pxToRem(78px);
     display: flex;
     align-items: center;
     justify-content: center;
-    filter: brightness(0) saturate(100%) invert(31%) sepia(6%) saturate(476%)
-      hue-rotate(195deg) brightness(100%) contrast(89%);
-
-    &--active {
-      filter: brightness(1);
-    }
+    opacity: 0.4;
 
+    &--active,
     &:hover {
-      filter: brightness(1);
+      opacity: 1;
     }
 
     &__icon {
@@ -32,6 +28,7 @@
       flex-direction: column;
       font-size: pxToRem(12px);
       gap: pxToRem(4px);
+      line-height: pxToRem(18px);
 
       svg {
         width: pxToRem(18px);