From 6e9f4f1f8ed74affb42650fa0fffb0f9fdf0544d Mon Sep 17 00:00:00 2001
From: Dorian <dorian@Dorians-MacBook-Air.local>
Date: Mon, 2 Feb 2026 23:56:38 +0000
Subject: [PATCH] Change mobile side margins to 16px (px-4)

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 src/components/ContentRow.vue | 4 ++--
 src/components/MobileNav.vue  | 2 +-
 src/views/Browse.vue          | 6 +++---
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/ContentRow.vue b/src/components/ContentRow.vue
index 2066284..e0471cc 100644
--- a/src/components/ContentRow.vue
+++ b/src/components/ContentRow.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="content-row">
-    <h2 class="text-xl md:text-2xl font-semibold text-white mb-4 px-6">
+    <h2 class="text-xl md:text-2xl font-semibold text-white mb-4 px-4">
       {{ title }}
     </h2>
     
@@ -19,7 +19,7 @@
       <!-- Content Slider -->
       <div 
         ref="sliderRef"
-        class="flex gap-8 overflow-x-auto overflow-y-visible scrollbar-hide scroll-smooth px-6 pt-6 pb-8"
+        class="flex gap-8 overflow-x-auto overflow-y-visible scrollbar-hide scroll-smooth px-4 pt-6 pb-8"
         @scroll="handleScroll"
       >
         <div
diff --git a/src/components/MobileNav.vue b/src/components/MobileNav.vue
index add1c5b..e4c865a 100644
--- a/src/components/MobileNav.vue
+++ b/src/components/MobileNav.vue
@@ -1,5 +1,5 @@
 <template>
-  <nav class="mobile-nav fixed bottom-0 left-0 right-0 z-50 md:hidden pb-4 px-6">
+  <nav class="mobile-nav fixed bottom-0 left-0 right-0 z-50 md:hidden pb-4 px-4">
     <div class="floating-glass-nav px-4 py-3 rounded-2xl">
       <div class="flex items-center justify-around gap-1">
         <button
diff --git a/src/views/Browse.vue b/src/views/Browse.vue
index 392cbb6..e73e93f 100644
--- a/src/views/Browse.vue
+++ b/src/views/Browse.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="browse-view">
     <!-- Header / Navigation -->
-    <header class="fixed top-0 left-0 right-0 z-50 pt-4 px-6">
+    <header class="fixed top-0 left-0 right-0 z-50 pt-4 px-4">
       <div class="floating-glass-header mx-auto px-4 md:px-6 py-3.5 rounded-2xl transition-all duration-300" style="max-width: 100%;">
         <div class="flex items-center justify-between">
           <!-- Logo -->
@@ -47,7 +47,7 @@
       </div>
 
       <!-- Hero Content -->
-      <div class="relative mx-auto px-6 md:px-8 h-full flex items-center pt-16" style="max-width: 90%;">
+      <div class="relative mx-auto px-4 md:px-8 h-full flex items-center pt-16" style="max-width: 90%;">
         <div class="max-w-2xl space-y-2.5 md:space-y-3 animate-fade-in">
           <!-- Title -->
           <h1 class="w-full text-3xl md:text-5xl lg:text-6xl font-bold drop-shadow-2xl leading-tight uppercase" style="font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-weight: 700;">
@@ -87,7 +87,7 @@
     </section>
 
     <!-- Content Rows -->
-    <section class="relative pt-8 pb-20 px-6">
+    <section class="relative pt-8 pb-20 px-4">
       <div class="mx-auto space-y-12">
 
         <!-- Featured Films -->