style: apply prettier formatting to all files

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

packages/frontend/src/routes/+page.svelte

@@ -1,24 +1,20 @@
 <script lang="ts">
-import { _ } from "svelte-i18n";
-import { Button } from "$lib/components/ui/button";
-import { Card, CardContent } from "$lib/components/ui/card";
-import { getAssetUrl } from "$lib/directus";
-import Meta from "$lib/components/meta/meta.svelte";
-import { formatVideoDuration } from "$lib/utils.js";
+  import { _ } from "svelte-i18n";
+  import { Button } from "$lib/components/ui/button";
+  import { Card, CardContent } from "$lib/components/ui/card";
+  import { getAssetUrl } from "$lib/directus";
+  import Meta from "$lib/components/meta/meta.svelte";
+  import { formatVideoDuration } from "$lib/utils.js";
 
-const { data } = $props();
+  const { data } = $props();
 </script>
 
-<Meta title={$_('home.hero.title')} description={$_('home.hero.description')} />
+<Meta title={$_("home.hero.title")} description={$_("home.hero.description")} />
 
 <!-- Hero Section -->
-<section
-  class="relative min-h-screen flex items-center justify-center overflow-hidden"
->
+<section class="relative min-h-screen flex items-center justify-center overflow-hidden">
   <!-- Background Gradient -->
-  <div
-    class="absolute inset-0 bg-gradient-to-br from-primary/20 via-accent/10 to-background"
-  ></div>
+  <div class="absolute inset-0 bg-gradient-to-br from-primary/20 via-accent/10 to-background"></div>
 
   <!-- Content -->
   <div class="relative z-10 container mx-auto px-4 text-center">
@@ -26,13 +22,11 @@ const { data } = $props();
       <h1
         class="text-6xl md:text-8xl font-bold bg-gradient-to-r from-primary via-accent to-primary bg-clip-text text-transparent leading-tight mb-8"
       >
-        {$_('home.hero.title')}
+        {$_("home.hero.title")}
       </h1>
 
-      <p
-        class="text-xl md:text-2xl text-muted-foreground max-w-3xl mx-auto leading-relaxed"
-      >
-        {$_('home.hero.description')}
+      <p class="text-xl md:text-2xl text-muted-foreground max-w-3xl mx-auto leading-relaxed">
+        {$_("home.hero.description")}
       </p>
 
       <div class="flex flex-col sm:flex-row gap-4 justify-center items-center">
@@ -42,13 +36,13 @@ const { data } = $props();
           href="/videos"
         >
           <span class="icon-[ri--play-large-fill]"></span>
-          {$_('home.hero.cta_videos')}
+          {$_("home.hero.cta_videos")}
         </Button>
         <Button
           variant="outline"
           size="lg"
           class="text-lg px-8 py-6 border-primary/50 hover:bg-primary/10"
-          href="/models">{$_('home.hero.cta_models')}</Button
+          href="/models">{$_("home.hero.cta_models")}</Button
         >
       </div>
     </div>
@@ -68,10 +62,10 @@ const { data } = $props();
   <div class="container mx-auto px-4">
     <div class="text-center mb-12">
       <h2 class="text-3xl md:text-4xl font-bold mb-4">
-        {$_('home.featured_models.title')}
+        {$_("home.featured_models.title")}
       </h2>
       <p class="text-muted-foreground text-lg">
-        {$_('home.featured_models.description')}
+        {$_("home.featured_models.description")}
       </p>
     </div>
 
@@ -83,7 +77,7 @@ const { data } = $props();
           <CardContent class="p-6 text-center">
             <div class="relative mb-4">
               <img
-                src={getAssetUrl(model.avatar, 'mini')}
+                src={getAssetUrl(model.avatar, "mini")}
                 alt={model.artist_name}
                 class="w-24 h-24 rounded-full mx-auto object-cover ring-4 ring-primary/20 group-hover:ring-primary/40 transition-all"
               />
@@ -107,8 +101,7 @@ const { data } = $props();
               variant="ghost"
               size="sm"
               class="mt-4 w-full group-hover:bg-primary/10"
-              href="/models/{model.slug}"
-              >{$_('home.featured_models.view_profile')}</Button
+              href="/models/{model.slug}">{$_("home.featured_models.view_profile")}</Button
             >
           </CardContent>
         </Card>
@@ -122,7 +115,7 @@ const { data } = $props();
   <div class="container mx-auto px-4">
     <div class="text-center mb-12">
       <h2 class="text-3xl md:text-4xl font-bold mb-4">
-        {$_('home.trending.title')}
+        {$_("home.trending.title")}
       </h2>
       <!-- <p class="text-muted-foreground text-lg">Most watched romantic content</p> -->
     </div>
@@ -134,16 +127,14 @@ const { data } = $props();
         >
           <div class="relative">
             <img
-              src={getAssetUrl(video.image, 'preview')}
+              src={getAssetUrl(video.image, "preview")}
               alt={video.title}
               class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300"
             />
             <div
               class="absolute inset-0 bg-gradient-to-t from-black/60 to-transparent group-hover:scale-105 transition-transform duration-300"
             ></div>
-            <div
-              class="absolute bottom-2 left-2 text-white text-sm font-medium"
-            >
+            <div class="absolute bottom-2 left-2 text-white text-sm font-medium">
               {#if video.movie_file?.duration}{formatVideoDuration(video.movie_file.duration)}{/if}
             </div>
             <!-- <div
@@ -160,21 +151,18 @@ const { data } = $props();
                 href="/videos/{video.slug}"
                 aria-label={video.title}
               >
-                <span class="icon-[ri--play-large-fill] w-8 h-8 text-white"
-                ></span>
+                <span class="icon-[ri--play-large-fill] w-8 h-8 text-white"></span>
               </a>
             </div>
           </div>
           <CardContent class="px-4 pb-4 pt-0">
-            <h3
-              class="font-semibold mb-2 group-hover:text-primary transition-colors"
-            >
+            <h3 class="font-semibold mb-2 group-hover:text-primary transition-colors">
               {video.title}
             </h3>
 
             <div class="flex items-center gap-2 text-sm text-muted-foreground">
               <span class="icon-[ri--fire-line] w-4 h-4"></span>
-              {$_('home.trending.trending')}
+              {$_("home.trending.trending")}
             </div>
           </CardContent>
         </Card>
@@ -184,29 +172,27 @@ const { data } = $props();
 </section>
 
 <!-- CTA Section -->
-<section
-  class="py-20 bg-gradient-to-r from-primary/10 via-accent/10 to-primary/10"
->
+<section class="py-20 bg-gradient-to-r from-primary/10 via-accent/10 to-primary/10">
   <div class="container mx-auto px-4 text-center">
     <div class="max-w-3xl mx-auto space-y-8">
       <h2 class="text-3xl md:text-4xl font-bold">
-        {$_('home.featured_models.join_community')}
+        {$_("home.featured_models.join_community")}
       </h2>
       <p class="text-lg text-muted-foreground">
-        {$_('home.featured_models.join_community_description')}
+        {$_("home.featured_models.join_community_description")}
       </p>
       <div class="flex flex-col sm:flex-row gap-4 justify-center">
         <Button
           href="/signup"
           size="lg"
           class="bg-gradient-to-r from-primary to-accent hover:from-primary/90 hover:to-accent/90 text-lg px-8 py-6"
-          >{$_('home.community.cta_join')}</Button
+          >{$_("home.community.cta_join")}</Button
         >
         <Button
           variant="outline"
           size="lg"
           class="text-lg px-8 py-6 border-primary/50 hover:bg-primary/10"
-          href="/magazine">{$_('home.community.cta_magazine')}</Button
+          href="/magazine">{$_("home.community.cta_magazine")}</Button
         >
       </div>
     </div>