File size: 4,474 Bytes
f31e5e8 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 | <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
<meta id="meta-theme-color" name="theme-color" content="#070707">
<script>
(function () {
try {
var k = "corner-cafe-theme";
var t = localStorage.getItem(k);
var th = t === "light" ? "light" : "dark";
document.documentElement.setAttribute("data-theme", th);
var meta = document.getElementById("meta-theme-color");
if (meta) meta.setAttribute("content", th === "light" ? "#f6f3ee" : "#070707");
} catch (e) {
document.documentElement.setAttribute("data-theme", "dark");
}
})();
</script>
<title>Corner Cafe | How would you like to order?</title>
<meta name="description" content="Browse the menu or tell Corner Cafe what you want — AI-assisted ordering.">
<link rel="icon" type="image/svg+xml" href="assets/logo-c.svg?v=1.17">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&family=Playfair+Display:wght@500;600;700&display=swap">
<link rel="stylesheet" href="styles.css?v=5">
</head>
<body>
<div class="app-shell">
<header class="app-header">
<a class="app-back" href="./">← Change service</a>
<button type="button" class="theme-toggle" data-theme-toggle aria-label="Switch theme" title="Theme">
<svg class="theme-icon theme-icon-sun" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
<circle cx="12" cy="12" r="4"/>
<path d="M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M6.34 17.66l-1.41 1.41M19.07 4.93l-1.41 1.41"/>
</svg>
<svg class="theme-icon theme-icon-moon" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
<path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/>
</svg>
</button>
</header>
<main class="app-main">
<div class="app-hero">
<p class="app-hero__eyebrow"><span data-order-service>Order</span></p>
<h1 class="app-hero__title">How would you like to order?</h1>
<p class="app-hero__lead">Browse the full menu, or tell us what you fancy — we’ll match it for you.</p>
</div>
<ul class="service-grid service-grid--two">
<li>
<a class="service-card service-card--menu" data-path-link data-mode="menu" href="order.html">
<span class="service-card__icon" aria-hidden="true">
<svg viewBox="0 0 24 24" width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"/>
<path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"/>
<path d="M8 7h8"/>
<path d="M8 11h6"/>
</svg>
</span>
<span class="service-card__copy">
<span class="service-card__name">Browse the menu</span>
<span class="service-card__meta">See everything by section and add dishes</span>
</span>
</a>
</li>
<li>
<a class="service-card service-card--know" data-path-link data-mode="know" href="order.html">
<span class="service-card__icon" aria-hidden="true">
<svg viewBox="0 0 24 24" width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M12 3a6 6 0 0 0-4.5 9.9V17a1.5 1.5 0 0 0 1.5 1.5h6A1.5 1.5 0 0 0 16.5 17v-4.1A6 6 0 0 0 12 3z"/>
<path d="M9.5 20.5h5"/>
<path d="M10.5 22h3"/>
</svg>
</span>
<span class="service-card__copy">
<span class="service-card__name">I know what I want</span>
<span class="service-card__meta">Say it in your own words — AI matches the kitchen</span>
</span>
</a>
</li>
</ul>
</main>
</div>
<script src="app.js?v=4" defer></script>
</body>
</html>
|