feat: nav cta hover effect

data-preservation-programs · Sep 6, 2023 · ddc3e13 · ddc3e13
1 parent 8c796eb
commit ddc3e13
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 6 deletions.
diff --git a/components/button/cta.vue b/components/button/cta.vue
@@ -216,9 +216,24 @@ const props = defineProps({
   padding: toRem(9);
   border-radius: 50%;
   border: 2px solid $sageGreen;
+  background-color: rgba($sageGreen, 0);
+  @include transitionDefault;
   .button-content {
     display: flex;
   }
+  :deep(.icon) {
+    path {
+      @include transitionDefault;
+    }
+  }
+  &:hover {
+    background-color: rgba($sageGreen, 1);
+    :deep(.icon) {
+      path {
+        fill: $codGray;
+      }
+    }
+  }
 }
 
 .theme__big-number {

diff --git a/components/site-header.vue b/components/site-header.vue
@@ -283,13 +283,13 @@ const getCtaComponent = (icon) => {
     visibility: visible;
     transform: scale(1);
   }
-  :deep(.navigation) {
-    .nav-item {
+  // :deep(.navigation) {
+  //   .nav-item {
 
-    }
-    .nav-link {
+  //   }
+  //   .nav-link {
 
-    }
-  }
+  //   }
+  // }
 }
 </style>