Merge pull request 'main' (#2) from main into web-demo

Reviewed-on: #2

src/about.bp

@@ -0,0 +1,57 @@
+page(favicon:"/favicon.ico") {
+    title { "Blueprint - About" }
+    description { "A modern, declarative UI framework for building beautiful web interfaces" }
+    keywords { "blueprint, ui, framework, web development" }
+    author { "Blueprint Team" }
+}
+
+navbar {
+    horizontal {
+        link(href:index) { text(bold) { "Blueprint Live" } }
+        links {
+            link(href:index) { "Home" }
+            link(href:components) { "Components" }
+            link(href:about) { "About" }
+            link(href:contact) { "Contact" }
+        }
+    }
+}
+
+section(wide) {
+    title { "About Blueprint" }
+    text(subtle) { "A modern UI compiler with live reload support" }
+    
+    vertical {
+        card {
+            title { "Our Story" }
+            text { "Blueprint was created to make UI development faster and more enjoyable. With live reload support, you can see your changes instantly without manual refreshing." }
+        }
+        
+        card {
+            title { "Features" }
+            vertical {
+                horizontal {
+                    badge { "New" }
+                    text { "Live Reload Support" }
+                }
+                horizontal {
+                    badge { "✨" }
+                    text { "Modern Dark Theme" }
+                }
+                horizontal {
+                    badge { "🚀" }
+                    text { "Fast Development" }
+                }
+            }
+        }
+        
+        card {
+            title { "Get Started" }
+            text { "Try Blueprint now with our development server:" }
+            codeblock {
+                "bun dev"
+            }
+            link(text:"Get Help") { "Contact" }
+        }
+    }
+} 

src/components.bp

@@ -0,0 +1,152 @@
+page(favicon:"/favicon.ico") {
+    title { "Blueprint - Components" }
+    description { "A modern, declarative UI framework for building beautiful web interfaces" }
+    keywords { "blueprint, ui, framework, web development" }
+    author { "Blueprint Team" }
+}
+
+navbar {
+    horizontal {
+        link(href:index) { text(bold) { "Blueprint Live" } }
+        links {
+            link(href:index) { "Home" }
+            link(href:components) { "Components" }
+            link(href:about) { "About" }
+            link(href:contact) { "Contact" }
+        }
+    }
+}
+
+section(wide, centered) {
+    title(huge) { "Modern UI Components" }
+    text(large, subtle) { "A showcase of beautiful, dark-themed UI elements" }
+}
+
+section(wide) {
+    title { "Form Elements" }
+    
+    grid(columns:2) {
+        card {
+            title { "Text Inputs" }
+            vertical {
+                text(subtle) { "Regular input:" }
+                input { "Type something..." }
+                
+                text(subtle) { "Textarea:" }
+                textarea { "Multiple lines of text..." }
+                
+                text(subtle) { "Select dropdown:" }
+                select {
+                    "Option 1"
+                    "Option 2"
+                    "Option 3"
+                }
+            }
+        }
+
+        card {
+            title { "Toggle Controls" }
+            vertical {
+                horizontal {
+                    checkbox { }
+                    text { "Enable notifications" }
+                }
+                
+                horizontal {
+                    radio { }
+                    text { "Light theme" }
+                }
+                
+                horizontal {
+                    radio { }
+                    text { "Dark theme" }
+                }
+                
+                horizontal {
+                    switch { }
+                    text { "Airplane mode" }
+                }
+            }
+        }
+    }
+}
+
+section(wide) {
+    title { "Progress Elements" }
+    
+    grid(columns:2) {
+        card {
+            title { "Progress Indicators" }
+            vertical {
+                text(subtle) { "Download progress:" }
+                progress(value:75, max:100) { }
+                
+                text(subtle) { "Volume control:" }
+                slider(value:50, min:0, max:100) { }
+            }
+        }
+
+        card {
+            title { "Status Indicators" }
+            vertical {
+                horizontal(spaced) {
+                    badge { "New" }
+                    badge { "Updated" }
+                    badge { "Popular" }
+                }
+                
+                alert { "✨ Welcome to the new UI Kit!" }
+                
+                horizontal {
+                    tooltip(data-tooltip:"Click to learn more") {
+                        text { "Hover me" }
+                    }
+                }
+            }
+        }
+    }
+}
+
+section(wide) {
+    title { "Button Variations" }
+    
+    grid(columns:3) {
+        card {
+            title { "Primary Actions" }
+            vertical {
+                button(prominent) { "Save Changes" }
+                button { "Cancel" }
+            }
+        }
+
+        card {
+            title { "Button Groups" }
+            horizontal {
+                button(prominent) { "Previous" }
+                button(prominent) { "Next" }
+            }
+        }
+
+        card {
+            title { "Icon Buttons" }
+            horizontal {
+                button(compact) { "👍" }
+                button(compact) { "❤️" }
+                button(compact) { "🔔" }
+            }
+        }
+    }
+}
+
+section(wide, alternate) {
+    title(centered) { "Ready to Build?" }
+    
+    vertical(centered) {
+        text(large, subtle) { "Start creating your own modern UI today" }
+        
+        horizontal(centered, spaced) {
+            button(prominent) { "Get Started" }
+            button(prominent) { "View Documentation" }
+        }
+    }
+}

src/contact.bp

@@ -0,0 +1,54 @@
+page(favicon:"/favicon.ico") {
+    title { "Blueprint - Contact" }
+    description { "A modern, declarative UI framework for building beautiful web interfaces" }
+    keywords { "blueprint, ui, framework, web development" }
+    author { "Blueprint Team" }
+}
+
+navbar {
+    horizontal {
+        link(href:index) { text(bold) { "Blueprint Live" } }
+        links {
+            link(href:index) { "Home" }
+            link(href:components) { "Components" }
+            link(href:about) { "About" }
+            link(href:contact) { "Contact" }
+        }
+    }
+}
+
+section(vertical, centered) {
+    card(width:100) {
+        title { "Contact Us" }
+        text(subtle) { "Get in touch with the Blueprint team" }
+        
+        vertical {
+            text(subtle) { "Name" }
+            input { "Your name" }
+            
+            text(subtle) { "Email" }
+            input { "you@example.com" }
+            
+            text(subtle) { "Message" }
+            textarea { "Type your message here..." }
+            
+            horizontal {
+                checkbox { }
+                text { "Subscribe to updates" }
+            }
+            
+            link(href:submit) { button { "Send Message (this does not do anything)" } }
+        }
+    }
+    
+    horizontal(centered) {
+        text(subtle) { "Or connect with us on social media:" }
+    }
+    
+    horizontal(centered) {
+        link(href:twitter) { button-compact { "𝕏" } }
+        link(href:facebook) { button-compact { "📘" } }
+        link(href:linkedin) { button-compact { "💼" } }
+        link(href:instagram) { button-compact { "📱" } }
+    }
+} 

src/index.bp

@@ -1,15 +1,50 @@
- page(favicon:"/favicon.ico") {
-    title { "Blueprint - Modern Web UI Language" }
-    description { "It works!" }
-    keywords { "blueprint, language, web, ui, modern" }
-    author { "Epilogue Team" }
+page(favicon:"/favicon.ico") {
+    title { "Blueprint - Modern UI Framework" }
+    description { "A modern, declarative UI framework for building beautiful web interfaces" }
+    keywords { "blueprint, ui, framework, web development" }
+    author { "Blueprint Team" }
 }
 
+navbar {
+    horizontal {
+        link(href:index) { text(bold) { "Blueprint Live" } }
+        links {
+            link(href:index) { "Home" }
+            link(href:components) { "Components" }
+            link(href:about) { "About" }
+            link(href:contact) { "Contact" }
+        }
+    }
+}
 
 section(wide, centered) {
     vertical(centered,wide) {
-        title(huge) { "It works!" }
-        text(subtle, large) { "Start using Blueprint at src/" }
-        text(small) { "Find examples at examples/" }
+        title(huge) { "Welcome to blueprint" }
+        text(subtle) { "You can now edit files in the src/ directory" }
+    }
+    
+    horizontal(centered) {
+        link(href:index) { button { "Get started" } }
+        link(href:about) { button-light { "About" } }
     }
 }
+
+section(wide) {
+    grid(columns:3) {
+        card {
+            title { "Live Reloads" }
+            text { "Changes appear instantly in your browser" }
+            link(href:https://github.com/epilogueteam/blueprint) { button-secondary { "Try Blueprint" } }
+        }
+        card {
+            title { "Modern Design" }
+            text { "Beautiful dark theme with consistent styling" }
+            link(href:about) { button-secondary { "About" } }
+        }
+        card {
+            title { "Easy to Use" }
+            text { "Simple, declarative syntax for building UIs" }
+            link(href:contact) { button-secondary { "Contact" } }
+        }
+    }
+}