fix: Consistency of ripple effects have been made consistent across t…

…he buttons.
IDEMSInternational · Aug 28, 2024 · 98b75a4 · 98b75a4
1 parent 356e638
commit 98b75a4
Show file tree

Hide file tree

Showing 4 changed files with 5 additions and 2 deletions.
diff --git a/packages/scripts/bin/app-scripts b/packages/scripts/bin/app-scripts
diff --git a/packages/scripts/bin/app-workflow b/packages/scripts/bin/app-workflow
diff --git a/src/app/shared/components/template/components/button/button.component.html b/src/app/shared/components/template/components/button/button.component.html
@@ -25,7 +25,6 @@
         [attr.data-rowname]="_row.name"
       ></plh-template-component>
     </span>
-    <ion-ripple-effect></ion-ripple-effect>
   </ion-button>
 
   <!-- "card-portrait" variant. This variant is not achievable using an ion-button -->
@@ -49,7 +48,6 @@
         [parent]="parent"
         [attr.data-rowname]="_row.name"
       ></plh-template-component>
-      <ion-ripple-effect></ion-ripple-effect>
     </span>
   </div>
 </ng-container>
diff --git a/src/app/shared/components/template/components/button/button.component.scss b/src/app/shared/components/template/components/button/button.component.scss
@@ -77,6 +77,11 @@ ion-button[data-variant~="card"] {
   }
 }
 
+// set the speed of the ripple effect to ensure that it is consistent across all buttons
+.ion-ripple-effect {
+  --ion-ripple-duration: 500ms;
+}
+
 .button-container[data-variant~="card-portrait"] {
   background-color: white;
   color: var(--ion-color-primary);