Cardoza_Construction/TasGrid
3
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Made font size match device preference

Browse Source
This commit is contained in:
Timothy Cardoza
2026-02-17 17:15:07 -06:00
parent 49cbe6abb2
commit 759083ea7d
10 changed files with 94 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/TaskDetail.tsx
+11 -11
View File
@@ -181,7 +181,7 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
{/* Priority */}
<div class="flex items-center gap-1 group shrink-0">
<span class="text-[10px] uppercase font-bold tracking-wider text-muted-foreground/70 hidden sm:inline">Priority</span>
<span class="text-[0.625rem] uppercase font-bold tracking-wider text-muted-foreground/70 hidden sm:inline">Priority</span>
<Select<any>
value={props.task.priority.toString()}
onChange={(val: string | null) => val && updatePriority(val)}
@@ -205,7 +205,7 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
{/* Urgency */}
<div class="flex items-center gap-1 group shrink-0">
<span class="text-[10px] uppercase font-bold tracking-wider text-muted-foreground/70 hidden sm:inline">Time</span>
<span class="text-[0.625rem] uppercase font-bold tracking-wider text-muted-foreground/70 hidden sm:inline">Time</span>
<Select<any>
value={currentUrgency()}
onChange={(val: string | null) => val && updateUrgency(val)}
@@ -229,7 +229,7 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
{/* Size */}
<div class="flex items-center gap-1 group shrink-0">
<span class="text-[10px] uppercase font-bold tracking-wider text-muted-foreground/70 hidden sm:inline">Size</span>
<span class="text-[0.625rem] uppercase font-bold tracking-wider text-muted-foreground/70 hidden sm:inline">Size</span>
<Select<any>
value={(props.task.size ?? 5).toString()}
onChange={(val: any) => {
@@ -262,7 +262,7 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
<Button
variant="ghost"
size="sm"
class="h-8 px-1 sm:px-2 text-[10px] font-bold uppercase tracking-wider hover:bg-muted/50 flex items-center gap-1 sm:gap-1.5 text-muted-foreground hover:text-foreground transition-colors"
class="h-8 px-1 sm:px-2 text-[0.625rem] font-bold uppercase tracking-wider hover:bg-muted/50 flex items-center gap-1 sm:gap-1.5 text-muted-foreground hover:text-foreground transition-colors"
onClick={() => {
const instance = editorInstance();
if (instance) {
@@ -325,7 +325,7 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
{/* Tags at the bottom */}
<div class="mt-auto pt-6 border-t border-border/50">
<div class="flex flex-wrap items-center gap-3">
<span class="text-[10px] uppercase font-bold tracking-wider text-muted-foreground/60 shrink-0">Tags</span>
<span class="text-[0.625rem] uppercase font-bold tracking-wider text-muted-foreground/60 shrink-0">Tags</span>
<div class="flex flex-wrap items-center gap-1.5 min-w-0 flex-1">
<TagPicker
selectedTags={props.task.tags || []}
@@ -404,7 +404,7 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
<PopoverContent class="w-72 p-0 overflow-hidden" align="end">
<div class="flex flex-col">
<div class="p-2 border-b border-border/50">
<div class="text-[10px] font-bold uppercase tracking-wider text-muted-foreground/70 px-2 py-1">Recurrence</div>
<div class="text-[0.625rem] font-bold uppercase tracking-wider text-muted-foreground/70 px-2 py-1">Recurrence</div>
<div class="flex flex-col gap-2 p-2 pt-0">
<Select
value={props.task.recurrence?.type || "none"}
@@ -442,7 +442,7 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
{(day, index) => (
<button
class={cn(
"w-7 h-7 rounded-full text-[10px] font-bold flex items-center justify-center transition-colors shadow-sm",
"w-7 h-7 rounded-full text-[0.625rem] font-bold flex items-center justify-center transition-colors shadow-sm",
props.task.recurrence?.days?.includes(index())
? "bg-primary text-primary-foreground"
: "bg-muted text-muted-foreground hover:bg-muted/80"
@@ -509,7 +509,7 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
{/* Sharing Section */}
<div class="p-2 border-t border-border/50">
<div class="text-[10px] font-bold uppercase tracking-wider text-muted-foreground/70 px-2 py-1 mb-1">Sharing</div>
<div class="text-[0.625rem] font-bold uppercase tracking-wider text-muted-foreground/70 px-2 py-1 mb-1">Sharing</div>
<UserSharePicker
taskId={props.task.id}
sharedWith={props.task.sharedWith || []}
@@ -569,12 +569,12 @@ const MetadataItem: Component<{
isToggled() ? "-translate-y-4" : "translate-y-0"
)}>
{/* Layer 1: Date */}
<div class="h-4 flex items-center gap-1.5 text-[11px] font-medium text-muted-foreground/80 whitespace-nowrap">
<div class="h-4 flex items-center gap-1.5 text-[0.6875rem] font-medium text-muted-foreground/80 whitespace-nowrap">
{props.icon}
{props.date}
</div>
{/* Layer 2: Time */}
<div class="h-4 flex items-center gap-2 text-[11px] font-bold text-foreground whitespace-nowrap">
<div class="h-4 flex items-center gap-2 text-[0.6875rem] font-bold text-foreground whitespace-nowrap">
<Clock size={11} class="text-primary/60 shrink-0" />
<span>{props.time}</span>
</div>
@@ -706,7 +706,7 @@ const UserSharePicker: Component<{
{rule.type === 'tag' ? <Tag size={10} /> : <Settings size={10} />}
</div>
<div class="flex flex-col min-w-0">
<span class="text-[11px] font-medium leading-none truncate">
<span class="text-[0.6875rem] font-medium leading-none truncate">
{getUserName(rule.targetUserId)}
</span>
<span class="text-[9px] text-muted-foreground/50 mt-0.5 uppercase tracking-tighter">