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
|
<section style="display: flow-root">
<h2>About</h2>
Hey! I'm Michał Sapka, and you've stumbled upon my personal website.
This marvel of modern engineering is modeled upon Web 1.0.
It's not dedicated to one thing, but rather it's about a few things that interest me.
Below you can find sections which I would describe as online books.
<a href="/brain-rot">Brain Rots</a> describe movies, books and games.
{{- $file := "me.png" }}
{{- $path := printf "content_images/%s" $file}}
{{- $img := resources.Get $path }}
{{- $img1x := $img.Resize "150x webp" }}
{{- $img2x := $img.Resize "300x webp" }}
<img
alt="Michal"
style="float: right;
max-width: 20%;
cursor: crosshair"
id="me-normal"
src="{{ $img1x.Permalink }}"
srcset="
{{ $img1x.Permalink }} 1x,
{{ $img2x.Permalink }} 2x
"
width="{{ $img1x.Width }}"
height="{{ $img1x.Height }}"
>
{{- $file := "me-grim.png" }}
{{- $path := printf "content_images/%s" $file}}
{{- $img := resources.Get $path }}
{{- $img1x := $img.Resize "150x webp" }}
{{- $img2x := $img.Resize "300x webp" }}
<img
alt="Grimacing michal"
style="float: right; max-width: 20%; display: none"
id="me-grim"
src="{{ $img1x.Permalink }}"
srcset="
{{ $img1x.Permalink }} 1x,
{{ $img2x.Permalink }} 2x
"
width="{{ $img1x.Width }}"
height="{{ $img1x.Height }}"
>
{{- $file := "me-pain.png" }}
{{- $path := printf "content_images/%s" $file}}
{{- $img := resources.Get $path }}
{{- $img1x := $img.Resize "150x webp" }}
{{- $img2x := $img.Resize "300x webp" }}
<img
alt="Michal full of pain"
style="float: right; max-width: 20%; display: none"
id="me-pain"
src="{{ $img1x.Permalink }}"
srcset="
{{ $img1x.Permalink }} 1x,
{{ $img2x.Permalink }} 2x
"
width="{{ $img1x.Width }}"
height="{{ $img1x.Height }}"
>
<a href="/bsd"/>BSD</a> and <a href="/emasc">Emacs</a> are quite self-explanatory.
I take special fondness of <a href="/star-trek">Star Trek</a> so it is a section of its own.
I also have a dedicated <a href="/blog">blog</a>, but this site is not a blog.
{{ partial "menu.html" (dict "menuID" "main-nav" "page" .) }}
<script>
const kofiLink = document.getElementById('ko-fi');
const meNormal = document.getElementById('me-normal');
const meGrim = document.getElementById('me-grim');
const mePain = document.getElementById('me-pain');
meNormal.addEventListener( 'click', function() {
meNormal.style.display="none";
mePain.style.display="inline";
setTimeout(() => {
meNormal.style.display="inline";
mePain.style.display="none";
}, 300);
})
kofiLink.addEventListener( 'mouseenter', function() {
meNormal.style.display="none";
meGrim.style.display="inline";
});
kofiLink.addEventListener( 'mouseleave', function() {
setTimeout(() => {
meNormal.style.display="inline";
meGrim.style.display="none";
}, 700);
});
{{- $file := "me.png" }}
{{- $path := printf "content_images/%s" $file}}
{{- $img := resources.Get $path }}
{{- $img1x := $img.Resize "150x webp" }}
{{- $img2x := $img.Resize "300x webp" }}
const lookFront = () => {
meNormal.src="{{ $img1x.Permalink }}";
meNormal.srcset="{{ $img1x.Permalink }}, {{ $img2x.Permalink }}";
setTimeout(lookLeft, 5000);
}
{{- $file := "me-right.png" }}
{{- $path := printf "content_images/%s" $file}}
{{- $img := resources.Get $path }}
{{- $img1x := $img.Resize "150x webp" }}
{{- $img2x := $img.Resize "300x webp" }}
const lookRight = () => {
meNormal.src="{{ $img1x.Permalink }}";
meNormal.srcset="{{ $img1x.Permalink }}, {{ $img2x.Permalink }}";
setTimeout(lookFront, 500);
}
{{- $file := "me-left.png" }}
{{- $path := printf "content_images/%s" $file}}
{{- $img := resources.Get $path }}
{{- $img1x := $img.Resize "150x webp" }}
{{- $img2x := $img.Resize "300x webp" }}
const lookLeft = () => {
meNormal.src="{{ $img1x.Permalink }}";
meNormal.srcset="{{ $img1x.Permalink }}, {{ $img2x.Permalink }}";
setTimeout(lookRight, 500);
}
lookFront();
</script>
</section>
|
