24 lines
1.7 KiB
HTML
24 lines
1.7 KiB
HTML
<!DOCTYPE html><html><head><meta charset="utf-8">
|
|
<style>html,body{margin:0;background:#222}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:10px;width:2400px}figure{margin:0;position:relative;background:#fff;overflow:hidden}img{width:100%;display:block}figcaption{position:absolute;left:0;bottom:0;right:0;padding:6px 10px;font:14px ui-monospace,monospace;color:#fff;background:linear-gradient(transparent,#000d)}</style></head><body>
|
|
<div class="grid" id=g></div><script>
|
|
const items=[
|
|
["01_E3-evolved-nautilus.svg","01 E3 evolved · twin nautilus"],
|
|
["02_single-huge-nautilus.svg","02 single huge nautilus"],
|
|
["03_triangular-three-nautilus.svg","03 triangular three nautilus"],
|
|
["04_asymmetric-chaos.svg","04 asymmetric chaos"],
|
|
["05_warm-tangle-tan.svg","05 warm tangle · tan"],
|
|
["06_sage-with-bright-lighter.svg","06 sage · lighter nautilus"],
|
|
["07_deep-teal-luminous.svg","07 deep teal · luminous"],
|
|
["08_bone-thick-white-nautilus.svg","08 bone · white nautilus"],
|
|
["09_galaxies-all-same-direction.svg","09 spiral galaxies"],
|
|
["10_nested-nautilus-mandala.svg","10 nested nautilus"],
|
|
["11_windblown-biased.svg","11 windblown · biased left"],
|
|
["12_linked-chain-across.svg","12 linked chain across"],
|
|
["13_spectral-radial-tangle.svg","13 spectral radial"],
|
|
["14_quiet-counterexample.svg","14 quiet · single nautilus"],
|
|
["15_heavy-weight-contrast.svg","15 heavy weight contrast"],
|
|
];
|
|
const base="http://localhost:8731/output/qft/sketch07/";const g=document.getElementById('g');
|
|
for(const[f,c]of items){const fig=document.createElement('figure');const im=document.createElement('img');im.src=base+f;const cap=document.createElement('figcaption');cap.textContent=c;fig.append(im,cap);g.append(fig);}
|
|
</script></body></html>
|