dastanmedetbekov.github.io/index.html at main · dastanmedetbekov/dastanmedetbekov.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Dastan's Blog</title>
    <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🎵</text></svg>">
    <link rel="stylesheet" href="styles.css">
</head>

<body>
  <input type="checkbox" id="theme-switch">
  <label for="theme-switch" class="theme-label"></label>
  <main class="container">
    <header>
      <h1>Welcome to Dastan's Blog</h1>
      <p class="muted">Explore my thoughts, reviews, and favorite picks</p>
    </header>

    <div class="latest-grid">
      <section class="card">
        <h2 style="margin-top:0;">Latest Posts</h2>
        <div class="latest-posts">
          <div class="latest-item">
            <a href="posts/en/internet-idk.html" class="tag">Internet — I Don’t Know</a>
            <span class="muted" style="margin-left: 1em;">2026-02-18</span><br>
            <span>Reflections on relying on AI for coding, autocompletion, and creative space.</span>
          </div>

          <div class="latest-item">
            <a href="posts/en/code-task-journal.html" class="tag">Code Task Journal</a>
            <span class="muted" style="margin-left: 1em;">2026-02-10</span><br>
            <span>A running log of programming tasks and how I solved them.</span>
          </div>
          <div class="latest-item">
            <a href="posts/en/vulkan/started-to-learn.html" class="tag">Started to Learn Vulkan</a>
            <span class="muted" style="margin-left: 1em;">2026-02-02</span><br>
            <span>Began reading Vulkan documentation. I enjoy working on challenging things because it's interesting.</span>
          </div>
          <div class="latest-item">
            <a href="posts/en/game-on-sfml.html" class="tag">Game On! SFML Edition</a>
            <span class="muted" style="margin-left: 1em;">2026-02-02</span><br>
            <span>Join me as I document my friend Adilet's journey in game development using the Simple and Fast Multimedia Library (SFML).</span>
          </div>
        </div>
      </section>
    </div>

    <div class="small-cards-grid">
      <section class="card">
        <h2 style="margin-top:0;">Experiments</h2>
        <ul style="list-style:none;padding:0;">
          <li><a href="garden/index.html" class="tag">Unremarkable Garden</a> <span class="muted">(Warning: Uses JavaScript)</span></li>
        </ul>
      </section>

      <section class="card">
        <h2 style="margin-top:0;">Music</h2>
        <ul style="list-style:none;padding:0;">
           <li><a href="posts/en/best-from-cyberspace.html" class="tag">Best Albums from Cyberspace</a></li>
           <li><a href="posts/en/weeksalbum.html" class="tag">Week's Album Recommendation</a></li>
           <li><a href="posts/en/club-dastan-radio.html" class="tag">Club Dastan Radio</a></li>
        </ul>
      </section>

      <section class="card">
        <h2 style="margin-top:0;">2025 Reviews</h2>
        <ul style="list-style:none;padding:0;">
          <li><a href="posts/en/albums2025.html" class="tag">Best Albums of 2025. My Top Picks</a></li>
          <li><a href="posts/en/review2025.html" class="tag">Review of 2025</a></li>
        </ul>
      </section>

      <section class="card">
        <h2 style="margin-top:0;">Poetry Log (Kyrgyz)</h2>
        <p>Read my poetry journal in Kyrgyz.<br>
          <a href="posts/kg/poetry-log.html" class="tag" style="margin-top:8px;display:inline-block;">Go to Poetry Log →</a>
        </p>
      </section>
        <section class="card">
          <h2 style="margin-top:0;">Turkish-Russian Study Words</h2>
          <p>This is a growing Turkish-Russian dictionary for university study.<br>
            <a href="posts/tr/turkish-russian-words.html" class="tag" style="margin-top:8px;display:inline-block;">Read Turkish-Russian Words →</a>
          </p>
        </section>
    </div>
    <style>
      .latest-grid {
        margin-bottom: 32px;
      }
      .latest-posts {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 24px;
      }
      .latest-item {
        background: var(--no2);
        border-radius: 10px;
        padding: 18px 18px 12px 18px;
        box-shadow: 0 2px 8px 0 rgba(48,97,242,0.06);
        margin-bottom: 0;
      }
      @media (max-width: 900px) {
        .latest-posts {
          grid-template-columns: 1fr;
        }
      }
      .small-cards-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 24px;
      }
      @media (max-width: 900px) {
        .small-cards-grid {
          grid-template-columns: 1fr;
        }
      }
    </style>
  </main>
</body>
</html>