style(ui): counters on labels sit right after the word
The counter hung at the label's right edge with a fixed 12 px gap, so two-digit numbers covered part of the last letter. It now follows the word in the text flow (position="text"): only its ring overlaps, the same for any number of digits, and wide numbers widen the tab. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
8989321bdd
commit
92993c2dd2
6 files changed
+29
-19
No files matched your search
@@ -1796,9 +1796,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-3' : ''}`}>
|
||||
<span className="inline-flex items-center">
|
||||
Alle Aufgaben
|
||||
<CountBadge count={openTasksCount} position="corner" className="-top-0.5 -right-2" />
|
||||
<CountBadge count={openTasksCount} position="text" />
|
||||
</span>
|
||||
</button>
|
||||
|
||||
@@ -1825,9 +1825,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-3' : ''}`}>
|
||||
<span className="inline-flex items-center">
|
||||
{tl.title}
|
||||
<CountBadge count={tl.tasksCount} position="corner" className="-top-0.5 -right-2" />
|
||||
<CountBadge count={tl.tasksCount} position="text" />
|
||||
</span>
|
||||
|
||||
{(() => {
|
||||
|
||||
Reference in new issue
Block a user