revert prisma schema to latest, add global css for scroll-bar, fix css

src/app/(main)/App.tsx

@@ -49,8 +49,8 @@ export function App({ children }) {
       <Column display={{ base: 'none', lg: 'flex' }}>
         <SideNav />
       </Column>
-      <Column alignItems="center" overflowY="auto" overflowX="hidden" position="relative">
-        {children}
+      <Column overflowX="hidden" position="relative">
+        <Column alignItems="center">{children}</Column>
       </Column>
       <UpdateNotice user={user} config={config} />
       {process.env.NODE_ENV === 'production' && !pathname.includes('/share/') && (

src/app/(main)/settings/SettingsLayout.tsx

@@ -12,7 +12,7 @@ export function SettingsLayout({ children }: { children: ReactNode }) {
         width="240px"
         height="100%"
         border="right"
-        backgroundColor
+        backgroundColor={'surface-raised'}
         marginRight="2"
         padding="3"
       >

src/app/(main)/settings/preferences/DateRangeSetting.tsx

@@ -21,7 +21,12 @@ export function DateRangeSetting() {
 
   return (
     <Row gap="3">
-      <DateFilter value={date} onChange={handleChange} placement="bottom start" />
+      <DateFilter
+        value={date}
+        onChange={handleChange}
+        placement="bottom start"
+        style={{ minWidth: '250px' }}
+      />
       <Button onPress={handleReset}>{formatMessage(labels.reset)}</Button>
     </Row>
   );

src/app/(main)/settings/preferences/LanguageSetting.tsx

@@ -34,6 +34,7 @@ export function LanguageSetting() {
         onSearch={setSearch}
         onOpenChange={handleOpen}
         listProps={{ style: { maxHeight: 300 } }}
+        style={{ minWidth: '250px' }}
       >
         {items.map(item => (
           <ListItem key={item} id={item}>

src/app/(main)/settings/preferences/PreferenceSettings.tsx

@@ -15,7 +15,7 @@ export function PreferenceSettings() {
   }
 
   return (
-    <Column width="400px" gap="6">
+    <Column gap="6">
       <Column>
         <Label>{formatMessage(labels.defaultDateRange)}</Label>
         <DateRangeSetting />

src/app/(main)/settings/preferences/TimezoneSetting.tsx

@@ -30,6 +30,7 @@ export function TimezoneSetting() {
         onSearch={setSearch}
         onOpenChange={handleOpen}
         listProps={{ style: { maxHeight: 300 } }}
+        style={{ minWidth: '250px' }}
       >
         {items.map((item: any) => (
           <ListItem key={item} id={item}>

src/app/(main)/settings/profile/ProfileSettings.tsx

@@ -29,7 +29,7 @@ export function ProfileSettings() {
   };
 
   return (
-    <Column width="400px" gap="6">
+    <Column gap="6">
       <Column>
         <Label>{formatMessage(labels.username)}</Label>
         {username}

src/app/(main)/websites/[websiteId]/sessions/SessionActivity.tsx

@@ -61,7 +61,7 @@ export function SessionActivity({
 
           return (
             <Column key={eventId} gap>
-              {showHeader && <Heading size="sm">{formatTimezoneDate(createdAt, 'PPPP')}</Heading>}
+              {showHeader && <Heading size="lg">{formatTimezoneDate(createdAt, 'PPPP')}</Heading>}
               <Row alignItems="center" gap="6" height="40px">
                 <StatusLight color={`#${visitId?.substring(0, 6)}`}>
                   <Text wrap="nowrap">{formatTimezoneDate(createdAt, 'pp')}</Text>

src/app/global.css

@@ -24,3 +24,41 @@ a:hover {
   color: var(--text-primary);
   text-decoration: none;
 }
+
+::-webkit-scrollbar {
+  width: 15px;
+  background: transparent;
+}
+
+::-webkit-scrollbar-track {
+  border: 7px solid rgba(0, 0, 0, 0);
+  background-color: var(--border-default);
+  background-clip: padding-box;
+}
+
+::-webkit-scrollbar-thumb {
+  border: 7px solid rgba(0, 0, 0, 0);
+  background-color: var(--text-disabled);
+  border-radius: var(--border-radius-full);
+  background-clip: padding-box;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  border: 4px solid rgba(0, 0, 0, 0);
+  background-clip: padding-box;
+}
+
+/* Fix autofill background color to match dark theme */
+input:-webkit-autofill,
+input:-webkit-autofill:hover,
+input:-webkit-autofill:focus,
+input:-webkit-autofill:active,
+textarea:-webkit-autofill,
+textarea:-webkit-autofill:hover,
+textarea:-webkit-autofill:focus,
+select:-webkit-autofill,
+select:-webkit-autofill:hover,
+select:-webkit-autofill:focus {
+  -webkit-box-shadow: 0 0 0 1000px var(--background-color) inset !important;
+  transition: color 5000s ease-in-out 0s;
+}

src/app/login/LoginPage.tsx

@@ -4,7 +4,13 @@ import { LoginForm } from './LoginForm';
 
 export function LoginPage() {
   return (
-    <Column alignItems="center" height="100vh" backgroundColor="surface-raised" paddingTop="12">
+    <Column
+      alignItems="center"
+      justifyContent="flex-start"
+      height="100vh"
+      backgroundColor="surface-raised"
+      style={{ paddingTop: '15vh' }}
+    >
       <LoginForm />
     </Column>
   );

src/components/common/NavMenu.tsx

@@ -55,7 +55,7 @@ export function NavMenu({
     <Column gap overflowY="auto" justifyContent="space-between" position="sticky">
       {title && (
         <Row padding>
-          <Heading size="sm">{title}</Heading>
+          <Heading size="lg">{title}</Heading>
         </Row>
       )}
       <Column gap="6" {...props}>

src/components/metrics/WeeklyTraffic.tsx

@@ -96,7 +96,7 @@ export function WeeklyTraffic({ websiteId }: { websiteId: string }) {
                           </Row>
                         </Focusable>
                         <Tooltip placement="right">
-                          <Text size="sm">{`${formatMessage(labels.visitors)}: ${count}`}</Text>
+                          <Text size="base">{`${formatMessage(labels.visitors)}: ${count}`}</Text>
                         </Tooltip>
                       </TooltipTrigger>
                     );