3 lines
1.4 KiB
HTML
3 lines
1.4 KiB
HTML
<!DOCTYPE html><html><head><meta charset="utf-8"><title>perspective4 · straight floor grid</title>
|
|
<style>html,body{margin:0;background:#1a1a1a}.grid{display:grid;grid-template-columns:repeat(2,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"><figure><img src="01_second-horizon.svg"><figcaption>second horizon</figcaption></figure><figure><img src="02_two-point-room.svg"><figcaption>two point room</figcaption></figure><figure><img src="03_tilted-floor.svg"><figcaption>tilted floor</figcaption></figure><figure><img src="04_ghost-floor-behind.svg"><figcaption>ghost floor behind</figcaption></figure><figure><img src="05_steep-tiles.svg"><figcaption>steep tiles</figcaption></figure><figure><img src="06_gentle-rippled-floor.svg"><figcaption>gentle rippled floor</figcaption></figure><figure><img src="07_zoomed-grid-tiny-event.svg"><figcaption>zoomed grid tiny event</figcaption></figure><figure><img src="08_teal-grid-magenta.svg"><figcaption>teal grid magenta</figcaption></figure><figure><img src="09_two-point-shifted.svg"><figcaption>two point shifted</figcaption></figure><figure><img src="10_dissolving-floor.svg"><figcaption>dissolving floor</figcaption></figure></div></body></html> |