wip: new onboarding

src/shared/layouts/auth.tsx

@@ -1,4 +1,4 @@
-import { Outlet } from 'react-router-dom';
+import { Outlet, ScrollRestoration } from 'react-router-dom';
 import { WindowTitlebar } from 'tauri-controls';
 
 import { useStorage } from '@libs/storage/provider';
@@ -7,10 +7,11 @@ export function AuthLayout() {
   const { db } = useStorage();
 
   return (
-    <div className="relative h-screen w-screen bg-neutral-50 dark:bg-neutral-950">
+    <div className="h-screen w-screen bg-neutral-50 dark:bg-neutral-950">
       {db.platform !== 'macos' ? <WindowTitlebar /> : null}
-      <div className="bg-neutral-50 dark:bg-neutral-950">
+      <div className="h-full w-full">
         <Outlet />
+        <ScrollRestoration />
       </div>
     </div>
   );

src/shared/notes/preview/link.tsx

@@ -41,19 +41,23 @@ export function LinkPreview({ urls }: { urls: string[] }) {
                 <img
                   src={data.image}
                   alt={urls[0]}
-                  className="h-44 w-full rounded-t-lg object-cover"
+                  className="h-44 w-full rounded-t-lg bg-white object-cover"
                 />
               )}
-              <div className="flex flex-col gap-1 border-t border-white/5 px-3 py-3">
-                <h5 className="line-clamp-1 text-base font-semibold text-neutral-900 dark:text-neutral-100">
-                  {data.title}
-                </h5>
-                {data.description && (
-                  <p className="line-clamp-3 break-words text-sm text-neutral-700 dark:text-neutral-400">
-                    {data.description}
-                  </p>
-                )}
-                <span className="mt-2.5 text-sm text-neutral-600 dark:text-neutral-400">
+              <div className="flex flex-col px-3 py-3">
+                <div className="flex flex-col gap-1">
+                  {data.title && (
+                    <h5 className="line-clamp-1 text-base font-semibold text-neutral-900 dark:text-neutral-100">
+                      {data.title}
+                    </h5>
+                  )}
+                  {data.description && (
+                    <p className="mb-2.5 line-clamp-3 break-words text-sm text-neutral-700 dark:text-neutral-400">
+                      {data.description}
+                    </p>
+                  )}
+                </div>
+                <span className="break-all text-sm text-neutral-600 dark:text-neutral-400">
                   {domain.hostname}
                 </span>
               </div>

src/shared/widgets/local/network.tsx

@@ -126,23 +126,23 @@ export function LocalNetworkWidget() {
                   {isFetchingNextPage ? (
                     <>
                       <span>Loading...</span>
-                      <LoaderIcon className="h-5 w-5 animate-spin text-neutral-900 dark:text-neutral-100" />
+                      <LoaderIcon className="h-5 w-5 animate-spin" />
                     </>
                   ) : hasNextPage ? (
                     <>
-                      <ArrowRightCircleIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />
+                      <ArrowRightCircleIcon className="h-5 w-5" />
                       <span>Load more</span>
                     </>
                   ) : (
                     <>
-                      <ArrowRightCircleIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />
+                      <ArrowRightCircleIcon className="h-5 w-5" />
                       <span>Nothing more to load</span>
                     </>
                   )}
                 </button>
               ) : null}
             </div>
-            <div className="h-16" />
+            <div className="h-14" />
           </VList>
         )}
       </div>