diff options
| author | 2025-11-25 23:27:43 +0100 | |
|---|---|---|
| committer | 2025-11-25 23:27:43 +0100 | |
| commit | 1a3565f26c84ed82ef191effc70c5fa6e054e094 (patch) | |
| tree | 16db9acaf4d2d992aac5531fa2761d2dc61cb249 /p/themes/Nord | |
| parent | 06d34f9b8ed81854baaaea3a4a7f4e247cab31a0 (diff) | |
More visible selected article (#8230)
There was not enough difference between selected and not-selected articles, especially not due to hovering using the same style.
Already relevant as is, and more relevant for a future feature depending on selected article.
Additional help welcome to further improve the styling, in this PR or a future one, also for the other themes.
In this example, the third article is the one selected:
<img width="443" height="189" alt="image" src="https://github.com/user-attachments/assets/06168e9f-1b91-47e2-9b64-4fd8ca6c7186" />
* Compensate the increased border-left-width
* Implement in Pafat
* Implement in Nord
* Shorten comment
* Implement in Alternative Dark
* Implement for Flat
* Implement for Swage
* Implement in Ansum and Mapco
* Call stylelint_fix before rtlcss
So that RTLCSS includes the fixes from previous step
Diffstat (limited to 'p/themes/Nord')
| -rw-r--r-- | p/themes/Nord/nord.css | 6 | ||||
| -rw-r--r-- | p/themes/Nord/nord.rtl.css | 6 |
2 files changed, 12 insertions, 0 deletions
diff --git a/p/themes/Nord/nord.css b/p/themes/Nord/nord.css index 47769c786..7419de8ea 100644 --- a/p/themes/Nord/nord.css +++ b/p/themes/Nord/nord.css @@ -809,6 +809,12 @@ li.item.active { .flux.current { background: var(--accent-bg); + border-left: 1px solid var(--highlight); +} + +.flux.current > .flux_header { + background: linear-gradient(to right, transparent 0, transparent 1px, var(--accent-bg) 1px); + margin-left: -1px; /* Compensate increased border-left-width */ } .flux:not(.current):hover .item .title { diff --git a/p/themes/Nord/nord.rtl.css b/p/themes/Nord/nord.rtl.css index 5820aebdc..9b3232c79 100644 --- a/p/themes/Nord/nord.rtl.css +++ b/p/themes/Nord/nord.rtl.css @@ -809,6 +809,12 @@ li.item.active { .flux.current { background: var(--accent-bg); + border-right: 1px solid var(--highlight); +} + +.flux.current > .flux_header { + background: linear-gradient(to left, transparent 0, transparent 1px, var(--accent-bg) 1px); + margin-right: -1px; /* Compensate increased border-left-width */ } .flux:not(.current):hover .item .title { |
