Fix background color activation in modes tab in dark mode (#3961)

betaflight · May 15, 2024 · 66e822d · 66e822d
1 parent e180298
commit 66e822d
Showing 1 changed file with 33 additions and 32 deletions.
diff --git a/src/css/tabs/auxiliary.less b/src/css/tabs/auxiliary.less
@@ -63,46 +63,47 @@
 			border-radius: 3px;
 		}
 	}
-	.mode.on {
-		.info {
-			background: var(--accent);
-			color: black;
-		}
-		&:nth-child(odd) {
+	.modes {
+		width: 100%;
+	}
+	.mode {
+		background-color: #f9f9f9;
+		vertical-align: top;
+		display: flex;
+
+		&.on {
 			.info {
-				background: var(--accent);
+				background: var(--accent) !important;
+				color: black;
+			}
+			&:nth-child(odd) {
+				.info {
+					background: var(--accent) !important;
+				}
 			}
 		}
-	}
-	.mode.off {
-		.info {
-			background: #828885;
-			color: white;
-		}
-		&:nth-child(odd) {
+		&.off {
 			.info {
-				background: #828885;
+				background: #828885 !important;
+				color: white;
+			}
+			&:nth-child(odd) {
+				.info {
+					background: #828885 !important;
+				}
 			}
 		}
-	}
-	.mode.disabled {
-		.info {
-			background: var(--error);
-			color: var(--quietText);
-		}
-		&:nth-child(odd) {
+		&.disabled {
 			.info {
-				background: var(--error);
+				background: var(--error) !important;
+				color: var(--quietText);
 			}
-		}
-	}
-	.modes {
-		width: 100%;
-	}
-	.mode {
-		background-color: #f9f9f9;
-		vertical-align: top;
-		display: flex;
+			&:nth-child(odd) {
+				.info {
+					background: var(--error) !important;
+				}
+			}
+		}	
 		.name {
 			min-height: 80px;
 			padding: 5px 0;