fix UI

enjoy/src/renderer/components/documents/document-config-button.tsx

@@ -20,7 +20,7 @@ export const DocumentConfigButton = (props: { document: DocumentEType }) => {
     <Popover open={configOpen} onOpenChange={setConfigOpen}>
       <PopoverTrigger asChild>
         <Button variant="ghost" size="icon" className="w-6 h-6">
-          <SettingsIcon className="w-5 h-5" />
+          <SettingsIcon className="size-4" />
         </Button>
       </PopoverTrigger>
       <PopoverContent side="bottom" align="start">

enjoy/src/renderer/components/documents/document-epub-renderer.tsx

@@ -145,7 +145,7 @@ export const DocumentEpubRenderer = () => {
           <DropdownMenu>
             <DropdownMenuTrigger asChild>
               <Button variant="ghost" size="icon" className="w-6 h-6">
-                <MenuIcon className="w-5 h-5" />
+                <MenuIcon className="size-4" />
               </Button>
             </DropdownMenuTrigger>
             <DropdownMenuContent

enjoy/src/renderer/components/layouts/sidebar.tsx

@@ -350,7 +350,7 @@ const SidebarHeader = (props: { isCollapsed: boolean }) => {
             onSelect={() => setDisplayDepositDialog(true)}
             className="cursor-pointer"
           >
-            <span className="flex-1 truncate">${user.balance}</span>
+            <span className="flex-1 truncate">${user.balance || 0.0}</span>
             <CreditCardIcon className="size-4 ml-auto" />
           </DropdownMenuItem>
           <DropdownMenuSeparator />

enjoy/src/renderer/pages/document.tsx

@@ -58,7 +58,7 @@ const DocumentComponent = () => {
         </BreadcrumbList>
       </Breadcrumb>
 
-      <ResizablePanelGroup direction="horizontal" className="p-4">
+      <ResizablePanelGroup direction="horizontal" className="px-4 pb-4">
         <ResizablePanel id="document" order={0}>
           <ScrollArea
             className={`h-full px-4 pb-6 border rounded-lg shadow-lg ${