🚀 Mobile-first Home Page & Navigation Overhaul (#201)

* 🚀 Upgrade theme toggle

* ✨ Add responsive navbar components with theme toggle and dropdown functionality

- Implemented a desktop dropdown menu with GitHub and Sponsor links.
- Created a mobile menu with navigation links and theme toggle.
- Added theme toggle functionality with animations for light, dark, and system preferences.
- Introduced a chevron-down icon for dropdown indicators.
- Enhanced mobile menu with GSAP animations for smoother transitions.

* ✨ Refactor desktop dropdown menu for improved accessibility and functionality

* ✨ Enhance device dropdown with improved styles and accessibility features

* ✨ Refactor device dropdown components for improved structure and accessibility

* ✨ Update device icons and dropdown components for improved accessibility and functionality

* ✨ Refactor device dropdown components for improved layout and accessibility

* ✨ Update device dropdown styles for improved visual feedback and accessibility

* ✨ Update device dropdown and navigation bar styles for improved accessibility and consistency

* ✨ Enhance theme toggle functionality with improved preference cycling and hover hint

* ✨ Update theme toggle hover hint for improved visibility and integrate theme toggle in navigation bar

* ✨ Update device dropdown styles for improved spacing and visual consistency

* 🎨 Refactor documentation components and update structure

* 🚚 Rename early-adopter and mobile to pricing

* ✨ Enhance mobile menu theme toggle with improved accessibility and styling adjustments

* 🚚 Move hero section content to a separate component for improved organization and maintainability

* 🚚 Refactor pricing, privacy policy, terms of service, and welcome pages for improved layout and structure

* 💄 Add mockup images & decoration lines to hero section

* ✨ Enhance hero section with video introduction and improved mockup layout

* ✨ Add demo app section with links to Play Store, App Store, and GitHub

* ✨ Enhance hero section with animated headline and video integration

* 💄 Update hero section layout and styling for improved visuals

* ✨ Add feature list to hero section

* ✨ Refactor feature list into an infinite vertical marquee and conditionally load analytics script in production

* 💄 Refactor icon components to use currentColor for fill and apply Tailwind CSS classes for dark mode support

* 💄 Refactor icon components to use CSS variables for colors

* 💄 Adjust margin for demo app section and refine marquee positioning for better layout

* 💄 Update hero section styles for improved layout and accessibility

* 💄 Add width, height, and loading attributes to hero section images for improved performance and layout

* 💄 Update image classes in hero section for improved dark mode support and performance

* ✨ Add Laravel welcome page

* 💄 Enhance demo app section with animation and improved layout

* 💄 Refactor animations in hero section to use GSAP for improved performance and consistency

* 💄 Update hero section layout and styles for improved responsiveness and visual consistency

* 💄 Update hero section typography and styles for improved responsiveness

* 💄 Refactor hero section mockups and add horizontal marquee for feature list

* 💄 Adjust spacing and layout in hero section for improved visual consistency

* 💄 Enhance hero section styles for improved responsiveness on 2xl screens

* 💄 Add introduction video for mobile viewport and clean up unused video section

* 💄 Replace motion.js animations with GSAP for improved performance and smoother transitions

* 💄 Adjust blur element positions for improved visual alignment in hero section

* 💄 Update hero and partners sections for improved layout and styling; add featured sponsor card component

* ♻️ Refactor sponsor components: replace featured sponsor card with featured partner card and update related references

* 💄 Update featured partner card styles and enhance partners section layout

* 💄 Add partner card component and update partners section for improved layout

* 💄 Enhance featured partner card layout and styling; adjust partners section for improved spacing and alignment

* 💄 Update styling for featured partner card and partners section; adjust padding and layout for improved responsiveness

* 💄 Update featured partners layout and enhance partner call-to-action styling for improved visibility and engagement

* 💄 Enhance partner call-to-action section with improved styling and responsiveness for better engagement

* 💄 Add explainer section and phone wireframe illustration for enhanced user understanding

* 💄 Add overflow handling and grid illustration to explainer section for improved layout and visual appeal

* 💄 Enhance explainer section with additional vertical and horizontal lines for improved visual structure

* 💄 Improve z-index and color consistency for lines and illustrations in explainer section for enhanced visual clarity

* 💄 Update explainer section with enhanced phone wireframe illustration and additional PHP runtime details for improved user clarity

* 💄 Enhance explainer section with phone wireframe illustration, PHP runtime details, and additional core components for improved user understanding

* 💄 Refine layout and styling in explainer section for improved visual consistency and clarity

* 💄 Adjust layout and spacing in explainer section, and add arrow illustrations for enhanced visual guidance

* 💄 Adjust layout and spacing in explainer section for improved visual consistency and clarity

* 💄 Update explainer section with enhanced descriptions, improved layout, and new icons for better user engagement and clarity

* 💄 Add favorite tools card to explainer section

* 💄 Refactor skills section for improved maintainability and consistency

* 💄 Enhance layout and styling for improved responsiveness and visual consistency across components

* 💄 Update explainer section with enhanced layout, improved spacing, and additional skills icons for better user engagement

* 💄 Improve layout and styling for explainer and partners sections to enhance text alignment and visual consistency

* 💄 Update hero component for improved text sizing and layout consistency across screen sizes

* 💄 Update partners and explainer sections for improved text sizing and visual consistency

* 💄 Update skill icons in explainer section and adjust text size in partners section for improved visual consistency

* 💄 Add new SVG icons for document, browser, and startup components; enhance explainer section with step-by-step guide for better user engagement

* 💄 Enhance explainer section with new layout and content; add category pills and improve SVG icons for better visual appeal

* 💄 Add new icons for eCommerce, social apps, and field services; update existing icons to use currentColor for better theming support

* 💄 Update category pill and explainer sections for improved layout and visual consistency; adjust padding, text sizes, and flex properties

* 💄 Update icon components to use currentColor for improved theming support; adjust fill properties for better visual consistency

* 💄 Update gradient backgrounds in explainer section for improved theming consistency

* 💄 Enhance accessibility by adding aria attributes and improving link security with rel attributes across multiple components

* 💄 Update explainer section layout for improved responsiveness; add health icon for enhanced visual representation

* 💄 Update partner tagline and description for improved clarity and relevance

* 💄 Adjust margin-top for the Marcel Talk section for improved layout consistency

* 💄 Add route names for privacy policy and terms of service views for improved clarity

* 💄 Refactor footer links for improved organization and clarity; update navigation structure and aria labels

* 💄 Enhance footer navigation layout and animations for improved user experience; adjust spacing and remove redundant classes

* 💄 Update hover text color for footer links to enhance visibility and consistency across themes

* 💄 Refactor footer structure for improved accessibility and organization; update headings and aria labels

* ✨ Add brand assets page and update navigation links for improved accessibility and clarity

* 💄 Update brand assets page content for clarity and consistency; enhance accessibility and improve text structure

* ✨ Add primary logo and download button to brand assets page; enhance layout and accessibility

* 💄 Enhance primary logo section with hover effect and update download button styling for improved user experience

* ✨ Add brand asset SVGs and create asset card component

* ✨ Add grayscale SVG logo for NativePHP desktop version

* ⬆️ Update Tailwind CSS and Vite dependencies

* ✨ Add animation to asset list on scroll into view

* ✨ Add GSAP animations for elements in explainer and partners sections on scroll into view

* ✨ Refactor icon components to use CSS variables for colors and improve consistency

* ✨ Update heading styles for consistency and add mini logo component

* ✨ Adjust layout spacing and improve text styles in explainer section

* ✨ Enhance hover and active states for device dropdown item styles

* Add TestFlight button

* Hide repo link (for now)

* Remove video

* Hide Mobile GitHub link (for now)

* Fix Desktop GitHub link

* Remove v1 banner

* ✨ Add alignment option to device dropdowns and update class binding

* 🔥 Refactor mobile menu component by removing GSAP animations and simplifying class bindings

* Adjust banner copy

---------

Co-authored-by: Simon Hamp <simon.hamp@me.com>

Author: HassanZahirnia

.cursor/mcp.json

@@ -0,0 +1,11 @@
+{
+    "mcpServers": {
+        "laravel-boost": {
+            "command": "php",
+            "args": [
+                "./artisan",
+                "boost:mcp"
+            ]
+        }
+    }
+}

.cursor/rules/laravel-boost.mdc

@@ -0,0 +1,11 @@
+{
+    "mcpServers": {
+        "laravel-boost": {
+            "command": "/usr/bin/php8.4",
+            "args": [
+                "/home/hassan/code/nativephp.com/artisan",
+                "boost:mcp"
+            ]
+        }
+    }
+}

.github/copilot-instructions.md

@@ -0,0 +1,11 @@
+{
+    "mcpServers": {
+        "laravel-boost": {
+            "command": "php",
+            "args": [
+                "./artisan",
+                "boost:mcp"
+            ]
+        }
+    }
+}

.junie/guidelines.md

@@ -8,7 +8,7 @@
             }
         }
     ],
-    "tailwindConfig": "./tailwind.config.js",
+    "tailwindStylesheet": "./resources/css/app.css",
     "singleQuote": true,
     "semi": false,
     "trailingComma": "all",

.junie/mcp/mcp.json

@@ -61,7 +61,7 @@ public function createCheckoutSession(?string $plan, ?User $user = null)
             ->allowPromotionCodes()
             ->checkout([
                 'success_url' => $this->successUrl(),
-                'cancel_url' => route('early-adopter'),
+                'cancel_url' => route('pricing'),
                 'consent_collection' => [
                     'terms_of_service' => 'required',
                 ],

.mcp.json

@@ -29,6 +29,7 @@
     },
     "require-dev": {
         "fakerphp/faker": "^1.9.1",
+        "laravel/boost": "^1.0",
         "laravel/pint": "^1.0",
         "laravel/sail": "^1.18",
         "mockery/mockery": "^1.4.4",