digital garden: 3 aktif varyant (v4 defter, v5 gazete, v6 katalog) + yillik
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
91
yillik/index.html
Normal file
91
yillik/index.html
Normal file
@@ -0,0 +1,91 @@
|
||||
<!doctype html>
|
||||
<html lang="tr">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>yıllıktan geldin · tunapro.xyz</title>
|
||||
<meta name="description" content="2026 yıllığındaki qr kodun çıkışı. kâğıt sararır, bu sayfa kalır.">
|
||||
<style>
|
||||
:root{
|
||||
--bg:#f4f1ea; --card:#faf8f2; --ink:#141412; --red:#c22f23; --dim:#8a857a; --faint:#c9c3b4;
|
||||
--serif:"Iowan Old Style",Palatino,Georgia,serif;
|
||||
--mono:ui-monospace,Menlo,Consolas,monospace;
|
||||
}
|
||||
*{box-sizing:border-box;margin:0;padding:0}
|
||||
::selection{background:var(--red);color:#fff}
|
||||
body{
|
||||
background:var(--bg);color:var(--ink);font-family:var(--serif);line-height:1.65;
|
||||
min-height:100vh;display:flex;align-items:center;justify-content:center;padding:34px 18px;
|
||||
background-image:repeating-linear-gradient(0deg,transparent,transparent 31px,rgba(20,20,18,.035) 31px,rgba(20,20,18,.035) 32px);
|
||||
}
|
||||
.card{
|
||||
max-width:620px;background:var(--card);border:2px solid var(--ink);
|
||||
box-shadow:6px 6px 0 rgba(20,20,18,.14);padding:38px 40px 30px;position:relative;
|
||||
}
|
||||
@media(max-width:560px){.card{padding:28px 22px 24px}}
|
||||
.stamp{
|
||||
position:absolute;top:16px;right:18px;font-family:var(--mono);font-size:10.5px;font-weight:700;
|
||||
letter-spacing:.14em;text-transform:uppercase;color:var(--red);border:2.5px solid var(--red);
|
||||
border-radius:4px;padding:3px 9px;transform:rotate(7deg);opacity:.85;
|
||||
}
|
||||
.kicker{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--red)}
|
||||
h1{font-size:clamp(30px,6vw,44px);font-weight:600;line-height:1.08;letter-spacing:-.015em;margin:14px 0 20px}
|
||||
h1 em{font-style:italic;color:var(--red)}
|
||||
p{font-size:16.5px;color:#2e2c25;margin-bottom:14px}
|
||||
.age{font-family:var(--mono);font-size:12px;color:var(--dim);border:1.5px dashed var(--faint);
|
||||
padding:8px 12px;margin:18px 0;background:var(--bg)}
|
||||
.age b{color:var(--red);font-weight:600}
|
||||
.sig{margin-top:22px;text-align:right}
|
||||
.sig .name{font-style:italic;font-size:26px;color:var(--ink)}
|
||||
.sig .at{font-family:var(--mono);font-size:11.5px;color:var(--dim);display:block;margin-top:2px}
|
||||
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px;padding-top:20px;border-top:1.5px solid var(--ink);
|
||||
font-family:var(--mono);font-size:12.5px}
|
||||
.actions a{text-decoration:none;color:var(--ink);border:1.5px solid var(--ink);padding:8px 15px;border-radius:999px;
|
||||
transition:background .12s,color .12s}
|
||||
.actions a:hover{background:var(--ink);color:var(--bg)}
|
||||
.actions a.main{background:var(--red);border-color:var(--red);color:#fff}
|
||||
.actions a.main:hover{background:var(--ink);border-color:var(--ink)}
|
||||
footer{margin-top:18px;font-family:var(--mono);font-size:10.5px;color:var(--dim)}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<main class="card">
|
||||
<span class="stamp">sayfalar arasında bulundu</span>
|
||||
<div class="kicker">tunapro.xyz/yillik · 2026 yıllığı</div>
|
||||
|
||||
<p style="margin-top:18px">demek gerçekten okuttun qr'ı. aynı kitaba sıkıştık madem, buyur.
|
||||
herkes yıllığa bi şeyler yazdı, ben de buraya bi kapı koydum. kâğıt sararıyor ama bu adres
|
||||
benim sunucumda döndüğü sürece açık.</p>
|
||||
|
||||
<p>beni hatırlıyorsundur, köşede robot parçaları ve terminal pencereleriyle uğraşan
|
||||
çocuk. o uğraşlar büyüdü. hâlâ robot yapıyorum, artık yarışma da düzenliyorum, sunucumda
|
||||
agent'lar çalışıyor. hepsinin kaydı bahçede duruyor, aşağıdaki kapıdan girebilirsin.</p>
|
||||
|
||||
<p>sen de kendi tuhaf şeyini yapıyorsundur umarım. yapmıyorsan yap. kimse senden
|
||||
beklemiyor zaten, o yüzden tamamen serbestsin.</p>
|
||||
|
||||
<div class="age" id="age">bu sayfa 2026'da yazıldı.</div>
|
||||
|
||||
<p>bu kod hâlâ çalışıyorsa ben hâlâ bi şeyler kuruyorum demektir. yolun açık olsun.</p>
|
||||
|
||||
<div class="sig">
|
||||
<div class="name">tuna</div>
|
||||
<span class="at">her yerde @tunapro1234</span>
|
||||
</div>
|
||||
|
||||
<div class="actions">
|
||||
<a class="main" href="/">bahçeye gir →</a>
|
||||
<a href="https://github.com/tunapro1234">github</a>
|
||||
</div>
|
||||
|
||||
<footer>kendi sunucumda basıldı. yıllığın kâğıdından uzun yaşar, plan bu.</footer>
|
||||
</main>
|
||||
<script>
|
||||
(function(){
|
||||
var y=new Date().getFullYear(), d=y-2026, el=document.getElementById("age");
|
||||
if(d===1){ el.innerHTML="bu sayfa 2026'da yazıldı. sen okuyana kadar <b>1 yıl</b> geçmiş. hâlâ ayaktayız."; }
|
||||
else if(d>1){ el.innerHTML="bu sayfa 2026'da yazıldı. sen okuyana kadar <b>"+d+" yıl</b> geçmiş. hâlâ ayaktayız, fena değil."; }
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user