Keysat
843ff0e5d7
Glue files not covered by subproject repos: top-level docs, logo, keysat-design-system, and crosscheck tests. Subproject folders are gitignored (each has its own Gitea remote).
26 lines
1.7 KiB
HTML
26 lines
1.7 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Keysat — Shadows</title>
|
|
<link rel="stylesheet" href="../colors_and_type.css">
|
|
<style>
|
|
body { margin: 0; padding: 28px 24px; font-family: var(--font-body); background: var(--bg-page); }
|
|
.grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; }
|
|
.item { display: flex; flex-direction: column; align-items: center; gap: 8px; }
|
|
.box { width: 100px; height: 64px; background: #FBF9F2; border-radius: 8px; border: 1px solid rgba(14,31,51,0.08); }
|
|
.name { font-family: var(--font-mono); font-size: 11px; color: var(--ink-700); }
|
|
.desc { font-size: 10px; color: var(--ink-400); text-align:center; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="grid">
|
|
<div class="item"><div class="box" style="box-shadow:0 1px 1px rgba(14,31,51,0.04)"></div><span class="name">shadow-xs</span><span class="desc">resting</span></div>
|
|
<div class="item"><div class="box" style="box-shadow:0 1px 2px rgba(14,31,51,0.06), 0 1px 1px rgba(14,31,51,0.03)"></div><span class="name">shadow-sm</span><span class="desc">cards</span></div>
|
|
<div class="item"><div class="box" style="box-shadow:0 2px 4px rgba(14,31,51,0.06), 0 4px 12px rgba(14,31,51,0.06)"></div><span class="name">shadow-md</span><span class="desc">elevated</span></div>
|
|
<div class="item"><div class="box" style="box-shadow:0 4px 8px rgba(14,31,51,0.07), 0 12px 32px rgba(14,31,51,0.10)"></div><span class="name">shadow-lg</span><span class="desc">popovers</span></div>
|
|
<div class="item"><div class="box" style="box-shadow:0 8px 16px rgba(14,31,51,0.10), 0 24px 64px rgba(14,31,51,0.14)"></div><span class="name">shadow-xl</span><span class="desc">modals</span></div>
|
|
</div>
|
|
</body>
|
|
</html>
|