From e7c3390fbf95abfd26225f7ab549898b1a7183c9 Mon Sep 17 00:00:00 2001
From: daudix <ddaudix@gmail.com>
Date: Sun, 8 Sep 2024 16:29:45 +0300
Subject: [PATCH] Don't add ::before pseudo element on color pickers

---
 CHANGELOG.md     |  1 +
 sass/_input.scss | 29 ++++++++++++++++-------------
 2 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 2d1331b..aaac95c 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -51,6 +51,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Fixed
 
 - `config.extra.fix_contrast_dark` should now work even if `config.extra.primary_color_dark` is not set.
+- Don't add `::before` pseudo element to color pickers.
 
 ## [4.8.0](https://codeberg.org/daudix/duckquill/compare/v4.7.1...v4.8.0)
 
diff --git a/sass/_input.scss b/sass/_input.scss
index da0ba80..543c6b0 100644
--- a/sass/_input.scss
+++ b/sass/_input.scss
@@ -11,6 +11,22 @@ input[type="color"] {
 	width: 1rem;
 	height: 1rem;
 
+	&:hover {
+		background-color: var(--fg-muted-2);
+	}
+
+	&:disabled {
+		opacity: var(--disabled);
+		cursor: not-allowed;
+
+		&:hover {
+			background-color: var(--fg-muted-1);
+		}
+	}
+}
+
+input[type="radio"],
+input[type="checkbox"] {
 	&::before {
 		display: block;
 		position: absolute;
@@ -21,10 +37,6 @@ input[type="color"] {
 		content: "";
 	}
 
-	&:hover {
-		background-color: var(--fg-muted-2);
-	}
-
 	&:checked {
 		border: 0.15rem solid transparent;
 		background-color: var(--primary-color);
@@ -45,15 +57,6 @@ input[type="color"] {
 			opacity: 1;
 		}
 	}
-
-	&:disabled {
-		opacity: var(--disabled);
-		cursor: not-allowed;
-
-		&:hover {
-			background-color: var(--fg-muted-1);
-		}
-	}
 }
 
 input[type="radio"] {