Files
fuel-alert/resources/js/components/landing/LandingNav.vue
Ovidiu U a841a7c900 Add dedicated /pricing page and lock launch tiers to Free/Daily/Smart
Consolidate pricing onto a single source. Pro is deferred from launch
(left dormant: no Stripe price, no card), so the offered set is 3 tiers.

- Extract the pricing grid and footer into shared components
  (PricingGrid.vue, landing/SiteFooter.vue); add a /pricing route
  rendering Pricing.vue; remove the pricing section from Home
- Repoint every upgrade link to the /pricing route (LandingNav and
  SiteFooter via RouterLink, UpsellBanner CTA) — no more #pricing anchors
- Bump Smart (plus) SMS daily limit 1 -> 3 (PlanSeeder + PlanFactory),
  update PlanFeaturesTest assertion
- Rewrite /pricing card bullets to match real entitlements (drop
  unbuilt promises: multi-location tracking, 14-day trend, supermarket anchor)
- Fix stale "1/day" SMS references in notifications.md, tiers.md, docs/tiers.md
- Delete unused resources/views/components/pricing-card.blade.php

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-10 12:22:19 +01:00

46 lines
2.2 KiB
Vue

<template>
<nav class="fixed top-0 w-full z-50 bg-zinc-50/90 backdrop-blur-sm border-b border-zinc-300 px-6 py-4 md:px-12">
<div class="max-w-7xl mx-auto flex items-center justify-between gap-6">
<RouterLink class="flex items-center gap-3 shrink-0" to="/">
<div class="w-9 h-9 md:w-10 md:h-10 rounded-lg bg-accent flex items-center justify-center shadow-md">
<iconify-icon class="text-white text-xl" icon="lucide:fuel"></iconify-icon>
</div>
<span class="text-xl md:text-2xl font-black font-display tracking-tighter text-accent">FuelAlert</span>
</RouterLink>
<div class="hidden lg:flex items-center gap-8 font-mono text-[11px] uppercase tracking-widest text-zinc-600">
<a class="hover:text-accent transition-colors" href="#how-it-works">How it works</a>
<a class="hover:text-accent transition-colors" href="#features">Why it works</a>
<RouterLink class="hover:text-accent transition-colors" to="/pricing">Pricing</RouterLink>
</div>
<div class="flex items-center gap-3 md:gap-5">
<template v-if="isAuthenticated">
<RouterLink
class="bg-accent text-white px-5 py-2 rounded-full text-sm font-bold shadow-md hover:bg-primary-dark transition-all"
to="/dashboard"
>
Dashboard
</RouterLink>
</template>
<template v-else>
<a class="text-sm font-semibold text-zinc-600 hover:text-zinc-900 transition-colors" href="/login">Login</a>
<a
class="hidden sm:inline-flex bg-accent text-white px-5 py-2 rounded-full text-sm font-bold shadow-md hover:bg-primary-dark transition-all"
href="/register"
>
Get started
</a>
</template>
</div>
</div>
</nav>
</template>
<script setup>
import { RouterLink } from 'vue-router'
import { useAuth } from '../../composables/useAuth.js'
const { isAuthenticated } = useAuth()
</script>