On mobile (<768px) the flex column put the config aside (price
breakdown + Proceed/Reset) above the robot canvas. Add explicit
order so the robot renders first and the panel flows below it.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
On mobile the configurator was a 100vh frame with an inner scrolling
bottom-sheet embedded inside the scrolling /configure page. Page scroll
hijacked the gesture and skipped the frame, trapping the Proceed to Order
and Reset buttons in the inner scroll. Drop the nested scroll on <=768px:
canvas stays fixed on top, the full config panel flows in normal page
scroll so the CTAs are always visible. Landscape side-by-side preserved.
Also pin outputFileTracingRoot to the project dir to silence the
multiple-lockfile workspace-root warning.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Add `overflow-x: clip` to main/section/header/footer/nav so decorative
absolutely-positioned glow elements (dcta-glow, brand-card-glow,
cap-tile-glow) can't bubble their bounds up to body.scrollWidth.
Without this, body extended ~168px past viewport at 360px width,
producing right-side empty gap and horizontal scroll on Android Chrome.
Also stack 2-col grids on narrow viewports in ExclusiveAccessSection,
FounderSection, and IndustryUseCases stats row to prevent cramped
or overflowing content under 640px.
Verified via Playwright at 320/360/375/390/411/414/480 — body.scrollWidth
now equals viewport at all widths.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Robot image and text overlapped on mobile because image was
absolutely positioned over the full card while text was max-width 50%.
Refactored to stacked flex layout below 900px (copy on top, image
below in own region), original side-by-side layout preserved at
desktop via media query.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- Introduced a new TypeScript file `bu-sunaidah-fetch.ts` to handle fetching the latest Instagram posts for Bu Sunaidah.
- Implemented a scraping method to attempt to retrieve posts directly from Instagram, with a fallback to a local JSON file `bu-sunaidah-posts.json`.
- Added a new JSON file containing recent Instagram post URLs and captions.
- Included a new image asset `unitree-l2.jpg` for accessories.
fix: update accessory images and compatibility details in accessories data
refactor: modify industry page hero image for education section
feat: add Bu Sunaidah page with sections for media, Instagram feed, and press coverage
feat: create InstagramGlyph icon component for consistent styling
chore: initialize Bu Sunaidah press and Instagram data structures
- Implemented the AccessoriesShowcase component for displaying various robotic accessories with filtering options.
- Created a new data file for accessories, including types, groups, and detailed information for each accessory.
- Introduced FilterChip and AccessoryCard components for better UI representation of accessories.
- Updated HomePage to use CategoryShowcaseScroll instead of RobotCategoryGrid for better category display.
- Modified BrandShowcase component to adjust background gradients and text colors for improved aesthetics.
- Changed CompanyStory component to enhance visual consistency with updated accent colors.
- Refined ExclusiveAccessSection to align with new design standards, including gradient adjustments.
- Enhanced Hero3DRobotics with new gradient backgrounds and updated text colors for better readability.
- Updated RoboticsScrollShowcase to reflect new color scheme and improved text visibility.
- Adjusted RoboticsSplineShowcase to maintain design consistency with updated colors and gradients.
- Improved MotionSection to enhance scroll behavior and visibility transitions.
- Updated container-scroll-animation styles for better visual effects.
- Introduced new CategoryShowcaseScroll component for a more dynamic category display experience.
- Adjusted padding, opacity, and transform properties for robot images in Hero3DRobotics.
- Updated sizes for images to enhance responsiveness.
- Modified floor reflection styles for better visual consistency.
- Refactored RoboticsSplineShowcase to use inline styles for layout and design consistency.
- Enhanced text styles and button designs for better user experience.
- Improved grid layout for better responsiveness across different screen sizes.
- Introduced FounderSection component to highlight leadership and vision.
- Created ServicesGrid component to display various robotics services offered.
- Developed RoboticsScrollShowcase for showcasing robots with interactive elements.
- Implemented RoboticsSplineShowcase featuring a 3D Spline scene for enhanced user experience.
- Added reusable Card component for consistent styling across sections.
- Integrated ContainerScroll for animated scrolling effects in the showcase.
- Built SplineScene component for lazy loading Spline 3D scenes.
- Added Spotlight component for interactive hover effects.
- Created utility function for class name merging to streamline styling.
- Introduced RobotProductCard component for displaying robot details.
- Added WhyUs component highlighting key reasons for choosing our robotics solutions.
- Implemented CursorSpotlight for enhanced user interaction.
- Created GlassPanel for a stylish UI element.
- Developed MotionSection for animated section visibility.
- Added PremiumButton for versatile button options.
- Established data structures for industries and robots, including detailed specifications and use cases.
- Included utility functions for retrieving robots by slug and category.
- `base` (Basic body) → 77,125 AED (Unitree G1 retail $16k + $5k markup)
- new `edu` row → 146,900 AED ($40k flat)
- all persona attire (kandura, vest, suit, robot-doctor, security-guard) → 5,000 AED
- `custom-color` unchanged at 3,500 AED
- PricingEngine now swaps the base line when EDU body is selected
- localStorage key bumped to `lootah-pricing-v2` to invalidate stale client caches
- Robot Body buttons now describe the variants as `Standard consumer` vs `Open-source education / research` (same chassis GLB, differs in licensing)
- New `prisma/update-prices.ts` idempotent script applies the new prices to an existing DB; seed.ts updated for fresh installs
- Pricing tests updated to match new defaults
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- New `activeBody` field in config store with `setBody` action and URL sync (`b` key, defaults to `basic` for backward compat)
- Robot Body section in ConfigPanel between Persona Attire and Pricing
- RobotModel base mesh extracted into BaseBodyMesh subcomponent wrapped in error boundary so a missing EDU GLB silently falls back to basic
- Tests cover defaults, setBody, reset, and round-trip serialization
Note: drop `/public/Unitree_G1_EDU.glb` to enable the EDU variant — until then EDU selection falls back to basic with a console warning.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- Updated package.json to include @gltf-transform/core, @gltf-transform/extensions, @gltf-transform/functions, and draco3dgltf for GLB file processing.
- Implemented GLB compression using Draco in the upload model API route.
- Adjusted camera keyframes in ScrollScene for improved animation.
- Enhanced overlay styles in ScrollOverlays for better visual clarity.
- Added original GLB files for Kandoura, Suit, Unitree_G1, and Vest.
- Updated existing GLB files for Kandoura, Suit, Unitree_G1, and Vest.
- Removed the previous demo payment system and implemented a real integration with Stripe for handling payments.
- Added new API routes for creating payment intents and handling webhooks from Stripe.
- Updated the database schema to include an Order model for storing payment details.
- Enhanced the admin page to manage pricing items, including the ability to upload 3D models.
- Introduced a settings management feature for the admin panel, allowing for dynamic key-value pairs.
- Improved the RobotModel component to support dynamic attire based on uploaded models.
- Added error handling and validation for file uploads and settings management.
- Implemented Prisma schema with models for AdminUser, AppSettings, and Snapshot.
- Created seed script to initialize the database with an admin user and JWT secret.
- Developed admin login page with form handling and error management.
- Added API routes for admin login, logout, change password, and JWT verification.
- Integrated Stripe for payment intent management in admin orders.
- Established middleware for protecting admin routes with JWT authentication.
- Created Zustand stores for managing persona and snapshot states.
