chore: tweak responsive header and link

This commit is contained in:
Aslam H
2024-09-09 07:18:44 +07:00
parent 4a57568391
commit 2c53acbac5
3 changed files with 4 additions and 4 deletions

View File

@@ -26,11 +26,11 @@ export const LinkHeader = React.memo(() => {
return ( return (
<> <>
<ContentHeader className="px-6 py-5 max-lg:px-4"> <ContentHeader className="px-6 max-lg:px-4 lg:py-5">
<div className="flex min-w-0 shrink-0 items-center gap-1.5"> <div className="flex min-w-0 shrink-0 items-center gap-1.5">
<SidebarToggleButton /> <SidebarToggleButton />
<div className="flex min-h-0 items-center"> <div className="flex min-h-0 items-center">
<span className="truncate text-left text-xl font-bold">Links</span> <span className="truncate text-left font-bold lg:text-xl">Links</span>
</div> </div>
</div> </div>

View File

@@ -92,7 +92,7 @@ export const LinkItem: React.FC<LinkItemProps> = ({
onKeyDown={handleKeyDown} onKeyDown={handleKeyDown}
className={cn( className={cn(
"relative cursor-default outline-none", "relative cursor-default outline-none",
"grid grid-cols-[auto_1fr_auto] items-center gap-x-2 px-2 py-2 sm:px-4 sm:py-2", "grid grid-cols-[auto_1fr_auto] items-center gap-x-2 py-2 max-lg:px-4 sm:px-5 sm:py-2",
{ {
"bg-muted-foreground/10": isActive, "bg-muted-foreground/10": isActive,
"hover:bg-muted/50": !isActive "hover:bg-muted/50": !isActive

View File

@@ -93,7 +93,7 @@ export const TopicDetailHeader = React.memo(function TopicDetailHeader({ topic }
<div className="flex min-w-0 shrink-0 items-center gap-1.5"> <div className="flex min-w-0 shrink-0 items-center gap-1.5">
<SidebarToggleButton /> <SidebarToggleButton />
<div className="flex min-h-0 items-center"> <div className="flex min-h-0 items-center">
<span className="truncate text-left text-xl font-bold">{topic.prettyName}</span> <span className="truncate text-left font-bold lg:text-xl">{topic.prettyName}</span>
</div> </div>
</div> </div>