bartvdbraak/hellob.art
1
0
Fork 0
mirror of https://github.com/bartvdbraak/hellob.art.git synced 2025-04-27 09:31:21 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #166 from bartvdbraak/feat/error-pages

Browse source 
Error pages and additional enhanced images
This commit is contained in:
Bart van der Braak 2023-11-21 04:06:23 +01:00 committed by GitHub
commit b03fb88477
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
19 changed files with 730 additions and 248 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
.gitignore vendored
View file

@ -8,4 +8,5 @@ node_modules
!.env.example
vite.config.js.timestamp-*
vite.config.ts.timestamp-*
.unlighthouse
.unlighthouse
.vercel

2
README.md
View file

@ -1,5 +1,5 @@
<div align="center">
<img src="https://github.com/bartvdbraak/hellob.art/assets/3996360/365337f4-0ad8-4107-bcb1-8a4843ceae94" alt="hellob.art" width="30%">
<a href="https://hellob.art/"><img src="https://github.com/bartvdbraak/hellob.art/assets/3996360/365337f4-0ad8-4107-bcb1-8a4843ceae94" alt="hellob.art" width="30%"></a>
<p><em>Personal website built with Svelte</em></p>
</div>

4
src/app.html
View file

@ -12,14 +12,14 @@
<meta name="msapplication-TileColor" content="#da532c" />
<meta name="theme-color" content="#ffffff" />
<title>hellob.art - home of bart van der braak</title>
<meta property="twitter:image" content="%sveltekit.assets%/og.png" />
<meta property="twitter:image" content="https://hellob.art/og.png" />
<meta property="twitter:card" content="summary_large_image" />
<meta property="twitter:title" content="hellob.art - home of bart van der braak" />
<meta
property="twitter:description"
content="Personal website of Bart van der Braak showcasing milestones, tools and ideas."
/>
<meta property="og:image" content="%sveltekit.assets%/og.png" />
<meta property="og:image" content="https://hellob.art/og.png" />
<meta property="og:title" content="hellob.art - home of bart van der braak" />
<meta
property="og:description"

143
src/lib/assets/timeline/bijlmerweide.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 25 KiB

66
src/lib/assets/timeline/diastase.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 23 KiB

94
src/lib/assets/timeline/linuxfoundation.svg Normal file
View file

@ -0,0 +1,94 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 26.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg:svg
version="1.1"
id="Layer_1"
x="0px"
y="0px"
viewBox="0 0 1000 1000"
xml:space="preserve"
sodipodi:docname="linuxfoundation.svg"
width="1000"
height="1000"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:svg="http://www.w3.org/2000/svg"><svg:defs
id="defs20" /><sodipodi:namedview
id="namedview20"
pagecolor="#505050"
bordercolor="#ffffff"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="1"
inkscape:deskcolor="#d1d1d1"
inkscape:export-bgcolor="#ffffffff" />&#10;<svg:style
type="text/css"
id="style1">&#10; .st0{fill:#003778;}&#10; .st1{fill:#003764;}&#10; .st2{fill:#0094FF;}&#10;</svg:style>&#10;<svg:g
id="g20"
transform="matrix(0.84026685,0,0,0.84026685,79.866575,361.81812)">&#10; <svg:g
id="g3">&#10; <svg:path
class="st0"
d="m 384.2,1.2 h 57.7 V 7.1 H 416.5 V 74 h -6.9 V 7.2 h -25.4 z"
id="path1" />&#10; <svg:path
class="st0"
d="m 448.7,1.2 h 6.9 v 31.6 h 43.2 V 1.2 h 6.9 V 74 h -6.9 V 38.8 H 455.6 V 74 h -6.9 z"
id="path2" />&#10; <svg:path
class="st0"
d="m 520.5,1.2 h 50.3 V 7.1 H 527.5 V 33.4 H 568 v 5.9 H 527.4 V 68 h 43.8 v 6 h -50.8 z"
id="path3" />&#10; </svg:g>&#10; <svg:g
id="g13">&#10; <svg:path
class="st0"
d="m 384.2,254.6 h 46.2 v 5.9 h -39.2 v 26.3 H 426 v 5.9 h -34.9 v 34.7 h -6.9 z"
id="path4" />&#10; <svg:path
class="st0"
d="m 469.4,253.1 c 22.8,0 34.2,17.9 34.2,37.9 0,20 -11.4,37.9 -34.2,37.9 -22.9,0 -34.4,-17.9 -34.4,-37.9 0,-20 11.4,-37.9 34.4,-37.9 z m 0,69.9 c 19.2,0 27.3,-16.1 27.3,-32 0,-15.9 -8.2,-32 -27.3,-32 -19.3,0 -27.4,16.1 -27.4,32 0,15.9 8.1,32 27.4,32 z"
id="path5" />&#10; <svg:path
class="st0"
d="m 513.7,254.6 h 6.9 v 45.1 c 0,16.8 7.8,23.3 21.3,23.3 13.6,0 21.4,-6.5 21.4,-23.3 v -45.1 h 6.9 v 46.6 c 0,15 -8.1,27.7 -28.3,27.7 -20.1,0 -28.2,-12.7 -28.2,-27.7 z"
id="path6" />&#10; <svg:path
class="st0"
d="m 584.2,254.6 h 7.7 l 42.4,61.6 h 0.2 v -61.6 h 6.9 v 72.8 h -7.7 l -42.4,-61.6 h -0.2 v 61.6 h -6.9 z"
id="path7" />&#10; <svg:path
class="st0"
d="m 656.1,254.6 h 25.2 c 22,0.5 33.4,12.3 33.4,36.4 0,24.1 -11.4,35.9 -33.4,36.4 h -25.2 z m 6.9,66.9 h 14.8 c 20.9,0 30,-8.7 30,-30.5 0,-21.8 -9.1,-30.5 -30,-30.5 H 663 Z"
id="path8" />&#10; <svg:path
class="st0"
d="m 747.2,254.6 h 7.7 l 28.5,72.8 H 776 l -8.9,-22.6 H 734 l -8.8,22.6 h -7.4 z m -11,44.3 h 28.6 l -14.1,-37.3 z"
id="path9" />&#10; <svg:path
class="st0"
d="M 775.3,254.6 H 833 v 5.9 h -25.4 v 66.9 h -6.9 v -66.9 h -25.4 z"
id="path10" />&#10; <svg:path
class="st0"
d="m 840.4,254.6 h 6.9 v 72.8 h -6.9 z"
id="path11" />&#10; <svg:path
class="st0"
d="m 893,253.1 c 22.8,0 34.2,17.9 34.2,37.9 0,20 -11.4,37.9 -34.2,37.9 -22.9,0 -34.4,-17.9 -34.4,-37.9 0,-20 11.4,-37.9 34.4,-37.9 z m 0,69.9 c 19.2,0 27.3,-16.1 27.3,-32 0,-15.9 -8.2,-32 -27.3,-32 -19.3,0 -27.4,16.1 -27.4,32 0,15.9 8.1,32 27.4,32 z"
id="path12" />&#10; <svg:path
class="st1"
d="m 937.9,254.6 h 7.7 l 42.4,61.6 h 0.2 v -61.6 h 6.9 v 72.8 h -7.7 L 945,265.8 h -0.2 v 61.6 h -6.9 z"
id="path13" />&#10; </svg:g>&#10; <svg:g
id="g18">&#10; <svg:path
class="st0"
d="m 384.2,95.7 h 40.1 v 96.8 h 57.6 v 33.4 h -97.8 z"
id="path14" />&#10; <svg:path
class="st0"
d="m 508.2,95.7 h 40.1 v 130.2 h -40.1 z"
id="path15" />&#10; <svg:path
class="st0"
d="m 578.2,95.7 h 41 l 37.9,69.7 h 0.4 V 95.7 h 37.9 v 130.2 h -39 l -39.9,-71.1 h -0.4 v 71.1 h -37.9 z"
id="path16" />&#10; <svg:path
class="st0"
d="m 843.7,175.6 c 0,36.3 -19.1,53.4 -59.3,53.4 -40.1,0 -59.5,-17.1 -59.5,-53.4 V 95.7 H 765 v 70.9 c 0,13.1 -0.2,29.9 19.5,29.9 19,0 19,-16.8 19,-29.9 V 95.7 h 40.1 v 79.9 z"
id="path17" />&#10; <svg:path
class="st0"
d="M 907.5,156.6 864.6,95.7 h 47.1 l 19.7,35.4 19.3,-35.4 h 44.5 l -41.7,61.3 46.5,68.9 h -48.3 l -22.2,-38.8 -23,38.8 h -46 z"
id="path18" />&#10; </svg:g>&#10; <svg:g
id="g19">&#10; <svg:polygon
class="st2"
points="0,327.4 196.5,327.4 196.5,261.9 65.6,261.9 65.6,131 0,131 "
id="polygon18" />&#10; <svg:polygon
class="st0"
points="327.3,327.4 327.3,0 0,0 0,98.2 65.5,98.2 65.5,65.8 261.9,65.8 261.9,261.9 229.2,261.9 229.2,327.4 "
id="polygon19" />&#10; </svg:g>&#10;</svg:g>&#10;<script /></svg:svg>
Side by side

After

Width:  |  Height:  |  Size: 4.5 KiB

1
src/lib/assets/timeline/microsoft.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23 23"><path fill="#f3f3f3" d="M0 0h23v23H0z"/><path fill="#f35325" d="M1 1h10v10H1z"/><path fill="#81bc06" d="M12 1h10v10H12z"/><path fill="#05a6f0" d="M1 12h10v10H1z"/><path fill="#ffba08" d="M12 12h10v10H12z"/><script xmlns=""/></svg>
Side by side

After

Width:  |  Height:  |  Size: 290 B

65
src/lib/assets/timeline/triple.svg Normal file
View file

@ -0,0 +1,65 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
viewBox="0 0 250 250"
aria-labelledby="triple-logo"
class="navbar__logo logo"
version="1.1"
id="svg3"
sodipodi:docname="triple.svg"
width="250"
height="250"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:dc="http://purl.org/dc/elements/1.1/">
<defs
id="defs3" />
<sodipodi:namedview
id="namedview3"
pagecolor="#505050"
bordercolor="#ffffff"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="1"
inkscape:deskcolor="#d1d1d1"
inkscape:export-bgcolor="#ffffffff" />
<title
id="triple-logo">Triple Logo</title>
<g
id="g3"
transform="matrix(0.84137882,0,0,0.84137882,27.26152,82.405441)">
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="m 73.7883,58.1616 4.0599,5.9824 c 0.2003,0.2931 0.5265,0.45 0.8548,0.45 0.2002,0 0.4005,-0.0557 0.578,-0.1775 0.4707,-0.318 0.5967,-0.958 0.2725,-1.4307 l -4.0823,-6.0155 -0.0488,0.0346 z M 103.215,37.3373 v 26.2245 c 0,0.5739 0.462,1.0322 1.032,1.0322 0.572,0 1.03,-0.4583 1.03,-1.0322 V 36.368 c 0,-0.1516 -0.032,-0.2957 -0.091,-0.4255 z M 231.031,62.5274 H 213.929 V 50.9909 h 12.69 c 0.57,0 1.031,-0.4583 1.031,-1.0322 0,-0.5636 -0.461,-1.0282 -1.031,-1.0282 h -12.69 V 37.394 h 17.102 c 0.568,0 1.03,-0.4583 1.03,-1.0322 0,-0.5678 -0.462,-1.0261 -1.03,-1.0261 h -18.135 c -0.569,0 -1.03,0.4583 -1.03,1.0261 v 27.1979 c 0,0.5698 0.461,1.0323 1.03,1.0323 h 18.135 c 0.568,0 1.03,-0.4625 1.03,-1.0323 0,-0.5677 -0.462,-1.0323 -1.03,-1.0323 z m -40.718,0.0021 H 175.308 V 36.3638 c 0,-0.5677 -0.463,-1.026 -1.034,-1.026 -0.57,0 -1.031,0.4583 -1.031,1.026 v 27.198 c 0,0.5698 0.461,1.0322 1.031,1.0322 h 16.039 c 0.572,0 1.032,-0.4624 1.032,-1.0322 0,-0.5678 -0.46,-1.0323 -1.032,-1.0323 z M 143.63,35.3378 h -12.753 c -0.571,0 -1.032,0.4624 -1.032,1.0302 v 27.1938 c 0,0.5739 0.461,1.0322 1.032,1.0322 0.568,0 1.031,-0.4583 1.031,-1.0322 V 53.0616 h 11.722 c 4.889,0 8.865,-3.9742 8.865,-8.8629 0,-4.8867 -3.976,-8.8609 -8.865,-8.8609 z m 0,15.6593 H 131.908 V 37.4002 h 11.722 c 3.753,0 6.8,3.0493 6.8,6.7985 0,3.7512 -3.047,6.7984 -6.8,6.7984 z"
fill="#0e0940"
class="logo__text"
id="path1" />
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="m 66.8258,63.0902 -2.2152,1.5679 h -10.43 v -2.3742 l 3.4209,-0.929 V 38.4904 L 54.1806,37.613 v -2.3742 h 15.4323 c 5.9354,0 9.0322,2.8903 9.0322,8.0516 0,5.6774 -6.9677,7.7419 -6.9677,7.7419 l 3.7366,5.9786 -3.9142,2.7708 -0.4317,0.3056 -4.2423,-8.2808 h -3.871 v 9.5484 l 3.871,0.929 z m 39.2162,-27.7534 -4.744,3.3572 v -0.183 l -4.0722,-0.7948 v -2.3794 h 7.2262 z M 67.2903,48.4517 H 63.1612 V 38.1291 h 3.6129 c 3.7492,0 6.1936,1.4121 6.1936,5.1613 0,3.7512 -1.9283,5.1613 -5.6774,5.1613 z m -55.742,-3.9536 v -9.1602 l 25.4091,-0.0011 v 9.1613 h -2.6013 l -1.2955,-6.1058 h -6.1729 v 22.9213 l 4.3045,0.9755 v 2.3639 h -6.7406 -7.1381 v -2.3639 l 4.2994,-0.9755 V 38.3923 h -6.2091 l -1.2748,6.1058 z"
fill="#0e0940"
class="logo__text"
id="path2" />
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M 18.7432,97.1164 2.35918,3.2738 108.944,32.9615 l 0.326,0.0909 -33.8476,23.9525 -3.9226,2.7768 -8.5925,6.082 z M 118.998,31.1283 2.11144,0.333934 C 0.949115,-0.0686463 0.127437,0.600257 0.288469,1.82245 L 17.1576,99.7383 c 0.1611,1.2227 1.1252,1.6577 2.1471,0.9637 l 55.4405,-37.487 1.7095,-1.1562 26.7623,-18.0954 2.062,-1.3957 13.979,-9.4513 c 1.022,-0.6896 0.902,-1.5835 -0.26,-1.9881 z"
fill="#ff4f68"
id="path3" />
</g>
<metadata
id="metadata3">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:title>Triple Logo</dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 4 KiB

10
src/lib/assets/timeline/urbandeal.svg Normal file
View file

@ -0,0 +1,10 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 23.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 500 500" style="enable-background:new 0 0 500 500;" xml:space="preserve">
<style type="text/css">
.st0{fill:#555555;}
</style>
<polygon class="st0" points="292.5,52.8 434.7,134.9 434.7,348.1 265,446.1 265,10.6 235,25 235,446.1 65.3,348.2 65.3,106.3
36.4,120.1 35.3,365.6 250,489.4 464.7,365.5 464.7,117.5 292.5,18.1 "/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 605 B

20
src/lib/assets/timeline/vu.svg Normal file
View file

@ -0,0 +1,20 @@
<?xml version="1.0" encoding="UTF-8"?>
<!-- Generator: Adobe Illustrator 25.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Laag_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 400 400" style="enable-background:new 0 0 400 400;" xml:space="preserve">
<style type="text/css">
.st0{fill:#FFFFFF;}
.st1{fill:#0080C9;}
</style>
<rect class="st0" width="400" height="400"/>
<circle class="st0" cx="200" cy="200" r="200"/>
<g>
<g>
<polygon points="70.2,252.8 31.5,148.3 54.7,148.3 84.7,229.2 113.8,148.3 129.4,148.3 91.9,252.8 "/>
<path d="M142,148.3h21.8v64.1c0,11.6,2,19.3,5.9,23c3.9,3.8,9,5.7,15.3,5.7c6.2,0,11.1-1.9,14.7-5.6c3.7-3.7,5.5-10.9,5.5-21.6 v-65.7h18.9v64.2c0,12.1-1.5,20.8-4.6,26c-3,5.3-7.4,9.4-13.2,12.4c-5.7,3-13,4.5-21.8,4.5c-8.7,0-16.1-1.4-22.3-4.2 c-6.2-2.8-11.1-7-14.8-12.5c-3.6-5.5-5.4-14.4-5.4-26.4V148.3z"/>
<path class="st1" d="M253.9,227.3v2.8l0.8-0.7c-0.2-0.8-0.4-1.5-0.5-2.3L253.9,227.3z"/>
<path class="st1" d="M267.9,196.5c0-0.5,0.4-0.9,0.8-0.9c0.5,0,0.8,0.5,0.8,0.9c0,0.5-0.3,0.8-0.8,0.8 C268.2,197.3,267.9,196.9,267.9,196.5"/>
<path class="st1" d="M319.4,221.9c-1.3-3.5-4.6-5.8-9.2-5.4c-2.5-4.8-6.6-2.5-7.7-1.1c1.3,1.1,2.3,1.6,3.8,1.8v1 c-2.9-0.1-3.8-1.3-5.8-3.3c-0.8,6.9,7.3,9.4,9.8,3.7c3.8-0.1,6.1,1.6,6.9,4c0.8,2.4,0,5.1-1.3,6.4c-2.3,2.8-6,2.8-9.3,1 c-2.1-1-4.3-3.2-6.2-5.3c-2.9-3.2-4.5-4.6-6.7-5.8c-1.2-0.6-2.4-0.9-3.6-1c-0.7-0.1-1.4-0.2-2.1-0.2c-0.7,0-1.3,0.1-1.8,0.2 c-4.9,0.5-9.9,3-15.9,3.5h-3.2c-2,1.7-3.8,3.3-5.3,4.7l-3.8,3.3c0,0,0,0,0,0.1c-1.6,1.5-2.6,2.3-2.6,2.3c0.5,3.6,0.6,5.3,0.6,8.5 c0,2.7-0.1,3.9-0.1,5.1c-0.1,1.1-0.4,2.1-0.7,3c-0.2,0.8-0.9,1.5-2.1,1.6c-1,0.2-3.5-1.6-4.3-0.5c-0.7,0.9,0.1,3.1,0.8,3.7h6.8 c0.8-1.7,1.2-2.8,1.6-3.8c0.6-0.8,1-2.1,1.5-2.9c0.5-0.8,0.9-2,1.2-2.8c0.1-0.8,0.5-1.6,0.6-2.2c0.5-1.3,1.1-2.4,1.6-3.1 c0.1-0.2,0.2-0.4,0.4-0.6c0.3,0.4,0.6,0.9,0.8,1.3c1.6,2.5,3,4.5,5.3,5.4c0.9,0.5,1.5,0.8,1.8,1.2c0.4,0.3,0.4,1.4,0.2,2.1 c0,0.9-0.4,1.7-1.3,2.1c-1.5,0.6-3.9-1.6-4.8-0.5c-0.8,0.9,0.1,2.6,0.9,3.8h6.2c1.5-2.4,2.1-5.8,2.1-8.5c0-2.9,0-3.6-1.7-4.3 c-0.6-0.4-1.2-1.7-1.6-3.2c0-0.2,0-0.5,0-0.8c3-1,6.3-2.7,9.8-5.4c0,0.5,0,1,0.1,1.4c0.6,3.9,1,7.5,4,10.4 c0.8,0.8,1.5,1.6,1.6,2.1c0,0.3-0.5,1.6-0.8,2.2c-0.7,1.5-2.2,2.8-3.3,2.9c-1.5,0.2-3.2-1.7-4.4-0.6c-1,1,0.4,3.2,1,3.8h6.3 c2.1-3.8,5-7,6-9.1c0.6-1.5,0.6-2.1-0.6-2.5c-2.1-1.2-1.8-3.7-1.3-6.6c0.2-0.5,0.4-1,0.7-1.4c1.6,4.4,3.6,8.5,8.4,9.7 c0.8,0.1,2,0.7,2.1,0.9c0,0.2,0,1.1-0.1,1.8c-0.2,1.4-1,3-2.1,3.8c-1.2,0.9-4-2.1-5-0.4c-0.7,1.4,0.5,3.2,1,3.7h6.1 c1.7-3.8,3.2-7.2,3.7-9.6c0.5-2.9,0.5-3.9-1.7-4.4c-1.2-0.1-2.1-0.6-2.4-2.2c-0.8-2.9-0.7-7.7-2.9-11.1c2.4,2.9,5.1,5,7.4,6.1 c5.3,2.9,10.8,1.8,13.5-2C320.1,227.2,320.1,223.9,319.4,221.9"/>
<path class="st1" d="M291.7,189.8c13.7-13,32.5-26.9,56.3-32.8C328,164.2,300.4,183,291.7,189.8 M252.5,183.1 c2.2-23.5,12.9-40.8,20.2-48.8C262.2,149.8,256.2,171.2,252.5,183.1 M262.6,186.3c-0.1-0.9-0.6-1.5-1.4-2c1.6-3.9,3.2-7,6.3-11.2 C264.6,178.9,263.2,183.8,262.6,186.3 M372.4,148.7c-4.7-0.6-15.5,0.6-24.7,2.6c5.8-2.9,7.4-3.3,9.5-4.6c0.6-0.3,0.9-1.2,0.9-2.4 c0-1.4-1.3-1.6-2.8-1.4c-1.5,0.1-4.7,1.3-8.7,2.6c-7.8,3.2-19.1,8.5-32.5,17.5c-11.8,8.1-19.6,15-28.2,23.6 c-2.2,2.3-4.8,5.1-7.5,8.3c-0.6-1-1-1.3-2-1c3-6.8,3.3-7.2,5-11.1c0.7-1.9,0.3-3.2-0.3-4c-0.9-1.6-2.2-0.5-3,0.1 c-1.3,1.5-1.6,1.8-4.4,5.3c3.5-11.5,5.3-12.5,8.5-19c0.4-0.8,0.4-2.2-0.1-3.2c-0.3-0.8-0.8-1.3-1.5-0.9c-1.3,0.6-1.6,1.3-4,4.1 c3.5-6.6,8.2-14.3,8.7-15.6c0.6-1.4,1.4-1.6-0.1-3.7c-1.2-1.7-2.2-0.5-3,0.3c-0.7,0.3-2.1,2-4.5,4.9c5.1-9.5,9.8-13.8,10.7-15.5 c1.1-1.8,1.3-2.3,0.3-4.4c-0.8-1.9-2.4-1-3.2,0c-3.6,3.4-3.3,2.6-9.3,9.6c3.1-8.2,8.5-14.4,10.5-17.7c0.8-1.3,0.9-1.7,0.1-4.9 c-0.5-1.4-1.6-1.9-2.8-1.7c-1.7,0.4-3.3,1.3-6.6,4c-6.6,5.9-15.3,14.4-22.5,29.8c-6.9,14.4-8.4,28-8.4,37.4 c0,14.5,3.8,27.1,7.3,35c0-0.3,0-0.5,0-0.8c-0.2-3.9,0.5-8.4,1.2-10.6c1.5-5.8,3.4-8.9,5-11.4l-2.8-3.8l3.7,1.1l-2.2-4.8 c0,0,2.8,0.3,4.9,3.2c1.3-1.2,4.1-2.3,6.7-0.2c1.7-0.1,2.8,0.2,3.7,0.7c2,1.1,1.7,3.2,1.6,3.7c-1-0.9-3.9-2.8-7-0.4l5.8,2 l-7.3,0.6v7.5l-8.7,7.7v3l5.9-5.2v2.7l-10.4,9.4v2.8l13.2-11.8v0l3.3-3c0,0,0,0,0,0c2-1.6,2.8-2.4,3.9-3c1.4-0.9,1.6,0.1,1.8,1.6 c0.3,1.3,1.8,2.5,5-0.3c9.2-8.3,18.9-12.8,29.2-17.7c-5.6,3.8-15.8,9.4-19.3,13.3c-1.5,1.7,0,6,2.4,4.1c4.4-2.9,10.2-3.3,13-3.2 c1.4,0,2.9-0.9,3.7-2.1c0.8-1,0.8-2.2-1-2.3c9.5-2.9,11.9-3.7,19.7-4.4c2.1-0.1,3.3-1.3,3.7-3c0.4-1.6-0.5-2.1-2.4-2.3 c-2.3-0.3-6.3,0.4-10.4,1c9.1-3.9,20.2-6,29-8.5c2.8-0.8,3.1-1.6,3.2-3.2c0.3-1.7-1.1-1.7-4.2-1.7c-6.3,0.3-15.8,0.9-30.2,5.1 c13.6-6.8,21.2-10,33.6-13.1c3.3-0.9,3.9-1.7,4.2-3.5c0.6-2-1-2-2.2-1.7c-1.7,0.1-5.9,0-14.3,2.5c8.2-3.6,17.2-7.7,23.7-9.8 c1.4-0.5,2.2-1.4,2.2-2.9c0-1.1-0.3-1.3-1.7-1.3c-2.8,0-7.3,0.9-12.7,2.5c11.1-4.7,14.4-6.3,21.8-7.6c2.4-0.6,2.9-1.4,3-2.9 C375.4,148.7,374,148.8,372.4,148.7"/>
</g>
</g>
<script xmlns=""/></svg>
Side by side

After

Width:  |  Height:  |  Size: 4.8 KiB

11
src/routes/+error.svelte Normal file
View file

@ -0,0 +1,11 @@
<script lang="ts">
import { page } from '$app/stores';
</script>
<svelte:head>
<title>hellob.art &mdash; {$page.error?.message.toLowerCase() || 'error'}</title>
</svelte:head>
<div class="h-screen flex justify-center items-center">
<h2 class="text-3xl font-bold mb-8">{$page.error?.message || 'An unknown error occurred.'}</h2>
</div>

34
src/routes/projects/+page.svelte
View file

@ -23,28 +23,28 @@
</p>
<div class="w-full text-token grid grid-cols-1 md:grid-cols-2 gap-4">
{#each projects as project}
{#if project.link}
<a href={project.link}>
{#each projects as { link, headerImage, headerSubTitle, title, description, logo, contributors, date }}
{#if link}
<a href={link}>
<ProjectCard
headerImage={project.headerImage}
headerSubTitle={project.headerSubTitle}
title={project.title}
description={project.description}
logo={project.logo}
contributors={project.contributors}
date={project.date}
{headerImage}
{headerSubTitle}
{title}
{description}
{logo}
{contributors}
{date}
/>
</a>
{:else}
<ProjectCard
headerImage={project.headerImage}
headerSubTitle={project.headerSubTitle}
title={project.title}
description={project.description}
logo={project.logo}
contributors={project.contributors}
date={project.date}
{headerImage}
{headerSubTitle}
{title}
{description}
{logo}
{contributors}
{date}
/>
{/if}
{/each}

4
src/routes/projects/projects-cards.ts
View file

@ -1,11 +1,11 @@
import keyweaveImage from '$lib/assets/projects/keyweave-terminal.jpg?enhanced';
import keyweaveLogo from '$lib/assets/projects/keyweave-logo.png';
import videowallImage from '$lib/assets/projects/videowall.jpg?enhanced';
import videowallLogo from '$lib/assets/projects/videowall-logo.png';
import ticketDashboardImage from '$lib/assets/projects/ticketdashboard.png?enhanced';
import ticketDashboardLogo from '$lib/assets/projects/triple-logo.png';
import zaantjeImage from '$lib/assets/projects/zaantje.png?enhanced';
import zaantjeLogo from '$lib/assets/projects/zaantje-logo.png';
import keyweaveImage from '$lib/assets/projects/keyweave-terminal.jpg?enhanced';
import keyweaveLogo from '$lib/assets/projects/keyweave-logo.png';
interface Contributor {
name: string;

4
src/routes/timeline/+page.svelte
View file

@ -27,8 +27,8 @@
<div
class="space-y-8 relative before:absolute before:inset-0 before:ml-5 before:-translate-x-px md:before:mx-auto md:before:translate-x-0 before:h-full before:w-0.5 before:bg-gradient-to-b before:from-transparent before:via-slate-300 before:to-transparent"
>
{#each timelineItems as item}
<TimelineItem title={item.title} description={item.description} date={item.date} />
{#each timelineItems as { title, logo, description, date }}
<TimelineItem {title} {logo} {description} {date} />
{/each}
</div>
</div>

18
src/routes/timeline/TimelineItem.svelte
View file

@ -1,21 +1,19 @@
<script lang="ts">
export let title: string;
export let description: string;
export let date: string;
import type { TimelineItem } from './timeline-items';
export let title: TimelineItem['title'];
export let logo: TimelineItem['logo'];
export let description: TimelineItem['description'];
export let date: TimelineItem['date'];
</script>
<div
class="relative flex items-center justify-between md:justify-normal md:odd:flex-row-reverse group is-active"
>
<div
class="flex items-center justify-center w-10 h-10 rounded-full border border-white bg-slate-300 group-[.is-active]:bg-emerald-500 text-slate-500 group-[.is-active]:text-emerald-50 shadow shrink-0 md:order-1 md:group-odd:-translate-x-1/2 md:group-even:translate-x-1/2"
class="flex items-center justify-center w-10 h-10 rounded-full border border-white bg-slate-300 gro up-[.is-active]:bg-emerald-500 text-slate-500 group-[.is-active]:text-emerald-50 shadow shrink-0 md:order-1 md:group-odd:-translate-x-1/2 md:group-even:translate-x-1/2 overflow-hidden"
>
<svg class="fill-current" xmlns="http://www.w3.org/2000/svg" width="12" height="10">
<path
fill-rule="nonzero"
d="M10.422 1.257 4.655 7.025 2.553 4.923A.916.916 0 0 0 1.257 6.22l2.75 2.75a.916.916 0 0 0 1.296 0l6.415-6.416a.916.916 0 0 0-1.296-1.296Z"
/>
</svg>
<img src={logo} alt="{title} logo" loading="lazy" />
</div>
<div

28
src/routes/timeline/timeline-items.ts
View file

@ -1,5 +1,14 @@
import linuxFoundationLogo from '$lib/assets/timeline/linuxfoundation.svg';
import microsoftLogo from '$lib/assets/timeline/microsoft.svg';
import tripleLogo from '$lib/assets/timeline/triple.svg';
import urbanDealLogo from '$lib/assets/timeline/urbandeal.svg';
import diastaseLogo from '$lib/assets/timeline/diastase.svg';
import vuLogo from '$lib/assets/timeline/vu.svg';
import bijlmerweideLogo from '$lib/assets/timeline/bijlmerweide.svg';
export interface TimelineItem {
title: string;
logo: string;
link?: string;
image?: string;
description: string;
@ -9,48 +18,51 @@ export interface TimelineItem {
const timelineItems: TimelineItem[] = [
{
title: 'The Linux Foundation',
logo: linuxFoundationLogo,
description: 'Certified Kubernetes Administrator',
date: '2022'
},
{
title: 'Microsoft Certified',
logo: microsoftLogo,
description: 'Administrator Associate (AZ-104)',
date: '2021'
},
{
title: 'Triple',
logo: tripleLogo,
description: 'DevOps Engineer',
date: '2021'
},
{
title: 'Urban Deal',
logo: urbanDealLogo,
description: 'Full Stack Developer',
date: '2019'
},
{
title: 'Diastase Netwerk',
logo: diastaseLogo,
description: 'Volunteer Web Administrator',
date: '2019'
},
{
title: 'Vrije Universiteit Amsterdam',
logo: vuLogo,
description: 'Master Information Sciences',
date: '2018'
},
{
title: 'Vrije Universiteit Amsterdam',
description: 'Bachelor Information Sciences',
date: '2014'
},
{
title: 'Kinderboerderij Bijlmerweide',
logo: bijlmerweideLogo,
description: 'Volunteer Web Administrator',
date: '2016'
},
{
title: 'Zaanlands Lyceum',
description: 'Pre-university education (VWO)',
date: '2008'
title: 'Vrije Universiteit Amsterdam',
logo: vuLogo,
description: 'Bachelor Information Sciences',
date: '2014'
}
];

4
src/routes/toolbox/+page.svelte
View file

@ -36,9 +36,9 @@
</div>
<ul class="columns-1 md:columns-2 lg:columns-3 gap-6 w-full mb-12">
{#each tools as { name, title, description, logo, toolUrl }}
{#each tools as { name, title, description, logo, toolUrl, enhanced }}
<li>
<ToolCard {name} {title} {description} {logo} {toolUrl} />
<ToolCard {name} {title} {description} {logo} {toolUrl} {enhanced} />
</li>
{/each}
</ul>

34
src/routes/toolbox/ToolCard.svelte
View file

@ -1,9 +1,12 @@
<script lang="ts">
export let name: string;
export let title: string;
export let description: string;
export let logo: string;
export let toolUrl: string;
import type { Tool } from './tools-cards';
export let name: Tool['name'];
export let title: Tool['title'];
export let description: Tool['description'];
export let logo: Tool['logo'];
export let toolUrl: Tool['toolUrl'];
export let enhanced: Tool['enhanced'];
</script>
<a
@ -14,12 +17,21 @@
>
<div class="flex flex-col gap-6">
<div class="flex gap-6">
<img
src={logo}
alt={name + ' logo'}
class="h-12 w-12 rounded-sm object-contain"
loading="lazy"
/>
{#if enhanced}
<enhanced:img
src={logo}
alt={name + ' logo'}
class="h-12 w-12 rounded-sm object-contain"
loading="lazy"
/>
{:else}
<img
src={logo}
alt={name + ' logo'}
class="h-12 w-12 rounded-sm object-contain"
loading="lazy"
/>
{/if}
<div class="grow">
<h4 class="mb-0">{name}</h4>
<p class="text-faded text-sm font-normal">{title}</p>

433
src/routes/toolbox/tools-cards.ts
View file

@ -1,101 +1,101 @@
import GitHubLogo from '$lib/assets/tools/github.svg';
import OverleafLogo from '$lib/assets/tools/overleaf.svg';
import ArgoCDLogo from '$lib/assets/tools/argocd.svg';
import Studio3TLogo from '$lib/assets/tools/studio3t.svg';
import WarpLogo from '$lib/assets/tools/warp.svg';
import K9sLogo from '$lib/assets/tools/k9s.png';
import FigmaLogo from '$lib/assets/tools/figma.svg';
import AzureCLILogo from '$lib/assets/tools/azure-cli.svg';
import KeystoreExplorer from '$lib/assets/tools/keystore-exporer.png';
import TogglTrackLogo from '$lib/assets/tools/toggl-track.svg';
import HelmLogo from '$lib/assets/tools/helm.svg';
import RoyalTSXLogo from '$lib/assets/tools/royal-tsx.png';
import PoetryLogo from '$lib/assets/tools/poetry.svg';
import MaccyLogo from '$lib/assets/tools/maccy.png';
import BalenaEtcherLogo from '$lib/assets/tools/balena-etcher.svg';
import SendGridLogo from '$lib/assets/tools/sendgrid.svg';
import InsomniaLogo from '$lib/assets/tools/insomnia.svg';
import BlenderLogo from '$lib/assets/tools/blender.svg';
import BitwardenLogo from '$lib/assets/tools/bitwarden.svg';
import AzureDataStudioLogo from '$lib/assets/tools/azure-data-studio.png';
import WiresharkLogo from '$lib/assets/tools/wireshark.png';
import RectangleLogo from '$lib/assets/tools/rectangle.png';
import PyCharmLogo from '$lib/assets/tools/pycharm.svg';
import DockerLogo from '$lib/assets/tools/docker.webp';
import CyberduckLogo from '$lib/assets/tools/cyberduck.png';
import MullvadVPNLogo from '$lib/assets/tools/mullvad-vpn.svg';
import JqLogo from '$lib/assets/tools/jq.svg';
import AkamaiLogo from '$lib/assets/tools/akamai.svg';
import CloudFlareLogo from '$lib/assets/tools/cloudflare.svg';
import VisualStudioCodeLogo from '$lib/assets/tools/visual-studio-code.svg';
import OpsGenieLogo from '$lib/assets/tools/opsgenie.svg';
import VimLogo from '$lib/assets/tools/vim.svg';
import NotionLogo from '$lib/assets/tools/notion.svg';
import NvmLogo from '$lib/assets/tools/nvm.svg';
import GIMPLogo from '$lib/assets/tools/gimp.svg';
import AzureStorageExplorerLogo from '$lib/assets/tools/azure-storage-explorer.svg';
import MeldLogo from '$lib/assets/tools/meld.svg';
import KarabinerElementsLogo from '$lib/assets/tools/karabiner-elements.png';
import KustomizeLogo from '$lib/assets/tools/kustomize.svg';
import InkScapeLogo from '$lib/assets/tools/inkscape.svg';
import OBSLogo from '$lib/assets/tools/obs.svg';
import WireGuardLogo from '$lib/assets/tools/wireguard.svg';
import SwitchHostsLogo from '$lib/assets/tools/switchhosts.svg';
import SlackLogo from '$lib/assets/tools/slack.svg';
import NmapLogo from '$lib/assets/tools/nmap.svg';
import DBeaverLogo from '$lib/assets/tools/dbeaver.svg';
import OpenTofuLogo from '$lib/assets/tools/opentofu.svg';
import GitLensLogo from '$lib/assets/tools/gitlens.png';
import gitHubLogo from '$lib/assets/tools/github.svg';
import overleafLogo from '$lib/assets/tools/overleaf.svg';
import argoCDLogo from '$lib/assets/tools/argocd.svg';
import studio3TLogo from '$lib/assets/tools/studio3t.svg';
import warpLogo from '$lib/assets/tools/warp.svg';
import k9sLogo from '$lib/assets/tools/k9s.png?enhanced';
import figmaLogo from '$lib/assets/tools/figma.svg';
import azureCLILogo from '$lib/assets/tools/azure-cli.svg';
import keystoreExplorer from '$lib/assets/tools/keystore-exporer.png?enhanced';
import togglTrackLogo from '$lib/assets/tools/toggl-track.svg';
import helmLogo from '$lib/assets/tools/helm.svg';
import royalTSXLogo from '$lib/assets/tools/royal-tsx.png?enhanced';
import poetryLogo from '$lib/assets/tools/poetry.svg';
import maccyLogo from '$lib/assets/tools/maccy.png?enhanced';
import balenaEtcherLogo from '$lib/assets/tools/balena-etcher.svg';
import sendGridLogo from '$lib/assets/tools/sendgrid.svg';
import insomniaLogo from '$lib/assets/tools/insomnia.svg';
import blenderLogo from '$lib/assets/tools/blender.svg';
import bitwardenLogo from '$lib/assets/tools/bitwarden.svg';
import azureDataStudioLogo from '$lib/assets/tools/azure-data-studio.png?enhanced';
import wiresharkLogo from '$lib/assets/tools/wireshark.png?enhanced';
import rectangleLogo from '$lib/assets/tools/rectangle.png?enhanced';
import pyCharmLogo from '$lib/assets/tools/pycharm.svg';
import dockerLogo from '$lib/assets/tools/docker.webp?enhanced';
import cyberduckLogo from '$lib/assets/tools/cyberduck.png?enhanced';
import mullvadVPNLogo from '$lib/assets/tools/mullvad-vpn.svg';
import jqLogo from '$lib/assets/tools/jq.svg';
import akamaiLogo from '$lib/assets/tools/akamai.svg';
import cloudFlareLogo from '$lib/assets/tools/cloudflare.svg';
import visualStudioCodeLogo from '$lib/assets/tools/visual-studio-code.svg';
import opsGenieLogo from '$lib/assets/tools/opsgenie.svg';
import vimLogo from '$lib/assets/tools/vim.svg';
import notionLogo from '$lib/assets/tools/notion.svg';
import nvmLogo from '$lib/assets/tools/nvm.svg';
import gIMPLogo from '$lib/assets/tools/gimp.svg';
import azureStorageExplorerLogo from '$lib/assets/tools/azure-storage-explorer.svg';
import meldLogo from '$lib/assets/tools/meld.svg';
import karabinerElementsLogo from '$lib/assets/tools/karabiner-elements.png?enhanced';
import kustomizeLogo from '$lib/assets/tools/kustomize.svg';
import inkScapeLogo from '$lib/assets/tools/inkscape.svg';
import oBSLogo from '$lib/assets/tools/obs.svg';
import wireGuardLogo from '$lib/assets/tools/wireguard.svg';
import switchHostsLogo from '$lib/assets/tools/switchhosts.svg';
import slackLogo from '$lib/assets/tools/slack.svg';
import nmapLogo from '$lib/assets/tools/nmap.svg';
import dBeaverLogo from '$lib/assets/tools/dbeaver.svg';
import openTofuLogo from '$lib/assets/tools/opentofu.svg';
import gitLensLogo from '$lib/assets/tools/gitlens.png?enhanced';
export {
GitHubLogo,
OverleafLogo,
ArgoCDLogo,
Studio3TLogo,
WarpLogo,
K9sLogo,
FigmaLogo,
AzureCLILogo,
KeystoreExplorer,
TogglTrackLogo,
HelmLogo,
RoyalTSXLogo,
PoetryLogo,
MaccyLogo,
BalenaEtcherLogo,
SendGridLogo,
InsomniaLogo,
BlenderLogo,
BitwardenLogo,
AzureDataStudioLogo,
RectangleLogo,
PyCharmLogo,
DockerLogo,
CyberduckLogo,
MullvadVPNLogo,
JqLogo,
AkamaiLogo,
CloudFlareLogo,
VisualStudioCodeLogo,
OpsGenieLogo,
VimLogo,
NotionLogo,
NvmLogo,
GIMPLogo,
AzureStorageExplorerLogo,
MeldLogo,
KarabinerElementsLogo,
KustomizeLogo,
InkScapeLogo,
OBSLogo,
WireGuardLogo,
SwitchHostsLogo,
WiresharkLogo,
SlackLogo,
NmapLogo,
DBeaverLogo,
OpenTofuLogo,
GitLensLogo
gitHubLogo,
overleafLogo,
argoCDLogo,
studio3TLogo,
warpLogo,
k9sLogo,
figmaLogo,
azureCLILogo,
keystoreExplorer,
togglTrackLogo,
helmLogo,
royalTSXLogo,
poetryLogo,
maccyLogo,
balenaEtcherLogo,
sendGridLogo,
insomniaLogo,
blenderLogo,
bitwardenLogo,
azureDataStudioLogo,
rectangleLogo,
pyCharmLogo,
dockerLogo,
cyberduckLogo,
mullvadVPNLogo,
jqLogo,
akamaiLogo,
cloudFlareLogo,
visualStudioCodeLogo,
opsGenieLogo,
vimLogo,
notionLogo,
nvmLogo,
gIMPLogo,
azureStorageExplorerLogo,
meldLogo,
karabinerElementsLogo,
kustomizeLogo,
inkScapeLogo,
oBSLogo,
wireGuardLogo,
switchHostsLogo,
wiresharkLogo,
slackLogo,
nmapLogo,
dBeaverLogo,
openTofuLogo,
gitLensLogo
};
export interface Tool {
@ -104,6 +104,7 @@ export interface Tool {
description: string;
logo: string;
toolUrl: string;
enhanced: boolean;
}
const tools: Tool[] = [
@ -112,383 +113,431 @@ const tools: Tool[] = [
title: 'A complete developer platform',
description:
'A platform for hosting and collaborating on code, providing version control, issue tracking, and code review.',
logo: GitHubLogo,
toolUrl: 'https://github.com'
logo: gitHubLogo,
toolUrl: 'https://github.com',
enhanced: false
},
{
name: 'Overleaf',
title: 'Online LaTeX Editor',
description:
'Overleaf provides a collaborative environment for writing and publishing LaTeX documents. I use it for crafting scientific papers, technical documents, and more.',
logo: OverleafLogo,
toolUrl: 'https://www.overleaf.com'
logo: overleafLogo,
toolUrl: 'https://www.overleaf.com',
enhanced: false
},
{
name: 'ArgoCD',
title: 'Declarative GitOps Continuous Delivery',
description:
'ArgoCD is vital for deploying applications in a declarative way, using Git as the source of truth. It helps me to manage and automate deployments across different environments.',
logo: ArgoCDLogo,
toolUrl: 'https://argoproj.github.io/cd/'
logo: argoCDLogo,
toolUrl: 'https://argoproj.github.io/cd/',
enhanced: false
},
{
name: 'Studio 3T',
title: 'MongoDB Development Tool',
description:
'Studio 3T simplifies working with MongoDB, providing useful features for managing databases, collections, and queries.',
logo: Studio3TLogo,
toolUrl: 'https://www.studio3t.com'
logo: studio3TLogo,
toolUrl: 'https://www.studio3t.com',
enhanced: false
},
{
name: 'Warp',
title: 'Fast and Secure VPN',
description:
'Warp is a modern, Rust-based terminal with AI built in so you and your team can build great software, faster.',
logo: WarpLogo,
toolUrl: 'https://warp.dev'
logo: warpLogo,
toolUrl: 'https://warp.dev',
enhanced: false
},
{
name: 'k9s',
title: 'Kubernetes Terminal',
description:
'k9s is a Kubernetes terminal that provides an easy interface to interact with clusters, aiding in managing and observing Kubernetes resources.',
logo: K9sLogo,
toolUrl: 'https://k9scli.io'
logo: k9sLogo,
toolUrl: 'https://k9scli.io',
enhanced: true
},
{
name: 'Figma',
title: 'Collaborative Design Tool',
description:
'Figma is a collaborative design tool that helps in creating, testing, and sharing user interfaces for applications and websites.',
logo: FigmaLogo,
toolUrl: 'https://www.figma.com'
logo: figmaLogo,
toolUrl: 'https://www.figma.com',
enhanced: false
},
{
name: 'Azure CLI',
title: 'Command-line Interface for Azure',
description:
'Azure CLI is a command-line interface for managing Azure resources, enabling quick administration of my Azure-hosted applications and services.',
logo: AzureCLILogo,
toolUrl: 'https://docs.microsoft.com/cli/azure'
logo: azureCLILogo,
toolUrl: 'https://docs.microsoft.com/cli/azure',
enhanced: false
},
{
name: 'KeyStore Explorer',
title: 'GUI-based Key & Certificate Management Tool',
description:
'KeyStore Explorer is a GUI-based tool to manage cryptographic keys and certificates, helping in development and testing phases.',
logo: KeystoreExplorer,
toolUrl: 'https://keystore-explorer.org'
logo: keystoreExplorer,
toolUrl: 'https://keystore-explorer.org',
enhanced: true
},
{
name: 'Toggl Track',
title: 'Time Tracking Tool',
description:
'Toggl Track is a time tracking tool that assists in managing my daily tasks and tracking productivity.',
logo: TogglTrackLogo,
toolUrl: 'https://www.toggl.com/track'
logo: togglTrackLogo,
toolUrl: 'https://www.toggl.com/track',
enhanced: false
},
{
name: 'Helm',
title: 'Kubernetes Package Manager',
description:
'Helm is a Kubernetes package manager that simplifies the deployment and management of applications on Kubernetes clusters.',
logo: HelmLogo,
toolUrl: 'https://helm.sh'
logo: helmLogo,
toolUrl: 'https://helm.sh',
enhanced: false
},
{
name: 'Royal TSX',
title: 'Connection Management Tool',
description:
'Royal TSX is a connection management tool that provides easy and secure access to remote systems.',
logo: RoyalTSXLogo,
toolUrl: 'https://www.royalapps.com/ts/mac/features'
logo: royalTSXLogo,
toolUrl: 'https://www.royalapps.com/ts/mac/features',
enhanced: true
},
{
name: 'Poetry',
title: 'Python Dependency Management Tool',
description:
'Poetry is a Python dependency management tool that simplifies package management and project environment setup.',
logo: PoetryLogo,
toolUrl: 'https://python-poetry.org'
logo: poetryLogo,
toolUrl: 'https://python-poetry.org',
enhanced: false
},
{
name: 'Maccy',
title: 'Clipboard Manager for macOS',
description:
'Maccy is a lightweight clipboard manager for macOS that improves productivity by keeping a history of the clipboard.',
logo: MaccyLogo,
toolUrl: 'https://maccy.app'
logo: maccyLogo,
toolUrl: 'https://maccy.app',
enhanced: true
},
{
name: 'Balena Etcher',
title: 'USB and SD Card Writing Tool',
description:
'Balena Etcher is a USB and SD card writing tool used to flash OS images onto memory cards or drives.',
logo: BalenaEtcherLogo,
toolUrl: 'https://www.balena.io/etcher'
logo: balenaEtcherLogo,
toolUrl: 'https://www.balena.io/etcher',
enhanced: false
},
{
name: 'SendGrid',
title: 'Email Delivery Service',
description:
'SendGrid is an email delivery service that facilitates the sending of transactional or marketing emails.',
logo: SendGridLogo,
toolUrl: 'https://sendgrid.com'
logo: sendGridLogo,
toolUrl: 'https://sendgrid.com',
enhanced: false
},
{
name: 'Insomnia',
title: 'REST Client',
description:
'Insomnia is a powerful REST client that aids in testing, debugging, and interacting with HTTP APIs.',
logo: InsomniaLogo,
toolUrl: 'https://insomnia.rest'
logo: insomniaLogo,
toolUrl: 'https://insomnia.rest',
enhanced: false
},
{
name: 'Blender',
title: '3D Modeling and Animation Software',
description:
'Blender is a 3D modeling and animation software used for creating and rendering 3D graphics and animations.',
logo: BlenderLogo,
toolUrl: 'https://www.blender.org'
logo: blenderLogo,
toolUrl: 'https://www.blender.org',
enhanced: false
},
{
name: 'Bitwarden',
title: 'Open-source Password Manager',
description:
'Bitwarden is an open-source password manager that securely stores and manages passwords across devices.',
logo: BitwardenLogo,
toolUrl: 'https://bitwarden.com'
logo: bitwardenLogo,
toolUrl: 'https://bitwarden.com',
enhanced: false
},
{
name: 'Azure Data Studio',
title: 'Cross-platform Database Tool',
description:
'Azure Data Studio is a cross-platform database tool that provides a modern editor experience for managing data across multiple sources.',
logo: AzureDataStudioLogo,
toolUrl: 'https://azure.microsoft.com/products/data-studio'
logo: azureDataStudioLogo,
toolUrl: 'https://azure.microsoft.com/products/data-studio',
enhanced: true
},
{
name: 'Wireshark',
title: 'Network Protocol Analyzer',
description:
'Wireshark is a network protocol analyzer that helps me inspect and troubleshoot network traffic, providing in-depth insights.',
logo: WiresharkLogo,
toolUrl: 'https://www.wireshark.org'
logo: wiresharkLogo,
toolUrl: 'https://www.wireshark.org',
enhanced: true
},
{
name: 'Rectangle',
title: 'Window Management Tool for macOS',
description:
'Rectangle is a window management tool for macOS that provides keyboard shortcuts for resizing and organizing windows efficiently.',
logo: RectangleLogo,
toolUrl: 'https://rectangleapp.com/'
logo: rectangleLogo,
toolUrl: 'https://rectangleapp.com/',
enhanced: true
},
{
name: 'PyCharm',
title: 'Integrated Development Environment for Python',
description:
'An Integrated Development Environment (IDE) for Python, providing intelligent code assistance and debugging tools.',
logo: PyCharmLogo,
toolUrl: 'https://www.jetbrains.com/pycharm/'
logo: pyCharmLogo,
toolUrl: 'https://www.jetbrains.com/pycharm/',
enhanced: false
},
{
name: 'Docker',
title: 'Containerization Platform',
description:
'A platform that enables the development, shipment, and running of applications inside containers, ensuring consistency across environments.',
logo: DockerLogo,
toolUrl: 'https://www.docker.com'
logo: dockerLogo,
toolUrl: 'https://www.docker.com',
enhanced: true
},
{
name: 'Cyberduck',
title: 'Server and Cloud Storage Browser',
description:
'A libre server and cloud storage browser for Mac and Windows, supporting various protocols and cloud providers.',
logo: CyberduckLogo,
toolUrl: 'https://cyberduck.io'
logo: cyberduckLogo,
toolUrl: 'https://cyberduck.io',
enhanced: true
},
{
name: 'Mullvad VPN',
title: 'VPN Service',
description:
'A VPN service that prioritizes privacy and anonymity, keeping my online activities secure and private.',
logo: MullvadVPNLogo,
toolUrl: 'https://mullvad.net'
logo: mullvadVPNLogo,
toolUrl: 'https://mullvad.net',
enhanced: false
},
{
name: 'jq',
title: 'Command-line JSON Processor',
description:
'A lightweight and flexible command-line JSON processor, essential for parsing and manipulating JSON data in the shell.',
logo: JqLogo,
toolUrl: 'https://stedolan.github.io/jq/'
logo: jqLogo,
toolUrl: 'https://stedolan.github.io/jq/',
enhanced: false
},
{
name: 'Akamai',
title: 'Global Content Delivery Network',
description:
'A global content delivery network, cybersecurity, and cloud service company, providing web and internet security services.',
logo: AkamaiLogo,
toolUrl: 'https://www.akamai.com'
logo: akamaiLogo,
toolUrl: 'https://www.akamai.com',
enhanced: false
},
{
name: 'CloudFlare',
title: 'Content Delivery Network and Security Services',
description:
'A company that offers CDN services, DDoS mitigation, and distributed domain name server services to optimize and secure online content.',
logo: CloudFlareLogo,
toolUrl: 'https://www.cloudflare.com'
logo: cloudFlareLogo,
toolUrl: 'https://www.cloudflare.com',
enhanced: false
},
{
name: 'Visual Studio Code',
title: 'Code Editor',
description:
'A free, open-source code editor that offers powerful tools for code development, debugging, and extensions for various programming languages.',
logo: VisualStudioCodeLogo,
toolUrl: 'https://code.visualstudio.com'
logo: visualStudioCodeLogo,
toolUrl: 'https://code.visualstudio.com',
enhanced: false
},
{
name: 'OpsGenie',
title: 'Alert and On-Call Management Platform',
description:
'An alert and on-call management platform that ensures critical alerts are never missed, improving incident response times.',
logo: OpsGenieLogo,
toolUrl: 'https://www.atlassian.com/software/opsgenie'
logo: opsGenieLogo,
toolUrl: 'https://www.atlassian.com/software/opsgenie',
enhanced: false
},
{
name: 'vim',
title: 'Text Editor',
description:
'A highly configurable and efficient text editor that I use for editing code and text files from the command line.',
logo: VimLogo,
toolUrl: 'https://www.vim.org'
logo: vimLogo,
toolUrl: 'https://www.vim.org',
enhanced: false
},
{
name: 'Notion',
title: 'Collaboration Platform',
description:
'A collaboration platform that combines note-taking, task management, and workflow management.',
logo: NotionLogo,
toolUrl: 'https://www.notion.so'
logo: notionLogo,
toolUrl: 'https://www.notion.so',
enhanced: false
},
{
name: 'nvm',
title: 'Node.js Version Manager',
description:
'A Node.js version manager that simplifies the installation and management of multiple Node.js versions.',
logo: NvmLogo,
toolUrl: 'https://github.com/nvm-sh/nvm'
logo: nvmLogo,
toolUrl: 'https://github.com/nvm-sh/nvm',
enhanced: false
},
{
name: 'GIMP',
title: 'Open-source Graphics Editor',
description:
'An open-source raster graphics editor used for tasks such as photo retouching, image editing, and composition.',
logo: GIMPLogo,
toolUrl: 'https://www.gimp.org'
logo: gIMPLogo,
toolUrl: 'https://www.gimp.org',
enhanced: false
},
{
name: 'Azure Storage Explorer',
title: 'Azure Storage Management Application',
description: 'A standalone app that facilitates the management of Azure storage data.',
logo: AzureStorageExplorerLogo,
toolUrl: 'https://azure.microsoft.com/products/storage/storage-explorer'
logo: azureStorageExplorerLogo,
toolUrl: 'https://azure.microsoft.com/products/storage/storage-explorer',
enhanced: false
},
{
name: 'Meld',
title: 'Visual Diff and Merge Tool',
description:
'A visual diff and merge tool that provides clear comparisons between files and directories.',
logo: MeldLogo,
toolUrl: 'https://meldmerge.org'
logo: meldLogo,
toolUrl: 'https://meldmerge.org',
enhanced: false
},
{
name: 'Karabiner Elements',
title: 'Keyboard Customizer for macOS',
description:
'A powerful keyboard customizer for macOS, providing multiple customization options for the keyboard.',
logo: KarabinerElementsLogo,
toolUrl: 'https://karabiner-elements.pqrs.org'
logo: karabinerElementsLogo,
toolUrl: 'https://karabiner-elements.pqrs.org',
enhanced: true
},
{
name: 'Kustomize',
title: 'Kubernetes Configuration Customizer',
description:
'A template-free way to customize application configuration that simplifies the customization of Kubernetes YAML configuration files.',
logo: KustomizeLogo,
toolUrl: 'https://kustomize.io'
logo: kustomizeLogo,
toolUrl: 'https://kustomize.io',
enhanced: false
},
{
name: 'InkScape',
title: 'Open-source Vector Graphics Editor',
description:
'An open-source vector graphics editor, enabling the creation and editing of vector images.',
logo: InkScapeLogo,
toolUrl: 'https://inkscape.org'
logo: inkScapeLogo,
toolUrl: 'https://inkscape.org',
enhanced: false
},
{
name: 'OBS',
title: 'Open Broadcaster Software',
description:
'Open Broadcaster Software, a free and open-source tool for video recording and live streaming.',
logo: OBSLogo,
toolUrl: 'https://obsproject.com'
logo: oBSLogo,
toolUrl: 'https://obsproject.com',
enhanced: false
},
{
name: 'WireGuard',
title: 'Modern VPN Protocol',
description:
'A modern VPN protocol that aims for simplicity and speed, facilitating secure connections.',
logo: WireGuardLogo,
toolUrl: 'https://www.wireguard.com'
logo: wireGuardLogo,
toolUrl: 'https://www.wireguard.com',
enhanced: false
},
{
name: 'SwitchHosts',
title: 'Hosts File Manager',
description:
'An App for managing and switching hosts files, allowing me to easily switch between different environments.',
logo: SwitchHostsLogo,
toolUrl: 'https://switchhosts.vercel.app/'
logo: switchHostsLogo,
toolUrl: 'https://switchhosts.vercel.app/',
enhanced: false
},
{
name: 'Slack',
title: 'Collaboration Hub',
description:
'A collaboration hub that connects my work with the people I work with through channels, where communication and files are placed in one place.',
logo: SlackLogo,
toolUrl: 'https://slack.com'
logo: slackLogo,
toolUrl: 'https://slack.com',
enhanced: false
},
{
name: 'nmap',
title: 'Network Security Scanner',
description:
'A security scanner used to discover hosts and services on a computer network, providing a detailed view of the network.',
logo: NmapLogo,
toolUrl: 'https://nmap.org'
logo: nmapLogo,
toolUrl: 'https://nmap.org',
enhanced: false
},
{
name: 'DBeaver',
title: 'Universal Database Tool',
description:
'A universal database tool for developers and database administrators that supports all popular databases.',
logo: DBeaverLogo,
toolUrl: 'https://dbeaver.io'
logo: dBeaverLogo,
toolUrl: 'https://dbeaver.io',
enhanced: false
},
{
name: 'OpenTofu',
title: 'Infrastructure as Code Tool',
description:
'An open-source infrastructure as code tool that enables the automated creation, modification, and versioning of complex infrastructures.',
logo: OpenTofuLogo,
toolUrl: 'https://opentofu.org'
logo: openTofuLogo,
toolUrl: 'https://opentofu.org',
enhanced: false
},
{
name: 'GitLens',
title: 'Git Extension for Visual Studio Code',
description:
'An extension for Visual Studio Code that supercharges the Git capabilities, providing advanced blame annotations, code lens, and more.',
logo: GitLensLogo,
toolUrl: 'https://gitlens.amod.io'
logo: gitLensLogo,
toolUrl: 'https://gitlens.amod.io',
enhanced: true
}
];