Update error handling and UI design across multiple files

Enhanced error handling in documentation and blog pages, to ensure smoother running and user experience. This also includes additional UI updates related to font selection, layout arrangement, and interactive elements on error pages, marketing pages, and general site navigation components. Moreover, a "contact us" feature has been added to error pages to help users seek assistance more conveniently.

apps/web/app/(marketing)/_components/site-footer.tsx

@@ -7,7 +7,7 @@ import appConfig from '~/config/app.config';
 
 export function SiteFooter() {
   return (
-    <footer className={'mt-auto py-8 2xl:py-16 relative w-full site-footer'}>
+    <footer className={'site-footer relative mt-auto w-full py-8 2xl:py-16'}>
       <div className={'container'}>
         <div className={'flex flex-col space-y-8 lg:flex-row lg:space-y-0'}>
           <div

apps/web/app/(marketing)/_components/site-header.tsx

@@ -9,7 +9,7 @@ export function SiteHeader(props: { user?: User | null }) {
   return (
     <div
       className={
-        'sticky top-0 z-10 w-full bg-background/80 backdrop-blur-md dark:bg-background/50 py-2 site-header'
+        'site-header sticky top-0 z-10 w-full bg-background/80 py-2 backdrop-blur-md dark:bg-background/50'
       }
     >
       <div className={'container'}>

apps/web/app/(marketing)/_components/site-navigation-item.tsx

@@ -12,8 +12,7 @@ const getClassName = (path: string, currentPathName: string) => {
   return cn(
     `text-sm font-medium px-2.5 py-2 border rounded-lg border-transparent transition-colors duration-100`,
     {
-      'dark:text-gray-300 dark:hover:text-white':
-        !isActive,
+      'dark:text-gray-300 dark:hover:text-white': !isActive,
       'dark:text-white text-current': isActive,
     },
   );

apps/web/app/(marketing)/_components/site-navigation.tsx

@@ -33,7 +33,7 @@ const links = {
   Contact: {
     label: 'marketing:contact',
     path: '/contact',
-  }
+  },
 };
 
 export function SiteNavigation() {
@@ -48,7 +48,11 @@ export function SiteNavigation() {
   return (
     <>
       <div className={'hidden items-center justify-center md:flex'}>
-        <NavigationMenu className={'border border-gray-100 dark:border-primary/10 rounded-full py-2 px-4'}>
+        <NavigationMenu
+          className={
+            'rounded-full border border-gray-100 px-4 py-2 dark:border-primary/10'
+          }
+        >
           <NavigationMenuList className={'space-x-1'}>
             {NavItems}
           </NavigationMenuList>

apps/web/app/(marketing)/_components/site-page-header.tsx

@@ -8,11 +8,19 @@ export function SitePageHeader(props: {
   return (
     <div className={cn('border-b py-8 xl:py-10 2xl:py-12', props.className)}>
       <div className={'container flex flex-col space-y-2 lg:space-y-4'}>
-        <h1 className={'font-medium font-heading text-3xl xl:text-5xl dark:text-white tracking-tight'}>
+        <h1
+          className={
+            'font-heading text-3xl font-medium tracking-tight dark:text-white xl:text-5xl'
+          }
+        >
           {props.title}
         </h1>
 
-        <h2 className={'text-lg text-muted-foreground 2xl:text-2xl tracking-tight'}>
+        <h2
+          className={
+            'text-lg tracking-tight text-muted-foreground 2xl:text-2xl'
+          }
+        >
           {props.subtitle}
         </h2>
       </div>