Add active state to the footer socials

And use "transform" for transforms since e.g setting scale directly is not widely supported by browsers (baseline 2022)

sass/_article-list.scss

@@ -3,7 +3,7 @@
 		position: relative;
 
 		&.draft {
-			scale: 0.95;
+			transform: scale(0.95);
 			opacity: 0.6;
 			transition: var(--transition-longer);
 			outline: 2px dashed var(--fg-muted-2);
@@ -11,7 +11,7 @@
 			border-radius: 1rem;
 
 			&:hover {
-				scale: 1;
+				transform: scale(1);
 				opacity: 1;
 				outline: 2px dashed transparent;
 				outline-offset: 0;

sass/_comments.scss

@@ -175,7 +175,7 @@ section#comments {
 					background-color: var(--boosts-bg);
 
 					svg {
-						rotate: 180deg;
+						transform: rotate(180deg);
 					}
 				}
 			}
@@ -187,7 +187,7 @@ section#comments {
 					background-color: var(--faves-bg);
 
 					svg {
-						rotate: 72deg;
+						transform: rotate(72deg);
 					}
 				}
 			}

sass/_footer.scss

@@ -60,6 +60,10 @@
 					background-color: var(--primary-color);
 				}
 
+				&:active {
+					transform: scale(var(--active));
+				}
+
 				span {
 					display: none;
 				}