From 0c3dce781c5ef566bf9c1a2eb3631f5c77aa0c2a Mon Sep 17 00:00:00 2001
From: windingwind <33902321+windingwind@users.noreply.github.com>
Date: Sun, 10 Mar 2024 11:59:23 +0800
Subject: [PATCH] Use system accent color on Windows

---
 scss/base/_base.scss             |  2 +-
 scss/win/components/_button.scss |  6 +++---
 scss/win/components/_input.scss  | 10 +++++-----
 scss/win/components/_link.scss   |  6 ++++++
 scss/zotero-win.scss             |  1 +
 5 files changed, 16 insertions(+), 9 deletions(-)
 create mode 100644 scss/win/components/_link.scss

diff --git a/scss/base/_base.scss b/scss/base/_base.scss
index a64fd713cd..ddf720f863 100644
--- a/scss/base/_base.scss
+++ b/scss/base/_base.scss
@@ -4,7 +4,7 @@
 	font-style: normal;
 	line-height: 1.3333333333;
 	@media (-moz-platform: windows) {
-		--color-accent: var(--accent-blue);
+		--color-accent: -moz-accent-color;
 		@include light-dark(--color-focus-outer-border, var(--fill-primary), var(--accent-white));
 		@include light-dark(--color-focus-border, var(--accent-white), #00000080);
 		--width-focus-outer-border: 2px;
diff --git a/scss/win/components/_button.scss b/scss/win/components/_button.scss
index 5c25d98556..95fc1e515c 100644
--- a/scss/win/components/_button.scss
+++ b/scss/win/components/_button.scss
@@ -10,14 +10,14 @@ input:is([type=button], [type=submit]) {
 		color: var(--accent-white);
 
 		&:not([disabled]) {
-			--color-form-element-background: var(--accent-blue);
+			--color-form-element-background: var(--color-accent);
 
 			&:hover {
-				--color-form-element-background: rgba(64, 114, 229, 0.9);
+				--color-form-element-background: color-mix(in srgb, var(--color-accent) 90%, transparent);
 			}
 
 			&:active {
-				--color-form-element-background: rgba(64, 114, 229, 0.8);
+				--color-form-element-background: color-mix(in srgb, var(--color-accent) 80%, transparent);
 			}
 
 			@include focus-ring;
diff --git a/scss/win/components/_input.scss b/scss/win/components/_input.scss
index b3443116fc..78d13c0417 100644
--- a/scss/win/components/_input.scss
+++ b/scss/win/components/_input.scss
@@ -15,19 +15,19 @@
 	background-clip: border-box, padding-box;
 	@media (prefers-color-scheme: light) {
 		border: 1px solid var(--fill-quinary);
-		border-bottom-color: var(--accent-blue);
+		border-bottom-color: var(--color-accent);
 		background-color: unset;
 		background-image:
-			linear-gradient(to top, var(--accent-blue) 2px, transparent 2px 100%),
+			linear-gradient(to top, var(--color-accent) 2px, transparent 2px 100%),
 			linear-gradient(rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.3));
 	}
 
 	@media (prefers-color-scheme: dark) {
 		border: 1px solid var(--fill-quinary);
-		border-bottom-color: var(--accent-blue);
+		border-bottom-color: var(--color-accent);
 		background-color: unset;
 		background-image:
-			linear-gradient(to top, var(--accent-blue) 2px, transparent 2px 100%),
+			linear-gradient(to top, var(--color-accent) 2px, transparent 2px 100%),
 			linear-gradient(var(--fill-senary), var(--fill-senary));
 	}
 }
@@ -95,7 +95,7 @@ textarea {
 		}	
 
 		&::selection {
-			background-color: var(--accent-blue);
+			background-color: var(--color-accent);
 			color: var(--accent-white);
 		}
 
diff --git a/scss/win/components/_link.scss b/scss/win/components/_link.scss
new file mode 100644
index 0000000000..156dc462ef
--- /dev/null
+++ b/scss/win/components/_link.scss
@@ -0,0 +1,6 @@
+.text-link,
+.zotero-text-link,
+a {
+	// Overwrite the -moz-nativehyperlinktext to respect the accent color
+	color: var(--color-accent) !important;
+}
diff --git a/scss/zotero-win.scss b/scss/zotero-win.scss
index 86a96eeca1..e71cc21fff 100644
--- a/scss/zotero-win.scss
+++ b/scss/zotero-win.scss
@@ -20,5 +20,6 @@
 
 @import "win/components/button";
 @import "win/components/input";
+@import "win/components/link";
 @import "win/components/menulist";
 @import "win/components/tabbox";