mariuskimmina.com
+8
.gitignore
+8
.gitignore
+698
assets/css/extended.css
+698
assets/css/extended.css
···
1
+
/* Import Fonts */
2
+
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
3
+
4
+
/* Define Color Palette and Fonts */
5
+
:root {
6
+
--primary-color: #111827; /* Dark Gray/Black */
7
+
--secondary-color: #4b5563; /* Medium Gray */
8
+
--background-color: #ffffff; /* White background */
9
+
--accent-color: #e64980; /* Magenta */
10
+
--header-background: #ffffff;
11
+
--footer-background: #f9fafb;
12
+
13
+
--font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
14
+
}
15
+
16
+
/* Apply base styles */
17
+
body {
18
+
background-color: var(--background-color);
19
+
color: var(--primary-color);
20
+
font-family: var(--font-family);
21
+
line-height: 1.6;
22
+
margin: 0 !important;
23
+
padding: 0 !important;
24
+
max-width: 100% !important;
25
+
width: 100% !important;
26
+
overflow-x: hidden;
27
+
}
28
+
29
+
/* Constrain content width for standard PaperMod pages */
30
+
.main {
31
+
max-width: 100% !important;
32
+
margin: 0 auto;
33
+
padding: 0;
34
+
min-height: calc(100vh - 300px); /* Ensure footer stays down */
35
+
}
36
+
37
+
/* Specific content constraints for articles */
38
+
.post-single,
39
+
.post-content,
40
+
.list .post-entry,
41
+
.term-container {
42
+
max-width: 800px;
43
+
margin: 0 auto;
44
+
}
45
+
46
+
h1, h2, h3, h4, h5, h6 {
47
+
font-family: var(--font-family);
48
+
color: var(--primary-color);
49
+
font-weight: 800;
50
+
margin-top: 0;
51
+
}
52
+
53
+
a {
54
+
color: var(--accent-color);
55
+
text-decoration: none;
56
+
transition: color 0.2s;
57
+
}
58
+
59
+
a:hover {
60
+
color: var(--primary-color);
61
+
}
62
+
63
+
/* Header and Navigation Overrides */
64
+
.header {
65
+
background-color: var(--header-background);
66
+
border-bottom: 1px solid #f3f4f6;
67
+
padding: 1.5rem 0;
68
+
overflow: visible !important;
69
+
position: relative;
70
+
z-index: 100;
71
+
max-width: 100% !important;
72
+
width: 100% !important;
73
+
margin: 0 !important;
74
+
}
75
+
76
+
.nav {
77
+
display: flex !important;
78
+
justify-content: center !important; /* Center the only non-absolute child (the menu) */
79
+
align-items: center !important;
80
+
max-width: 1600px;
81
+
width: 95% !important;
82
+
margin: 0 auto !important;
83
+
padding: 0;
84
+
position: relative; /* Anchor for absolute children */
85
+
overflow: visible !important;
86
+
}
87
+
88
+
.logo {
89
+
position: absolute;
90
+
left: 0;
91
+
}
92
+
93
+
.logo a {
94
+
font-size: 2.25rem;
95
+
font-weight: 800;
96
+
text-decoration: none;
97
+
color: var(--primary-color);
98
+
letter-spacing: -0.05em;
99
+
display: block;
100
+
}
101
+
102
+
/* Menu Styles */
103
+
.menu {
104
+
display: flex !important;
105
+
list-style: none !important;
106
+
margin: 0 !important;
107
+
padding: 0 !important;
108
+
gap: 2rem;
109
+
background: transparent !important;
110
+
}
111
+
112
+
.menu li {
113
+
position: relative;
114
+
display: flex;
115
+
align-items: center;
116
+
}
117
+
118
+
.menu a {
119
+
text-decoration: none;
120
+
color: var(--secondary-color);
121
+
font-weight: 500;
122
+
transition: color 0.2s;
123
+
font-size: 1.1rem;
124
+
white-space: nowrap;
125
+
cursor: pointer;
126
+
}
127
+
128
+
.menu a:hover {
129
+
color: var(--accent-color);
130
+
}
131
+
132
+
.nav-cta {
133
+
position: absolute;
134
+
right: 0;
135
+
}
136
+
137
+
@media (max-width: 992px) {
138
+
.nav {
139
+
justify-content: space-between !important;
140
+
}
141
+
142
+
.logo, .nav-cta {
143
+
position: static;
144
+
}
145
+
146
+
.menu {
147
+
display: none !important; /* Mobile menu handles this */
148
+
}
149
+
}
150
+
151
+
/* Dropdown Styles */
152
+
.dropdown-menu {
153
+
display: none;
154
+
position: absolute;
155
+
top: 100%;
156
+
left: 50%;
157
+
transform: translateX(-50%);
158
+
background-color: white;
159
+
border: 1px solid #f3f4f6;
160
+
border-radius: 8px;
161
+
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
162
+
padding: 0.5rem 0;
163
+
min-width: 200px;
164
+
z-index: 1000;
165
+
margin-top: 0.5rem;
166
+
overflow: visible;
167
+
}
168
+
169
+
.dropdown-menu::after {
170
+
content: '';
171
+
position: absolute;
172
+
top: -1rem;
173
+
left: 0;
174
+
width: 100%;
175
+
height: 1rem;
176
+
background: transparent;
177
+
}
178
+
179
+
.dropdown-menu::before {
180
+
content: '';
181
+
position: absolute;
182
+
top: -6px;
183
+
left: 50%;
184
+
transform: translateX(-50%);
185
+
border-left: 6px solid transparent;
186
+
border-right: 6px solid transparent;
187
+
border-bottom: 6px solid white;
188
+
z-index: 1001;
189
+
}
190
+
191
+
.dropdown:hover .dropdown-menu {
192
+
display: block;
193
+
}
194
+
195
+
/* Dropdown Toggle Arrow */
196
+
.dropdown-toggle {
197
+
display: flex;
198
+
align-items: center;
199
+
gap: 8px;
200
+
}
201
+
202
+
.dropdown-toggle::after {
203
+
content: "";
204
+
border: solid currentColor;
205
+
border-width: 0 2px 2px 0;
206
+
display: inline-block;
207
+
padding: 2.5px;
208
+
transform: rotate(45deg);
209
+
margin-left: 2px;
210
+
margin-bottom: 2px;
211
+
transition: none;
212
+
}
213
+
214
+
.dropdown-menu li {
215
+
width: 100%;
216
+
position: relative;
217
+
z-index: 1002;
218
+
}
219
+
220
+
.dropdown-menu a {
221
+
display: flex;
222
+
align-items: center;
223
+
gap: 0.75rem;
224
+
padding: 0.75rem 1.5rem;
225
+
color: var(--secondary-color);
226
+
font-size: 0.95rem;
227
+
transition: background-color 0.2s, color 0.2s;
228
+
text-align: left;
229
+
width: 100%;
230
+
box-sizing: border-box;
231
+
}
232
+
233
+
.menu-icon {
234
+
display: flex;
235
+
align-items: center;
236
+
justify-content: center;
237
+
color: var(--secondary-color);
238
+
transition: color 0.2s;
239
+
}
240
+
241
+
.dropdown-menu a:hover .menu-icon {
242
+
color: var(--accent-color);
243
+
}
244
+
245
+
.dropdown-menu a:hover {
246
+
background-color: #f9fafb;
247
+
color: var(--accent-color);
248
+
}
249
+
250
+
/* CTA Button */
251
+
.nav-cta .button {
252
+
background-color: var(--primary-color);
253
+
color: white !important;
254
+
padding: 0.8rem 1.75rem;
255
+
border-radius: 9999px;
256
+
text-decoration: none;
257
+
font-weight: 600;
258
+
transition: transform 0.2s, background-color 0.2s;
259
+
display: inline-block;
260
+
white-space: nowrap;
261
+
line-height: 1.2;
262
+
}
263
+
264
+
.nav-cta .button:hover {
265
+
background-color: var(--accent-color);
266
+
transform: translateY(-1px);
267
+
}
268
+
269
+
/* Mobile Toggle */
270
+
.menu-toggle {
271
+
display: none;
272
+
background: none;
273
+
border: none;
274
+
cursor: pointer;
275
+
padding: 0.5rem;
276
+
flex-direction: column;
277
+
gap: 4px;
278
+
z-index: 200;
279
+
}
280
+
281
+
.menu-toggle span {
282
+
display: block;
283
+
width: 25px;
284
+
height: 3px;
285
+
background-color: var(--primary-color);
286
+
border-radius: 2px;
287
+
transition: all 0.3s;
288
+
}
289
+
290
+
/* --- New Intro Section --- */
291
+
.intro-section {
292
+
padding: 8rem 0;
293
+
background-color: var(--background-color);
294
+
text-align: center;
295
+
}
296
+
297
+
.intro-content {
298
+
max-width: 900px;
299
+
margin: 0 auto;
300
+
padding: 0 2rem;
301
+
}
302
+
303
+
.intro-subtitle {
304
+
font-size: 1.1rem;
305
+
text-transform: uppercase;
306
+
letter-spacing: 0.1em;
307
+
color: var(--accent-color);
308
+
margin-bottom: 1rem;
309
+
font-weight: 700;
310
+
}
311
+
312
+
.intro-title {
313
+
font-size: 5rem;
314
+
line-height: 1.1;
315
+
margin-bottom: 2rem;
316
+
color: var(--primary-color);
317
+
letter-spacing: -0.05em;
318
+
}
319
+
320
+
.intro-description {
321
+
font-size: 1.5rem;
322
+
color: var(--secondary-color);
323
+
line-height: 1.6;
324
+
margin-bottom: 3rem;
325
+
}
326
+
327
+
.intro-actions .button.primary {
328
+
background-color: var(--primary-color);
329
+
color: white;
330
+
padding: 1rem 2.5rem;
331
+
border-radius: 9999px;
332
+
font-weight: 600;
333
+
font-size: 1.1rem;
334
+
display: inline-block;
335
+
transition: transform 0.2s, background-color 0.2s;
336
+
}
337
+
338
+
.intro-actions .button.primary:hover {
339
+
background-color: var(--accent-color);
340
+
transform: translateY(-2px);
341
+
}
342
+
343
+
/* --- New About Preview Section --- */
344
+
.about-preview-section {
345
+
background-color: var(--footer-background); /* Use the light gray */
346
+
padding: 6rem 0;
347
+
}
348
+
349
+
.about-preview-container {
350
+
max-width: 1200px;
351
+
margin: 0 auto;
352
+
padding: 0 2rem;
353
+
}
354
+
355
+
.about-grid {
356
+
display: grid;
357
+
grid-template-columns: 1fr 1fr;
358
+
gap: 4rem;
359
+
align-items: center;
360
+
margin-bottom: 3rem;
361
+
}
362
+
363
+
.about-text h2 {
364
+
font-size: 2.5rem;
365
+
margin-bottom: 1.5rem;
366
+
}
367
+
368
+
.about-text p {
369
+
font-size: 1.15rem;
370
+
color: var(--secondary-color);
371
+
margin-bottom: 1.5rem;
372
+
line-height: 1.7;
373
+
}
374
+
375
+
.about-image img {
376
+
width: 100%;
377
+
max-width: 450px;
378
+
border-radius: 24px;
379
+
object-fit: cover;
380
+
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
381
+
}
382
+
383
+
.about-actions-row {
384
+
display: flex;
385
+
flex-direction: column;
386
+
align-items: center; /* Center the button and socials below everything */
387
+
gap: 2rem;
388
+
}
389
+
390
+
.button.outline {
391
+
background: transparent;
392
+
border: 2px solid var(--primary-color);
393
+
color: var(--primary-color);
394
+
padding: 0.8rem 2rem;
395
+
border-radius: 9999px;
396
+
font-weight: 600;
397
+
font-size: 1.1rem;
398
+
transition: all 0.2s;
399
+
display: inline-block;
400
+
}
401
+
402
+
.button.outline:hover {
403
+
background-color: var(--primary-color);
404
+
color: white;
405
+
}
406
+
407
+
.about-socials {
408
+
display: flex;
409
+
gap: 1.5rem;
410
+
}
411
+
412
+
.about-socials a {
413
+
color: var(--secondary-color);
414
+
transition: color 0.2s, transform 0.2s;
415
+
}
416
+
417
+
.about-socials a:hover {
418
+
color: var(--accent-color);
419
+
transform: translateY(-2px);
420
+
}
421
+
422
+
423
+
/* Latest Posts */
424
+
.latest-posts {
425
+
max-width: 1600px;
426
+
width: 95%;
427
+
margin: 0 auto;
428
+
padding: 8rem 0;
429
+
}
430
+
431
+
.section-header {
432
+
margin-bottom: 5rem;
433
+
}
434
+
435
+
.section-header h2 {
436
+
font-size: 3.5rem;
437
+
margin-bottom: 1.5rem;
438
+
letter-spacing: -0.025em;
439
+
}
440
+
441
+
.section-header p {
442
+
font-size: 1.4rem;
443
+
color: var(--secondary-color);
444
+
}
445
+
446
+
.posts-grid {
447
+
display: grid;
448
+
grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
449
+
gap: 4rem;
450
+
}
451
+
452
+
.post-entry {
453
+
background: #fff;
454
+
border: 1px solid #f3f4f6;
455
+
padding: 3rem;
456
+
border-radius: 32px;
457
+
transition: transform 0.3s, box-shadow 0.3s, border-color 0.3s;
458
+
}
459
+
460
+
.post-entry:hover {
461
+
transform: translateY(-8px);
462
+
box-shadow: 0 25px 30px -5px rgba(0, 0, 0, 0.05);
463
+
border-color: var(--accent-color);
464
+
}
465
+
466
+
.entry-header h3 {
467
+
font-size: 2rem;
468
+
margin-bottom: 1.25rem;
469
+
line-height: 1.2;
470
+
}
471
+
472
+
.entry-header h3 a {
473
+
color: var(--primary-color);
474
+
}
475
+
476
+
.entry-header h3 a:hover {
477
+
color: var(--accent-color);
478
+
}
479
+
480
+
.entry-meta {
481
+
font-size: 1rem;
482
+
color: var(--secondary-color);
483
+
margin-bottom: 2rem;
484
+
display: flex;
485
+
gap: 1.5rem;
486
+
font-weight: 500;
487
+
}
488
+
489
+
.entry-content p {
490
+
color: var(--secondary-color);
491
+
font-size: 1.15rem;
492
+
line-height: 1.6;
493
+
}
494
+
495
+
/* Footer */
496
+
.footer {
497
+
background-color: var(--footer-background);
498
+
padding: 8rem 0;
499
+
border-top: 1px solid #f3f4f6;
500
+
max-width: 100% !important;
501
+
width: 100% !important;
502
+
margin: 8rem 0 0 0 !important;
503
+
}
504
+
505
+
.footer-container {
506
+
max-width: 1600px; /* Full width content */
507
+
width: 95%;
508
+
margin: 0 auto;
509
+
padding: 0;
510
+
}
511
+
512
+
.footer-grid {
513
+
display: grid;
514
+
grid-template-columns: 2fr 1fr;
515
+
gap: 6rem;
516
+
margin-bottom: 6rem;
517
+
}
518
+
519
+
.footer-brand {
520
+
max-width: 500px;
521
+
}
522
+
523
+
.footer-name {
524
+
font-size: 2.25rem;
525
+
font-weight: 800;
526
+
color: var(--primary-color);
527
+
margin-bottom: 1.5rem;
528
+
letter-spacing: -0.05em;
529
+
}
530
+
531
+
.footer-brand p {
532
+
font-size: 1.2rem;
533
+
color: var(--secondary-color);
534
+
line-height: 1.6;
535
+
}
536
+
537
+
.footer-nav {
538
+
display: flex;
539
+
gap: 6rem;
540
+
}
541
+
542
+
.footer-column h3 {
543
+
font-size: 1.1rem;
544
+
text-transform: uppercase;
545
+
letter-spacing: 0.1em;
546
+
color: var(--primary-color);
547
+
margin-bottom: 2rem;
548
+
font-weight: 800;
549
+
}
550
+
551
+
.footer-column ul {
552
+
list-style: none;
553
+
padding: 0;
554
+
margin: 0;
555
+
}
556
+
557
+
.footer-column li {
558
+
margin-bottom: 1rem;
559
+
}
560
+
561
+
.footer-column a {
562
+
color: var(--secondary-color);
563
+
text-decoration: none;
564
+
transition: color 0.2s;
565
+
font-size: 1.1rem;
566
+
}
567
+
568
+
.footer-column a:hover {
569
+
color: var(--accent-color);
570
+
}
571
+
572
+
.footer-bottom {
573
+
display: flex;
574
+
justify-content: space-between;
575
+
align-items: center;
576
+
padding-top: 4rem;
577
+
border-top: 1px solid #f3f4f6;
578
+
}
579
+
580
+
.footer-copy {
581
+
color: var(--secondary-color);
582
+
font-size: 1.05rem;
583
+
}
584
+
585
+
.social-icons {
586
+
display: flex;
587
+
gap: 2rem;
588
+
}
589
+
590
+
.social-icons a {
591
+
color: var(--secondary-color);
592
+
transition: color 0.2s, transform 0.2s;
593
+
}
594
+
595
+
.social-icons a:hover {
596
+
color: var(--accent-color);
597
+
transform: translateY(-2px);
598
+
}
599
+
600
+
/* Mobile Responsiveness */
601
+
@media (max-width: 1200px) {
602
+
.intro-title { font-size: 4rem; }
603
+
.about-image img { width: 350px; height: 350px; }
604
+
}
605
+
606
+
@media (max-width: 992px) {
607
+
.menu-toggle {
608
+
display: flex;
609
+
}
610
+
611
+
.menu {
612
+
position: fixed;
613
+
top: 0;
614
+
right: -100%;
615
+
width: 100%;
616
+
height: 100vh;
617
+
background-color: white;
618
+
flex-direction: column;
619
+
justify-content: center;
620
+
transition: right 0.3s ease-in-out;
621
+
z-index: 150;
622
+
box-shadow: -5px 0 15px rgba(0,0,0,0.1);
623
+
padding: 2rem;
624
+
margin: 0 !important;
625
+
}
626
+
627
+
.menu.active {
628
+
right: 0;
629
+
}
630
+
631
+
.menu a {
632
+
font-size: 1.75rem;
633
+
}
634
+
635
+
.dropdown-menu {
636
+
position: static;
637
+
transform: none;
638
+
box-shadow: none;
639
+
border: none;
640
+
text-align: center;
641
+
display: none;
642
+
padding: 0;
643
+
background-color: #f9fafb;
644
+
}
645
+
646
+
.dropdown:hover .dropdown-menu {
647
+
display: block;
648
+
}
649
+
650
+
.about-grid { grid-template-columns: 1fr; text-align: center; gap: 3rem; }
651
+
.about-image { order: -1; }
652
+
.about-image img { max-width: 300px; margin: 0 auto; }
653
+
654
+
.nav-cta {
655
+
display: none; /* Hide on mobile or handle differently */
656
+
}
657
+
}
658
+
659
+
@media (max-width: 768px) {
660
+
.footer {
661
+
padding: 5rem 0;
662
+
}
663
+
664
+
.footer-grid {
665
+
grid-template-columns: 1fr;
666
+
gap: 4rem;
667
+
text-align: center;
668
+
}
669
+
670
+
.footer-brand {
671
+
max-width: none;
672
+
margin: 0 auto;
673
+
}
674
+
675
+
.footer-nav {
676
+
justify-content: center;
677
+
flex-direction: row;
678
+
gap: 4rem;
679
+
}
680
+
681
+
.footer-bottom {
682
+
flex-direction: column;
683
+
gap: 2.5rem;
684
+
text-align: center;
685
+
}
686
+
687
+
.intro-title {
688
+
font-size: 3rem;
689
+
}
690
+
691
+
.section-header h2 {
692
+
font-size: 2.5rem;
693
+
}
694
+
695
+
.posts-grid {
696
+
grid-template-columns: 1fr;
697
+
}
698
+
}
+15
-2
content/about.md
+15
-2
content/about.md
···
3
3
date: 2024-01-01
4
4
---
5
5
6
-
# About Me
6
+
## Hi, I'm Marius Kimmina.
7
+
8
+
I am a software engineer with a deep interest in backend systems, cloud infrastructure, and the human side of technology. I believe that building great software is as much about understanding people as it is about understanding code.
9
+
10
+
### What I do
11
+
12
+
Currently, I focus on:
13
+
- **Backend Architecture:** Designing scalable and resilient systems using Go, Rust, and Node.js.
14
+
- **Cloud Infrastructure:** Automating deployments and managing infrastructure as code with Terraform and Nix.
15
+
- **Knowledge Sharing:** Writing about my experiences and speaking at community events.
7
16
8
-
Software Engineer passionate about infrastructure, DevOps, and technology.
17
+
### My Philosophy
18
+
19
+
I strive for simplicity and clarity in everything I build. I'm a strong advocate for open source and believe in the power of community-driven development.
20
+
21
+
When I'm not at my desk, you might find me exploring local cafes, reading a good book, or contributing to various open-source projects.
+14
content/contact.md
+14
content/contact.md
···
1
+
---
2
+
title: "Contact"
3
+
date: 2026-01-04
4
+
---
5
+
6
+
I'm always open to discussing new projects, creative ideas, or opportunities to be part of your visions.
7
+
8
+
### Get in touch
9
+
10
+
- **Email:** [marius@example.com](mailto:marius@example.com)
11
+
- **LinkedIn:** [linkedin.com/in/marius-kimmina](https://linkedin.com/in/marius-kimmina)
12
+
- **GitHub:** [github.com/marius-k](https://github.com/marius-k)
13
+
14
+
Whether you have a question or just want to say hi, I'll try my best to get back to you!
+1
-1
content/posts/first-post.md
+1
-1
content/posts/first-post.md
+25
content/speaking.md
+25
content/speaking.md
···
1
+
---
2
+
title: "Speaking"
3
+
date: 2026-01-04
4
+
---
5
+
6
+
I love sharing my experiences with the community. Here are some of the topics I speak about and where I've been recently.
7
+
8
+
## Upcoming Events
9
+
10
+
- **GopherCon Europe 2026** - *Scaling Backend Services with Nix* (June 2026)
11
+
- **Local Tech Meetup** - *The Future of Infrastructure as Code* (February 2026)
12
+
13
+
## Past Talks
14
+
15
+
### 2025
16
+
- **EuroPython 2025** - *Nix for Python Developers: A Match Made in Heaven*
17
+
- **DevOpsDays Berlin** - *Automating Everything with Nix Flakes*
18
+
19
+
### 2024
20
+
- **RustFest** - *Safety and Performance in Backend Systems*
21
+
- **WebConf** - *Building Accessible Modern Web Apps*
22
+
23
+
---
24
+
25
+
Interested in having me speak at your event? [Get in touch](/contact).
+61
flake.lock
+61
flake.lock
···
1
+
{
2
+
"nodes": {
3
+
"flake-utils": {
4
+
"inputs": {
5
+
"systems": "systems"
6
+
},
7
+
"locked": {
8
+
"lastModified": 1731533236,
9
+
"narHash": "sha256-l0KFg5HjrsfsO/JpG+r7fRrqm12kzFHyUHqHCVpMMbI=",
10
+
"owner": "numtide",
11
+
"repo": "flake-utils",
12
+
"rev": "11707dc2f618dd54ca8739b309ec4fc024de578b",
13
+
"type": "github"
14
+
},
15
+
"original": {
16
+
"owner": "numtide",
17
+
"repo": "flake-utils",
18
+
"type": "github"
19
+
}
20
+
},
21
+
"nixpkgs": {
22
+
"locked": {
23
+
"lastModified": 1767379071,
24
+
"narHash": "sha256-EgE0pxsrW9jp9YFMkHL9JMXxcqi/OoumPJYwf+Okucw=",
25
+
"owner": "NixOS",
26
+
"repo": "nixpkgs",
27
+
"rev": "fb7944c166a3b630f177938e478f0378e64ce108",
28
+
"type": "github"
29
+
},
30
+
"original": {
31
+
"owner": "NixOS",
32
+
"ref": "nixos-unstable",
33
+
"repo": "nixpkgs",
34
+
"type": "github"
35
+
}
36
+
},
37
+
"root": {
38
+
"inputs": {
39
+
"flake-utils": "flake-utils",
40
+
"nixpkgs": "nixpkgs"
41
+
}
42
+
},
43
+
"systems": {
44
+
"locked": {
45
+
"lastModified": 1681028828,
46
+
"narHash": "sha256-Vy1rq5AaRuLzOxct8nz4T6wlgyUR7zLU309k9mBC768=",
47
+
"owner": "nix-systems",
48
+
"repo": "default",
49
+
"rev": "da67096a3b9bf56a91d16901293e51ba5b49a27e",
50
+
"type": "github"
51
+
},
52
+
"original": {
53
+
"owner": "nix-systems",
54
+
"repo": "default",
55
+
"type": "github"
56
+
}
57
+
}
58
+
},
59
+
"root": "root",
60
+
"version": 7
61
+
}
+2
-2
flake.nix
+2
-2
flake.nix
···
15
15
papermod-theme = pkgs.fetchFromGitHub {
16
16
owner = "adityatelange";
17
17
repo = "hugo-PaperMod";
18
-
rev = "v7.0";
19
-
sha256 = "sha256-PLACEHOLDER"; # We'll update this
18
+
rev = "master";
19
+
sha256 = "sha256-+OyrkV+9TELJOoz1qL63Ad95jobRQfv6RpoHKhemDfM=";
20
20
};
21
21
22
22
# Hugo site build
+82
-27
hugo.toml
+82
-27
hugo.toml
···
1
1
baseURL = 'https://yourdomain.com'
2
2
languageCode = 'en-us'
3
-
title = 'Your Blog Name'
3
+
title = 'Marius Kimmina'
4
4
theme = 'PaperMod'
5
5
6
6
# Enable emoji support
7
7
enableEmoji = true
8
8
9
-
# Pagination
10
-
paginate = 10
9
+
# Updated pagination syntax (Hugo v0.128.0+)
10
+
[pagination]
11
+
pagerSize = 10
11
12
12
13
[params]
13
14
# Theme settings
14
-
env = "production" # to enable google analytics, opengraph, twitter-cards and schema.
15
+
env = "production"
15
16
description = "Your blog description"
16
-
author = "Your Name"
17
-
18
-
# Home page settings
19
-
homeInfoParams.Title = "Hi there 👋"
20
-
homeInfoParams.Content = """
21
-
Welcome to my blog! I write about software engineering, infrastructure, and technology.
22
-
"""
23
-
24
-
# Social media links
25
-
[[params.socialIcons]]
26
-
name = "github"
27
-
url = "https://github.com/yourusername"
28
-
29
-
[[params.socialIcons]]
30
-
name = "linkedin"
31
-
url = "https://linkedin.com/in/yourusername"
17
+
author = "Marius Kimmina"
32
18
33
19
# Search
34
20
ShowSearchPage = true
···
49
35
50
36
[menu]
51
37
[[menu.main]]
52
-
identifier = "posts"
53
-
name = "Posts"
54
-
url = "/posts/"
38
+
identifier = "home"
39
+
name = "Home"
40
+
url = "/"
55
41
weight = 10
56
42
57
43
[[menu.main]]
···
61
47
weight = 20
62
48
63
49
[[menu.main]]
64
-
identifier = "search"
65
-
name = "Search"
66
-
url = "/search/"
50
+
identifier = "speaking"
51
+
name = "Speaking"
52
+
url = "/speaking/"
67
53
weight = 30
68
54
55
+
# Content Dropdown
56
+
[[menu.main]]
57
+
identifier = "content"
58
+
name = "Content"
59
+
weight = 40
60
+
[menu.main.params]
61
+
dropdown = true
62
+
63
+
[[menu.main]]
64
+
identifier = "blog"
65
+
name = "Blog"
66
+
url = "/posts/"
67
+
weight = 41
68
+
parent = "content"
69
+
[menu.main.params]
70
+
icon = "blog"
71
+
72
+
[[menu.main]]
73
+
identifier = "videos"
74
+
name = "Videos"
75
+
url = "https://youtube.com/@yourusername"
76
+
weight = 42
77
+
parent = "content"
78
+
[menu.main.params]
79
+
icon = "youtube"
80
+
81
+
[[menu.main]]
82
+
identifier = "notes"
83
+
name = "Notes"
84
+
url = "https://notes.mariuskimmina.com"
85
+
weight = 43
86
+
parent = "content"
87
+
[menu.main.params]
88
+
icon = "notes"
89
+
90
+
# Socials Dropdown
91
+
[[menu.main]]
92
+
identifier = "socials"
93
+
name = "Socials"
94
+
weight = 50
95
+
[menu.main.params]
96
+
dropdown = true
97
+
98
+
[[menu.main]]
99
+
identifier = "bluesky"
100
+
name = "BlueSky"
101
+
url = "https://bsky.app/"
102
+
weight = 51
103
+
parent = "socials"
104
+
[menu.main.params]
105
+
icon = "bluesky"
106
+
107
+
[[menu.main]]
108
+
identifier = "github"
109
+
name = "GitHub"
110
+
url = "https://github.com/yourusername"
111
+
weight = 52
112
+
parent = "socials"
113
+
[menu.main.params]
114
+
icon = "github"
115
+
116
+
[[menu.main]]
117
+
identifier = "linkedin"
118
+
name = "LinkedIn"
119
+
url = "https://linkedin.com/in/yourusername"
120
+
weight = 53
121
+
parent = "socials"
122
+
[menu.main.params]
123
+
icon = "linkedin"
124
+
69
125
# Markup settings
70
126
[markup]
71
127
[markup.highlight]
···
74
130
guessSyntax = true
75
131
lineNos = true
76
132
style = "github"
77
-
```
+72
layouts/index.html
+72
layouts/index.html
···
1
+
{{ define "main" }}
2
+
<section class="intro-section">
3
+
<div class="intro-content">
4
+
<h2 class="intro-subtitle">Senior Software Engineer</h2>
5
+
<h1 class="intro-title">Marius Kimmina</h1>
6
+
<p class="intro-description">Software engineer, speaker, and educator dedicated to building accessible and performant web applications. I help developers build better software, stronger careers, and a more inclusive tech industry.</p>
7
+
<div class="intro-actions">
8
+
<a href="/contact" class="button primary">Contact</a>
9
+
</div>
10
+
</div>
11
+
</section>
12
+
13
+
<section class="about-preview-section">
14
+
<div class="about-preview-container">
15
+
<div class="about-grid">
16
+
<div class="about-text">
17
+
<h2>About Me</h2>
18
+
<p>I am a software engineer with a deep interest in backend systems, cloud infrastructure, and the human side of technology. I believe that building great software is as much about understanding people as it is about understanding code.</p>
19
+
<p>When I'm not at my desk, you might find me exploring local cafes, reading a good book, or contributing to various open-source projects.</p>
20
+
</div>
21
+
<div class="about-image">
22
+
<img src="/images/profile.jpg" alt="Marius Kimmina">
23
+
</div>
24
+
</div>
25
+
<div class="about-actions-row">
26
+
<a href="/about" class="button outline">Learn more about me</a>
27
+
<div class="about-socials">
28
+
<a href="https://bsky.app/" aria-label="BlueSky" target="_blank" rel="noopener noreferrer">
29
+
<svg viewBox="0 0 512 512" width="24" height="24" fill="currentColor"><path d="M111.8 62.2C170.2 105.9 233 194.7 256 242.4c23-47.6 85.8-136.4 144.2-180.2c42.1-31.6 110.3-56 110.3 21.8c0 15.5-8.9 130.5-14.1 149.2C478.1 298 412 314.6 353.1 304.5c102.9 17.5 129.1 75.5 72.5 120.6c-121.9 97.4-147.2-74.9-161.2-148.5C261.3 259.3 259.6 258 256 258s-5.3 1.3-8.4 18.6c-14 73.6-39.3 245.9-161.2 148.5c-56.6-45.1-30.4-103.1 72.5-120.6C100 314.6 33.9 298 15.7 233.1C10.5 214.4 1.6 99.4 1.6 83.9c0-77.8 68.2-53.4 110.2-21.7z"/></svg>
30
+
</a>
31
+
<a href="https://github.com/yourusername" aria-label="GitHub" target="_blank" rel="noopener noreferrer">
32
+
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4"/><path d="M9 18c-4.51 2-5-2-7-2"/></svg>
33
+
</a>
34
+
<a href="https://linkedin.com/in/yourusername" aria-label="LinkedIn" target="_blank" rel="noopener noreferrer">
35
+
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"/><rect width="4" height="12" x="2" y="9"/><circle cx="4" cy="4" r="2"/></svg>
36
+
</a>
37
+
<a href="https://youtube.com/@yourusername" aria-label="YouTube" target="_blank" rel="noopener noreferrer">
38
+
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.42a2.78 2.78 0 0 0-1.94 2C1 8.11 1 12 1 12s0 3.89.46 5.58a2.78 2.78 0 0 0 1.94 2c1.72.42 8.6.42 8.6.42s6.88 0 8.6-.42a2.78 2.78 0 0 0 1.94-2C23 15.89 23 12 23 12s0-3.89-.46-5.58z"/><polygon points="9.75 15.02 15.5 12 9.75 8.98 9.75 15.02"/></svg>
39
+
</a>
40
+
</div>
41
+
</div>
42
+
</div>
43
+
</section>
44
+
45
+
<section class="latest-posts">
46
+
<div class="section-header">
47
+
<h2>Latest Content</h2>
48
+
<p>Explore my latest articles, notes, and projects.</p>
49
+
</div>
50
+
<div class="posts-grid">
51
+
{{ $pages := where .Site.RegularPages "Type" "in" .Site.Params.mainSections }}
52
+
{{ $paginator := .Paginate $pages }}
53
+
{{ range $paginator.Pages }}
54
+
<article class="post-entry">
55
+
<header class="entry-header">
56
+
<h3><a href="{{ .Permalink }}">{{ .Title }}</a></h3>
57
+
<div class="entry-meta">
58
+
<span class="date">{{ .Date.Format "January 2, 2006" }}</span>
59
+
<span class="reading-time">{{ .ReadingTime }} min read</span>
60
+
</div>
61
+
</header>
62
+
<div class="entry-content">
63
+
<p>{{ .Summary | plainify | truncate 150 }}</p>
64
+
</div>
65
+
</article>
66
+
{{ else }}
67
+
<p>No posts found yet. Stay tuned!</p>
68
+
{{ end }}
69
+
</div>
70
+
{{ .Render "pagination" }}
71
+
</section>
72
+
{{ end }}
+6
layouts/partials/extend_head.html
+6
layouts/partials/extend_head.html
···
1
+
{{- /* Custom CSS */ -}}
2
+
{{- $extended := resources.Get "css/extended.css" -}}
3
+
{{- if $extended -}}
4
+
{{- $extended = $extended | resources.Minify | resources.Fingerprint -}}
5
+
<link crossorigin="anonymous" href="{{ $extended.RelPermalink }}" integrity="{{ $extended.Data.Integrity }}" rel="preload stylesheet" as="style">
6
+
{{- end -}}
+54
layouts/partials/header.html
+54
layouts/partials/header.html
···
1
+
<header class="header">
2
+
<nav class="nav">
3
+
<div class="logo">
4
+
<a href="{{ .Site.BaseURL }}">{{ .Site.Title }}</a>
5
+
</div>
6
+
7
+
<!-- Mobile Toggle Button -->
8
+
<button class="menu-toggle" aria-label="Toggle Menu">
9
+
<span></span>
10
+
<span></span>
11
+
<span></span>
12
+
</button>
13
+
14
+
<ul class="menu">
15
+
{{ range .Site.Menus.main }}
16
+
{{ if .HasChildren }}
17
+
<li class="dropdown">
18
+
<a href="#" class="dropdown-toggle">{{ .Name }}</a>
19
+
<ul class="dropdown-menu">
20
+
{{ range .Children }}
21
+
<li>
22
+
<a href="{{ .URL }}">
23
+
<span class="menu-icon">
24
+
{{ if eq .Params.icon "bluesky" }}
25
+
<svg viewBox="0 0 512 512" width="16" height="16" fill="currentColor"><path d="M111.8 62.2C170.2 105.9 233 194.7 256 242.4c23-47.6 85.8-136.4 144.2-180.2c42.1-31.6 110.3-56 110.3 21.8c0 15.5-8.9 130.5-14.1 149.2C478.1 298 412 314.6 353.1 304.5c102.9 17.5 129.1 75.5 72.5 120.6c-121.9 97.4-147.2-74.9-161.2-148.5C261.3 259.3 259.6 258 256 258s-5.3 1.3-8.4 18.6c-14 73.6-39.3 245.9-161.2 148.5c-56.6-45.1-30.4-103.1 72.5-120.6C100 314.6 33.9 298 15.7 233.1C10.5 214.4 1.6 99.4 1.6 83.9c0-77.8 68.2-53.4 110.2-21.7z"/></svg>
26
+
{{ else if eq .Params.icon "github" }}
27
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4"/><path d="M9 18c-4.51 2-5-2-7-2"/></svg>
28
+
{{ else if eq .Params.icon "linkedin" }}
29
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"/><rect width="4" height="12" x="2" y="9"/><circle cx="4" cy="4" r="2"/></svg>
30
+
{{ else if eq .Params.icon "youtube" }}
31
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.42a2.78 2.78 0 0 0-1.94 2C1 8.11 1 12 1 12s0 3.89.46 5.58a2.78 2.78 0 0 0 1.94 2c1.72.42 8.6.42 8.6.42s6.88 0 8.6-.42a2.78 2.78 0 0 0 1.94-2C23 15.89 23 12 23 12s0-3.89-.46-5.58z"/><polygon points="9.75 15.02 15.5 12 9.75 8.98 9.75 15.02"/></svg>
32
+
{{ else if eq .Params.icon "blog" }}
33
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path></svg>
34
+
{{ else if eq .Params.icon "notes" }}
35
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15.5 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V8.5L15.5 3z"></path><path d="M15 3v6h6"></path><line x1="9" y1="13" x2="15" y2="13"></line><line x1="9" y1="17" x2="15" y2="17"></line></svg>
36
+
{{ end }}
37
+
</span>
38
+
{{ .Name }}
39
+
</a>
40
+
</li>
41
+
{{ end }}
42
+
</ul>
43
+
</li>
44
+
{{ else }}
45
+
<li><a href="{{ .URL }}">{{ .Name }}</a></li>
46
+
{{ end }}
47
+
{{ end }}
48
+
</ul>
49
+
50
+
<div class="nav-cta">
51
+
<a href="/contact" class="button">Contact</a>
52
+
</div>
53
+
</nav>
54
+
</header>
static/images/pick-3.jpg
static/images/pick-3.jpg
This is a binary file and will not be displayed.
static/images/profile.jpg
static/images/profile.jpg
This is a binary file and will not be displayed.
+1
themes/PaperMod
+1
themes/PaperMod
···
1
+
/nix/store/m8hw2gnalmph5sy25prs33xfn9v9vvw4-source