1 line
16 KiB
JSON
1 line
16 KiB
JSON
{"pages": [{"id": "pf-page-home", "name": "Home", "root": {"id": "pf-root", "type": "column", "styles": {"width": "100%", "display": "flex", "minHeight": "100vh", "flexDirection": "column", "backgroundColor": "#0f0f0f"}, "children": [{"id": "pf-hero", "type": "column", "styles": {"gap": "20px", "width": "100%", "display": "flex", "padding": "120px 80px", "flexDirection": "column", "justifyContent": "center", "backgroundColor": "#0f0f0f"}, "children": [{"id": "pf-hero-greeting", "type": "text", "props": {"text": "Hello, I am", "elementType": "span"}, "styles": {"color": "#FF592F", "fontSize": "14px", "fontWeight": "600", "letterSpacing": "3px", "textTransform": "uppercase"}, "layerName": "Greeting"}, {"id": "pf-hero-name", "type": "text", "props": {"text": "John Doe", "elementType": "h1"}, "styles": {"color": "#ffffff", "fontSize": "68px", "fontWeight": "800", "lineHeight": "1.05", "letterSpacing": "-2px"}, "layerName": "Name"}, {"id": "pf-hero-role", "type": "text", "props": {"text": "Full Stack Developer", "elementType": "h2"}, "styles": {"color": "#94a3b8", "fontSize": "28px", "fontWeight": "400"}, "layerName": "Role"}, {"id": "pf-hero-bio", "type": "text", "props": {"text": "I design and build digital experiences that are fast, accessible, and beautiful. Focused on React, Node.js, and everything in between.", "elementType": "p"}, "styles": {"color": "#64748b", "fontSize": "16px", "maxWidth": "520px", "lineHeight": "1.8"}, "layerName": "Short Bio"}, {"id": "pf-hero-actions", "type": "row", "styles": {"gap": "16px", "display": "flex", "marginTop": "8px", "alignItems": "center", "flexDirection": "row"}, "children": [{"id": "pf-cta-work", "type": "button", "props": {"text": "View My Work"}, "styles": {"color": "#ffffff", "border": "none", "cursor": "pointer", "padding": "14px 32px", "fontSize": "15px", "fontWeight": "600", "borderRadius": "8px", "backgroundColor": "#FF592F"}, "layerName": "View Work"}, {"id": "pf-cta-contact", "type": "button", "props": {"text": "Contact Me"}, "styles": {"color": "#ffffff", "border": "1px solid rgba(255,255,255,0.2)", "cursor": "pointer", "padding": "14px 32px", "fontSize": "15px", "fontWeight": "600", "borderRadius": "8px", "backgroundColor": "transparent"}, "layerName": "Contact"}], "layerName": "Hero Actions"}], "layerName": "Hero"}, {"id": "pf-about", "type": "row", "styles": {"gap": "64px", "width": "100%", "display": "flex", "padding": "80px", "alignItems": "flex-start", "flexDirection": "row", "backgroundColor": "#ffffff"}, "children": [{"id": "pf-about-left", "type": "column", "styles": {"gap": "16px", "flex": "1", "display": "flex", "flexDirection": "column"}, "children": [{"id": "pf-about-label", "type": "text", "props": {"text": "About Me", "elementType": "span"}, "styles": {"color": "#FF592F", "fontSize": "12px", "fontWeight": "700", "letterSpacing": "3px", "textTransform": "uppercase"}, "layerName": "About Label"}, {"id": "pf-about-title", "type": "text", "props": {"text": "Passionate about crafting great software", "elementType": "h2"}, "styles": {"color": "#1a1a2e", "fontSize": "36px", "fontWeight": "700", "lineHeight": "1.25"}, "layerName": "About Title"}], "layerName": "About Left"}, {"id": "pf-about-right", "type": "column", "styles": {"gap": "20px", "flex": "1", "display": "flex", "flexDirection": "column", "justifyContent": "center"}, "children": [{"id": "pf-about-text", "type": "text", "props": {"text": "I'm a software developer with 5+ years of experience building scalable web applications. I care deeply about clean code, great UX, and developer experience.", "elementType": "p"}, "styles": {"color": "#6b7280", "fontSize": "16px", "lineHeight": "1.8"}, "layerName": "About Text"}, {"id": "pf-about-skills", "type": "row", "styles": {"gap": "8px", "display": "flex", "flexWrap": "wrap", "flexDirection": "row"}, "children": [{"id": "pf-skill-react", "type": "text", "props": {"text": "React", "elementType": "span"}, "styles": {"color": "#1a1a2e", "padding": "6px 14px", "fontSize": "13px", "fontWeight": "600", "borderRadius": "999px", "backgroundColor": "#f1f5f9"}, "layerName": "React"}, {"id": "pf-skill-typescript", "type": "text", "props": {"text": "TypeScript", "elementType": "span"}, "styles": {"color": "#1a1a2e", "padding": "6px 14px", "fontSize": "13px", "fontWeight": "600", "borderRadius": "999px", "backgroundColor": "#f1f5f9"}, "layerName": "TypeScript"}, {"id": "pf-skill-node.js", "type": "text", "props": {"text": "Node.js", "elementType": "span"}, "styles": {"color": "#1a1a2e", "padding": "6px 14px", "fontSize": "13px", "fontWeight": "600", "borderRadius": "999px", "backgroundColor": "#f1f5f9"}, "layerName": "Node.js"}, {"id": "pf-skill-postgresql", "type": "text", "props": {"text": "PostgreSQL", "elementType": "span"}, "styles": {"color": "#1a1a2e", "padding": "6px 14px", "fontSize": "13px", "fontWeight": "600", "borderRadius": "999px", "backgroundColor": "#f1f5f9"}, "layerName": "PostgreSQL"}, {"id": "pf-skill-docker", "type": "text", "props": {"text": "Docker", "elementType": "span"}, "styles": {"color": "#1a1a2e", "padding": "6px 14px", "fontSize": "13px", "fontWeight": "600", "borderRadius": "999px", "backgroundColor": "#f1f5f9"}, "layerName": "Docker"}], "layerName": "Skills"}], "layerName": "About Right"}], "layerName": "About"}, {"id": "pf-projects", "type": "column", "styles": {"gap": "16px", "width": "100%", "display": "flex", "padding": "80px", "alignItems": "center", "flexDirection": "column", "backgroundColor": "#f8f9fa"}, "children": [{"id": "pf-projects-label", "type": "text", "props": {"text": "My Work", "elementType": "span"}, "styles": {"color": "#FF592F", "fontSize": "12px", "fontWeight": "700", "letterSpacing": "3px", "textTransform": "uppercase"}, "layerName": "Projects Label"}, {"id": "pf-projects-title", "type": "text", "props": {"text": "Selected Projects", "elementType": "h2"}, "styles": {"color": "#1a1a2e", "fontSize": "36px", "textAlign": "center", "fontWeight": "700"}, "layerName": "Projects Title"}, {"id": "pf-projects-grid", "type": "grid", "styles": {"gap": "24px", "width": "100%", "display": "grid", "maxWidth": "960px", "marginTop": "32px", "gridTemplateColumns": "repeat(2, 1fr)"}, "children": [{"id": "pf-proj-1", "type": "column", "styles": {"gap": "12px", "display": "flex", "padding": "32px", "boxShadow": "0 2px 12px rgba(0,0,0,0.06)", "borderRadius": "12px", "flexDirection": "column", "backgroundColor": "#ffffff"}, "children": [{"id": "pf-proj-1-title", "type": "text", "props": {"text": "E-Commerce Platform", "elementType": "h3"}, "styles": {"color": "#1a1a2e", "fontSize": "20px", "fontWeight": "700"}, "layerName": "Title"}, {"id": "pf-proj-1-desc", "type": "text", "props": {"text": "A full-featured e-commerce platform with real-time inventory, payments, and analytics dashboard.", "elementType": "p"}, "styles": {"color": "#6b7280", "fontSize": "14px", "lineHeight": "1.6"}, "layerName": "Desc"}, {"id": "pf-proj-1-tags", "type": "row", "styles": {"gap": "8px", "display": "flex", "flexWrap": "wrap", "flexDirection": "row"}, "children": [{"id": "pf-proj-1-tag-React", "type": "text", "props": {"text": "React", "elementType": "span"}, "styles": {"color": "#64748b", "padding": "4px 10px", "fontSize": "12px", "fontWeight": "500", "borderRadius": "4px", "backgroundColor": "#f1f5f9"}}, {"id": "pf-proj-1-tag-Node.js", "type": "text", "props": {"text": "Node.js", "elementType": "span"}, "styles": {"color": "#64748b", "padding": "4px 10px", "fontSize": "12px", "fontWeight": "500", "borderRadius": "4px", "backgroundColor": "#f1f5f9"}}, {"id": "pf-proj-1-tag-Stripe", "type": "text", "props": {"text": "Stripe", "elementType": "span"}, "styles": {"color": "#64748b", "padding": "4px 10px", "fontSize": "12px", "fontWeight": "500", "borderRadius": "4px", "backgroundColor": "#f1f5f9"}}], "layerName": "Tags"}, {"id": "pf-proj-1-btn", "type": "button", "props": {"text": "View Project →"}, "styles": {"color": "#FF592F", "width": "fit-content", "border": "1px solid #FF592F", "cursor": "pointer", "padding": "8px 20px", "fontSize": "14px", "marginTop": "4px", "fontWeight": "600", "borderRadius": "6px", "backgroundColor": "transparent"}, "layerName": "View Project"}], "layerName": "Project 1"}, {"id": "pf-proj-2", "type": "column", "styles": {"gap": "12px", "display": "flex", "padding": "32px", "boxShadow": "0 2px 12px rgba(0,0,0,0.06)", "borderRadius": "12px", "flexDirection": "column", "backgroundColor": "#ffffff"}, "children": [{"id": "pf-proj-2-title", "type": "text", "props": {"text": "AI Chat Assistant", "elementType": "h3"}, "styles": {"color": "#1a1a2e", "fontSize": "20px", "fontWeight": "700"}, "layerName": "Title"}, {"id": "pf-proj-2-desc", "type": "text", "props": {"text": "A conversational AI assistant with document understanding, custom personas, and multi-channel deployment.", "elementType": "p"}, "styles": {"color": "#6b7280", "fontSize": "14px", "lineHeight": "1.6"}, "layerName": "Desc"}, {"id": "pf-proj-2-tags", "type": "row", "styles": {"gap": "8px", "display": "flex", "flexWrap": "wrap", "flexDirection": "row"}, "children": [{"id": "pf-proj-2-tag-Python", "type": "text", "props": {"text": "Python", "elementType": "span"}, "styles": {"color": "#64748b", "padding": "4px 10px", "fontSize": "12px", "fontWeight": "500", "borderRadius": "4px", "backgroundColor": "#f1f5f9"}}, {"id": "pf-proj-2-tag-OpenAI", "type": "text", "props": {"text": "OpenAI", "elementType": "span"}, "styles": {"color": "#64748b", "padding": "4px 10px", "fontSize": "12px", "fontWeight": "500", "borderRadius": "4px", "backgroundColor": "#f1f5f9"}}, {"id": "pf-proj-2-tag-FastAPI", "type": "text", "props": {"text": "FastAPI", "elementType": "span"}, "styles": {"color": "#64748b", "padding": "4px 10px", "fontSize": "12px", "fontWeight": "500", "borderRadius": "4px", "backgroundColor": "#f1f5f9"}}], "layerName": "Tags"}, {"id": "pf-proj-2-btn", "type": "button", "props": {"text": "View Project →"}, "styles": {"color": "#FF592F", "width": "fit-content", "border": "1px solid #FF592F", "cursor": "pointer", "padding": "8px 20px", "fontSize": "14px", "marginTop": "4px", "fontWeight": "600", "borderRadius": "6px", "backgroundColor": "transparent"}, "layerName": "View Project"}], "layerName": "Project 2"}, {"id": "pf-proj-3", "type": "column", "styles": {"gap": "12px", "display": "flex", "padding": "32px", "boxShadow": "0 2px 12px rgba(0,0,0,0.06)", "borderRadius": "12px", "flexDirection": "column", "backgroundColor": "#ffffff"}, "children": [{"id": "pf-proj-3-title", "type": "text", "props": {"text": "Analytics Dashboard", "elementType": "h3"}, "styles": {"color": "#1a1a2e", "fontSize": "20px", "fontWeight": "700"}, "layerName": "Title"}, {"id": "pf-proj-3-desc", "type": "text", "props": {"text": "Real-time analytics with customizable widgets, team collaboration, and automated reports.", "elementType": "p"}, "styles": {"color": "#6b7280", "fontSize": "14px", "lineHeight": "1.6"}, "layerName": "Desc"}, {"id": "pf-proj-3-tags", "type": "row", "styles": {"gap": "8px", "display": "flex", "flexWrap": "wrap", "flexDirection": "row"}, "children": [{"id": "pf-proj-3-tag-React", "type": "text", "props": {"text": "React", "elementType": "span"}, "styles": {"color": "#64748b", "padding": "4px 10px", "fontSize": "12px", "fontWeight": "500", "borderRadius": "4px", "backgroundColor": "#f1f5f9"}}, {"id": "pf-proj-3-tag-D3.js", "type": "text", "props": {"text": "D3.js", "elementType": "span"}, "styles": {"color": "#64748b", "padding": "4px 10px", "fontSize": "12px", "fontWeight": "500", "borderRadius": "4px", "backgroundColor": "#f1f5f9"}}, {"id": "pf-proj-3-tag-PostgreSQL", "type": "text", "props": {"text": "PostgreSQL", "elementType": "span"}, "styles": {"color": "#64748b", "padding": "4px 10px", "fontSize": "12px", "fontWeight": "500", "borderRadius": "4px", "backgroundColor": "#f1f5f9"}}], "layerName": "Tags"}, {"id": "pf-proj-3-btn", "type": "button", "props": {"text": "View Project →"}, "styles": {"color": "#FF592F", "width": "fit-content", "border": "1px solid #FF592F", "cursor": "pointer", "padding": "8px 20px", "fontSize": "14px", "marginTop": "4px", "fontWeight": "600", "borderRadius": "6px", "backgroundColor": "transparent"}, "layerName": "View Project"}], "layerName": "Project 3"}, {"id": "pf-proj-4", "type": "column", "styles": {"gap": "12px", "display": "flex", "padding": "32px", "boxShadow": "0 2px 12px rgba(0,0,0,0.06)", "borderRadius": "12px", "flexDirection": "column", "backgroundColor": "#ffffff"}, "children": [{"id": "pf-proj-4-title", "type": "text", "props": {"text": "DevOps Pipeline Tool", "elementType": "h3"}, "styles": {"color": "#1a1a2e", "fontSize": "20px", "fontWeight": "700"}, "layerName": "Title"}, {"id": "pf-proj-4-desc", "type": "text", "props": {"text": "A CI/CD pipeline tool with visual workflow builder, deployment tracking, and Slack notifications.", "elementType": "p"}, "styles": {"color": "#6b7280", "fontSize": "14px", "lineHeight": "1.6"}, "layerName": "Desc"}, {"id": "pf-proj-4-tags", "type": "row", "styles": {"gap": "8px", "display": "flex", "flexWrap": "wrap", "flexDirection": "row"}, "children": [{"id": "pf-proj-4-tag-Go", "type": "text", "props": {"text": "Go", "elementType": "span"}, "styles": {"color": "#64748b", "padding": "4px 10px", "fontSize": "12px", "fontWeight": "500", "borderRadius": "4px", "backgroundColor": "#f1f5f9"}}, {"id": "pf-proj-4-tag-Docker", "type": "text", "props": {"text": "Docker", "elementType": "span"}, "styles": {"color": "#64748b", "padding": "4px 10px", "fontSize": "12px", "fontWeight": "500", "borderRadius": "4px", "backgroundColor": "#f1f5f9"}}, {"id": "pf-proj-4-tag-Kubernetes", "type": "text", "props": {"text": "Kubernetes", "elementType": "span"}, "styles": {"color": "#64748b", "padding": "4px 10px", "fontSize": "12px", "fontWeight": "500", "borderRadius": "4px", "backgroundColor": "#f1f5f9"}}], "layerName": "Tags"}, {"id": "pf-proj-4-btn", "type": "button", "props": {"text": "View Project →"}, "styles": {"color": "#FF592F", "width": "fit-content", "border": "1px solid #FF592F", "cursor": "pointer", "padding": "8px 20px", "fontSize": "14px", "marginTop": "4px", "fontWeight": "600", "borderRadius": "6px", "backgroundColor": "transparent"}, "layerName": "View Project"}], "layerName": "Project 4"}], "layerName": "Projects Grid"}], "layerName": "Projects"}, {"id": "pf-contact", "type": "column", "styles": {"gap": "24px", "width": "100%", "display": "flex", "padding": "80px", "alignItems": "center", "flexDirection": "column", "backgroundColor": "#1a1a2e"}, "children": [{"id": "pf-contact-title", "type": "text", "props": {"text": "Let's Work Together", "elementType": "h2"}, "styles": {"color": "#ffffff", "fontSize": "36px", "textAlign": "center", "fontWeight": "700"}, "layerName": "Contact Title"}, {"id": "pf-contact-subtitle", "type": "text", "props": {"text": "Have a project in mind? I'd love to hear about it.", "elementType": "p"}, "styles": {"color": "#94a3b8", "fontSize": "16px", "textAlign": "center"}, "layerName": "Contact Subtitle"}, {"id": "pf-contact-form", "type": "row", "styles": {"gap": "12px", "display": "flex", "marginTop": "8px", "alignItems": "center", "flexDirection": "row"}, "children": [{"id": "pf-contact-email", "type": "input", "props": {"type": "email", "placeholder": "your@email.com"}, "styles": {"color": "#ffffff", "width": "320px", "border": "1px solid rgba(255,255,255,0.15)", "padding": "12px 20px", "fontSize": "15px", "borderRadius": "8px", "backgroundColor": "rgba(255,255,255,0.05)"}, "layerName": "Email Input"}, {"id": "pf-contact-send", "type": "button", "props": {"text": "Send Message"}, "styles": {"color": "#ffffff", "border": "none", "cursor": "pointer", "padding": "12px 28px", "fontSize": "15px", "fontWeight": "600", "borderRadius": "8px", "backgroundColor": "#FF592F"}, "layerName": "Send Button"}], "layerName": "Contact Form"}], "layerName": "Contact"}], "layerName": "Page"}, "route": "/", "isDefault": true}], "stateData": {"state": {}, "version": 1}, "currentPageId": "pf-page-home", "pageStateData": {}} |