style: adjust size of top bar icons

src/components/Titlebar/index.tsx

@@ -10,7 +10,7 @@ export function Titlebar({
   return (
     <div
       className={cn(
-        'sticky top-0 w-full z-40 bg-background [&_svg]:size-4 [&_svg]:shrink-0',
+        'sticky top-0 w-full h-12 z-40 bg-background [&_svg]:size-5 [&_svg]:shrink-0',
         className
       )}
     >

src/components/ui/button.tsx

@@ -23,7 +23,7 @@ const buttonVariants = cva(
         sm: 'h-8 rounded-md px-3 text-xs',
         lg: 'h-10 rounded-md px-8',
         icon: 'h-9 w-9',
-        'titlebar-icon': 'h-10 w-10 rounded-lg'
+        'titlebar-icon': 'h-10 w-10 rounded-lg [&_svg]:size-5'
       }
     },
     defaultVariants: {

src/layouts/PrimaryPageLayout/index.tsx

@@ -87,5 +87,5 @@ export type TPrimaryPageLayoutRef = {
 }
 
 function PrimaryPageTitlebar({ children }: { children?: React.ReactNode }) {
-  return <Titlebar className="h-12 p-1">{children}</Titlebar>
+  return <Titlebar className="p-1">{children}</Titlebar>
 }

src/layouts/SecondaryPageLayout/index.tsx

@@ -105,7 +105,7 @@ export function SecondaryPageTitlebar({
   hideBackButton?: boolean
 }): JSX.Element {
   return (
-    <Titlebar className="h-12 flex gap-1 p-1 items-center justify-between font-semibold">
+    <Titlebar className="flex gap-1 p-1 items-center justify-between font-semibold">
       {hideBackButton ? (
         <div className="flex gap-2 items-center pl-3 w-fit truncate text-lg font-semibold">
           {title}