fix: add hover and active state to square button [PT-188162618]

concord-consortium · Aug 27, 2024 · d3829df · d3829df
1 parent 8ba96bc
commit d3829df
Showing 1 changed file with 11 additions and 2 deletions.
diff --git a/src/components/square-button.scss b/src/components/square-button.scss
@@ -1,12 +1,21 @@
+@import "./vars.scss";
+
 .square-button {
   width: 32px;
   height: 32px;
   display: flex;
   justify-content: center;
   align-items: center;
-  color: #177991;
+  color: $teal-dark;
   border-radius: 3px;
-  border: 1px solid #177991;
+  border: 1px solid $teal-dark;
   background-color: white;
   cursor: pointer;
+
+  &:hover {
+    background-color: $teal-light-25;
+  }
+  &:active {
+    background-color: $teal-light-50;
+  }
 }