bender/859c4e96-32be-4a35-ab93-f47dd94d9d3a
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Merge version_2 into main #4

Merged
bender merged 2 commits from version_2 into main 2026-04-17 15:13:04 +00:00
Conversation 0 Commits 2 Files Changed 2 +27 -36
2 changed files with 27 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
src/app/page.tsx
View File

@@ -11,7 +11,7 @@ import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleAp
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import { Github, Layers, MousePointer, Settings, Twitter } from "lucide-react";
import { Github, Layers, MousePointer, Settings, Twitter, Download } from "lucide-react";
export default function LandingPage() {
return (
@@ -44,7 +44,7 @@ export default function LandingPage() {
<HeroSplitTestimonial
background={{ variant: "plain" }}
title="Design Without Limits"
description="Create professional-grade graphics, layouts, and digital art with our high-performance React-based design platform."
description="Create professional-grade graphics, layouts, and digital art with our high-performance React-based design platform. Use the export settings panel below to download your designs in PNG, SVG, or PDF formats."
testimonials={[
{ name: "Sarah Chen", handle: "@sarahdesign", testimonial: "The performance is unmatched. It feels like native desktop software in the browser.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/graphic-designer-making-logo-notebook_23-2149142118.jpg" },
{ name: "Marcus Thorne", handle: "@mthorne", testimonial: "Finally, a browser tool that handles complex layers without breaking a sweat.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/closeup-smiling-business-man-standing-outside_1262-3492.jpg" },
@@ -52,16 +52,12 @@ export default function LandingPage() {
{ name: "David Wu", handle: "@davidw", testimonial: "The layer management is so intuitive. It's exactly what I needed for my agency.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-3693.jpg" },
{ name: "Jessica Lee", handle: "@jlee", testimonial: "Exporting to high-quality PDF has never been easier. My go-to design platform.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-handsome-bearded-male-wearing-stylish-sui_613910-12116.jpg" }
]}
buttons={[{ text: "Start Creating", href: "#product" }]}
buttons={[
{ text: "Start Creating", href: "#product" },
{ text: "Export Settings", href: "#product" }
]}
imageSrc="http://img.b2bpic.net/free-photo/still-life-graphic-design-studio_23-2151320710.jpg"
mediaAnimation="slide-up"
avatars={[
{ src: "http://img.b2bpic.net/free-photo/young-fashion-designer-working-her-workshop-alone_23-2148877353.jpg", alt: "Portrait of creative studio designer" },
{ src: "http://img.b2bpic.net/free-photo/portrait-confident-young-woman-with-eyeglasses_23-2148452693.jpg", alt: "Portrait of ux designer" },
{ src: "http://img.b2bpic.net/free-photo/handsome-confident-man_1098-18449.jpg", alt: "Portrait of digital artist" },
{ src: "http://img.b2bpic.net/free-photo/smiling-young-businessman-holding-takeaway-coffee-cup-hand_23-2148176167.jpg", alt: "Portrait of startup founder" },
{ src: "http://img.b2bpic.net/free-photo/close-up-portrait-attractive-male-model-color-flash-light_158595-5103.jpg", alt: "Portrait of design lead" }
]}
/>
</div>
@@ -75,7 +71,7 @@ export default function LandingPage() {
features={[
{ title: "Drag-and-Drop", description: "Seamlessly move elements from sidebar to canvas with our high-performance engine.", icon: MousePointer, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-psd/3d-square-intersection-prohibition_84443-57114.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/sound-volume-up-front-side-white-background_187299-40214.jpg" }] },
{ title: "Layer Management", description: "Powerful layering controls: reorder, group, lock, and manage complex elements easily.", icon: Layers, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/business-analysis-report-folder-icon_53876-14638.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/close-up-computers-data-center-running-server-rigs-diagnostic-tests_482257-123527.jpg" }] },
{ title: "Smart Toolbars", description: "Context-sensitive floating menus that adapt automatically to your selected element.", icon: Settings, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/high-angle-man-designing-websites_23-2149930944.jpg?_wi=1" }, { imageSrc: "http://img.b2bpic.net/free-photo/career-skills-progress-graphic-icon-symbol_53876-124007.jpg" }] }
{ title: "Smart Export Panel", description: "Preview and export your final designs as high-res images, vectors, or documents directly in-app.", icon: Download, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/high-angle-man-designing-websites_23-2149930944.jpg?_wi=1" }, { imageSrc: "http://img.b2bpic.net/free-photo/career-skills-progress-graphic-icon-symbol_53876-124007.jpg" }] }
]}
/>
</div>
@@ -87,15 +83,13 @@ export default function LandingPage() {
useInvertedBackground={false}
animationType="slide-up"
products={[
{ id: "p1", name: "Multi-Format Export", price: "PDF/PNG/SVG", variant: "Efficiency", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-man-designing-websites_23-2149930944.jpg?_wi=2" },
{ id: "p2", name: "Pro Photo Filters", price: "Advance", variant: "Filters", imageSrc: "http://img.b2bpic.net/free-photo/blue-desk-accessories-pink-plate_23-2148748620.jpg" },
{ id: "p3", name: "Typography Library", price: "Unlimited", variant: "Fonts", imageSrc: "http://img.b2bpic.net/free-photo/restaurant-menu-street_1101-101.jpg" },
{ id: "p4", name: "Precise Manipulation", price: "Rotate/Crop", variant: "Tools", imageSrc: "http://img.b2bpic.net/free-photo/still-life-stacked-aesthetic-objects_23-2150185379.jpg" },
{ id: "p5", name: "Precision Picker", price: "Color Palette", variant: "Color", imageSrc: "http://img.b2bpic.net/free-photo/closeup-photo-turned-digital-midi-controller_400718-29.jpg" },
{ id: "p6", name: "Canvas Workspace", price: "Zoomable", variant: "Performance", imageSrc: "http://img.b2bpic.net/free-photo/long-yellow-cold-colors-exposure-neon-lights-texture_23-2148328025.jpg" }
{ id: "p1", name: "Export to SVG", price: "Vector Format", variant: "Download", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-man-designing-websites_23-2149930944.jpg?_wi=2" },
{ id: "p2", name: "Export to PNG", price: "High-Res Image", variant: "Download", imageSrc: "http://img.b2bpic.net/free-photo/blue-desk-accessories-pink-plate_23-2148748620.jpg" },
{ id: "p3", name: "Export to PDF", price: "Document", variant: "Download", imageSrc: "http://img.b2bpic.net/free-photo/restaurant-menu-street_1101-101.jpg" },
{ id: "p4", name: "Live Preview", price: "Toggle", variant: "View", imageSrc: "http://img.b2bpic.net/free-photo/still-life-stacked-aesthetic-objects_23-2150185379.jpg" }
]}
title="Professional Features"
description="Everything in one place for high-performance creative workflows."
title="Export & Preview"
description="Finalize your projects with built-in export settings and real-time previews."
/>
</div>
@@ -114,12 +108,12 @@ export default function LandingPage() {
textboxLayout="split"
useInvertedBackground={false}
faqs={[
{ id: "1", title: "Is the canvas really zoomable?", content: "Yes, we support buttery-smooth infinite zooming for maximum pixel-perfect precision." },
{ id: "2", title: "Does it support custom fonts?", content: "Absolutely. You can import any web font directly into your creative workspace." },
{ id: "3", title: "How does it perform?", content: "Built with WebGL-accelerated React components, ensuring high-frame-rate performance even with thousands of elements." }
{ id: "1", title: "How do I export my designs?", content: "Simply navigate to the export settings panel in the product section, choose your format (PNG, SVG, or PDF), and click download." },
{ id: "2", title: "Does it support preview before export?", content: "Yes, the built-in previewer allows you to inspect your export settings and output quality before saving." },
{ id: "3", title: "What performance can I expect?", content: "Built with WebGL-accelerated React components, ensuring high-frame-rate performance even with complex layers." }
]}
title="Design Platform FAQ"
description="Answers to common questions about performance and features."
description="Answers to common questions about export tools and features."
faqsAnimation="blur-reveal"
/>
</div>
@@ -130,10 +124,7 @@ export default function LandingPage() {
useInvertedBackground={true}
testimonials={[
{ id: "1", name: "Sarah Chen", date: "Jan 2025", title: "CEO", quote: "The speed and reliability change everything.", tag: "Pro", avatarSrc: "http://img.b2bpic.net/free-photo/woman-designer-with-musical-earphones-standing-office-holding-folder_1303-32105.jpg", imageSrc: "http://img.b2bpic.net/free-photo/young-attractive-man-glasses-is-posing-photographer-studio_613910-2638.jpg" },
{ id: "2", name: "Marcus Thorne", date: "Feb 2025", title: "CTO", quote: "Incredible React performance in-browser.", tag: "Expert", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-black-man-wool-suit_613910-15972.jpg", imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-with-arms-folded-isolated-white_231208-13007.jpg" },
{ id: "3", name: "Elena Rossi", date: "March 2025", title: "Designer", quote: "The context toolbar is pure gold.", tag: "Creative", avatarSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-man-blending-different-colors-his-painting_23-2148422201.jpg", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girl-listens-music-via-headphones-is-drawing-painting-with-oils_8353-10780.jpg" },
{ id: "4", name: "David Wu", date: "April 2025", title: "Lead", quote: "My agency workflows just got a huge upgrade.", tag: "Agency", avatarSrc: "http://img.b2bpic.net/free-photo/studio-portrait-blond-female-dressed-white-shirt-red-eyeglasses_613910-14657.jpg", imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-young-man_158595-231.jpg" },
{ id: "5", name: "Jessica Lee", date: "May 2025", title: "Lead", quote: "Exporting to PDF is finally seamless.", tag: "Pro", avatarSrc: "http://img.b2bpic.net/free-photo/crazy-hippie-angry-expression_1194-3931.jpg", imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-woman-studio_23-2148565552.jpg" }
{ id: "2", name: "Marcus Thorne", date: "Feb 2025", title: "CTO", quote: "Incredible React performance in-browser.", tag: "Expert", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-black-man-wool-suit_613910-15972.jpg", imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-with-arms-folded-isolated-white_231208-13007.jpg" }
]}
title="Creator Testimonials"
description="Hear from the professionals who switched to our high-performance design platform."
@@ -146,7 +137,7 @@ export default function LandingPage() {
background={{ variant: "radial-gradient" }}
tag="Join Now"
title="Start Creating Today"
description="Sign up for early access to our high-performance design workspace."
description="Sign up for early access to our high-performance design workspace and export tools."
imageSrc="http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-99785.jpg"
mediaAnimation="opacity"
/>
@@ -162,4 +153,4 @@ export default function LandingPage() {
</ReactLenis>
</ThemeProvider>
);
}
}

14
src/app/styles/variables.css
View File

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #000000;
--card: #0c0c0c;
--foreground: #ffffff;
--primary-cta: #106EFB;
--background: #0a0a0f;
--card: #16161f;
--foreground: #f8fafc;
--primary-cta: #3b82f6;
--primary-cta-text: #ffffff;
--secondary-cta: #000000;
--secondary-cta: #60a5fa;
--secondary-cta-text: #ffffff;
--accent: #535353;
--background-accent: #106EFB;
--accent: #2563eb;
--background-accent: #1e293b;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);