Spythere/spythere-portfolio
1
0
Fork 0
mirror of https://github.com/Spythere/spythere-portfolio.git synced 2026-05-02 21:18:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

project section update

Browse Source
This commit is contained in:
Spythere
2024-02-23 20:26:58 +01:00
parent 579ffd790d
commit 2aaeeeed8b
6 changed files with 276 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/generator-logo.svg
+48
View File
@@ -0,0 +1,48 @@
<svg width="512" height="512" viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="512" height="512" rx="256" fill="black"/>
<rect width="512" height="512" rx="256" stroke="#FF0000"/>
<rect x="329.454" y="340.498" width="7.7497" height="147.239" rx="3.87485" transform="rotate(90 329.454 340.498)" fill="white"/>
<rect x="308" y="320" width="5" height="103" rx="2.5" transform="rotate(90 308 320)" fill="white"/>
<rect x="366.263" y="367.622" width="11.6246" height="213.496" rx="5.81228" transform="rotate(90 366.263 367.622)" fill="white"/>
<g filter="url(#filter0_d_856_41)">
<rect width="18.2931" height="124.137" rx="9.14654" transform="matrix(0.688736 0.725012 -0.688736 0.725012 212.498 294)" fill="white"/>
</g>
<g filter="url(#filter1_d_856_41)">
<rect width="19.6916" height="124.137" rx="9.84578" transform="matrix(-0.688736 0.725012 0.688736 0.725012 303.502 294)" fill="white"/>
</g>
<g filter="url(#filter2_d_856_41)">
<path d="M147.893 304.935H121.015C109.69 304.935 101.233 302.498 95.6422 297.624C90.195 292.607 87.4713 285.01 87.4713 274.832V194.628C87.4713 184.307 90.195 176.71 95.6422 171.836C101.233 166.962 109.69 164.525 121.015 164.525H178.856V187.318H115.854C114.134 187.318 113.274 188.178 113.274 189.898V279.562C113.274 281.283 114.134 282.143 115.854 282.143H154.559C156.279 282.143 157.139 281.283 157.139 279.562V245.589L159.719 249.674H138.002V228.387H181.436V274.832C181.436 285.01 178.641 292.607 173.051 297.624C167.603 302.498 159.217 304.935 147.893 304.935ZM282.921 265.371V166.46H304.853V303H287.006L222.284 204.734L226.585 203.874V303H204.867V166.46H222.499L287.006 264.511L282.921 265.371ZM358.59 303H333.218V166.46L391.059 165.6C402.527 165.313 411.199 167.894 417.077 173.341C423.097 178.788 426.108 186.672 426.108 196.994V218.711C426.108 227.025 423.814 233.978 419.227 239.568C414.783 245.159 408.189 248.671 399.445 250.104V245.159C403.889 246.019 407.401 247.739 409.981 250.319C412.561 252.9 414.783 256.842 416.647 262.146L431.053 303H405.68L389.339 254.19C388.909 253.043 388.479 252.255 388.049 251.824C387.762 251.251 386.973 250.964 385.683 250.964H354.505L358.59 246.879V303ZM358.59 183.232V233.117L354.935 229.247H397.295C399.301 229.247 400.305 228.315 400.305 226.452V190.328C400.305 188.464 399.301 187.533 397.295 187.533H354.935L358.59 183.232Z" fill="white"/>
</g>
<defs>
<filter id="filter0_d_856_41" x="101.768" y="268.962" width="148.561" height="153.339" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset/>
<feGaussianBlur stdDeviation="14.4611"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_856_41"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_856_41" result="shape"/>
</filter>
<filter id="filter1_d_856_41" x="264.99" y="269.259" width="148.96" height="153.759" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset/>
<feGaussianBlur stdDeviation="14.4611"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_856_41"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_856_41" result="shape"/>
</filter>
<filter id="filter2_d_856_41" x="85.2845" y="161.245" width="352.33" height="149.158" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset dx="2.18692" dy="1.09346"/>
<feGaussianBlur stdDeviation="2.18692"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0.5375 0 0 0 0 0.5375 0 0 0 0 0.5375 0 0 0 1 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_856_41"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_856_41" result="shape"/>
</filter>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.4 KiB

public/pojazdownik-logo.svg
+24
View File
@@ -0,0 +1,24 @@
<svg width="500" height="500" viewBox="0 0 500 500" fill="none" xmlns="http://www.w3.org/2000/svg">
<mask id="path-1-inside-1_102_63" fill="white">
<path d="M0 250C0 111.929 111.929 6.10352e-05 250 6.10352e-05C388.071 6.10352e-05 500 111.929 500 250C500 388.071 388.071 500 250 500C111.929 500 0 388.071 0 250Z"/>
</mask>
<path d="M0 250C0 111.929 111.929 6.10352e-05 250 6.10352e-05C388.071 6.10352e-05 500 111.929 500 250C500 388.071 388.071 500 250 500C111.929 500 0 388.071 0 250Z" fill="#242424"/>
<path d="M0 222.821C0 84.7503 111.929 -27.1785 250 -27.1785C388.071 -27.1785 500 84.7503 500 222.821V250C500 126.939 388.071 27.1787 250 27.1787C111.929 27.1787 0 126.939 0 250V222.821ZM500 277.179C500 415.25 388.071 527.179 250 527.179C111.929 527.179 0 415.25 0 277.179V250C0 373.061 111.929 472.821 250 472.821C388.071 472.821 500 373.061 500 250V277.179ZM0 500V6.10352e-05V500ZM500 6.10352e-05V500V6.10352e-05Z" fill="#FFD600" mask="url(#path-1-inside-1_102_63)"/>
<path d="M210.369 301.604C210.369 301.604 210.369 341.807 210.369 364.846C210.369 387.885 202.798 417.491 171.591 417.491C140.385 417.491 132.813 417.491 132.813 417.491L132.812 78.125L250.754 78.125C274.312 78.125 294.504 80.9665 311.331 86.6494C328.311 92.1788 342.232 99.8585 353.093 109.689C364.107 119.519 372.214 131.115 377.415 144.478C382.616 157.84 385.217 172.278 385.217 187.791C385.217 204.533 382.54 219.892 377.186 233.869C371.832 247.846 363.648 259.827 352.634 269.81C341.62 279.794 327.623 287.627 310.643 293.31C293.816 298.839 273.853 301.604 250.754 301.604L210.369 301.604ZM210.369 242.854L250.754 242.854C270.946 242.854 285.479 238.016 294.351 228.34C303.224 218.663 307.66 205.147 307.66 187.791C307.66 180.111 306.512 173.123 304.218 166.825C301.923 160.528 298.405 155.152 293.663 150.698C289.074 146.09 283.184 142.558 275.995 140.1C268.958 137.643 260.544 136.414 250.754 136.414L210.369 136.414L210.369 242.854Z" fill="url(#paint0_linear_102_63)"/>
<path d="M239.215 301.604C239.215 301.604 239.215 341.807 239.215 364.846C239.215 387.885 231.643 417.491 200.437 417.491C169.231 417.491 161.659 417.491 161.659 417.491L161.658 78.125L279.6 78.125C303.158 78.125 323.35 80.9665 340.177 86.6494C357.157 92.1788 371.077 99.8585 381.938 109.689C392.952 119.519 401.06 131.115 406.261 144.478C411.462 157.84 414.062 172.278 414.062 187.791C414.062 204.533 411.385 219.892 406.031 233.869C400.677 247.846 392.493 259.827 381.479 269.81C370.465 279.794 356.468 287.627 339.488 293.31C322.662 298.839 302.699 301.604 279.6 301.604L239.215 301.604ZM239.215 242.854L279.6 242.854C299.792 242.854 314.325 238.016 323.197 228.34C332.069 218.663 336.505 205.147 336.505 187.791C336.505 180.111 335.358 173.123 333.064 166.825C330.769 160.528 327.251 155.152 322.509 150.698C317.919 146.09 312.03 142.558 304.84 140.1C297.804 137.643 289.39 136.414 279.6 136.414L239.215 136.414L239.215 242.854Z" fill="url(#paint1_linear_102_63)"/>
<path d="M210.685 301.604C210.685 301.604 210.685 341.807 210.685 364.846C210.685 387.885 203.082 417.491 171.749 417.491C140.416 417.491 132.813 417.491 132.813 417.491L132.812 78.125L251.233 78.125C274.887 78.125 295.161 80.9665 312.057 86.6494C329.105 92.1788 343.083 99.8585 353.988 109.689C365.046 119.519 373.187 131.115 378.409 144.478C383.631 157.84 386.242 172.278 386.242 187.791C386.242 204.533 383.555 219.892 378.179 233.869C372.803 247.846 364.586 259.827 353.527 269.81C342.468 279.794 328.414 287.627 311.365 293.31C294.47 298.839 274.426 301.604 251.233 301.604L210.685 301.604ZM210.685 242.854L251.233 242.854C271.508 242.854 286.099 238.016 295.008 228.34C303.916 218.663 308.37 205.147 308.37 187.791C308.37 180.111 307.218 173.123 304.914 166.825C302.611 160.528 299.078 155.152 294.316 150.698C289.709 146.09 283.795 142.558 276.576 140.1C269.511 137.643 261.063 136.414 251.233 136.414L210.685 136.414L210.685 242.854Z" fill="url(#paint2_radial_102_63)"/>
<defs>
<linearGradient id="paint0_linear_102_63" x1="259.015" y1="78.125" x2="259.015" y2="417.491" gradientUnits="userSpaceOnUse">
<stop offset="0.135417" stop-color="#FFD600"/>
<stop offset="1"/>
</linearGradient>
<linearGradient id="paint1_linear_102_63" x1="287.86" y1="78.125" x2="287.86" y2="417.491" gradientUnits="userSpaceOnUse">
<stop offset="0.135417" stop-color="#FFD600"/>
<stop offset="1"/>
</linearGradient>
<radialGradient id="paint2_radial_102_63" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(259.527 247.808) rotate(0.36307) scale(345.948 325.206)">
<stop offset="0.484375" stop-color="white"/>
<stop offset="1"/>
</radialGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.5 KiB

public/stacjownik-dev-logo.svg
+51
View File
@@ -0,0 +1,51 @@
<svg width="512" height="512" viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="512" height="512" rx="256" fill="#0066FF"/>
<rect width="512" height="512" rx="256" stroke="#FF0000"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M145.112 194L137.004 233.319C130.273 235.283 123.875 238.033 117.917 241.463L85.1512 219.86L61.8467 243.242L83.6668 276.557C80.7268 281.974 78.3947 287.635 76.6707 293.439L38 301.467V334.533L76.0869 342.44C77.8539 348.963 80.3806 355.323 83.6668 361.378L61.8469 394.693L85.1514 418.074L118.159 396.312C124.274 399.728 130.709 402.356 137.316 404.195L145.112 442H178.888L186.684 404.195C193.291 402.356 199.726 399.728 205.841 396.312L238.849 418.074L262.153 394.693L240.333 361.378C243.619 355.323 246.146 348.963 247.913 342.44L286 334.533V301.467L247.329 293.439C245.605 287.635 243.273 281.974 240.333 276.557L262.153 243.242L238.849 219.86L206.083 241.463C200.124 238.033 193.727 235.283 186.996 233.319L178.888 194H145.112ZM162.409 362.089C186.678 362.089 206.352 342.35 206.352 318C206.352 293.65 186.678 273.911 162.409 273.911C138.14 273.911 118.465 293.65 118.465 318C118.465 342.35 138.14 362.089 162.409 362.089Z" fill="black" stroke="white" stroke-width="10.0613"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M332.624 70L324.516 109.319C317.785 111.283 311.388 114.033 305.429 117.463L272.663 95.8603L249.359 119.242L271.179 152.556C268.239 157.974 265.907 163.635 264.183 169.439L225.512 177.467V210.533L263.599 218.439C265.366 224.963 267.893 231.323 271.179 237.378L249.359 270.692L272.664 294.074L305.671 272.312C311.786 275.728 318.221 278.356 324.828 280.195L332.624 318H366.4L374.196 280.195C380.803 278.356 387.238 275.728 393.353 272.312L426.361 294.074L449.665 270.692L427.845 237.378C431.132 231.323 433.658 224.963 435.425 218.439L473.512 210.533V177.467L434.841 169.439C433.117 163.635 430.785 157.974 427.845 152.556L449.665 119.242L426.361 95.8603L393.595 117.463C387.637 114.033 381.239 111.283 374.508 109.319L366.4 70H332.624ZM349.921 238.089C374.19 238.089 393.865 218.35 393.865 194C393.865 169.65 374.19 149.911 349.921 149.911C325.652 149.911 305.978 169.65 305.978 194C305.978 218.35 325.652 238.089 349.921 238.089Z" fill="black" stroke="white" stroke-width="10.0613"/>
<rect x="325.818" y="405.665" width="7.11086" height="143.867" rx="3.55543" transform="rotate(90 325.818 405.665)" fill="white"/>
<rect x="361.785" y="430.553" width="10.6663" height="208.608" rx="5.33314" transform="rotate(90 361.785 430.553)" fill="white"/>
<g filter="url(#filter0_d_459_41)">
<rect width="25.0328" height="117.468" rx="12.5164" transform="matrix(0.711174 0.703016 -0.711174 0.703016 211.54 363)" fill="white"/>
</g>
<g filter="url(#filter1_d_459_41)">
<rect width="25.0328" height="117.468" rx="12.5164" transform="matrix(-0.711174 0.703016 0.711174 0.703016 300.46 363)" fill="white"/>
</g>
<g filter="url(#filter2_d_459_41)">
<rect x="139.352" y="65.4912" width="232.66" height="325.893" rx="41.5866" stroke="#7A7A7A" stroke-width="8.31733"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M135.193 107.078C135.193 81.8134 155.674 61.3325 180.938 61.3325H330.425C355.69 61.3325 376.171 81.8134 376.171 107.078V349.797C376.171 375.062 355.69 395.543 330.426 395.543H180.938C155.674 395.543 135.193 375.062 135.193 349.797V107.078ZM208.217 338.656C208.217 352.401 196.774 363.544 182.659 363.544C168.543 363.544 157.1 352.401 157.1 338.656C157.1 324.91 168.543 313.768 182.659 313.768C196.774 313.768 208.217 324.91 208.217 338.656ZM328.706 363.544C342.821 363.544 354.264 352.401 354.264 338.656C354.264 324.91 342.821 313.768 328.706 313.768C314.591 313.768 303.148 324.91 303.148 338.656C303.148 352.401 314.591 363.544 328.706 363.544ZM248.38 136.323C248.38 132.07 244.932 128.622 240.679 128.622H164.802C160.549 128.622 157.101 132.07 157.101 136.323V203.223C157.101 207.476 160.549 210.924 164.802 210.924H240.679C244.932 210.924 248.38 207.476 248.38 203.223V136.323ZM346.563 128.622C350.817 128.622 354.265 132.07 354.265 136.323V203.223C354.265 207.476 350.817 210.924 346.563 210.924H270.686C266.433 210.924 262.985 207.476 262.985 203.223V136.323C262.985 132.07 266.433 128.622 270.686 128.622H346.563Z" fill="white"/>
<ellipse cx="255.682" cy="64.888" rx="25.5582" ry="24.888" fill="#F3F1F1"/>
</g>
<defs>
<filter id="filter0_d_459_41" x="106.676" y="341.617" width="143.99" height="142.947" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset/>
<feGaussianBlur stdDeviation="13.269"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_459_41"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_459_41" result="shape"/>
</filter>
<filter id="filter1_d_459_41" x="261.334" y="341.617" width="143.99" height="142.947" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset/>
<feGaussianBlur stdDeviation="13.269"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_459_41"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_459_41" result="shape"/>
</filter>
<filter id="filter2_d_459_41" x="110.241" y="15.048" width="290.882" height="405.446" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset/>
<feGaussianBlur stdDeviation="12.476"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_459_41"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_459_41" result="shape"/>
</filter>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 6.3 KiB

public/stacjownik-logo.svg
+48
View File
@@ -0,0 +1,48 @@
<svg width="512" height="512" viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="512" height="512" rx="256" fill="#121212"/>
<rect x="325.818" y="405.665" width="7.11086" height="143.867" rx="3.55543" transform="rotate(90 325.818 405.665)" fill="white"/>
<rect x="361.785" y="430.553" width="10.6663" height="208.608" rx="5.33314" transform="rotate(90 361.785 430.553)" fill="white"/>
<g filter="url(#filter0_d_272_208)">
<rect width="25.0328" height="117.468" rx="12.5164" transform="matrix(0.711174 0.703016 -0.711174 0.703016 211.54 363)" fill="white"/>
</g>
<g filter="url(#filter1_d_272_208)">
<rect width="25.0328" height="117.468" rx="12.5164" transform="matrix(-0.711174 0.703016 0.711174 0.703016 300.46 363)" fill="white"/>
</g>
<g filter="url(#filter2_d_272_208)">
<rect x="139.352" y="65.4912" width="232.66" height="325.893" rx="41.5866" stroke="#7A7A7A" stroke-width="8.31733"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M135.193 107.078C135.193 81.8134 155.674 61.3325 180.938 61.3325H330.425C355.69 61.3325 376.171 81.8134 376.171 107.078V349.797C376.171 375.062 355.69 395.543 330.426 395.543H180.938C155.674 395.543 135.193 375.062 135.193 349.797V107.078ZM208.217 338.656C208.217 352.401 196.774 363.544 182.659 363.544C168.543 363.544 157.1 352.401 157.1 338.656C157.1 324.91 168.543 313.768 182.659 313.768C196.774 313.768 208.217 324.91 208.217 338.656ZM328.706 363.544C342.821 363.544 354.264 352.401 354.264 338.656C354.264 324.91 342.821 313.768 328.706 313.768C314.591 313.768 303.148 324.91 303.148 338.656C303.148 352.401 314.591 363.544 328.706 363.544ZM248.38 136.323C248.38 132.07 244.932 128.622 240.679 128.622H164.802C160.549 128.622 157.101 132.07 157.101 136.323V203.223C157.101 207.476 160.549 210.924 164.802 210.924H240.679C244.932 210.924 248.38 207.476 248.38 203.223V136.323ZM346.563 128.622C350.817 128.622 354.265 132.07 354.265 136.323V203.223C354.265 207.476 350.817 210.924 346.563 210.924H270.686C266.433 210.924 262.985 207.476 262.985 203.223V136.323C262.985 132.07 266.433 128.622 270.686 128.622H346.563Z" fill="white"/>
<ellipse cx="255.682" cy="64.888" rx="25.5582" ry="24.888" fill="#F3F1F1"/>
</g>
<defs>
<filter id="filter0_d_272_208" x="106.676" y="341.617" width="143.99" height="142.947" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset/>
<feGaussianBlur stdDeviation="13.269"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_272_208"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_272_208" result="shape"/>
</filter>
<filter id="filter1_d_272_208" x="261.334" y="341.617" width="143.99" height="142.947" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset/>
<feGaussianBlur stdDeviation="13.269"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_272_208"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_272_208" result="shape"/>
</filter>
<filter id="filter2_d_272_208" x="110.241" y="15.048" width="290.882" height="405.446" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset/>
<feGaussianBlur stdDeviation="12.476"/>
<feComposite in2="hardAlpha" operator="out"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_272_208"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_272_208" result="shape"/>
</filter>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB

src/components/styles/Projects.styled.ts
+28 -7
View File
@@ -7,16 +7,28 @@ export const StyledProjects = styled.section`
margin-top: 3em;
}
.projects-grid {
.showcase-container {
display: flex;
flex-direction: column;
gap: 2rem;
gap: 2em;
}
.other-projects-container {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 2em;
}
.project-card {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 3.5em;
background-color: ${({ theme }) => theme.colors['600']};
padding: 0.75em;
border-radius: 1em;
&.showcase {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 3.5em;
}
.project-thumbnail img,
.project-badges img {
@@ -40,8 +52,17 @@ export const StyledProjects = styled.section`
margin: 0.5em 0;
}
h2.project-title {
color: ${({ theme }) => theme.colors.accent};
.project-title {
display: flex;
gap: 0.5em;
h2 {
display: inline;
}
img.project-title-icon {
max-width: 2em;
}
}
h3.project-subtitle {
src/sections/ProjectsSection.tsx
+77 -13
View File
@@ -28,10 +28,10 @@ const badges = {
};
const projects = {
frontend: [
showcase: [
{
thumbnailSrc: 'stacjownik-1.png',
iconSrc: null,
iconSrc: 'stacjownik-logo.svg',
title: 'Stacjownik',
subtitle: '',
desc: "A tool made for the Polish railway simulator: Train Driver 2.\
@@ -44,7 +44,7 @@ const projects = {
},
{
thumbnailSrc: 'pojazdownik-1.png',
iconSrc: null,
iconSrc: 'pojazdownik-logo.svg',
title: 'Pojazdownik',
subtitle: '',
desc: "Another tool made for the Train Driver 2 community, which allows players to easily create their own railway rolling stock configurations.\
@@ -56,7 +56,7 @@ const projects = {
},
{
thumbnailSrc: 'generator-1.png',
iconSrc: null,
iconSrc: 'generator-logo.svg',
title: 'GeneraTOR',
subtitle: '',
desc: 'The last of the "Holy Trinity" of applications created for the TD2 simulator. It\'s a graphical interface of so-called "written orders"\
@@ -68,7 +68,7 @@ const projects = {
},
{
thumbnailSrc: 'stacjownik-manager-1.png',
iconSrc: null,
iconSrc: 'stacjownik-dev-logo.svg',
title: 'Stacjownik Manager',
subtitle: '',
desc: "An additional tool made for people who work with Stacjownik and update it with the freshest data coming from the simulator which isn't automatically scraped, mainly new sceneries (maps available for the community).\
@@ -79,13 +79,34 @@ const projects = {
siteLink: 'https://station-manager.web.app/',
},
],
backend: [
other: [
{
title: 'Stacjownik API',
title: 'Stacjownik Backend + API',
iconSrc: null,
subtitle: '',
desc: 'The backend services for Stacjownik site. Here I compute all data which is further sent to the app. Aside from the API,\
it\'s also used for storing history data about users which can be later browsed in the "Journal" tab. ',
technologies: [badges.NestJS, badges.TS, badges.Postgresql],
repoLink: 'https://github.com/Spythere/station-manager-2.0',
docsLink: 'https://stacjownik.spythere.eu/docs',
},
{
title: 'Stacjobot',
iconSrc: null,
subtitle: '',
desc: 'The backend services for Stacjownik site. Here I compute all data which is further sent to the app. Aside from the API,\
it\'s also used for storing history data about users which can be later browsed in the "Journal" tab. ',
technologies: [badges.NestJS, badges.Discord, badges.TS],
repoLink: 'https://github.com/Spythere/station-manager-2.0',
},
{
title: 'TD2 Discord Presence',
iconSrc: null,
subtitle: '',
desc: 'The backend services for Stacjownik site. Here I compute all data which is further sent to the app. Aside from the API,\
it\'s also used for storing history data about users which can be later browsed in the "Journal" tab. ',
technologies: [badges.CSharp, badges.Dotnet],
repoLink: 'https://github.com/Spythere/station-manager-2.0',
},
],
};
@@ -101,17 +122,20 @@ function ProjectsSection() {
</span>
</StyledSectionHeader>
<h3 className="sub-header">MY FRONT-END PROJECTS</h3>
<h3 className="sub-header">SHOWCASE - MAJOR PROJECTS</h3>
<div className="projects-grid">
{projects.frontend.map((p) => (
<div className="project-card">
<div className="showcase-container">
{projects.showcase.map((p) => (
<div className="project-card showcase">
<div className="project-thumbnail">
<img src={p.thumbnailSrc} alt="" />
</div>
<div className="project-content">
<h2 className="project-title">{p.title}</h2>
<a className="project-title" href={p.siteLink} target="_blank">
{p.iconSrc && <img className="project-title-icon" src={p.iconSrc} alt="" />}
<h2 className="project-title-content">{p.title}</h2>
</a>
<h3 className="project-subtitle">{p.subtitle}</h3>
<div className="project-badges">
@@ -139,7 +163,47 @@ function ProjectsSection() {
))}
</div>
<h3 className="sub-header">MY BACK-END PROJECTS</h3>
<h3 className="sub-header">OTHER PROJECTS</h3>
<div className="other-projects-container">
{projects.other.map((p) => (
<div className="project-card">
<div className="project-content">
<div className="project-title">
{p.iconSrc && <img className="project-title-icon" src={p.iconSrc} alt="" />}
<h2 className="project-title-content">{p.title}</h2>
</div>
<h3 className="project-subtitle">{p.subtitle}</h3>
<div className="project-badges">
{p.technologies.map((tech) => (
<img src={tech} alt="technology badge"></img>
))}
</div>
<hr />
<p className="project-desc">{p.desc}</p>
<div className="project-actions">
{p.repoLink && (
<a href={p.repoLink} target="_blank">
<FaGithub />
SOURCE
</a>
)}
{p.docsLink && (
<a href={p.docsLink} target="_blank">
<FaExternalLinkAlt />
DOCS
</a>
)}
</div>
</div>
</div>
))}
</div>
</StyledProjects>
);
}