Made font size match device preference

This commit is contained in:
2026-02-17 17:15:07 -06:00
parent 49cbe6abb2
commit 759083ea7d
10 changed files with 94 additions and 94 deletions
+5 -5
View File
@@ -73,7 +73,7 @@ export const TaskCard: Component<{ task: Task }> = (props) => {
{props.task.title}
</h3>
{props.task.content && (
<div class="text-[11px] sm:text-xs text-muted-foreground/60 line-clamp-1 mt-1 leading-tight whitespace-pre">
<div class="text-[0.6875rem] sm:text-xs text-muted-foreground/60 line-clamp-1 mt-1 leading-tight whitespace-pre">
{(() => {
let html = props.task.content || "";
// Replace block tags with newlines first to preserve structure
@@ -97,7 +97,7 @@ export const TaskCard: Component<{ task: Task }> = (props) => {
{/* Priority */}
<div class="flex items-center gap-1.5 shrink-0">
<ArrowUpCircle size={12} class="text-primary opacity-60" />
<span class="text-[10px] font-medium">P{props.task.priority}</span>
<span class="text-[0.625rem] font-medium">P{props.task.priority}</span>
</div>
{/* Shared Indicator - shows for individual shares OR tag-based ShareRules */}
@@ -132,7 +132,7 @@ export const TaskCard: Component<{ task: Task }> = (props) => {
{(tag) => (
<Badge
variant="secondary"
class="h-4 px-1.5 text-[9px] gap-1 bg-muted/50 border-border/50 shrink-0"
class="h-4 px-1.5 text-[0.5625rem] gap-1 bg-muted/50 border-border/50 shrink-0"
style={{
"background-color": (() => {
const def = store.tagDefinitions.find(d => d.name === tag);
@@ -166,7 +166,7 @@ export const TaskCard: Component<{ task: Task }> = (props) => {
{/* Due Date + Urgency Slide-out */}
<div class="relative group/date flex items-center h-5 cursor-help shrink-0 min-w-0">
{/* Due Date - Static Layer on Top */}
<div class="flex items-center space-x-1 text-[9px] font-bold text-muted-foreground uppercase tracking-wider bg-card relative z-20 pr-1">
<div class="flex items-center space-x-1 text-[0.5625rem] font-bold text-muted-foreground uppercase tracking-wider bg-card relative z-20 pr-1">
<Clock size={11} class="text-primary/60" />
<span class="truncate">{formattedDate()}</span>
</div>
@@ -176,7 +176,7 @@ export const TaskCard: Component<{ task: Task }> = (props) => {
"absolute left-4 top-0 bottom-0 flex items-center transition-all duration-300 ease-out z-10 opacity-0 group-hover/date:opacity-100 group-hover/date:left-full whitespace-nowrap",
urgencyColor()
)}>
<span class="text-[9px] font-bold ml-2 transition-all duration-300 transform translate-x-[-8px] group-hover/date:translate-x-0 group-hover/date:blur-none blur-[2px]">
<span class="text-[0.5625rem] font-bold ml-2 transition-all duration-300 transform translate-x-[-8px] group-hover/date:translate-x-0 group-hover/date:blur-none blur-[2px]">
Urgency {urgencyLevel()}
</span>
</div>