Group button border-radius together with background-color

peruukki · peruukki · commit b3376d28c10b · 2024-12-29T15:56:11.000+02:00
The two properties only make sense here when applied together, so make that
more visible.
diff --git a/app/src/components/button.scss b/app/src/components/button.scss
@@ -12,6 +12,7 @@
   &--pause {
     .visible-button {
       background-color: colors.$gray-semi-transparent;
+      border-radius: 50%;
     }
   }
 
@@ -21,7 +22,6 @@
     height: 3.5rem;
     transition: color animations.$hover-duration animations.$hover-timing-function;
     color: colors.$gray;
-    border-radius: 50%;
     animation: animations.$fade-duration fade-in;
 
     &:hover {

Original file line number	Diff line number	Diff line change
`@@ -12,6 +12,7 @@`
`12`	`12`	`&--pause {`
`13`	`13`	`.visible-button {`
`14`	`14`	`background-color: colors.$gray-semi-transparent;`
	`15`	`+ border-radius: 50%;`
`15`	`16`	`}`
`16`	`17`	`}`
`17`	`18`
`@@ -21,7 +22,6 @@`
`21`	`22`	`height: 3.5rem;`
`22`	`23`	`transition: color animations.$hover-duration animations.$hover-timing-function;`
`23`	`24`	`color: colors.$gray;`
`24`		`- border-radius: 50%;`
`25`	`25`	`animation: animations.$fade-duration fade-in;`
`26`	`26`
`27`	`27`	`&:hover {`