From 26a311f8fc7c598de07bf0d1fd2e20d479539490 Mon Sep 17 00:00:00 2001
From: polybjorn <service@polybjorn.com>
Date: Thu, 30 Apr 2026 07:07:11 +0000
Subject: [PATCH] fix(themes): match hover border on adjacent .group/.stick
 buttons (#8735)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

In Alternative-Dark and Dark-pink, hovering a button that isn't first in its `.stick` or `.group` row produces a 3-sided highlight (top, right, bottom) instead of all four. The strip rule that visually joins adjacent buttons (`.stick .btn + .btn, ... { border-left: none }`) wins by specificity over `.btn:hover { border: 1px solid <hover-color> }`, so the left edge stays missing through the hover state.

The fix adds `:not(:hover)` to the `.btn` targets in the strip rules, so the join lifts on hover and `.btn:hover` paints the full border. The second strip rule's `border-radius` was hoisted into its own block to keep the radius applying in all states.

Dark-pink inherits the modified rules and needs no changes of its own. The other themes don't change border on hover, so they're unaffected.

References #7405

### Screenshots

#### Before: hovered button missing left border
<img width="171" height="40" alt="hover border before" src="https://github.com/user-attachments/assets/974bd250-e0bd-483c-85dc-f0777a38eb52" />

#### After: hover border on all four sides
<img width="173" height="40" alt="hover border after" src="https://github.com/user-attachments/assets/2bd5002c-f2cd-4ea6-9ae5-8c6caef8cf9f" />

### Notes

- `.rtl.css` regenerated via `make rtl`.
- `npm run stylelint` passes.
- Verified on Alternative-Dark and Dark-pink.

Co-authored-by: Bjørn A. Andersen <polybjorn@users.noreply.github.com>
---
 p/themes/Alternative-Dark/adark.css     | 21 ++++++++++-----------
 p/themes/Alternative-Dark/adark.rtl.css | 21 ++++++++++-----------
 2 files changed, 20 insertions(+), 22 deletions(-)

diff --git a/p/themes/Alternative-Dark/adark.css b/p/themes/Alternative-Dark/adark.css
index cf40031f7..3bc14afd9 100644
--- a/p/themes/Alternative-Dark/adark.css
+++ b/p/themes/Alternative-Dark/adark.css
@@ -183,25 +183,24 @@ th {
 	border-radius: 3px;
 }
 
-.stick .btn + .btn,
-.group .btn + .btn,
+.stick .btn + .btn:not(:hover),
+.group .btn + .btn:not(:hover),
 .stick .btn + input,
-.stick .btn + .dropdown > .btn,
-.group .btn + .dropdown > .btn,
-.stick input + .btn,
+.stick .btn + .dropdown > .btn:not(:hover),
+.group .btn + .dropdown > .btn:not(:hover),
+.stick input + .btn:not(:hover),
 .stick input + input,
-.stick input + .dropdown > .btn,
-.stick .dropdown + .btn,
-.group .dropdown + .btn,
+.stick input + .dropdown > .btn:not(:hover),
+.stick .dropdown + .btn:not(:hover),
+.group .dropdown + .btn:not(:hover),
 .stick .dropdown + input,
-.stick .dropdown + .dropdown > .btn,
-.group .dropdown + .dropdown > .btn {
+.stick .dropdown + .dropdown > .btn:not(:hover),
+.group .dropdown + .dropdown > .btn:not(:hover) {
 	border-left: none;
 }
 
 .stick .btn + .dropdown > .btn,
 .group .dropdown + .dropdown > .btn {
-	border-left: none;
 	border-radius: 0 3px 3px 0;
 }
 
diff --git a/p/themes/Alternative-Dark/adark.rtl.css b/p/themes/Alternative-Dark/adark.rtl.css
index 7d7982452..aecb12f7b 100644
--- a/p/themes/Alternative-Dark/adark.rtl.css
+++ b/p/themes/Alternative-Dark/adark.rtl.css
@@ -183,25 +183,24 @@ th {
 	border-radius: 3px;
 }
 
-.stick .btn + .btn,
-.group .btn + .btn,
+.stick .btn + .btn:not(:hover),
+.group .btn + .btn:not(:hover),
 .stick .btn + input,
-.stick .btn + .dropdown > .btn,
-.group .btn + .dropdown > .btn,
-.stick input + .btn,
+.stick .btn + .dropdown > .btn:not(:hover),
+.group .btn + .dropdown > .btn:not(:hover),
+.stick input + .btn:not(:hover),
 .stick input + input,
-.stick input + .dropdown > .btn,
-.stick .dropdown + .btn,
-.group .dropdown + .btn,
+.stick input + .dropdown > .btn:not(:hover),
+.stick .dropdown + .btn:not(:hover),
+.group .dropdown + .btn:not(:hover),
 .stick .dropdown + input,
-.stick .dropdown + .dropdown > .btn,
-.group .dropdown + .dropdown > .btn {
+.stick .dropdown + .dropdown > .btn:not(:hover),
+.group .dropdown + .dropdown > .btn:not(:hover) {
 	border-right: none;
 }
 
 .stick .btn + .dropdown > .btn,
 .group .dropdown + .dropdown > .btn {
-	border-right: none;
 	border-radius: 3px 0 0 3px;
 }