From 146aadb96348852d97346d84605dcd69ea04ffbe Mon Sep 17 00:00:00 2001
From: James Lyne <jim+github@not-null.co.uk>
Date: Wed, 25 Aug 2021 20:29:36 +0100
Subject: [PATCH] Drop :active styles

---
 index.html                                | 2 --
 src/components/Sidebar.vue                | 2 +-
 src/components/sidebar/PlayerListItem.vue | 2 +-
 src/scss/_mixins.scss                     | 7 +------
 src/scss/_placeholders.scss               | 4 ----
 src/scss/leaflet/_controls.scss           | 6 +++---
 src/scss/style.scss                       | 4 ----
 7 files changed, 6 insertions(+), 21 deletions(-)

diff --git a/index.html b/index.html
index bca2207..6637be0 100644
--- a/index.html
+++ b/index.html
@@ -137,7 +137,6 @@
 
             --background-disabled: #555555; /* Disabled controls */
             --background-hover: #cccccc; /* Button :hover/selected */
-            --background-active: #eeeeee; /* Button :active */
 
             --outline-focus: #eeeeee; /* Button :focus outline */
 
@@ -151,7 +150,6 @@
             --text-disabled: #999999; /* Disabled controls */
 
             --text-hover: var(--background-base); /* Text in :hover/selected buttons */
-            --text-active: var(--background-dark); /* Text in :active buttons */
 
             --text-night: #ddffff; /* Clock time at night */
             --text-day: #ffdd33; /* Clock time in day */
diff --git a/src/components/Sidebar.vue b/src/components/Sidebar.vue
index b9a5ca9..58f3c98 100644
--- a/src/components/Sidebar.vue
+++ b/src/components/Sidebar.vue
@@ -258,7 +258,7 @@ export default defineComponent({
 				}
 			}
 
-			&:hover, &:focus-visible, &.focus-visible, &:active {
+			&:hover, &:focus-visible, &.focus-visible {
 				background-color: transparent;
 				color: inherit;
 			}
diff --git a/src/components/sidebar/PlayerListItem.vue b/src/components/sidebar/PlayerListItem.vue
index 9905abe..b20ab50 100644
--- a/src/components/sidebar/PlayerListItem.vue
+++ b/src/components/sidebar/PlayerListItem.vue
@@ -141,7 +141,7 @@ export default defineComponent({
 			}
 		}
 
-		&:hover, &:focus, &:active {
+		&:hover, &:focus {
 			.player__name ::v-deep(span) {
 				color: inherit !important;
 			}
diff --git a/src/scss/_mixins.scss b/src/scss/_mixins.scss
index b55b1a9..a47cf11 100644
--- a/src/scss/_mixins.scss
+++ b/src/scss/_mixins.scss
@@ -69,17 +69,12 @@
 	border-color: var(--background-dark);
 }
 
-@mixin button-active {
-	background-color: var(--background-active);
-	color: var(--text-active);
-}
-
 @mixin button-disabled {
 	background-color: var(--background-disabled);
 	color: var(--text-disabled);
 	cursor: not-allowed;
 
-	&:hover, &:active, &:focus {
+	&:hover, &:focus {
 		background-color: var(--background-disabled);
 		color: var(--text-disabled);
 	}
diff --git a/src/scss/_placeholders.scss b/src/scss/_placeholders.scss
index 7d39871..d639f40 100644
--- a/src/scss/_placeholders.scss
+++ b/src/scss/_placeholders.scss
@@ -32,10 +32,6 @@
 		z-index: auto;
 	}
 
-	&:active {
-		@include button-active;
-	}
-
 	&[disabled], &[aria-disabled="true"] {
 		@include button-disabled;
 	}
diff --git a/src/scss/leaflet/_controls.scss b/src/scss/leaflet/_controls.scss
index da7072e..993ad7c 100644
--- a/src/scss/leaflet/_controls.scss
+++ b/src/scss/leaflet/_controls.scss
@@ -28,8 +28,8 @@
 	}
 
 	/* Avoid applying the base background colour twice, in case its semi-transparent */
-	> a:not(:hover):not(:focus):not(:active):not([aria-expanded=true]),
-	> button:not(:hover):not(:focus):not(:active):not([aria-expanded=true]) {
+	> a:not(:hover):not(:focus):not([aria-expanded=true]),
+	> button:not(:hover):not(:focus):not([aria-expanded=true]) {
 		background-color: transparent;
 	}
 
@@ -345,7 +345,7 @@
 	animation: fade 0.3s linear;
 	animation-fill-mode: forwards;
 
-	&:hover, &:active, &:focus {
+	&:hover, &:focus {
 		background-color: var(--background-base);
 	}
 
diff --git a/src/scss/style.scss b/src/scss/style.scss
index 5173ddd..ecc9975 100644
--- a/src/scss/style.scss
+++ b/src/scss/style.scss
@@ -237,10 +237,6 @@ input {
 			outline: none !important;
 		}
 
-		&:active + label {
-			@include button-active;
-		}
-
 		&:disabled + label {
 			@include button-disabled;
 		}