end

2025-10-12 00:46:59 +02:00 · 2025-10-12 00:46:59 +02:00 · bf9da8c39a
commit bf9da8c39a
parent 09646a4019
19 changed files with 686 additions and 56 deletions
--- a/package.json
+++ b/package.json
@ -14,6 +14,9 @@
    "format": "prettier --write src/"
  },
  "dependencies": {
+    "@tailwindcss/vite": "^4.1.14",
+    "date-fns": "^4.1.0",
+    "tailwindcss": "^4.1.14",
    "vue": "^3.5.22"
  },
  "devDependencies": {
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@ -8,6 +8,15 @@ importers:

  .:
    dependencies:
+      '@tailwindcss/vite':
+        specifier: ^4.1.14
+        version: 4.1.14(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1))
+      date-fns:
+        specifier: ^4.1.0
+        version: 4.1.0
+      tailwindcss:
+        specifier: ^4.1.14
+        version: 4.1.14
      vue:
        specifier: ^3.5.22
        version: 3.5.22
@ -17,16 +26,16 @@ importers:
        version: 9.37.0
      '@vitejs/plugin-vue':
        specifier: ^6.0.1
-        version: 6.0.1(vite@7.1.9)(vue@3.5.22)
+        version: 6.0.1(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1))(vue@3.5.22)
      '@vue/eslint-config-prettier':
        specifier: ^10.2.0
-        version: 10.2.0(eslint@9.37.0)(prettier@3.6.2)
+        version: 10.2.0(eslint@9.37.0(jiti@2.6.1))(prettier@3.6.2)
      eslint:
        specifier: ^9.33.0
-        version: 9.37.0
+        version: 9.37.0(jiti@2.6.1)
      eslint-plugin-vue:
        specifier: ~10.4.0
-        version: 10.4.0(eslint@9.37.0)(vue-eslint-parser@10.2.0(eslint@9.37.0))
+        version: 10.4.0(eslint@9.37.0(jiti@2.6.1))(vue-eslint-parser@10.2.0(eslint@9.37.0(jiti@2.6.1)))
      globals:
        specifier: ^16.3.0
        version: 16.4.0
@ -35,10 +44,10 @@ importers:
        version: 3.6.2
      vite:
        specifier: ^7.1.7
-        version: 7.1.9
+        version: 7.1.9(jiti@2.6.1)(lightningcss@1.30.1)
      vite-plugin-vue-devtools:
        specifier: ^8.0.2
-        version: 8.0.2(vite@7.1.9)(vue@3.5.22)
+        version: 8.0.2(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1))(vue@3.5.22)

 packages:

@ -392,6 +401,10 @@ packages:
    resolution: {integrity: sha512-bV0Tgo9K4hfPCek+aMAn81RppFKv2ySDQeMoSZuvTASywNTnVJCArCZE2FWqpvIatKu7VMRLWlR1EazvVhDyhQ==}
    engines: {node: '>=18.18'}

+  '@isaacs/fs-minipass@4.0.1':
+    resolution: {integrity: sha512-wgm9Ehl2jpeqP3zw/7mo3kRHFp5MEDhqAdwy1fTGkHAwnkGOVsgpvQhL8B5n1qlb01jV3n/bI0ZfZp5lWA1k4w==}
+    engines: {node: '>=18.0.0'}
+
  '@jridgewell/gen-mapping@0.3.13':
    resolution: {integrity: sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==}

@ -535,6 +548,96 @@ packages:
    resolution: {integrity: sha512-tlqY9xq5ukxTUZBmoOp+m61cqwQD5pHJtFY3Mn8CA8ps6yghLH/Hw8UPdqg4OLmFW3IFlcXnQNmo/dh8HzXYIQ==}
    engines: {node: '>=18'}

+  '@tailwindcss/node@4.1.14':
+    resolution: {integrity: sha512-hpz+8vFk3Ic2xssIA3e01R6jkmsAhvkQdXlEbRTk6S10xDAtiQiM3FyvZVGsucefq764euO/b8WUW9ysLdThHw==}
+
+  '@tailwindcss/oxide-android-arm64@4.1.14':
+    resolution: {integrity: sha512-a94ifZrGwMvbdeAxWoSuGcIl6/DOP5cdxagid7xJv6bwFp3oebp7y2ImYsnZBMTwjn5Ev5xESvS3FFYUGgPODQ==}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [android]
+
+  '@tailwindcss/oxide-darwin-arm64@4.1.14':
+    resolution: {integrity: sha512-HkFP/CqfSh09xCnrPJA7jud7hij5ahKyWomrC3oiO2U9i0UjP17o9pJbxUN0IJ471GTQQmzwhp0DEcpbp4MZTA==}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@tailwindcss/oxide-darwin-x64@4.1.14':
+    resolution: {integrity: sha512-eVNaWmCgdLf5iv6Qd3s7JI5SEFBFRtfm6W0mphJYXgvnDEAZ5sZzqmI06bK6xo0IErDHdTA5/t7d4eTfWbWOFw==}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@tailwindcss/oxide-freebsd-x64@4.1.14':
+    resolution: {integrity: sha512-QWLoRXNikEuqtNb0dhQN6wsSVVjX6dmUFzuuiL09ZeXju25dsei2uIPl71y2Ic6QbNBsB4scwBoFnlBfabHkEw==}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@tailwindcss/oxide-linux-arm-gnueabihf@4.1.14':
+    resolution: {integrity: sha512-VB4gjQni9+F0VCASU+L8zSIyjrLLsy03sjcR3bM0V2g4SNamo0FakZFKyUQ96ZVwGK4CaJsc9zd/obQy74o0Fw==}
+    engines: {node: '>= 10'}
+    cpu: [arm]
+    os: [linux]
+
+  '@tailwindcss/oxide-linux-arm64-gnu@4.1.14':
+    resolution: {integrity: sha512-qaEy0dIZ6d9vyLnmeg24yzA8XuEAD9WjpM5nIM1sUgQ/Zv7cVkharPDQcmm/t/TvXoKo/0knI3me3AGfdx6w1w==}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@tailwindcss/oxide-linux-arm64-musl@4.1.14':
+    resolution: {integrity: sha512-ISZjT44s59O8xKsPEIesiIydMG/sCXoMBCqsphDm/WcbnuWLxxb+GcvSIIA5NjUw6F8Tex7s5/LM2yDy8RqYBQ==}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@tailwindcss/oxide-linux-x64-gnu@4.1.14':
+    resolution: {integrity: sha512-02c6JhLPJj10L2caH4U0zF8Hji4dOeahmuMl23stk0MU1wfd1OraE7rOloidSF8W5JTHkFdVo/O7uRUJJnUAJg==}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [linux]
+
+  '@tailwindcss/oxide-linux-x64-musl@4.1.14':
+    resolution: {integrity: sha512-TNGeLiN1XS66kQhxHG/7wMeQDOoL0S33x9BgmydbrWAb9Qw0KYdd8o1ifx4HOGDWhVmJ+Ul+JQ7lyknQFilO3Q==}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [linux]
+
+  '@tailwindcss/oxide-wasm32-wasi@4.1.14':
+    resolution: {integrity: sha512-uZYAsaW/jS/IYkd6EWPJKW/NlPNSkWkBlaeVBi/WsFQNP05/bzkebUL8FH1pdsqx4f2fH/bWFcUABOM9nfiJkQ==}
+    engines: {node: '>=14.0.0'}
+    cpu: [wasm32]
+    bundledDependencies:
+      - '@napi-rs/wasm-runtime'
+      - '@emnapi/core'
+      - '@emnapi/runtime'
+      - '@tybys/wasm-util'
+      - '@emnapi/wasi-threads'
+      - tslib
+
+  '@tailwindcss/oxide-win32-arm64-msvc@4.1.14':
+    resolution: {integrity: sha512-Az0RnnkcvRqsuoLH2Z4n3JfAef0wElgzHD5Aky/e+0tBUxUhIeIqFBTMNQvmMRSP15fWwmvjBxZ3Q8RhsDnxAA==}
+    engines: {node: '>= 10'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@tailwindcss/oxide-win32-x64-msvc@4.1.14':
+    resolution: {integrity: sha512-ttblVGHgf68kEE4om1n/n44I0yGPkCPbLsqzjvybhpwa6mKKtgFfAzy6btc3HRmuW7nHe0OOrSeNP9sQmmH9XA==}
+    engines: {node: '>= 10'}
+    cpu: [x64]
+    os: [win32]
+
+  '@tailwindcss/oxide@4.1.14':
+    resolution: {integrity: sha512-23yx+VUbBwCg2x5XWdB8+1lkPajzLmALEfMb51zZUBYaYVPDQvBSD/WYDqiVyBIo2BZFa3yw1Rpy3G2Jp+K0dw==}
+    engines: {node: '>= 10'}
+
+  '@tailwindcss/vite@4.1.14':
+    resolution: {integrity: sha512-BoFUoU0XqgCUS1UXWhmDJroKKhNXeDzD7/XwabjkDIAbMnc4ULn5e2FuEuBbhZ6ENZoSYzKlzvZ44Yr6EUDUSA==}
+    peerDependencies:
+      vite: ^5.2.0 || ^6 || ^7
+
  '@types/estree@1.0.8':
    resolution: {integrity: sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==}

@ -670,6 +773,10 @@ packages:
    resolution: {integrity: sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==}
    engines: {node: '>=10'}

+  chownr@3.0.0:
+    resolution: {integrity: sha512-+IxzY9BZOQd/XuYPRmrvEVjF/nqj5kgT4kEq7VofrDoM1MxoRjEWkrCC3EtLi59TVawxTAn+orJwFQcrqEN1+g==}
+    engines: {node: '>=18'}
+
  color-convert@2.0.1:
    resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
    engines: {node: '>=7.0.0'}
@ -699,6 +806,9 @@ packages:
  csstype@3.1.3:
    resolution: {integrity: sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==}

+  date-fns@4.1.0:
+    resolution: {integrity: sha512-Ukq0owbQXxa/U3EGtsdVBkR1w7KOQ5gIBqdH2hkvknzZPYvBxb/aa6E8L7tmjFtkwZBu3UXBbjIgPo/Ez4xaNg==}
+
  debug@4.4.3:
    resolution: {integrity: sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==}
    engines: {node: '>=6.0'}
@ -723,9 +833,17 @@ packages:
    resolution: {integrity: sha512-N+MeXYoqr3pOgn8xfyRPREN7gHakLYjhsHhWGT3fWAiL4IkAt0iDw14QiiEm2bE30c5XX5q0FtAA3CK5f9/BUg==}
    engines: {node: '>=12'}

+  detect-libc@2.1.2:
+    resolution: {integrity: sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==}
+    engines: {node: '>=8'}
+
  electron-to-chromium@1.5.230:
    resolution: {integrity: sha512-A6A6Fd3+gMdaed9wX83CvHYJb4UuapPD5X5SLq72VZJzxHSY0/LUweGXRWmQlh2ln7KV7iw7jnwXK7dlPoOnHQ==}

+  enhanced-resolve@5.18.3:
+    resolution: {integrity: sha512-d4lC8xfavMeBjzGr2vECC3fsGXziXZQyJxD868h2M/mBI3PwAuODxAkLkq5HYuvrPYcUtiLzsTo8U3PgX3Ocww==}
+    engines: {node: '>=10.13.0'}
+
  entities@4.5.0:
    resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==}
    engines: {node: '>=0.12'}
@ -891,6 +1009,9 @@ packages:
    resolution: {integrity: sha512-ob/2LcVVaVGCYN+r14cnwnoDPUufjiYgSqRhiFD0Q1iI4Odora5RE8Iv1D24hAz5oMophRGkGz+yuvQmmUMnMw==}
    engines: {node: '>=18'}

+  graceful-fs@4.2.11:
+    resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==}
+
  has-flag@4.0.0:
    resolution: {integrity: sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==}
    engines: {node: '>=8'}
@ -955,6 +1076,10 @@ packages:
  isexe@2.0.0:
    resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==}

+  jiti@2.6.1:
+    resolution: {integrity: sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==}
+    hasBin: true
+
  js-tokens@4.0.0:
    resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==}

@ -991,6 +1116,70 @@ packages:
    resolution: {integrity: sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==}
    engines: {node: '>= 0.8.0'}

+  lightningcss-darwin-arm64@1.30.1:
+    resolution: {integrity: sha512-c8JK7hyE65X1MHMN+Viq9n11RRC7hgin3HhYKhrMyaXflk5GVplZ60IxyoVtzILeKr+xAJwg6zK6sjTBJ0FKYQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [darwin]
+
+  lightningcss-darwin-x64@1.30.1:
+    resolution: {integrity: sha512-k1EvjakfumAQoTfcXUcHQZhSpLlkAuEkdMBsI/ivWw9hL+7FtilQc0Cy3hrx0AAQrVtQAbMI7YjCgYgvn37PzA==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [darwin]
+
+  lightningcss-freebsd-x64@1.30.1:
+    resolution: {integrity: sha512-kmW6UGCGg2PcyUE59K5r0kWfKPAVy4SltVeut+umLCFoJ53RdCUWxcRDzO1eTaxf/7Q2H7LTquFHPL5R+Gjyig==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [freebsd]
+
+  lightningcss-linux-arm-gnueabihf@1.30.1:
+    resolution: {integrity: sha512-MjxUShl1v8pit+6D/zSPq9S9dQ2NPFSQwGvxBCYaBYLPlCWuPh9/t1MRS8iUaR8i+a6w7aps+B4N0S1TYP/R+Q==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm]
+    os: [linux]
+
+  lightningcss-linux-arm64-gnu@1.30.1:
+    resolution: {integrity: sha512-gB72maP8rmrKsnKYy8XUuXi/4OctJiuQjcuqWNlJQ6jZiWqtPvqFziskH3hnajfvKB27ynbVCucKSm2rkQp4Bw==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [linux]
+
+  lightningcss-linux-arm64-musl@1.30.1:
+    resolution: {integrity: sha512-jmUQVx4331m6LIX+0wUhBbmMX7TCfjF5FoOH6SD1CttzuYlGNVpA7QnrmLxrsub43ClTINfGSYyHe2HWeLl5CQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [linux]
+
+  lightningcss-linux-x64-gnu@1.30.1:
+    resolution: {integrity: sha512-piWx3z4wN8J8z3+O5kO74+yr6ze/dKmPnI7vLqfSqI8bccaTGY5xiSGVIJBDd5K5BHlvVLpUB3S2YCfelyJ1bw==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [linux]
+
+  lightningcss-linux-x64-musl@1.30.1:
+    resolution: {integrity: sha512-rRomAK7eIkL+tHY0YPxbc5Dra2gXlI63HL+v1Pdi1a3sC+tJTcFrHX+E86sulgAXeI7rSzDYhPSeHHjqFhqfeQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [linux]
+
+  lightningcss-win32-arm64-msvc@1.30.1:
+    resolution: {integrity: sha512-mSL4rqPi4iXq5YVqzSsJgMVFENoa4nGTT/GjO2c0Yl9OuQfPsIfncvLrEW6RbbB24WtZ3xP/2CCmI3tNkNV4oA==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [win32]
+
+  lightningcss-win32-x64-msvc@1.30.1:
+    resolution: {integrity: sha512-PVqXh48wh4T53F/1CCu8PIPCxLzWyCnn/9T5W1Jpmdy5h9Cwd+0YQS6/LwhHXSafuc61/xg9Lv5OrCby6a++jg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [win32]
+
+  lightningcss@1.30.1:
+    resolution: {integrity: sha512-xi6IyHML+c9+Q3W0S4fCQJOym42pyurFiJUHEcEyHS0CeKzia4yZDEsLlqOFykxOdHpNy0NmvVO31vcSqAxJCg==}
+    engines: {node: '>= 12.0.0'}
+
  locate-path@6.0.0:
    resolution: {integrity: sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==}
    engines: {node: '>=10'}
@ -1007,6 +1196,14 @@ packages:
  minimatch@3.1.2:
    resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==}

+  minipass@7.1.2:
+    resolution: {integrity: sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==}
+    engines: {node: '>=16 || 14 >=14.17'}
+
+  minizlib@3.1.0:
+    resolution: {integrity: sha512-KZxYo1BUkWD2TVFLr0MQoM8vUUigWD3LlD83a/75BqC+4qE0Hb1Vo5v1FgcfaNXvfXzr+5EhQ6ing/CaBijTlw==}
+    engines: {node: '>= 18'}
+
  mitt@3.0.1:
    resolution: {integrity: sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==}

@ -1190,6 +1387,17 @@ packages:
    resolution: {integrity: sha512-MeQTA1r0litLUf0Rp/iisCaL8761lKAZHaimlbGK4j0HysC4PLfqygQj9srcs0m2RdtDYnF8UuYyKpbjHYp7Jw==}
    engines: {node: ^14.18.0 || >=16.0.0}

+  tailwindcss@4.1.14:
+    resolution: {integrity: sha512-b7pCxjGO98LnxVkKjaZSDeNuljC4ueKUddjENJOADtubtdo8llTaJy7HwBMeLNSSo2N5QIAgklslK1+Ir8r6CA==}
+
+  tapable@2.3.0:
+    resolution: {integrity: sha512-g9ljZiwki/LfxmQADO3dEY1CbpmXT5Hm2fJ+QaGKwSXUylMybePR7/67YW7jOrrvjEgL1Fmz5kzyAjWVWLlucg==}
+    engines: {node: '>=6'}
+
+  tar@7.5.1:
+    resolution: {integrity: sha512-nlGpxf+hv0v7GkWBK2V9spgactGOp0qvfWRxUMjqHyzrt3SgwE48DIv/FhqPHJYLHpgW1opq3nERbz5Anq7n1g==}
+    engines: {node: '>=18'}
+
  tinyglobby@0.2.15:
    resolution: {integrity: sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ==}
    engines: {node: '>=12.0.0'}
@ -1327,6 +1535,10 @@ packages:
  yallist@3.1.1:
    resolution: {integrity: sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==}

+  yallist@5.0.0:
+    resolution: {integrity: sha512-YgvUTfwqyc7UXVMrB+SImsVYSmTS8X/tSrtdNZMImM+n7+QTriRXyXim0mBrTXNeqzVF0KWGgHPeiyViFFrNDw==}
+    engines: {node: '>=18'}
+
  yocto-queue@0.1.0:
    resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==}
    engines: {node: '>=10'}
@ -1606,9 +1818,9 @@ snapshots:
  '@esbuild/win32-x64@0.25.10':
    optional: true

-  '@eslint-community/eslint-utils@4.9.0(eslint@9.37.0)':
+  '@eslint-community/eslint-utils@4.9.0(eslint@9.37.0(jiti@2.6.1))':
    dependencies:
-      eslint: 9.37.0
+      eslint: 9.37.0(jiti@2.6.1)
      eslint-visitor-keys: 3.4.3

  '@eslint-community/regexpp@4.12.1': {}
@ -1663,6 +1875,10 @@ snapshots:

  '@humanwhocodes/retry@0.4.3': {}

+  '@isaacs/fs-minipass@4.0.1':
+    dependencies:
+      minipass: 7.1.2
+
  '@jridgewell/gen-mapping@0.3.13':
    dependencies:
      '@jridgewell/sourcemap-codec': 1.5.5
@ -1758,14 +1974,85 @@ snapshots:

  '@sindresorhus/merge-streams@4.0.0': {}

+  '@tailwindcss/node@4.1.14':
+    dependencies:
+      '@jridgewell/remapping': 2.3.5
+      enhanced-resolve: 5.18.3
+      jiti: 2.6.1
+      lightningcss: 1.30.1
+      magic-string: 0.30.19
+      source-map-js: 1.2.1
+      tailwindcss: 4.1.14
+
+  '@tailwindcss/oxide-android-arm64@4.1.14':
+    optional: true
+
+  '@tailwindcss/oxide-darwin-arm64@4.1.14':
+    optional: true
+
+  '@tailwindcss/oxide-darwin-x64@4.1.14':
+    optional: true
+
+  '@tailwindcss/oxide-freebsd-x64@4.1.14':
+    optional: true
+
+  '@tailwindcss/oxide-linux-arm-gnueabihf@4.1.14':
+    optional: true
+
+  '@tailwindcss/oxide-linux-arm64-gnu@4.1.14':
+    optional: true
+
+  '@tailwindcss/oxide-linux-arm64-musl@4.1.14':
+    optional: true
+
+  '@tailwindcss/oxide-linux-x64-gnu@4.1.14':
+    optional: true
+
+  '@tailwindcss/oxide-linux-x64-musl@4.1.14':
+    optional: true
+
+  '@tailwindcss/oxide-wasm32-wasi@4.1.14':
+    optional: true
+
+  '@tailwindcss/oxide-win32-arm64-msvc@4.1.14':
+    optional: true
+
+  '@tailwindcss/oxide-win32-x64-msvc@4.1.14':
+    optional: true
+
+  '@tailwindcss/oxide@4.1.14':
+    dependencies:
+      detect-libc: 2.1.2
+      tar: 7.5.1
+    optionalDependencies:
+      '@tailwindcss/oxide-android-arm64': 4.1.14
+      '@tailwindcss/oxide-darwin-arm64': 4.1.14
+      '@tailwindcss/oxide-darwin-x64': 4.1.14
+      '@tailwindcss/oxide-freebsd-x64': 4.1.14
+      '@tailwindcss/oxide-linux-arm-gnueabihf': 4.1.14
+      '@tailwindcss/oxide-linux-arm64-gnu': 4.1.14
+      '@tailwindcss/oxide-linux-arm64-musl': 4.1.14
+      '@tailwindcss/oxide-linux-x64-gnu': 4.1.14
+      '@tailwindcss/oxide-linux-x64-musl': 4.1.14
+      '@tailwindcss/oxide-wasm32-wasi': 4.1.14
+      '@tailwindcss/oxide-win32-arm64-msvc': 4.1.14
+      '@tailwindcss/oxide-win32-x64-msvc': 4.1.14
+
+  '@tailwindcss/vite@4.1.14(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1))':
+    dependencies:
+      '@tailwindcss/node': 4.1.14
+      '@tailwindcss/oxide': 4.1.14
+      tailwindcss: 4.1.14
+      vite: 7.1.9(jiti@2.6.1)(lightningcss@1.30.1)
+
  '@types/estree@1.0.8': {}

  '@types/json-schema@7.0.15': {}

-  '@vitejs/plugin-vue@6.0.1(vite@7.1.9)(vue@3.5.22)':
+  '@vitejs/plugin-vue@6.0.1(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1))(vue@3.5.22)':
    dependencies:
      '@rolldown/pluginutils': 1.0.0-beta.29
-      vite: 7.1.9
+      vite: 7.1.9(jiti@2.6.1)(lightningcss@1.30.1)
      vue: 3.5.22

  '@vue/babel-helper-vue-transform-on@1.5.0': {}
@ -1827,14 +2114,14 @@ snapshots:
      '@vue/compiler-dom': 3.5.22
      '@vue/shared': 3.5.22

-  '@vue/devtools-core@8.0.2(vite@7.1.9)(vue@3.5.22)':
+  '@vue/devtools-core@8.0.2(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1))(vue@3.5.22)':
    dependencies:
      '@vue/devtools-kit': 8.0.2
      '@vue/devtools-shared': 8.0.2
      mitt: 3.0.1
      nanoid: 5.1.6
      pathe: 2.0.3
-      vite-hot-client: 2.1.0(vite@7.1.9)
+      vite-hot-client: 2.1.0(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1))
      vue: 3.5.22
    transitivePeerDependencies:
      - vite
@ -1853,11 +2140,11 @@ snapshots:
    dependencies:
      rfdc: 1.4.1

-  '@vue/eslint-config-prettier@10.2.0(eslint@9.37.0)(prettier@3.6.2)':
+  '@vue/eslint-config-prettier@10.2.0(eslint@9.37.0(jiti@2.6.1))(prettier@3.6.2)':
    dependencies:
-      eslint: 9.37.0
-      eslint-config-prettier: 10.1.8(eslint@9.37.0)
-      eslint-plugin-prettier: 5.5.4(eslint-config-prettier@10.1.8(eslint@9.37.0))(eslint@9.37.0)(prettier@3.6.2)
+      eslint: 9.37.0(jiti@2.6.1)
+      eslint-config-prettier: 10.1.8(eslint@9.37.0(jiti@2.6.1))
+      eslint-plugin-prettier: 5.5.4(eslint-config-prettier@10.1.8(eslint@9.37.0(jiti@2.6.1)))(eslint@9.37.0(jiti@2.6.1))(prettier@3.6.2)
      prettier: 3.6.2
    transitivePeerDependencies:
      - '@types/eslint'
@ -1941,6 +2228,8 @@ snapshots:
      ansi-styles: 4.3.0
      supports-color: 7.2.0

+  chownr@3.0.0: {}
+
  color-convert@2.0.1:
    dependencies:
      color-name: 1.1.4
@ -1965,6 +2254,8 @@ snapshots:

  csstype@3.1.3: {}

+  date-fns@4.1.0: {}
+
  debug@4.4.3:
    dependencies:
      ms: 2.1.3
@ -1980,8 +2271,15 @@ snapshots:

  define-lazy-prop@3.0.0: {}

+  detect-libc@2.1.2: {}
+
  electron-to-chromium@1.5.230: {}

+  enhanced-resolve@5.18.3:
+    dependencies:
+      graceful-fs: 4.2.11
+      tapable: 2.3.0
+
  entities@4.5.0: {}

  error-stack-parser-es@1.0.5: {}
@ -2019,28 +2317,28 @@ snapshots:

  escape-string-regexp@4.0.0: {}

-  eslint-config-prettier@10.1.8(eslint@9.37.0):
+  eslint-config-prettier@10.1.8(eslint@9.37.0(jiti@2.6.1)):
    dependencies:
-      eslint: 9.37.0
+      eslint: 9.37.0(jiti@2.6.1)

-  eslint-plugin-prettier@5.5.4(eslint-config-prettier@10.1.8(eslint@9.37.0))(eslint@9.37.0)(prettier@3.6.2):
+  eslint-plugin-prettier@5.5.4(eslint-config-prettier@10.1.8(eslint@9.37.0(jiti@2.6.1)))(eslint@9.37.0(jiti@2.6.1))(prettier@3.6.2):
    dependencies:
-      eslint: 9.37.0
+      eslint: 9.37.0(jiti@2.6.1)
      prettier: 3.6.2
      prettier-linter-helpers: 1.0.0
      synckit: 0.11.11
    optionalDependencies:
-      eslint-config-prettier: 10.1.8(eslint@9.37.0)
+      eslint-config-prettier: 10.1.8(eslint@9.37.0(jiti@2.6.1))

-  eslint-plugin-vue@10.4.0(eslint@9.37.0)(vue-eslint-parser@10.2.0(eslint@9.37.0)):
+  eslint-plugin-vue@10.4.0(eslint@9.37.0(jiti@2.6.1))(vue-eslint-parser@10.2.0(eslint@9.37.0(jiti@2.6.1))):
    dependencies:
-      '@eslint-community/eslint-utils': 4.9.0(eslint@9.37.0)
-      eslint: 9.37.0
+      '@eslint-community/eslint-utils': 4.9.0(eslint@9.37.0(jiti@2.6.1))
+      eslint: 9.37.0(jiti@2.6.1)
      natural-compare: 1.4.0
      nth-check: 2.1.1
      postcss-selector-parser: 6.1.2
      semver: 7.7.2
-      vue-eslint-parser: 10.2.0(eslint@9.37.0)
+      vue-eslint-parser: 10.2.0(eslint@9.37.0(jiti@2.6.1))
      xml-name-validator: 4.0.0

  eslint-scope@8.4.0:
@ -2052,9 +2350,9 @@ snapshots:

  eslint-visitor-keys@4.2.1: {}

-  eslint@9.37.0:
+  eslint@9.37.0(jiti@2.6.1):
    dependencies:
-      '@eslint-community/eslint-utils': 4.9.0(eslint@9.37.0)
+      '@eslint-community/eslint-utils': 4.9.0(eslint@9.37.0(jiti@2.6.1))
      '@eslint-community/regexpp': 4.12.1
      '@eslint/config-array': 0.21.0
      '@eslint/config-helpers': 0.4.0
@ -2089,6 +2387,8 @@ snapshots:
      minimatch: 3.1.2
      natural-compare: 1.4.0
      optionator: 0.9.4
+    optionalDependencies:
+      jiti: 2.6.1
    transitivePeerDependencies:
      - supports-color

@ -2177,6 +2477,8 @@ snapshots:

  globals@16.4.0: {}

+  graceful-fs@4.2.11: {}
+
  has-flag@4.0.0: {}

  hookable@5.5.3: {}
@ -2218,6 +2520,8 @@ snapshots:

  isexe@2.0.0: {}

+  jiti@2.6.1: {}
+
  js-tokens@4.0.0: {}

  js-yaml@4.1.0:
@ -2245,6 +2549,51 @@ snapshots:
      prelude-ls: 1.2.1
      type-check: 0.4.0

+  lightningcss-darwin-arm64@1.30.1:
+    optional: true
+
+  lightningcss-darwin-x64@1.30.1:
+    optional: true
+
+  lightningcss-freebsd-x64@1.30.1:
+    optional: true
+
+  lightningcss-linux-arm-gnueabihf@1.30.1:
+    optional: true
+
+  lightningcss-linux-arm64-gnu@1.30.1:
+    optional: true
+
+  lightningcss-linux-arm64-musl@1.30.1:
+    optional: true
+
+  lightningcss-linux-x64-gnu@1.30.1:
+    optional: true
+
+  lightningcss-linux-x64-musl@1.30.1:
+    optional: true
+
+  lightningcss-win32-arm64-msvc@1.30.1:
+    optional: true
+
+  lightningcss-win32-x64-msvc@1.30.1:
+    optional: true
+
+  lightningcss@1.30.1:
+    dependencies:
+      detect-libc: 2.1.2
+    optionalDependencies:
+      lightningcss-darwin-arm64: 1.30.1
+      lightningcss-darwin-x64: 1.30.1
+      lightningcss-freebsd-x64: 1.30.1
+      lightningcss-linux-arm-gnueabihf: 1.30.1
+      lightningcss-linux-arm64-gnu: 1.30.1
+      lightningcss-linux-arm64-musl: 1.30.1
+      lightningcss-linux-x64-gnu: 1.30.1
+      lightningcss-linux-x64-musl: 1.30.1
+      lightningcss-win32-arm64-msvc: 1.30.1
+      lightningcss-win32-x64-msvc: 1.30.1
+
  locate-path@6.0.0:
    dependencies:
      p-locate: 5.0.0
@ -2263,6 +2612,12 @@ snapshots:
    dependencies:
      brace-expansion: 1.1.12

+  minipass@7.1.2: {}
+
+  minizlib@3.1.0:
+    dependencies:
+      minipass: 7.1.2
+
  mitt@3.0.1: {}

  mrmime@2.0.1: {}
@ -2429,6 +2784,18 @@ snapshots:
    dependencies:
      '@pkgr/core': 0.2.9

+  tailwindcss@4.1.14: {}
+
+  tapable@2.3.0: {}
+
+  tar@7.5.1:
+    dependencies:
+      '@isaacs/fs-minipass': 4.0.1
+      chownr: 3.0.0
+      minipass: 7.1.2
+      minizlib: 3.1.0
+      yallist: 5.0.0
+
  tinyglobby@0.2.15:
    dependencies:
      fdir: 6.5.0(picomatch@4.0.3)
@ -2459,17 +2826,17 @@ snapshots:

  util-deprecate@1.0.2: {}

-  vite-dev-rpc@1.1.0(vite@7.1.9):
+  vite-dev-rpc@1.1.0(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1)):
    dependencies:
      birpc: 2.6.1
-      vite: 7.1.9
-      vite-hot-client: 2.1.0(vite@7.1.9)
+      vite: 7.1.9(jiti@2.6.1)(lightningcss@1.30.1)
+      vite-hot-client: 2.1.0(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1))

-  vite-hot-client@2.1.0(vite@7.1.9):
+  vite-hot-client@2.1.0(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1)):
    dependencies:
-      vite: 7.1.9
+      vite: 7.1.9(jiti@2.6.1)(lightningcss@1.30.1)

-  vite-plugin-inspect@11.3.3(vite@7.1.9):
+  vite-plugin-inspect@11.3.3(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1)):
    dependencies:
      ansis: 4.2.0
      debug: 4.4.3
@ -2479,27 +2846,27 @@ snapshots:
      perfect-debounce: 2.0.0
      sirv: 3.0.2
      unplugin-utils: 0.3.0
-      vite: 7.1.9
-      vite-dev-rpc: 1.1.0(vite@7.1.9)
+      vite: 7.1.9(jiti@2.6.1)(lightningcss@1.30.1)
+      vite-dev-rpc: 1.1.0(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1))
    transitivePeerDependencies:
      - supports-color

-  vite-plugin-vue-devtools@8.0.2(vite@7.1.9)(vue@3.5.22):
+  vite-plugin-vue-devtools@8.0.2(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1))(vue@3.5.22):
    dependencies:
-      '@vue/devtools-core': 8.0.2(vite@7.1.9)(vue@3.5.22)
+      '@vue/devtools-core': 8.0.2(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1))(vue@3.5.22)
      '@vue/devtools-kit': 8.0.2
      '@vue/devtools-shared': 8.0.2
      execa: 9.6.0
      sirv: 3.0.2
-      vite: 7.1.9
-      vite-plugin-inspect: 11.3.3(vite@7.1.9)
-      vite-plugin-vue-inspector: 5.3.2(vite@7.1.9)
+      vite: 7.1.9(jiti@2.6.1)(lightningcss@1.30.1)
+      vite-plugin-inspect: 11.3.3(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1))
+      vite-plugin-vue-inspector: 5.3.2(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1))
    transitivePeerDependencies:
      - '@nuxt/kit'
      - supports-color
      - vue

-  vite-plugin-vue-inspector@5.3.2(vite@7.1.9):
+  vite-plugin-vue-inspector@5.3.2(vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1)):
    dependencies:
      '@babel/core': 7.28.4
      '@babel/plugin-proposal-decorators': 7.28.0(@babel/core@7.28.4)
@ -2510,11 +2877,11 @@ snapshots:
      '@vue/compiler-dom': 3.5.22
      kolorist: 1.8.0
      magic-string: 0.30.19
-      vite: 7.1.9
+      vite: 7.1.9(jiti@2.6.1)(lightningcss@1.30.1)
    transitivePeerDependencies:
      - supports-color

-  vite@7.1.9:
+  vite@7.1.9(jiti@2.6.1)(lightningcss@1.30.1):
    dependencies:
      esbuild: 0.25.10
      fdir: 6.5.0(picomatch@4.0.3)
@ -2524,11 +2891,13 @@ snapshots:
      tinyglobby: 0.2.15
    optionalDependencies:
      fsevents: 2.3.3
+      jiti: 2.6.1
+      lightningcss: 1.30.1

-  vue-eslint-parser@10.2.0(eslint@9.37.0):
+  vue-eslint-parser@10.2.0(eslint@9.37.0(jiti@2.6.1)):
    dependencies:
      debug: 4.4.3
-      eslint: 9.37.0
+      eslint: 9.37.0(jiti@2.6.1)
      eslint-scope: 8.4.0
      eslint-visitor-keys: 4.2.1
      espree: 10.4.0
@ -2559,6 +2928,8 @@ snapshots:

  yallist@3.1.1: {}

+  yallist@5.0.0: {}
+
  yocto-queue@0.1.0: {}

  yoctocolors@2.1.2: {}
--- a/public/autowycena1.png
+++ b/public/autowycena1.png
--- a/public/autowycena2.png
+++ b/public/autowycena2.png
--- a/public/mandarynki.gif
+++ b/public/mandarynki.gif
--- a/public/prawo_jazdy1.png
+++ b/public/prawo_jazdy1.png
--- a/public/prawo_jazdy2.png
+++ b/public/prawo_jazdy2.png
--- a/public/prawo_jazdy3.png
+++ b/public/prawo_jazdy3.png
--- a/public/tv.jpg
+++ b/public/tv.jpg
--- a/src/App.vue
+++ b/src/App.vue
@ -1,11 +1,69 @@
-<script setup></script>
+<script setup>
+import { ref } from 'vue'
+
+import AboutSection from './components/AboutSection.vue'
+import ProjectSection from './components/ProjectSection.vue'
+import ContactSection from './components/ContactSection.vue'
+import GenericSection from './components/GenericSection.vue'
+import ImgViewer from './components/ImgViewer.vue'
+
+const currentImage = ref('')
+
+function viewImage(image) {
+  currentImage.value = image
+}
+
+function closeImage() {
+  currentImage.value = ''
+}
+</script>

 <template>
-  <h1>You did it!</h1>
-  <p>
-    Visit <a href="https://vuejs.org/" target="_blank" rel="noopener">vuejs.org</a> to read the
-    documentation
-  </p>
+  <div>
+    <ImgViewer
+      :image="currentImage"
+      :key="currentImage"
+      class="fixed"
+      :class="currentImage ? '' : 'hidden'"
+      @close="closeImage"
+    />
+    <div
+      class="flex flex-col min-h-dvh bg-linear-to-r from-red-100 via-yellow-50 to-cyan-100 items-center *:w-full"
+    >
+      <div class="flex justify-center gap-4 items-center">
+        <div class="p-4 text-3xl font-mono text-center">
+          netman.<sub><sub>[screw]</sub>ovh</sub>
+        </div>
+        <div
+          class="p-2 bg-slate-500/80 text-slate-100 font-mono text-center !w-fit m-2 opacity-75 rounded-xl cursor-pointer"
+        >
+          blog <sub>(maybe someday)</sub>
+        </div>
+      </div>
+      <AboutSection />
+      <ProjectSection @view-image="viewImage" />
+      <ContactSection />
+      <GenericSection>
+        <template #title> setup </template>
+        <template #content>
+          <div class="flex gap-8">
+            <div>
+              <p class="font-bold">ThinkBook 16 G7:</p>
+              <p>* Ryzen 5 7535HS</p>
+              <p>* 64GB (DDR5)</p>
+            </div>
+            <div>
+              <p class="font-bold">EndeavourOS:</p>
+              <p>* KDE Plasma</p>
+              <p>* VSCode</p>
+            </div>
+          </div>
+        </template>
+      </GenericSection>
+      <div class="flex-1"></div>
+      <div class="text-xl font-mono text-center bg-slate-200/20 p-1.5">CC0 netman 2025</div>
+    </div>
+  </div>
 </template>

 <style scoped></style>
--- a/src/components/AboutSection.vue
+++ b/src/components/AboutSection.vue
@ -0,0 +1,29 @@
+<script setup lang="js">
+import { intervalToDuration } from 'date-fns'
+import GenericSection from './GenericSection.vue'
+const dob = new Date(2006, 11)
+const now = new Date()
+</script>
+
+<template>
+  <GenericSection>
+    <template #title>about me</template>
+    <template #content>
+      <h4 class="font-bold text-xl">
+        <span class="font-normal text-3xl">hej! (^^)/</span> i'm Oskar, aka NetMan
+      </h4>
+      <p>
+        age = {{ intervalToDuration({ start: dob, end: now }).years }}; locale = pl_PL.UTF-8 || en
+      </p>
+      <p>hobbies = ['cycling', 'transit', 'tinkering', 'software'] <br /></p>
+      <i> co-admin of </i>
+      <a class="link" href="https://mandarynki.eu/">🍊 mandarynki.eu</a>
+      <p class="text-sm">my stack, skills, whatever you may call it (^^)":</p>
+      <img
+        class="h-12"
+        alt="skillicons"
+        src="https://skillicons.dev/icons?i=js,python,nuxt,tailwind,docker,linux,git,sqlite,ts"
+      />
+    </template>
+  </GenericSection>
+</template>
--- a/src/components/ContactSection.vue
+++ b/src/components/ContactSection.vue
@ -0,0 +1,51 @@
+<script setup lang="js">
+import GenericSection from './GenericSection.vue'
+</script>
+
+<template>
+  <GenericSection>
+    <template #title>contact<sub>/platforms</sub></template>
+    <template #content>
+      <div class="text-xl">
+        <a href="https://mandarynki.eu/" class="flex items-center gap-2">
+          <img src="/mandarynki.gif" alt="mandarynki.eu 80x31 gif" /><i>mandarynki.eu house ad</i>
+        </a>
+        <p>
+          email:
+          <a class="link" href="mailto:contact@netman.ovh">contact@netman.ovh</a>
+        </p>
+        <p>
+          signal:
+          <a
+            class="link"
+            href="https://signal.me/#eu/F5F3bJi6d_QJHVX2Fuu0IwYFXAZkLAQ3ay80FTD_4VbH8lHVTRdNAZjOtwX-M0-u"
+          >
+            @onn_net.03
+          </a>
+        </p>
+        <p>
+          🍊 fedi
+          <a class="link" href="https://fedi.mandarynki.eu/@netman"> @netman@fedi.mandarynki.eu </a>
+        </p>
+        <p>
+          🍊
+          <a class="link" href="https://git.mandarynki.eu/netman"> git.mandarynki.eu/netman </a>
+        </p>
+        <p>
+          matrix:
+          <a class="link" href="https://matrix.to/#/@netman:matrix.netman.ovh">
+            @netman:matrix.netman.ovh
+          </a>
+        </p>
+        <p>
+          github:
+          <a class="link" href="https://github.com/netman134">netman134</a>
+        </p>
+        <p>
+          telegram:
+          <a class="link" href="https://t.me/onn_net">@onn_net</a>
+        </p>
+      </div>
+    </template>
+  </GenericSection>
+</template>
--- a/src/components/GenericSection.vue
+++ b/src/components/GenericSection.vue
@ -0,0 +1,12 @@
+<template>
+  <div class="flex flex-col">
+    <div class="flex-1 flex justify-center items-center font-mono text-2xl p-2.5 bg-slate-200/15">
+      <slot name="title"></slot>
+    </div>
+    <div class="flex-1 flex justify-center items-center font-mono p-4">
+      <div>
+        <slot name="content"></slot>
+      </div>
+    </div>
+  </div>
+</template>
--- a/src/components/ImgSection.vue
+++ b/src/components/ImgSection.vue
@ -0,0 +1,17 @@
+<script lang="js" setup>
+defineProps(['images'])
+const emit = defineEmits(['open'])
+</script>
+
+<template>
+  <div class="flex gap-2">
+    <div
+      v-for="image in images"
+      :key="image"
+      class="border border-black cursor-pointer"
+      @click="emit('open', image)"
+    >
+      <img class="h-16" :src="`/${image}`" :alt="image" />
+    </div>
+  </div>
+</template>
--- a/src/components/ImgViewer.vue
+++ b/src/components/ImgViewer.vue
@ -0,0 +1,16 @@
+<script setup lang="js">
+defineProps(['image'])
+const emit = defineEmits(['close'])
+</script>
+
+<template>
+  <div class="flex justify-center items-center z-10 min-h-dvh w-full bg-black/30 backdrop-blur-sm">
+    <button
+      class="bg-slate-100 text-slate-700 absolute top-2 right-2 font-mono cursor-pointer text-2xl p-1.5 rounded-lg"
+      @click="emit('close')"
+    >
+      Close
+    </button>
+    <img :src="image" alt="" class="max-w-full max-h-dvh p-16 rounded-sm" />
+  </div>
+</template>
--- a/src/components/ProjectSection.vue
+++ b/src/components/ProjectSection.vue
@ -0,0 +1,69 @@
+<script setup lang="js">
+import GenericSection from './GenericSection.vue'
+import ImgSection from './ImgSection.vue'
+
+const emit = defineEmits(['viewImage'])
+</script>
+
+<template>
+  <GenericSection>
+    <template #title>projects</template>
+    <template #content>
+      <div class="flex flex-col gap-5">
+        <div>
+          <ImgSection
+            :images="['autowycena1.png', 'autowycena2.png']"
+            @open="(image) => emit('viewImage', image)"
+          />
+          <h4 class="font-bold text-xl">autowycena <sub>(autoOffer)</sub></h4>
+          <p>automatic offer processer and sender with easy manual intervention</p>
+          <p><sup>(code not available)</sup></p>
+        </div>
+        <div>
+          <ImgSection :images="['tv.jpg']" @open="(image) => emit('viewImage', image)" />
+          <h4 class="font-bold text-xl">
+            <a class="link" href="https://tvannouncements.netman.ovh"> tv announcements </a>
+          </h4>
+          <p>(school) display for announcements, 🕔 🌞 (+AQI), and even video</p>
+          <p><sup>(code not available)</sup></p>
+        </div>
+        <div>
+          <ImgSection
+            :images="['prawo_jazdy1.png', 'prawo_jazdy2.png', 'prawo_jazdy3.png']"
+            @open="(image) => emit('viewImage', image)"
+          />
+          <h4 class="font-bold text-xl">
+            <a class="link" href="https://git.mandarynki.eu/netman/nuxt-prawo-jazdy">
+              prawo jazdy <sub>(driver's exam)</sub>
+            </a>
+          </h4>
+          <p>
+            driver's Polish theoritical exam app<sub>/website</sub> using
+            <a class="link" href="https://www.gov.pl/web/infrastruktura/prawo-jazdy">
+              official resources
+            </a>
+          </p>
+        </div>
+        <div>
+          <h5 class="font-bold text-md">
+            <a class="link" href="https://github.com/netman134/faktmobile-kody">
+              faktmobile kody <sub>(sim gift codes)</sub>
+            </a>
+          </h5>
+          <p>automatically scrape and enter codes for free 💬 ☎️ & 🛜 for faktmobile</p>
+        </div>
+        <div>
+          <h5 class="font-bold text-md">
+            <a class="link" href="https://niedziela.netman.ovh">
+              dziśhandlowa <sub>(check shopping sunday)</sub>
+            </a>
+          </h5>
+          <p>
+            <a class="link" href="https://github.com/netman134/dzishandlowa">(code)</a>
+            quick, no-nonsense info about next<sup>incoming</sup> Polish shopping sunday[s]
+          </p>
+        </div>
+      </div>
+    </template>
+  </GenericSection>
+</template>
--- a/src/main.js
+++ b/src/main.js
@ -1,4 +1,5 @@
 import { createApp } from 'vue'
 import App from './App.vue'
+import './style.css'

 createApp(App).mount('#app')
--- a/src/style.css
+++ b/src/style.css
@ -0,0 +1,4 @@
+@import 'tailwindcss';
+.link {
+  @apply text-blue-700 underline;
+}
--- a/vite.config.js
+++ b/vite.config.js
@ -4,15 +4,14 @@ import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import vueDevTools from 'vite-plugin-vue-devtools'

+import tailwindcss from '@tailwindcss/vite'
+
 // https://vite.dev/config/
 export default defineConfig({
-  plugins: [
-    vue(),
-    vueDevTools(),
-  ],
+  plugins: [vue(), vueDevTools(), tailwindcss()],
  resolve: {
    alias: {
-      '@': fileURLToPath(new URL('./src', import.meta.url))
+      '@': fileURLToPath(new URL('./src', import.meta.url)),
    },
  },
 })