vantzs/corrosion-admin-panel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 18 Wiki Activity

feat: Build 5 marketing pages with layout and routing

Browse Source 
Landing page (hero, problem, shift, capabilities, wipe orchestration,
infrastructure, public sites, CTA), Pricing (3-tier cards), How It Works
(4-step walkthrough + architecture diagram), FAQ (10-item accordion),
Roadmap (6-phase timeline). All under /site/* with MarketingLayout
(sticky nav, 4-column footer). Routes wired, build clean.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Vantz Stockwell
2026-02-14 23:45:34 -05:00
parent 5d911d4165
commit 597f2ec379
7 changed files with 922 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
frontend/src/components/layout/MarketingLayout.vue Normal file
View File

@@ -0,0 +1,76 @@
<script setup lang="ts">
import { RouterView, RouterLink } from 'vue-router'
</script>
<template>
<div class="min-h-screen bg-neutral-950 flex flex-col">
<!-- Navigation -->
<nav class="border-b border-neutral-800 bg-neutral-950/80 backdrop-blur-sm sticky top-0 z-50">
<div class="max-w-6xl mx-auto px-6 py-4 flex items-center justify-between">
<RouterLink to="/site" class="flex items-center gap-3">
<img src="/logo.png" alt="Corrosion" class="h-8 w-8" />
<span class="text-lg font-bold text-neutral-100">Corrosion</span>
</RouterLink>
<div class="hidden md:flex items-center gap-6">
<RouterLink to="/site/how-it-works" class="text-sm text-neutral-400 hover:text-neutral-100 transition-colors">How It Works</RouterLink>
<RouterLink to="/site/pricing" class="text-sm text-neutral-400 hover:text-neutral-100 transition-colors">Pricing</RouterLink>
<RouterLink to="/site/roadmap" class="text-sm text-neutral-400 hover:text-neutral-100 transition-colors">Roadmap</RouterLink>
<RouterLink to="/site/faq" class="text-sm text-neutral-400 hover:text-neutral-100 transition-colors">FAQ</RouterLink>
</div>
<div class="flex items-center gap-3">
<RouterLink to="/login" class="text-sm text-neutral-400 hover:text-neutral-100 transition-colors">Sign In</RouterLink>
<RouterLink to="/register" class="px-4 py-2 bg-oxide-600 hover:bg-oxide-700 text-white text-sm font-medium rounded-lg transition-colors">Get Started</RouterLink>
</div>
</div>
</nav>
<!-- Page content -->
<main class="flex-1">
<RouterView />
</main>
<!-- Footer -->
<footer class="border-t border-neutral-800 py-12">
<div class="max-w-6xl mx-auto px-6">
<div class="grid grid-cols-2 md:grid-cols-4 gap-8 mb-8">
<div>
<h4 class="text-sm font-semibold text-neutral-300 mb-3">Product</h4>
<div class="space-y-2">
<RouterLink to="/site/how-it-works" class="block text-sm text-neutral-500 hover:text-neutral-300 transition-colors">How It Works</RouterLink>
<RouterLink to="/site/pricing" class="block text-sm text-neutral-500 hover:text-neutral-300 transition-colors">Pricing</RouterLink>
<RouterLink to="/site/roadmap" class="block text-sm text-neutral-500 hover:text-neutral-300 transition-colors">Roadmap</RouterLink>
</div>
</div>
<div>
<h4 class="text-sm font-semibold text-neutral-300 mb-3">Support</h4>
<div class="space-y-2">
<RouterLink to="/site/faq" class="block text-sm text-neutral-500 hover:text-neutral-300 transition-colors">FAQ</RouterLink>
<a href="https://discord.gg/corrosion" target="_blank" class="block text-sm text-neutral-500 hover:text-neutral-300 transition-colors">Discord</a>
</div>
</div>
<div>
<h4 class="text-sm font-semibold text-neutral-300 mb-3">Company</h4>
<div class="space-y-2">
<RouterLink to="/site" class="block text-sm text-neutral-500 hover:text-neutral-300 transition-colors">About</RouterLink>
<RouterLink to="/status" class="block text-sm text-neutral-500 hover:text-neutral-300 transition-colors">Status</RouterLink>
</div>
</div>
<div>
<h4 class="text-sm font-semibold text-neutral-300 mb-3">Legal</h4>
<div class="space-y-2">
<span class="block text-sm text-neutral-600">Terms of Service</span>
<span class="block text-sm text-neutral-600">Privacy Policy</span>
</div>
</div>
</div>
<div class="border-t border-neutral-800 pt-6 flex items-center justify-between">
<div class="flex items-center gap-2">
<img src="/logo.png" alt="Corrosion" class="h-4 w-4 opacity-60" />
<span class="text-sm text-neutral-600">&copy; 2026 Corrosion. All rights reserved.</span>
</div>
<span class="text-xs text-neutral-700">The Control Plane for Rust Servers.</span>
</div>
</div>
</footer>
</div>
</template>