diff options
Diffstat (limited to 'pics/itw-digitale-gracht/index.html')
| -rw-r--r-- | pics/itw-digitale-gracht/index.html | 114 |
1 files changed, 114 insertions, 0 deletions
diff --git a/pics/itw-digitale-gracht/index.html b/pics/itw-digitale-gracht/index.html new file mode 100644 index 0000000..b9a5a27 --- /dev/null +++ b/pics/itw-digitale-gracht/index.html @@ -0,0 +1,114 @@ +<!DOCTYPE html> +<html lang="en" prefix="og: https://ogp.me/ns#"> +<head> +<meta charset="UTF-8" /> +<meta http-equiv="X-UA-Compatible" + content="IE=edge"> +<meta name="viewport" + content="width=device-width, initial-scale=1.0" /> +<meta name="description" + content="Recovering scientist. Hacker. ๐ณ๏ธโ๐. He/him." /> +<meta name="keywords" + content="" /> + +<title> + In the Wild: Digitale Gracht // Grisha's awesome website</title> +<meta property="og:site_name" content="Grisha's awesome website"/> +<meta property="og:title" content="Grisha's awesome website | In the Wild: Digitale Gracht"/> +<meta property="og:type" content="website"/> +<meta property="og:url" content="https://oxapentane.com/pics/itw-digitale-gracht/"/> +<meta property="og:description" content="Recovering scientist. Hacker. ๐ณ๏ธโ๐. He/him."/> + +<meta name="twitter:card" content="summary_large_image"/> +<meta name="twitter:title" content="In the Wild: Digitale Gracht"/> +<meta name="twitter:description" content="Recovering scientist. Hacker. ๐ณ๏ธโ๐. He/him."/> +<link rel="alternate" type="application/atom+xml" title="Grisha's awesome website" href="https://oxapentane.com/atom.xml"> + + <style> +html{font-family:monospace;font-size:1rem;line-height:1.5;margin:auto;max-width:70ch;padding:1.5rem 1em 3em} +img{max-width:100%}img:not([src$=".svg"]),article>div,blockquote,pre{border-radius:.3rem}img[src$="#pixelate"]{image-rendering:pixelated} +h1,h2,h3,h4,h5,h6{font-size:inherit;margin:2rem 0 1em} +h1::before{content:'# '} +h2::before{content:'## '} +h3::before{content:'### '} +p{text-align:justify}p,ul,ol,.g,article>footer,article>header{margin:0 0 2em} +pre,blockquote{padding:1.5rem;margin:0 0 1.5rem}pre{overflow-x:auto}pre code{background:0!important}blockquote>*:last-child{margin-bottom:0} +article>img,article>p>img,article>div{display:block;margin-bottom:1.5rem;width:100%} +.yt{aspect-ratio:16/9;width:100%;overflow:hidden}.yt iframe{width:100%;height:100%;border:0} +.s{font-size:.85rem} +.theme{display:inline-block;width:1.5rem;height:1.5rem}.theme img,.theme svg{width:100%;height:100%} +html.light .theme img:first-child,html.light .theme svg:first-child,html.dark .theme img:last-child,html.dark .theme svg:last-child{display:none} +header>div{margin-bottom:1.5rem}footer{margin-top:1.5rem}body>footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem} +body>footer img,body>footer svg{width:1em;height:1em;vertical-align:middle} +.tags{padding:.5rem 0 0 0}.tags li{display:inline}.tags li+li::before{content:' ยท '} +nav{display:flex;gap:.5rem;margin:1.5rem 0}nav a{flex:1;display:flex;flex-direction:column;align-items:center;overflow:hidden;font-weight:bold}nav img,nav svg{width:2rem;height:2rem;margin-bottom:.25rem}nav a .s{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} +.g{display:grid;grid-template-columns:repeat(auto-fill,minmax(7rem,1fr));gap:.5rem}.g a{aspect-ratio:1;display:flex;align-items:center;justify-content:center}.g img{object-fit:contain;max-height:100%;max-width:100%} +.p{list-style:none;padding:0}.p ul{margin:0}.p>li{display:flex;gap:1rem;margin-bottom:1rem}.p time{display:flex;flex-direction:column;align-items:center;min-width:3rem;margin:.25rem 0}.p time span:first-child{font-size:1.5em;line-height:1} +.lb{position:fixed;inset:0;background:#000d;display:flex;align-items:center;justify-content:center;z-index:999;cursor:pointer}.lb img{max-width:95vw;max-height:95vh} +@media(max-width:30em){header .desc{display:none}} + </style> + + <style> + html.light{background:oklch(0.9602 0.0811 96.96);--tc:#f5e6b3;color:#000} + html.light a{color:oklch(0.53 0.2448 257.69) } + html.light a:visited{color:oklch(0.48 0.24 290.93)} + html.light a.active,html.light a:active,html.light a:hover{color:oklch(0.53 0.2687 324.53) } + html.light p,html.light ul,html.light ol, html.light .desc {color:oklch(0.4 0.1082 58.76) } + html.light blockquote,html.light pre,html.light code,html.light article>img,html.light article>p>img,html.light .g img{background:oklch(0.94 0.1 93.24)} + html.light code{color:#000} + html.dark{background:#000;--tc:#000;color:#fff} + html.dark a{color:oklch(0.87 0.24 165.59)} + html.dark a:visited{color:oklch(0.79 0.13 297.29)} + html.dark a.active,html.dark a:active,html.dark a:hover{color:oklch(0.76 0.25 344.92)} + html.dark p,html.dark ul,html.dark ol, html.dark .desc {color: oklch(0.92 0.15 94.86)} + html.dark img[src$=".svg"],html.dark nav svg,html.dark .theme svg,html.dark footer svg{filter:invert(1)} + html.dark blockquote,html.dark pre,html.dark code,html.dark article>img,html.dark article>p>img,html.dark .g img{background:#222} + html.dark code{color:#fff} + a.active,a:active,a:hover{text-decoration-style:wavy} + .tags a{text-decoration-style:dotted} + hr{border:0;border-top:1px dashed;clear:both;margin-bottom:1.5rem} + </style> + <meta name="theme-color" id="tc"><script>(function(){var m=matchMedia('(prefers-color-scheme:dark)'),t=localStorage.theme||(m.matches?'dark':'light'),h=document.documentElement,c=document.getElementById('tc');h.className=t;function u(){c.content=getComputedStyle(h).getPropertyValue('--tc')}u();window.T=function(){t=t==='dark'?'light':'dark';localStorage.theme=t;h.className=t;u()}})()</script> + +</head> +<body> + + <header> + <div class="s" style="display:flex;justify-content:space-between;align-items:center"> + <span><strong>Grisha's awesome website</strong><span class="desc"> ยท Recovering scientist. Hacker. ๐ณ๏ธโ๐. He/him.</span></span> + <a href="#" onclick="T();return false" class="theme" aria-label="Toggle theme" title="Toggle theme"><img src="/icons/light.svg" alt="Light mode"><img src="/icons/asleep.svg" alt="Dark mode"></a> + </div> + <hr> + <nav> + <a href="https://oxapentane.com/" aria-label="Hallo ^^"><span class="s">Hallo ^^</span></a> + </nav> + </header> + <hr> + <main> + +<article> + <header> + <h1>In the Wild: Digitale Gracht</h1> + <time class="s" datetime="2026-01-07">07 Jan 2026</time> + </header> + + <p>This year I want to try to bring you some pictures of the infrastructure in our natural habitat, so welcome to the first edition of "In the Wild"!</p> +<p>I'll start by dumping some old pics to kick things off. And today we are looking at Amsterdam's "Pilot stadsgeluid" (Pilot city soundscapes).</p> +<p>According to <a rel="external" href="https://sensorenregister.amsterdam.nl/">sensorenregister</a></p> + + + + +</article> +</main> + <hr> + <footer class="s"> + <span>ยฉ Grisha's awesome website 2026</span> + <span><img src="/icons/rss.svg" alt=""> Feeds: <a href="https://oxapentane.com/atom.xml">Atom</a> ยท <a href="https://oxapentane.com/rss.xml">RSS</a></span> + </footer> + + + + <script>document.querySelectorAll('article img[srcset]').forEach(i=>{if(i.closest('a'))return;i.style.cursor='pointer';i.onclick=()=>{let d=document.createElement('div'),s=i.srcset.split(',').pop().trim().split(' ')[0];d.className='lb';d.innerHTML='<img src="'+s+'">';document.body.style.overflow='hidden';d.onclick=()=>{d.remove();document.body.style.overflow=''};document.body.appendChild(d)}})</script> + </body> +</html> |