From 801e4067109f77880fce50221f469575dda4f95b Mon Sep 17 00:00:00 2001
From: Bruno Charest <bruno.charest@gmail.com>
Date: Wed, 22 Apr 2026 12:24:57 -0400
Subject: [PATCH] =?UTF-8?q?feat:=20masquer=20badge=20lecture=20ult=C3=A9ri?=
 =?UTF-8?q?eure=20en=20vue=20compacte=20(display=20none=20avec=20thumbnail?=
 =?UTF-8?q?/description),=20supprimer=20styles=20sp=C3=A9cifiques=20compac?=
 =?UTF-8?q?t=20badge=20(positionnement=20top=2050%=20transform=20-50%,=20i?=
 =?UTF-8?q?c=C3=B4ne=20bookmark=20SVG=2026=C3=9726px=20rouge,=20shadow),?=
 =?UTF-8?q?=20et=20cleanup=20r=C3=A8gles=20mobile=20redondantes=20position?=
 =?UTF-8?q?nement/transform=20badge=20readlater,=20tout=20en=20conservant?=
 =?UTF-8?q?=20styles=20bouton=20toggle=20actif=20avec=20background=20#ef44?=
 =?UTF-8?q?44=20blanc=20+=20shadow=20(dark=20mode=20#f87171=20#1b0b0b)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 shaarli-pro/css/style.css | 47 ++++++++++++---------------------------
 1 file changed, 14 insertions(+), 33 deletions(-)

diff --git a/shaarli-pro/css/style.css b/shaarli-pro/css/style.css
index 2920046..a5f156f 100644
--- a/shaarli-pro/css/style.css
+++ b/shaarli-pro/css/style.css
@@ -1622,9 +1622,17 @@ body.view-notes .paging {
     color: inherit;
 }
 
-.link-actions .readitlater-toggle-btn.active {
-    color: #dc2626;
-    background: rgba(220, 38, 38, 0.08);
+.link-actions .readitlater-toggle-btn.active,
+.link-actions .readitlater-toggle-btn.active:hover {
+    background: #ef4444;
+    color: #fff;
+    box-shadow: 0 2px 6px rgba(239, 68, 68, 0.35);
+}
+
+[data-theme="dark"] .link-actions .readitlater-toggle-btn.active,
+[data-theme="dark"] .link-actions .readitlater-toggle-btn.active:hover {
+    background: #f87171;
+    color: #1b0b0b;
 }
 
 .link-actions .readitlater-toggle-btn.is-loading {
@@ -4275,7 +4283,8 @@ table {
 }
 
 .view-compact .link-thumbnail,
-.view-compact .link-description {
+.view-compact .link-description,
+.view-compact .link-readlater-badge {
     display: none !important;
 }
 
@@ -4383,28 +4392,6 @@ table {
     font-size: 1rem;
 }
 
-.view-compact .link-readlater-badge {
-    top: 50%;
-    right: calc(0.65rem + 26px + 0.4rem);
-    left: auto;
-    transform: translateY(-50%);
-    width: 26px;
-    height: 26px;
-    padding: 0;
-    color: transparent;
-    font-size: 0;
-    border-radius: 0.45rem;
-    background: #ef4444 url('data:image/svg+xml;utf8,<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="%23fff" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="m19 21-7-4-7 4V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v16z"/></svg>') no-repeat center;
-    box-shadow: 0 2px 4px rgba(239, 68, 68, 0.35);
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-}
-
-[data-theme="dark"] .view-compact .link-readlater-badge {
-    background-color: #f87171;
-}
-
 @media (max-width: 768px) {
     .view-compact .compact-table-head {
         display: none;
@@ -4447,8 +4434,7 @@ table {
     }
 
     .view-compact .link-select-checkbox,
-    .view-compact .link-visibility-badge,
-    .view-compact .link-readlater-badge {
+    .view-compact .link-visibility-badge {
         top: 0.7rem;
         transform: none;
     }
@@ -4458,11 +4444,6 @@ table {
         right: 0.7rem;
     }
 
-    .view-compact .link-readlater-badge {
-        left: auto;
-        right: calc(0.7rem + 26px + 0.4rem);
-    }
-
     .view-compact .link-select-checkbox {
         right: auto;
         left: 0.7rem;