adata-ui 2.0.2 → 2.0.3

package/components/elements/curve-block/ACurveBlock.vue

@@ -13,7 +13,8 @@ const props = defineProps<{
   <component
     :is="to ? NuxtLinkLocale : 'button'"
     :to="to"
-    class="relative w-fit cursor-pointer"
+    class="curve-block relative w-fit cursor-pointer"
+    active-class="active-item"
   >
     <svg
       width="306"
@@ -148,19 +149,23 @@ const props = defineProps<{
   stroke-dasharray: 1200;
   stroke-dashoffset: 1200;
   fill: #F4F5F6;
-  transition: stroke-dashoffset 2s ease, fill 2s ease;
 }
 
 .animated-border {
   stroke-dasharray: 180;
   stroke-dashoffset: 180;
-  transition: stroke-dashoffset 2s ease, fill 2s ease;
   fill: #F4F5F6;
 }
 
 
-.relative:hover .border-path,
-.relative:hover .animated-border {
+.active-item .border-path,
+.active-item .animated-border {
+  stroke-dashoffset: 0;
+  fill: white;
+}
+.curve-block:hover .border-path,
+.curve-block:hover .animated-border {
+  transition: stroke-dashoffset 2s ease, fill 2s ease;
   stroke-dashoffset: 0;
   fill: white;
 }
@@ -188,12 +193,20 @@ const props = defineProps<{
 .dark {
   .border-path,
   .animated-border {
-    fill: #393d40;
-  }
-  .relative:hover .border-path,
-  .relative:hover .animated-border {
     fill: #26282b;
   }
+
+  .active-item .border-path,
+  .active-item .animated-border {
+    stroke-dashoffset: 0;
+    fill: #131415;
+  }
+
+  .curve-block:hover .border-path,
+  .curve-block:hover .animated-border {
+    fill: #131415;
+
+  }
   .arrow {
     fill: #1b98e2;
   }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "adata-ui",
   "type": "module",
-  "version": "2.0.2",
+  "version": "2.0.3",
   "main": "./nuxt.config.ts",
   "scripts": {
     "dev": "nuxi dev .playground",