add hover to rounded button

jwcooper · jwcooper · commit 149810627e86 · 2025-02-10T09:30:26.000-06:00
diff --git a/assets/sass/base/_mixins.scss b/assets/sass/base/_mixins.scss
@@ -1,3 +1,5 @@
+@use "sass:color";
+
 @mixin readable-content {
   display: grid;
   grid-template-columns:
@@ -20,8 +22,8 @@
   background-color: #63338f;
 
   &:hover {
-    color: #000;
-    background-color: #fff;
+    color: #fff;
+    background-color: color.adjust(#63338f, $lightness: -10%, $space: hsl);
   }
 }
 

Original file line number	Diff line number	Diff line change
`@@ -1,3 +1,5 @@`
	`1`	`+@use "sass:color";`
	`2`	`+`
`1`	`3`	`@mixin readable-content {`
`2`	`4`	`display: grid;`
`3`	`5`	`grid-template-columns:`
`@@ -20,8 +22,8 @@`
`20`	`22`	`background-color: #63338f;`
`21`	`23`
`22`	`24`	`&:hover {`
`23`		`- color: #000;`
`24`		`- background-color: #fff;`
	`25`	`+ color: #fff;`
	`26`	`+ background-color: color.adjust(#63338f, $lightness: -10%, $space: hsl);`
`25`	`27`	`}`
`26`	`28`	`}`
`27`	`29`