Added Ridgeline Plots and layers output
This commit is contained in:
40
tools/archive-wall.html
Normal file
40
tools/archive-wall.html
Normal file
@@ -0,0 +1,40 @@
|
||||
<!DOCTYPE html><html><head><meta charset="utf-8">
|
||||
<title>The Archive — typology wall mock</title>
|
||||
<style>
|
||||
html,body{margin:0;background:#16140f;color:#cabfa6}
|
||||
/* warm gallery wall, even hang, consistent frames + museum labels */
|
||||
body{padding:64px 56px 80px;font:13px/1.5 ui-monospace,"SFMono-Regular",Menlo,monospace}
|
||||
.head{letter-spacing:.34em;text-transform:uppercase;font-size:13px;color:#9fb7af;margin:0 0 4px}
|
||||
.sub{color:#6f6a5c;font-size:12px;margin:0 0 40px;letter-spacing:.06em}
|
||||
.wall{display:grid;grid-template-columns:repeat(4,1fr);gap:44px 40px}
|
||||
figure{margin:0}
|
||||
.mat{background:#f3ecdb;padding:16px;box-shadow:0 2px 0 #0008,0 18px 40px -18px #000c;border:1px solid #000}
|
||||
.mat img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;background:#fff}
|
||||
figcaption{margin-top:11px;display:flex;justify-content:space-between;gap:10px;align-items:baseline}
|
||||
.cat{color:#9fb7af;letter-spacing:.12em}
|
||||
.ttl{color:#cabfa6;flex:1;text-align:center}
|
||||
.kind{color:#6f6a5c;text-transform:uppercase;letter-spacing:.1em;font-size:11px}
|
||||
</style></head><body>
|
||||
<p class="head">Traces of the Invisible · a catalogue</p>
|
||||
<p class="sub">one fabricated archive · evidence (bubble chamber) · cause (field) · synthesis · A3 plates, seeds as catalogue numbers</p>
|
||||
<div class="wall" id=w></div>
|
||||
<script>
|
||||
const items=[
|
||||
["output/iterations-claude-craft/78_final-lively-magenta-cream.svg","BC·001","Lively magenta event","evidence"],
|
||||
["output/qft/sketch07/02_single-huge-nautilus.svg","QF·011","Single E8 nautilus","cause"],
|
||||
["output/iterations-claude-craft/03_boron-bluered-cream.svg","BC·014","Boron · blue/red","evidence"],
|
||||
["output/qft/sketch05/10_concentric-rosettes-pale-rose.svg","QF·024","Concentric rosettes","cause"],
|
||||
["output/qft-bc/sketch01/05_scale-rhyme-nautilus.svg","SY·002","Scale rhyme · nautilus","synthesis"],
|
||||
["output/iterations-claude-craft/22_kind-warm-relic.svg","BC·022","Kind · warm relic","evidence"],
|
||||
["output/qft/sketch04/06_bone-radial-gradient.svg","QF·046","Bone radial field","cause"],
|
||||
["output/iterations-claude-craft/26_kind-selenium-soft.svg","BC·026","Kind · selenium","evidence"],
|
||||
["output/qft/sketch05/02_dense-radial-cream.svg","QF·052","Dense radial lattice","cause"],
|
||||
["output/iterations-claude-craft/10_boron-gold-olive.svg","BC·010","Boron · gold/olive","evidence"],
|
||||
["output/qft-bc/sketch02/10_trace-family-communion.svg","SY·010","Communion","synthesis"],
|
||||
["output/iterations-claude-craft/16_warm-halo-nocturne.svg","BC·016","Warm halo nocturne","evidence"],
|
||||
];
|
||||
w.innerHTML=items.map(([src,cat,ttl,kind])=>
|
||||
`<figure><div class="mat"><img src="../${src}"></div>
|
||||
<figcaption><span class="cat">${cat}</span><span class="ttl">${ttl}</span></figcaption>
|
||||
<div style="text-align:right" class="kind">${kind}</div></figure>`).join("");
|
||||
</script></body></html>
|
||||
Reference in New Issue
Block a user