sandrodach/MindSift
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ui): tab counters 4px lower and further right
MindSift CI & Docker Release / Build, Test in Container & Push (push) Successful in 1m32s
Details

Browse Source 
Corner counters on tabs (header, task lists, lists, workspace) sat on
the tab's top border and close to the text; now -top-0.5 -right-2 with
pr-3 on the label. The mobile bottom bar keeps its icon placement.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
sandrodachandClaude Opus 5.5 committed 2026-10-29 12:46:26 +01:00
1 parent e7851f1257
commit 6d6a35d28d
5 files changed
+17 -17
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

frontend/src/App.tsx
+6 -6
View File
@@ -987,9 +987,9 @@ export const App: React.FC = () => {
className={`tab-btn ${activeTab === 'triage' ? 'tab-btn-active' : ''}`}
>
<Layers className="w-4 h-4" />
<span className={`relative inline-flex items-center ${stats.inboxCount > 0 ? 'pr-2' : ''}`}>
<span className={`relative inline-flex items-center ${stats.inboxCount > 0 ? 'pr-3' : ''}`}>
<span>Triage</span>
<CountBadge count={stats.inboxCount} variant="accent" position="corner" className="-top-1.5 -right-1" />
<CountBadge count={stats.inboxCount} variant="accent" position="corner" className="-top-0.5 -right-2" />
</span>
</button>
@@ -1012,9 +1012,9 @@ export const App: React.FC = () => {
className={`tab-btn ${activeTab === 'tasks' ? 'tab-btn-active' : ''}`}
>
<CheckSquare className="w-4 h-4" />
<span className={`relative inline-flex items-center ${stats.tasksOpenCount > 0 ? 'pr-2' : ''}`}>
<span className={`relative inline-flex items-center ${stats.tasksOpenCount > 0 ? 'pr-3' : ''}`}>
<span>Aufgaben</span>
<CountBadge count={stats.tasksOpenCount} variant="accent" position="corner" className="-top-1.5 -right-1" />
<CountBadge count={stats.tasksOpenCount} variant="accent" position="corner" className="-top-0.5 -right-2" />
</span>
</button>
@@ -1026,9 +1026,9 @@ export const App: React.FC = () => {
className={`tab-btn ${activeTab === 'lists' ? 'tab-btn-active' : ''}`}
>
<ShoppingCart className="w-4 h-4" />
<span className={`relative inline-flex items-center ${(stats.listItemsOpenCount ?? 0) > 0 ? 'pr-2' : ''}`}>
<span className={`relative inline-flex items-center ${(stats.listItemsOpenCount ?? 0) > 0 ? 'pr-3' : ''}`}>
<span>Listen</span>
<CountBadge count={stats.listItemsOpenCount} variant="accent" position="corner" className="-top-1.5 -right-1" />
<CountBadge count={stats.listItemsOpenCount} variant="accent" position="corner" className="-top-0.5 -right-2" />
</span>
</button>
</div>
frontend/src/features/lists/SharedListsView.tsx
+2 -2
View File
@@ -872,9 +872,9 @@ export const SharedListsView: React.FC<SharedListsViewProps> = ({ onRefreshGloba
>
<span>{lst.icon}</span>
{/* Counter on the label, like in the nav bar */}
<span className={`relative inline-flex items-center ${openCount > 0 ? 'pr-2' : ''}`}>
<span className={`relative inline-flex items-center ${openCount > 0 ? 'pr-3' : ''}`}>
{lst.title}
<CountBadge count={openCount} position="corner" className="-top-1.5 -right-1" />
<CountBadge count={openCount} position="corner" className="-top-0.5 -right-2" />
</span>
<AvatarStack
people={otherMembers(lst)}
frontend/src/features/triage/TasksView.tsx
+4 -4
View File
@@ -1405,9 +1405,9 @@ export const TasksView: React.FC<TasksViewProps> = ({
}`}
>
{/* Counter on the label, like in the nav bar */}
<span className={`relative inline-flex items-center ${openTasksCount ? 'pr-2' : ''}`}>
<span className={`relative inline-flex items-center ${openTasksCount ? 'pr-3' : ''}`}>
Alle Aufgaben
<CountBadge count={openTasksCount} position="corner" className="-top-1.5 -right-1" />
<CountBadge count={openTasksCount} position="corner" className="-top-0.5 -right-2" />
</span>
</button>
@@ -1423,9 +1423,9 @@ export const TasksView: React.FC<TasksViewProps> = ({
className="h-full px-3 text-xs font-medium flex items-center gap-1.5 rounded-btn"
>
<span>{tl.icon}</span>
<span className={`relative inline-flex items-center ${tl.tasksCount ? 'pr-2' : ''}`}>
<span className={`relative inline-flex items-center ${tl.tasksCount ? 'pr-3' : ''}`}>
{tl.title}
<CountBadge count={tl.tasksCount} position="corner" className="-top-1.5 -right-1" />
<CountBadge count={tl.tasksCount} position="corner" className="-top-0.5 -right-2" />
</span>
{(() => {
frontend/src/features/workspace/WorkspaceView.tsx
+4 -4
View File
@@ -1229,9 +1229,9 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
}`}
>
<Check className="w-3.5 h-3.5 text-status-ok" />
<span className={`relative inline-flex items-center ${totalOpenTodos > 0 ? 'pr-2' : ''}`}>
<span className={`relative inline-flex items-center ${totalOpenTodos > 0 ? 'pr-3' : ''}`}>
To-Dos
<CountBadge count={totalOpenTodos} position="corner" className="-top-1.5 -right-1" />
<CountBadge count={totalOpenTodos} position="corner" className="-top-0.5 -right-2" />
</span>
</button>
@@ -1248,9 +1248,9 @@ export const WorkspaceView: React.FC<WorkspaceViewProps> = ({
}`}
>
<Hash className="w-3.5 h-3.5 text-accent" />
<span className={`relative inline-flex items-center ${tagsSummary.length > 0 ? 'pr-2' : ''}`}>
<span className={`relative inline-flex items-center ${tagsSummary.length > 0 ? 'pr-3' : ''}`}>
Hashtags
<CountBadge count={tagsSummary.length} position="corner" className="-top-1.5 -right-1" />
<CountBadge count={tagsSummary.length} position="corner" className="-top-0.5 -right-2" />
</span>
</button>
</div>