martinrue.github.io/index.html at master · martinrue/martinrue.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
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Martin Rue</title>
    <meta name="description" content="I build things on the internet." />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <link rel="shortcut icon" href="/assets/images/favicon/favicon-96x96.png" />
    <link rel="alternate" type="application/rss+xml" href="/rss.xml" title="RSS Feed" />

    <link rel="stylesheet" type="text/css" href="/assets/css/index.css" />

    <link rel="apple-touch-icon" sizes="180x180" href="/assets/images/favicon/apple-touch-icon.png" />
    <link rel="icon" type="image/png" sizes="32x32" href="/assets/images/favicon/favicon-32x32.png" />
    <link rel="icon" type="image/png" sizes="16x16" href="/assets/images/favicon/favicon-16x16.png" />
    <link rel="manifest" href="/assets/images/favicon/site.webmanifest" />

    <meta property="og:url" content="https://martinrue.com" />
    <meta property="og:type" content="website" />
    <meta property="og:title" content="Martin Rue" />
    <meta property="og:description" content="I build things on the internet." />
    <meta property="og:image" content="https://martinrue.com/assets/images/og/home.jpg" />

    <meta name="twitter:card" content="summary" />
    <meta name="twitter:site" content="@martinrue" />
    <meta name="twitter:creator" content="@martinrue" />

    <!-- START:ANALYTICS -->
    <script defer src="https://cloud.umami.is/script.js" data-website-id="f9b01ef1-688b-4afb-a365-b5508e8f1640"></script>
    <!-- END:ANALYTICS -->
  </head>

  <body>
    <script src="/assets/js/lib.js"></script>
    <script src="/assets/js/dark-mode.js"></script>

    <div class="container">
      <header>
        <section class="bio">
          <a href="/">
            <h1>Martin Rue</h1>
          </a>

          <h2>I build things on the internet.</h2>
        </section>

        <!-- START:LINKS -->

        <section class="links">
          <a href="https://youtube.com/@martinrue" aria-label="YouTube">
            <svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 23 22" stroke-width="0" stroke-linecap="round" stroke-linejoin="round">
              <path
                class="yt"
                d="M7.84499 4.77535C10.4365 4.40822 13.5635 4.40822 16.155 4.77535C18.5096 5.10891 20.3341 6.76142 20.6831 8.54141C21.1056 10.6962 21.1056 13.3038 20.6831 15.4586C20.3341 17.2386 18.5096 18.8911 16.1551 19.2247C13.5635 19.5918 10.4365 19.5918 7.84499 19.2247C5.49049 18.8911 3.666 17.2386 3.31691 15.4586C2.89434 13.3038 2.89438 10.6962 3.31692 8.54142C3.66596 6.76141 5.49048 5.10891 7.84499 4.77535ZM16.4356 2.79512C13.658 2.40163 10.3421 2.40163 7.56446 2.79512C4.54986 3.22219 1.90016 5.37282 1.35429 8.15657C0.881927 10.5655 0.881875 13.4345 1.3543 15.8434C1.90021 18.6272 4.54984 20.7778 7.56446 21.2049C10.3421 21.5984 13.658 21.5984 16.4356 21.2049C19.4502 20.7778 22.0999 18.6272 22.6458 15.8434C23.1181 13.4345 23.1181 10.5655 22.6458 8.15658C22.0999 5.37281 19.4502 3.22219 16.4356 2.79512ZM10.5547 7.16795C10.2478 6.96338 9.8533 6.94431 9.52814 7.11833C9.20299 7.29234 9 7.6312 9 8V16C9 16.3688 9.20299 16.7077 9.52814 16.8817C9.8533 17.0557 10.2478 17.0366 10.5547 16.8321L16.5547 12.8321C16.8329 12.6466 17 12.3344 17 12C17 11.6656 16.8329 11.3534 16.5547 11.1679L10.5547 7.16795ZM14.1972 12L11 14.1315V9.86852L14.1972 12Z"
              ></path>
            </svg>
          </a>

          <a href="https://instagram.com/martinrue" aria-label="Instagram">
            <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="#333" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
              <rect x="2" y="2" width="20" height="20" rx="5" ry="5"></rect>
              <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"></path>
              <line x1="17.5" y1="6.5" x2="17.51" y2="6.5"></line>
            </svg>
          </a>

          <a href="https://twitter.com/martinrue" aria-label="Twitter">
            <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="#333" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
              <path
                d="M23 3a10.9 10.9 0 0 1-3.14 1.53 4.48 4.48 0 0 0-7.86 3v1A10.66 10.66 0 0 1 3 4s-4 9 5 13a11.64 11.64 0 0 1-7 2c9 5 20 0 20-11.5a4.5 4.5 0 0 0-.08-.83A7.72 7.72 0 0 0 23 3z"
              ></path>
            </svg>
          </a>

          <a href="https://mstdn.social/@martinrue" rel="me" aria-label="Mastodon">
            <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22" stroke-width="0" stroke-linecap="round" stroke-linejoin="round">
              <path
                class="masto"
                d="M3.018,12.008 C2.986,10.748 3.006,9.56 3.006,8.566 C3.006,4.228 5.849,2.956 5.849,2.956 C7.282,2.298 9.741,2.021 12.299,2 L12.361,2 C14.918,2.02 17.379,2.298 18.812,2.956 C18.812,2.956 21.655,4.228 21.655,8.566 C21.655,8.566 21.691,11.767 21.259,13.99 C20.984,15.4 18.802,16.945 16.296,17.244 C14.99,17.4 13.703,17.544 12.331,17.48 C10.088,17.377 8.317,16.945 8.317,16.945 C8.317,17.163 8.331,17.371 8.357,17.565 C8.441,18.198 8.656,18.66 8.962,19 C9.728,19.85 11.068,19.93 12.357,19.974 C14.177,20.037 15.797,19.525 15.797,19.525 L15.873,21.171 C15.873,21.171 14.599,21.855 12.331,21.981 C11.081,22.049 9.528,21.949 7.719,21.471 C6.187,21.065 5.151,20.181 4.449,19 C3.356,17.157 3.081,14.594 3.018,12.008 Z M6.318,16.945 L6.318,14.397 L8.792,15.002 C9.22358374,15.0976669 9.6581434,15.1793761 10.095,15.247 C10.848,15.363 11.633,15.447 12.423,15.482 C13.442,15.529 14.324,15.465 16.059,15.258 C17.722,15.059 19.207,14.062 19.295,13.608 C19.377,13.186 19.446,12.686 19.501,12.126 C19.5717075,11.3794052 19.6173998,10.6306525 19.638,9.881 C19.653,9.371 19.658,8.936 19.655,8.625 L19.655,8.566 C19.655,7.136 19.286,6.128 18.692,5.408 C18.5226287,5.20011999 18.3262218,5.01582031 18.108,4.86 C18.018,4.796 17.973,4.771 17.978,4.773 C16.965,4.308 14.885,4.021 12.361,4 L12.315,4 C9.775,4.02 7.695,4.308 6.665,4.782 C6.688,4.772 6.644,4.796 6.553,4.86 C6.33477821,5.01582031 6.13837125,5.20011999 5.969,5.408 C5.375,6.128 5.006,7.137 5.006,8.566 C5.006,8.798 5.006,8.963 5.003,9.441 C4.99402715,10.2803538 4.99869443,11.1197979 5.017,11.959 C5.071,14.156 5.281,15.794 5.717,17 C5.929,17.587 6.189,18.07 6.497,18.45 C6.37026932,17.9585833 6.30973424,17.4524428 6.317,16.945 L6.318,16.945 Z M8.084,6.37 C8.71553761,6.37 9.2275,6.88196239 9.2275,7.5135 C9.2275,8.14503761 8.71553761,8.657 8.084,8.657 C7.45246239,8.657 6.9405,8.14503761 6.9405,7.5135 C6.9405,6.88196239 7.45246239,6.37 8.084,6.37 Z"
              ></path>
            </svg>
          </a>

          <a href="https://github.com/martinrue" aria-label="GitHub">
            <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="#333" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
              <path
                d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"
              ></path>
            </svg>
          </a>

          <a href="#" class="dark-mode" aria-label="Dark mode">
            <svg
              xmlns="http://www.w3.org/2000/svg"
              width="22"
              height="22"
              viewBox="0 0 24 24"
              fill="none"
              stroke="#333"
              stroke-width="2"
              stroke-linecap="round"
              stroke-linejoin="round"
              class="feather feather-moon"
            >
              <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
            </svg>
          </a>
        </section>

        <!-- END:LINKS -->
      </header>

      <nav>
        <a href="/articles/">Articles</a>
        <a href="/projects/">Projects</a>
        <a href="/books/">Books</a>
        <a href="/now/">Now</a>
      </nav>

      <section class="profile">
        <img src="/assets/images/martin.jpg" alt="Martin Rue" />
      </section>

      <div class="info">
        <section>
          <div class="title">Hello</div>

          <div class="item">
            <div class="icon">🙋‍♂️</div>
            <div class="text">I'm Martin, nice to meet you.</div>
          </div>

          <div class="item">
            <div class="icon">🇻🇳</div>
            <div class="text">I'm from the UK and I now live in Vietnam.</div>
          </div>

          <div class="item">
            <div class="icon">👋</div>
            <div class="text">Say hello: <a href="#" id="email-link">hello@martinrue.com</a>.</div>
          </div>

          <div class="item">
            <div class="icon">💻</div>
            <div class="text">I learned to code when I was pretty <a href="/give-yourself-more-playtime/">young</a> and I like building <a href="/projects/">things</a>.</div>
          </div>

          <div class="item">
            <div class="icon">✍️</div>
            <div class="text">I enjoy <a href="/articles/">writing</a>, as well as the writing of <a href="/books/">others</a>.</div>
          </div>

          <div class="item">
            <div class="icon">🗣️</div>
            <div class="text">I speak a <a href="/zamenhofa-tago-18/">language</a> invented 140 years ago.</div>
          </div>

          <div class="item">
            <div class="icon">🙇‍♂️</div>
            <div class="text">
              My current language interests:

              <div class="flags">
                <img src="/assets/images/langs/epo.svg" title="Esperanto" />
                <img src="/assets/images/langs/vie.svg" title="Vietnamese" />
                <img src="/assets/images/langs/tha.svg" title="Thai" />
                <img src="/assets/images/langs/esp.svg" title="Spanish" />
                <img src="/assets/images/langs/deu.svg" title="German" />
              </div>
            </div>
          </div>
        </section>

        <section>
          <div class="title">What I'm working on</div>

          <div class="item">
            <div class="icon">🌏</div>
            <div class="text">In 2024 I quit my job and moved to Asia to work on my own dream projects.</div>
          </div>

          <div class="item">
            <div class="icon">👨🏻‍💻</div>
            <div class="text">I'm currently working on <a href="https://buildmode.club">Build Mode</a> and <a href="https://uselangbot.com">LangBot</a>.</div>
          </div>

          <div class="item">
            <div class="icon">🕝</div>
            <div class="text">Here's what I'm upto <a href="/now/">right now</a>.</div>
          </div>
        </section>
      </div>
    </div>

    <div class="toast">
      <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
        <path
          stroke-linecap="round"
          stroke-linejoin="round"
          d="M15.75 17.25v3.375c0 .621-.504 1.125-1.125 1.125h-9.75a1.125 1.125 0 0 1-1.125-1.125V7.875c0-.621.504-1.125 1.125-1.125H6.75a9.06 9.06 0 0 1 1.5.124m7.5 10.376h3.375c.621 0 1.125-.504 1.125-1.125V11.25c0-4.46-3.243-8.161-7.5-8.876a9.06 9.06 0 0 0-1.5-.124H9.375c-.621 0-1.125.504-1.125 1.125v3.5m7.5 10.375H9.375a1.125 1.125 0 0 1-1.125-1.125v-9.25m12 6.625v-1.875a3.375 3.375 0 0 0-3.375-3.375h-1.5a1.125 1.125 0 0 1-1.125-1.125v-1.5a3.375 3.375 0 0 0-3.375-3.375H9.75"
        />
      </svg>

      <div>Copied email address!</div>
    </div>

    <script>
      lib.$("#email-link").addEventListener("click", (e) => {
        e.preventDefault();
        e.stopPropagation();

        lib.copy("hello@martinrue.com");
        lib.$(".toast").classList.value = "toast show";

        setTimeout(() => {
          lib.$(".toast").classList.value = "toast hide";
        }, 1500);

        return false;
      });
    </script>
  </body>
</html>