From add8a511f9e5e2bc74ccdcfada216f18f139be30 Mon Sep 17 00:00:00 2001
From: Johannes Millan <johannes.millan@gmail.com>
Date: Tue, 21 Apr 2026 16:47:20 +0200
Subject: [PATCH] style(main-header): size sync icon to match other header
 icons

The sync button was pinned to 28px while every other header icon
(add task, panel toggles, etc.) sits at 20px, making it visually
oversized. Drop the sync-btn-specific override so it inherits the
shared 20px rule, and switch the general selector to exclude only
the small .sync-state-ico overlay badge (still 15px with absolute
positioning).
---
 .../main-header/main-header.component.scss       | 16 +++-------------
 1 file changed, 3 insertions(+), 13 deletions(-)

diff --git a/src/app/core-ui/main-header/main-header.component.scss b/src/app/core-ui/main-header/main-header.component.scss
index 86baa521cf..186829268a 100644
--- a/src/app/core-ui/main-header/main-header.component.scss
+++ b/src/app/core-ui/main-header/main-header.component.scss
@@ -145,9 +145,9 @@ button.isActive2 {
   }
 
   // Set 20px icon sizing for buttons outside counters-action-group
-  // (add button, panel buttons, etc.) but exclude sync button
-  > button:not(.sync-btn) .mat-icon,
-  ::ng-deep > *:not(.counters-action-group):not(.sync-btn) .mat-icon {
+  // (add button, panel buttons, etc.)
+  > button .mat-icon:not(.sync-state-ico),
+  ::ng-deep > *:not(.counters-action-group) .mat-icon:not(.sync-state-ico) {
     font-size: 20px;
     width: 20px;
     height: 20px;
@@ -347,16 +347,6 @@ page-title {
 
 .sync-btn {
   position: relative;
-
-  > .mat-icon:not(.sync-state-ico) {
-    font-size: 28px;
-    width: 28px;
-    height: 28px;
-    line-height: 28px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-  }
 }
 
 .sync-state-ico {