Untitled
unknown
plain_text
5 months ago
7.9 kB
4
Indexable
async fn home(templ: Template) -> Markup { templ .render(Padded(html! { // Main container div.flex.flex-col style="min-height: 100vh; padding: 2rem;" { // Header Section div.text-center style="margin: 3rem 0;" { h1 style="font-size: 3.75rem; font-weight: bold;" { span style="font-weight: 900; color: #3B82F6;" { "A" } "gent-based " span style="font-weight: 900; color: #3B82F6;" { "D" } "evice " span style="font-weight: 900; color: #3B82F6;" { "A" } "udit " span style="font-weight: 900; color: #3B82F6;" { "M" } "onitor" } div style="font-size: 1.25rem; margin-top: 1rem;" { p { "Understand your Resources and Optimize" } p { "using some, or all plugins" } } } // Main content grid div style="display: flex; gap: 2rem;" { // Left sidebar - Tools and Environment div style="width: 25%; display: flex; flex-direction: column; gap: 1.5rem;" { // Tools section div style="background-color: #1F2937; border-radius: 0.5rem; padding: 1.5rem;" { h2 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 1rem;" { "Your tools / data" } div style="display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem;" { // Database tool div style="background-color: #374151; border-radius: 0.5rem; padding: 0.75rem; text-align: center;" { svg style="width: 2rem; height: 2rem; margin: 0 auto 0.5rem auto;" viewBox="0 0 24 24" { path d="M4 18V6C4 4.89543 5.79086 4 8 4H16C18.2091 4 20 4.89543 20 6V18C20 19.1046 18.2091 20 16 20H8C5.79086 20 4 19.1046 4 18Z" fill="currentColor"; } span { "Data" } } // Server tool div style="background-color: #374151; border-radius: 0.5rem; padding: 0.75rem; text-align: center;" { svg style="width: 2rem; height: 2rem; margin: 0 auto 0.5rem auto;" viewBox="0 0 24 24" { path d="M20 2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2z" fill="currentColor"; } span { "Server" } } } } // Environment section div style="background-color: #1F2937; border-radius: 0.5rem; padding: 1.5rem;" { h2 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 1rem;" { "Your environment" } p { "Applications and infrastructure" } div style="margin-top: 1rem; display: flex; flex-direction: column; gap: 0.5rem;" { div style="display: flex; align-items: center; padding: 0.5rem; background-color: #374151; border-radius: 0.5rem;" { svg style="width: 1.5rem; height: 1.5rem; margin-right: 0.5rem;" viewBox="0 0 24 24" { path d="M21 16V8a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2z" fill="currentColor"; } span { "Infrastructure" } } div style="display: flex; align-items: center; padding: 0.5rem; background-color: #374151; border-radius: 0.5rem;" { svg style="width: 1.5rem; height: 1.5rem; margin-right: 0.5rem;" viewBox="0 0 24 24" { path d="M13 2l10 6v8l-10 6L3 16V8l10-6z" fill="currentColor"; } span { "Applications" } } } } } // Right content area div style="width: 75%; display: flex; flex-direction: column; gap: 1.5rem;" { // eBPF Visualization div style="background-color: #1F2937; border-radius: 0.5rem; padding: 1.5rem;" { h2 style="font-size: 1.25rem; font-weight: 600; margin-bottom: 1rem;" { "eBPF System Overview" } div style="background-color: #374151; border-radius: 0.5rem; padding: 1rem;" { svg style="width: 100%; height: 16rem;" viewBox="0 0 800 300" { // Background rect x="50" y="50" width="700" height="300" style="fill: #1e293b; rx: 8;" {}; // User Space rect x="100" y="40" width="600" height="80" style="fill: #374151; rx: 4;" {}; text x="150" y="85" style="fill: white; font-size: 16px;" { "User Space Applications" } // eBPF Programs rect x="100" y="140" width="600" height="80" style="fill: #1d4ed8; rx: 4;" {}; text x="150" y="185" style="fill: white; font-size: 16px;" { "eBPF Programs" } // Kernel Space rect x="100" y="240" width="600" height="40" style="fill: #064e3b; rx: 4;" {}; text x="150" y="265" style="fill: white; font-size: 16px;" { "Kernel Space" } // Connecting Lines path d="M400 120 L400 140" style="stroke: white; stroke-width: 2;" {}; path d="M400 220 L400 240" style="stroke: white; stroke-width: 2;" {}; } } } // Feature boxes grid div style="display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem;" { div style="background-color: #9B7EDE; border-radius: 0.5rem; padding: 1.5rem; text-align: center;" { h3 style="font-size: 1.125rem; font-weight: 600;" { "Testing" } p style="font-size: 0.875rem; margin-top: 0.5rem;" { "Comprehensive testing tools" } } div style="background-color: #5B9BD5; border-radius: 0.5rem; padding: 1.5rem; text-align: center;" { h3 style="font-size: 1.125rem; font-weight: 600;" { "Observability solutions" } p style="font-size: 0.875rem; margin-top: 0.5rem;" { "Monitor and analyze" } } div style="background-color: #68B37E; border-radius: 0.5rem; padding: 1.5rem; text-align: center;" { h3 style="font-size: 1.125rem; font-weight: 600;" { "Incident response" } p style="font-size: 0.875rem; margin-top: 0.5rem;" { "Quick resolution" } } } } } } })) .await }
Editor is loading...
Leave a Comment