Add contact form

Fake API
Make Index resize to mobile better
Add error colour
This commit is contained in:
Michał 2024-04-26 13:50:21 +01:00
parent 8ab0957a85
commit 04adf38b46
11 changed files with 248 additions and 59 deletions

View file

@ -1,14 +1,15 @@
<svg width="192" height="40" viewBox="0 0 192 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_5_3)">
<path d="M21.56 6.84V13.48H19.16C18.9733 12.2533 18.5733 11.28 17.96 10.56C17.3733 9.81333 16.5733 9.44 15.56 9.44H13.96V6.84H21.56ZM14.12 26.16C14.12 26.96 14.2933 27.5733 14.64 28C15.0133 28.4 15.6133 28.6667 16.44 28.8V31H5.8V28.8C6.62667 28.6667 7.21333 28.4 7.56 28C7.93333 27.6 8.12 27.0133 8.12 26.24V6.84H14.12V26.16ZM0.64 6.84H8.6V9.44H6.64C5.62667 9.44 4.8 9.81333 4.16 10.56C3.54667 11.28 3.17333 12.2533 3.04 13.48H0.64V6.84ZM32.2259 27.4L32.7859 28.64C32.0659 29.4667 31.2259 30.12 30.2659 30.6C29.3326 31.08 28.2659 31.32 27.0659 31.32C25.4393 31.32 24.1193 30.88 23.1059 30C22.0926 29.0933 21.5859 27.9467 21.5859 26.56C21.5859 24.8267 22.3459 23.44 23.8659 22.4C25.3859 21.3333 27.3859 20.8 29.8659 20.8H32.9059V23.04H31.1059C30.1193 23.04 29.3193 23.2667 28.7059 23.72C28.0926 24.1467 27.7859 24.72 27.7859 25.44C27.7859 26.1067 28.0659 26.64 28.6259 27.04C29.1859 27.44 29.9193 27.64 30.8259 27.64C31.0926 27.64 31.3459 27.6267 31.5859 27.6C31.8259 27.5467 32.0393 27.48 32.2259 27.4ZM38.0659 24.68C38.0659 25.48 38.2393 26.08 38.5859 26.48C38.9593 26.8533 39.5193 27.12 40.2659 27.28V29.48L35.5059 31.28H34.3059L32.1059 27.92V18.04C32.1059 17.1067 31.8659 16.3867 31.3859 15.88C30.9059 15.3733 30.2793 15.12 29.5059 15.12C28.6793 15.12 27.9326 15.4133 27.2659 16C26.6259 16.56 26.1459 17.44 25.8259 18.64H23.2259V13.88C24.3193 13.4 25.4259 13.0267 26.5459 12.76C27.6926 12.4667 28.9193 12.32 30.2259 12.32C31.6393 12.32 32.9326 12.56 34.1059 13.04C35.3059 13.4933 36.2659 14.24 36.9859 15.28C37.7059 16.32 38.0659 17.68 38.0659 19.36V24.68ZM48.4994 31.28C47.086 31.28 45.8994 31.1467 44.9394 30.88C43.9794 30.6133 43.1794 30.3067 42.5394 29.96V24.96H45.1394C45.3527 26.1067 45.7527 26.9867 46.3394 27.6C46.9527 28.2133 47.8327 28.52 48.9794 28.52C49.7527 28.52 50.3527 28.3333 50.7794 27.96C51.206 27.5867 51.4194 27.0933 51.4194 26.48C51.4194 26 51.1927 25.6 50.7394 25.28C50.3127 24.9333 49.7527 24.6133 49.0594 24.32C48.3927 24.0267 47.6727 23.72 46.8994 23.4C46.126 23.0533 45.3927 22.6667 44.6994 22.24C44.0327 21.7867 43.4727 21.24 43.0194 20.6C42.5927 19.96 42.3794 19.1733 42.3794 18.24C42.3794 17.0133 42.686 15.96 43.2994 15.08C43.9127 14.2 44.7927 13.52 45.9394 13.04C47.086 12.56 48.446 12.32 50.0194 12.32C51.2994 12.32 52.3794 12.4267 53.2594 12.64C54.166 12.8533 55.0194 13.1467 55.8194 13.52V18.08H53.2194C53.0327 17.04 52.646 16.28 52.0594 15.8C51.4994 15.32 50.8194 15.08 50.0194 15.08C49.326 15.08 48.7927 15.2667 48.4194 15.64C48.046 16.0133 47.8594 16.4667 47.8594 17C47.8594 17.48 48.0727 17.8933 48.4994 18.24C48.9527 18.56 49.526 18.8667 50.2194 19.16C50.9394 19.4533 51.686 19.7733 52.4594 20.12C53.2327 20.44 53.966 20.8133 54.6594 21.24C55.3794 21.6667 55.9527 22.1867 56.3794 22.8C56.8327 23.4133 57.0594 24.1733 57.0594 25.08C57.0594 27 56.286 28.52 54.7394 29.64C53.2194 30.7333 51.1394 31.28 48.4994 31.28ZM71.3688 15.56H62.2488V12.6H71.3688V15.56ZM71.6088 27.4L72.2888 29.44C71.5421 29.92 70.6088 30.3467 69.4888 30.72C68.3954 31.0933 67.3021 31.28 66.2088 31.28C64.4221 31.28 62.9954 30.7467 61.9288 29.68C60.8621 28.5867 60.3288 27.1867 60.3288 25.48V15.56H58.6888V13.2C59.8354 12.8 60.8354 12.2 61.6888 11.4C62.5688 10.5733 63.1688 9.58667 63.4888 8.44H66.2888V24.72C66.2888 25.6267 66.5688 26.36 67.1288 26.92C67.7154 27.48 68.4621 27.76 69.3688 27.76C69.7154 27.76 70.0754 27.7333 70.4488 27.68C70.8221 27.6 71.2088 27.5067 71.6088 27.4ZM86.0953 14.8V12.6H93.4153V14.8C92.9353 15.0667 92.522 15.4 92.1753 15.8C91.8553 16.2 91.562 16.6933 91.2953 17.28L85.2553 30.68L82.0953 39H76.2553V37.6L82.8953 29.4L82.4953 32.2L74.9353 17.28C74.6686 16.7467 74.402 16.2667 74.1353 15.84C73.8953 15.4133 73.5086 15.0667 72.9753 14.8V12.6H82.3753V14.8C81.7886 14.8 81.3753 15.0267 81.1353 15.48C80.922 15.9067 80.9486 16.4533 81.2153 17.12L85.5353 27.72L82.9753 29.24L87.5353 17.28C87.8286 16.48 87.8153 15.8667 87.4953 15.44C87.1753 15.0133 86.7086 14.8 86.0953 14.8Z" fill="#E1DCD3"/>
<mask id="mask0_5_3" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="114" y="0" width="78" height="38">
<path fill-rule="evenodd" clip-rule="evenodd" d="M119.386 2.80517C119.393 2.57069 119.348 2.3392 119.255 2.11928C119.077 1.69954 118.738 1.35465 118.322 1.09748C117.492 0.583728 116.265 0.358072 114.914 0.593113C114.642 0.640467 114.46 0.899396 114.507 1.17145C114.555 1.4435 114.814 1.62565 115.086 1.5783C116.246 1.37641 117.214 1.58769 117.796 1.94781C118.087 2.12758 118.258 2.32886 118.334 2.50991C118.406 2.67803 118.409 2.85596 118.314 3.05449L117.972 3.77039L118.765 3.77039C119.904 3.77038 120.736 4.1618 121.218 4.86417C121.39 5.11429 121.483 5.44798 121.482 5.76505C121.481 6.0947 121.382 6.31239 121.286 6.40364L120.764 6.90069L121.412 7.21564C122.24 7.61757 122.429 7.99264 122.466 8.17495C122.54 8.54668 122.46 8.71831 122.354 8.8474C122.234 8.99365 122.072 9.10377 121.831 9.26727C121.766 9.31167 121.695 9.36 121.617 9.41405L120.813 9.97426L121.739 10.2966C122.236 10.4697 122.394 10.7161 122.455 10.8959C122.527 11.1066 122.498 11.3263 122.468 11.4645C122.394 11.8016 122.305 12.0481 122.168 12.2356C122.04 12.4099 121.845 12.5677 121.486 12.6759L120.565 12.9541L121.322 13.548C121.573 13.7444 121.673 13.9419 121.699 14.1108C121.725 14.2821 121.684 14.4881 121.533 14.7163C121.223 15.185 120.479 15.6817 119.307 15.8858L118.383 16.0467L119.032 16.7242C119.301 17.0058 119.388 17.2148 119.408 17.3507C119.425 17.4739 119.396 17.5921 119.3 17.7253C119.082 18.0295 118.583 18.3156 117.973 18.5278C117.713 18.6186 117.575 18.9036 117.666 19.1644C117.756 19.4252 119.322 19.0653 119.583 18.9745C120.229 18.7498 119.704 18.8782 120.113 18.3085C120.331 18.0048 120.458 17.6314 120.398 17.2085C120.372 17.0331 120.317 16.8611 120.233 16.6925C121.205 16.3964 121.956 15.8899 122.367 15.2683C122.627 14.8751 122.758 14.422 122.687 13.9597C122.653 13.7336 122.572 13.5204 122.452 13.3238C122.661 13.1854 122.834 13.0189 122.975 12.8265C123.236 12.4705 123.36 12.0615 123.444 11.6797C123.489 11.478 123.561 11.0424 123.402 10.5734C123.302 10.2809 123.122 10.0029 122.837 9.76967C122.942 9.68153 123.042 9.58562 123.127 9.48112C123.442 9.09731 123.574 8.61354 123.446 7.97837C123.346 7.47759 122.991 6.99962 122.334 6.58393C122.437 6.32347 122.481 6.03787 122.482 5.76804C122.483 5.27517 122.344 4.73691 122.043 4.2982C121.436 3.4142 120.492 2.93274 119.386 2.80517Z" fill="#111111"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M122.077 22.0329C122.147 21.8107 122.162 21.5752 122.123 21.3365C122.047 20.8784 121.78 20.4524 121.418 20.091C120.692 19.3664 119.473 18.7822 117.994 18.5849C117.72 18.5484 117.468 18.7406 117.432 19.0144C117.395 19.2881 117.588 19.5396 117.861 19.5761C119.175 19.7514 120.174 20.2624 120.711 20.7987C120.981 21.0679 121.106 21.3137 121.136 21.4993C121.163 21.6615 121.126 21.8081 120.981 21.9538L120.388 22.5499L121.195 22.7861C122.442 23.1513 123.238 23.7987 123.561 24.6146C123.673 24.8991 123.678 25.2292 123.594 25.5111C123.508 25.8016 123.354 25.9674 123.224 26.0243L122.48 26.3508L123.107 26.868C123.898 27.5207 123.986 27.9365 123.977 28.0958C123.965 28.286 123.923 28.3995 123.88 28.4709C123.839 28.5405 123.78 28.5977 123.691 28.651C123.52 28.753 123.31 28.8076 123.007 28.8865C122.926 28.9077 122.838 28.9306 122.742 28.9567L121.674 29.2474L122.598 29.8566C123.107 30.1922 123.202 30.4846 123.217 30.6555C123.233 30.8574 123.151 31.0399 123.083 31.1562C122.914 31.4447 122.756 31.6434 122.561 31.7746C122.376 31.8993 122.113 31.9922 121.68 31.9815L120.597 31.9547L121.279 32.7961C121.5 33.0694 121.544 33.2822 121.527 33.4273C121.511 33.5715 121.425 33.7401 121.203 33.9062C120.74 34.2519 119.794 34.4925 118.464 34.3151L117.434 34.1777L117.97 35.0684C118.183 35.423 118.211 35.6394 118.197 35.7544C118.185 35.8497 118.136 35.9401 117.998 36.0352C117.849 36.1381 117.619 36.2262 117.315 36.2876C117.016 36.348 116.677 36.3766 116.334 36.3811C116.058 36.3847 115.837 36.6114 115.841 36.8875C115.844 37.1636 116.071 37.3846 116.347 37.381C116.732 37.376 117.137 37.3439 117.513 37.2678C117.884 37.1928 118.26 37.0687 118.565 36.8591C118.881 36.6418 119.134 36.3195 119.189 35.8776C119.21 35.7126 119.201 35.5441 119.166 35.3728C120.266 35.3986 121.194 35.1612 121.802 34.7072C122.188 34.4181 122.466 34.0213 122.521 33.5403C122.546 33.3234 122.523 33.1081 122.459 32.8983C122.705 32.8349 122.924 32.7362 123.12 32.604C123.499 32.349 123.748 31.9987 123.946 31.6615C124.051 31.4819 124.256 31.0805 124.213 30.5719C124.188 30.2688 124.078 29.9641 123.861 29.6725C123.981 29.6266 124.097 29.5733 124.203 29.5101C124.408 29.3881 124.598 29.2204 124.739 28.9828C124.88 28.7471 124.955 28.4712 124.975 28.1572C125.006 27.6401 124.757 27.0842 124.188 26.5028C124.358 26.2934 124.479 26.0454 124.553 25.7955C124.695 25.3176 124.692 24.7567 124.491 24.2469C124.085 23.2217 123.212 22.4859 122.077 22.0329Z" fill="#111111"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M122.077 5.5L118.765 2.29038L115 0.5H191.5V37.5H116.5V36.5H118.197L119.032 35.0684L121.802 34.1777V32.604L123.88 31.1562L123.107 29.5101L124.491 28.9828L123.88 26.868L124.213 24.7771L122.561 22.5499L119.408 19.1644L120 16.5L121.195 16.0467L123 11L122.077 5.5Z" fill="#111111"/>
<mask id="mask0_5_3" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="109" y="0" width="78" height="38">
<path fill-rule="evenodd" clip-rule="evenodd" d="M114.386 2.80517C114.393 2.57069 114.348 2.3392 114.255 2.11928C114.077 1.69954 113.738 1.35465 113.322 1.09748C112.492 0.583728 111.265 0.358072 109.914 0.593113C109.642 0.640467 109.46 0.899396 109.507 1.17145C109.555 1.4435 109.814 1.62565 110.086 1.5783C111.246 1.37641 112.214 1.58769 112.796 1.94781C113.087 2.12758 113.258 2.32886 113.334 2.50991C113.406 2.67803 113.409 2.85596 113.314 3.05449L112.972 3.77039L113.765 3.77039C114.904 3.77038 115.736 4.1618 116.218 4.86417C116.39 5.11429 116.483 5.44798 116.482 5.76505C116.481 6.0947 116.382 6.31239 116.286 6.40364L115.764 6.90069L116.412 7.21564C117.24 7.61757 117.429 7.99264 117.466 8.17495C117.54 8.54668 117.46 8.71831 117.354 8.8474C117.234 8.99365 117.072 9.10377 116.831 9.26727C116.766 9.31167 116.695 9.36 116.617 9.41405L115.813 9.97426L116.739 10.2966C117.236 10.4697 117.394 10.7161 117.455 10.8959C117.527 11.1066 117.498 11.3263 117.468 11.4645C117.394 11.8016 117.305 12.0481 117.168 12.2356C117.04 12.4099 116.845 12.5677 116.486 12.6759L115.565 12.9541L116.322 13.548C116.573 13.7444 116.673 13.9419 116.699 14.1108C116.725 14.2821 116.684 14.4881 116.533 14.7163C116.223 15.185 115.479 15.6817 114.307 15.8858L113.383 16.0467L114.032 16.7242C114.301 17.0058 114.388 17.2148 114.408 17.3507C114.425 17.4739 114.396 17.5921 114.3 17.7253C114.082 18.0295 113.583 18.3156 112.973 18.5278C112.713 18.6186 112.575 18.9036 112.666 19.1644C112.756 19.4252 114.322 19.0653 114.583 18.9745C115.229 18.7498 114.704 18.8782 115.113 18.3085C115.331 18.0048 115.458 17.6314 115.398 17.2085C115.372 17.0331 115.317 16.8611 115.233 16.6925C116.205 16.3964 116.956 15.8899 117.367 15.2683C117.627 14.8751 117.758 14.422 117.687 13.9597C117.653 13.7336 117.572 13.5204 117.452 13.3238C117.661 13.1854 117.834 13.0189 117.975 12.8265C118.236 12.4705 118.36 12.0615 118.444 11.6797C118.489 11.478 118.561 11.0424 118.402 10.5734C118.302 10.2809 118.122 10.0029 117.837 9.76967C117.942 9.68153 118.042 9.58562 118.127 9.48112C118.442 9.09731 118.574 8.61354 118.446 7.97837C118.346 7.47759 117.991 6.99962 117.334 6.58393C117.437 6.32347 117.481 6.03787 117.482 5.76804C117.483 5.27517 117.344 4.73691 117.043 4.2982C116.436 3.4142 115.492 2.93274 114.386 2.80517Z" fill="#111111"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M117.077 22.0329C117.147 21.8107 117.162 21.5752 117.123 21.3365C117.047 20.8784 116.78 20.4524 116.418 20.091C115.692 19.3664 114.473 18.7822 112.994 18.5849C112.72 18.5484 112.468 18.7406 112.432 19.0144C112.395 19.2881 112.588 19.5396 112.861 19.5761C114.175 19.7514 115.174 20.2624 115.711 20.7987C115.981 21.0679 116.106 21.3137 116.136 21.4993C116.163 21.6615 116.126 21.8081 115.981 21.9538L115.388 22.5499L116.195 22.7861C117.442 23.1513 118.238 23.7987 118.561 24.6146C118.673 24.8991 118.678 25.2292 118.594 25.5111C118.508 25.8016 118.354 25.9674 118.224 26.0243L117.48 26.3508L118.107 26.868C118.898 27.5207 118.986 27.9365 118.977 28.0958C118.965 28.286 118.923 28.3995 118.88 28.4709C118.839 28.5405 118.78 28.5977 118.691 28.651C118.52 28.753 118.31 28.8076 118.007 28.8865C117.926 28.9077 117.838 28.9306 117.742 28.9567L116.674 29.2474L117.598 29.8566C118.107 30.1922 118.202 30.4846 118.217 30.6555C118.233 30.8574 118.151 31.0399 118.083 31.1562C117.914 31.4447 117.756 31.6434 117.561 31.7746C117.376 31.8993 117.113 31.9922 116.68 31.9815L115.597 31.9547L116.279 32.7961C116.5 33.0694 116.544 33.2822 116.527 33.4273C116.511 33.5715 116.425 33.7401 116.203 33.9062C115.74 34.2519 114.794 34.4925 113.464 34.3151L112.434 34.1777L112.97 35.0684C113.183 35.423 113.211 35.6394 113.197 35.7544C113.185 35.8497 113.136 35.9401 112.998 36.0352C112.849 36.1381 112.619 36.2262 112.315 36.2876C112.016 36.348 111.677 36.3766 111.334 36.3811C111.058 36.3847 110.837 36.6114 110.841 36.8875C110.844 37.1636 111.071 37.3846 111.347 37.381C111.732 37.376 112.137 37.3439 112.513 37.2678C112.884 37.1928 113.26 37.0687 113.565 36.8591C113.881 36.6418 114.134 36.3195 114.189 35.8776C114.21 35.7126 114.201 35.5441 114.166 35.3728C115.266 35.3986 116.194 35.1612 116.802 34.7072C117.188 34.4181 117.466 34.0213 117.521 33.5403C117.546 33.3234 117.523 33.1081 117.459 32.8983C117.705 32.8349 117.924 32.7362 118.12 32.604C118.499 32.349 118.748 31.9987 118.946 31.6615C119.051 31.4819 119.256 31.0805 119.213 30.5719C119.188 30.2688 119.078 29.9641 118.861 29.6725C118.981 29.6266 119.097 29.5733 119.203 29.5101C119.408 29.3881 119.598 29.2204 119.739 28.9828C119.88 28.7471 119.955 28.4712 119.975 28.1572C120.006 27.6401 119.757 27.0842 119.188 26.5028C119.358 26.2934 119.479 26.0454 119.553 25.7955C119.695 25.3176 119.692 24.7567 119.491 24.2469C119.085 23.2217 118.212 22.4859 117.077 22.0329Z" fill="#111111"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M117.077 5.5L113.765 2.29038L110 0.5H186.5V37.5H111.5V36.5H113.197L114.032 35.0684L116.802 34.1777V32.604L118.88 31.1562L118.107 29.5101L119.491 28.9828L118.88 26.868L119.213 24.7771L117.561 22.5499L114.408 19.1644L115 16.5L116.195 16.0467L118 11L117.077 5.5Z" fill="#111111"/>
</mask>
<g mask="url(#mask0_5_3)">
<rect x="100" y="1" width="91" height="36" rx="2" fill="#E1DCD3"/>
<path d="M116.16 19.92L116.12 19.36C117.72 19.36 119.12 19.6133 120.32 20.12C121.547 20.6267 122.507 21.3333 123.2 22.24C123.893 23.1467 124.24 24.2 124.24 25.4C124.24 26.7067 123.827 27.8667 123 28.88C122.173 29.8667 121.013 30.64 119.52 31.2C118.053 31.7333 116.32 32 114.32 32H110.96V29.24L112.92 29.12C113.907 29.0667 114.747 28.88 115.44 28.56C116.16 28.24 116.707 27.8 117.08 27.24C117.48 26.6533 117.68 25.9867 117.68 25.24C117.68 24.4133 117.48 23.7067 117.08 23.12C116.707 22.5333 116.133 22.0667 115.36 21.72C114.587 21.3467 113.6 21.12 112.4 21.04L110.96 20.92V18.4L112.56 18.28C114.213 18.1467 115.413 17.7333 116.16 17.04C116.933 16.3467 117.32 15.4267 117.32 14.28C117.32 13.1867 116.92 12.32 116.12 11.68C115.32 11.0133 114.28 10.64 113 10.56L110.96 10.44V7.84H113.68C115.627 7.84 117.333 8.12 118.8 8.68C120.267 9.21333 121.413 9.97333 122.24 10.96C123.067 11.92 123.48 13.0533 123.48 14.36C123.48 15.4533 123.173 16.4267 122.56 17.28C121.947 18.1067 121.093 18.76 120 19.24C118.907 19.6933 117.627 19.92 116.16 19.92ZM111.72 7.84V32H103.4V29.8C104.173 29.6133 104.747 29.3333 105.12 28.96C105.52 28.5867 105.72 28.0133 105.72 27.24V12.6C105.72 11.8267 105.533 11.24 105.16 10.84C104.813 10.4133 104.227 10.1467 103.4 10.04V7.84H111.72ZM128.233 8.28C128.233 7.34667 128.579 6.56 129.273 5.92C129.966 5.28 130.806 4.96 131.793 4.96C132.779 4.96 133.606 5.28 134.273 5.92C134.939 6.56 135.273 7.34667 135.273 8.28C135.273 9.24 134.939 10.0533 134.273 10.72C133.606 11.36 132.779 11.68 131.793 11.68C130.806 11.68 129.966 11.36 129.273 10.72C128.579 10.0533 128.233 9.24 128.233 8.28ZM137.193 32H126.833V29.8C127.633 29.5867 128.193 29.2933 128.513 28.92C128.859 28.52 129.033 27.92 129.033 27.12V20.36C129.033 19.5867 128.859 19.0133 128.513 18.64C128.166 18.2667 127.606 18 126.833 17.84V15.64L132.473 13.6H134.993V27.24C134.993 28.0133 135.166 28.5867 135.513 28.96C135.886 29.3333 136.446 29.6133 137.193 29.8V32ZM151.298 16.56H142.178V13.6H151.298V16.56ZM151.538 28.4L152.218 30.44C151.472 30.92 150.538 31.3467 149.418 31.72C148.325 32.0933 147.232 32.28 146.138 32.28C144.352 32.28 142.925 31.7467 141.858 30.68C140.792 29.5867 140.258 28.1867 140.258 26.48V16.56H138.618V14.2C139.765 13.8 140.765 13.2 141.618 12.4C142.498 11.5733 143.098 10.5867 143.418 9.44H146.218V25.72C146.218 26.6267 146.498 27.36 147.058 27.92C147.645 28.48 148.392 28.76 149.298 28.76C149.645 28.76 150.005 28.7333 150.378 28.68C150.752 28.6 151.138 28.5067 151.538 28.4ZM169.554 27.68L170.394 29.96C169.648 30.44 168.621 30.9467 167.314 31.48C166.034 32.0133 164.541 32.28 162.834 32.28C161.021 32.28 159.381 31.9067 157.914 31.16C156.474 30.4133 155.328 29.36 154.474 28C153.621 26.64 153.194 25.0267 153.194 23.16C153.194 21.2933 153.608 19.6267 154.434 18.16C155.288 16.6667 156.448 15.4933 157.914 14.64C159.381 13.76 161.048 13.32 162.914 13.32C164.728 13.32 166.234 13.76 167.434 14.64C168.661 15.4933 169.581 16.6533 170.194 18.12C170.808 19.5867 171.114 21.2267 171.114 23.04H159.034V20.48L165.554 20.12C165.554 19.4267 165.448 18.8 165.234 18.24C165.048 17.68 164.741 17.24 164.314 16.92C163.914 16.5733 163.408 16.4 162.794 16.4C161.994 16.4 161.354 16.6933 160.874 17.28C160.394 17.8667 160.048 18.5867 159.834 19.44C159.648 20.2933 159.554 21.12 159.554 21.92C159.554 23.8667 160.048 25.4667 161.034 26.72C162.021 27.9467 163.341 28.56 164.994 28.56C165.661 28.56 166.421 28.4667 167.274 28.28C168.128 28.0933 168.888 27.8933 169.554 27.68ZM179.64 32.28C178.227 32.28 177.04 32.1467 176.08 31.88C175.12 31.6133 174.32 31.3067 173.68 30.96V25.96H176.28C176.493 27.1067 176.893 27.9867 177.48 28.6C178.093 29.2133 178.973 29.52 180.12 29.52C180.893 29.52 181.493 29.3333 181.92 28.96C182.347 28.5867 182.56 28.0933 182.56 27.48C182.56 27 182.333 26.6 181.88 26.28C181.453 25.9333 180.893 25.6133 180.2 25.32C179.533 25.0267 178.813 24.72 178.04 24.4C177.267 24.0533 176.533 23.6667 175.84 23.24C175.173 22.7867 174.613 22.24 174.16 21.6C173.733 20.96 173.52 20.1733 173.52 19.24C173.52 18.0133 173.827 16.96 174.44 16.08C175.053 15.2 175.933 14.52 177.08 14.04C178.227 13.56 179.587 13.32 181.16 13.32C182.44 13.32 183.52 13.4267 184.4 13.64C185.307 13.8533 186.16 14.1467 186.96 14.52V19.08H184.36C184.173 18.04 183.787 17.28 183.2 16.8C182.64 16.32 181.96 16.08 181.16 16.08C180.467 16.08 179.933 16.2667 179.56 16.64C179.187 17.0133 179 17.4667 179 18C179 18.48 179.213 18.8933 179.64 19.24C180.093 19.56 180.667 19.8667 181.36 20.16C182.08 20.4533 182.827 20.7733 183.6 21.12C184.373 21.44 185.107 21.8133 185.8 22.24C186.52 22.6667 187.093 23.1867 187.52 23.8C187.973 24.4133 188.2 25.1733 188.2 26.08C188.2 28 187.427 29.52 185.88 30.64C184.36 31.7333 182.28 32.28 179.64 32.28Z" fill="#443023"/>
<rect x="95" y="1" width="91" height="36" rx="2" fill="#E1DCD3"/>
<path d="M111.16 19.92L111.12 19.36C112.72 19.36 114.12 19.6133 115.32 20.12C116.547 20.6267 117.507 21.3333 118.2 22.24C118.893 23.1467 119.24 24.2 119.24 25.4C119.24 26.7067 118.827 27.8667 118 28.88C117.173 29.8667 116.013 30.64 114.52 31.2C113.053 31.7333 111.32 32 109.32 32H105.96V29.24L107.92 29.12C108.907 29.0667 109.747 28.88 110.44 28.56C111.16 28.24 111.707 27.8 112.08 27.24C112.48 26.6533 112.68 25.9867 112.68 25.24C112.68 24.4133 112.48 23.7067 112.08 23.12C111.707 22.5333 111.133 22.0667 110.36 21.72C109.587 21.3467 108.6 21.12 107.4 21.04L105.96 20.92V18.4L107.56 18.28C109.213 18.1467 110.413 17.7333 111.16 17.04C111.933 16.3467 112.32 15.4267 112.32 14.28C112.32 13.1867 111.92 12.32 111.12 11.68C110.32 11.0133 109.28 10.64 108 10.56L105.96 10.44V7.84H108.68C110.627 7.84 112.333 8.12 113.8 8.68C115.267 9.21333 116.413 9.97333 117.24 10.96C118.067 11.92 118.48 13.0533 118.48 14.36C118.48 15.4533 118.173 16.4267 117.56 17.28C116.947 18.1067 116.093 18.76 115 19.24C113.907 19.6933 112.627 19.92 111.16 19.92ZM106.72 7.84V32H98.4V29.8C99.1733 29.6133 99.7467 29.3333 100.12 28.96C100.52 28.5867 100.72 28.0133 100.72 27.24V12.6C100.72 11.8267 100.533 11.24 100.16 10.84C99.8133 10.4133 99.2267 10.1467 98.4 10.04V7.84H106.72ZM123.233 8.28C123.233 7.34667 123.579 6.56 124.273 5.92C124.966 5.28 125.806 4.96 126.793 4.96C127.779 4.96 128.606 5.28 129.273 5.92C129.939 6.56 130.273 7.34667 130.273 8.28C130.273 9.24 129.939 10.0533 129.273 10.72C128.606 11.36 127.779 11.68 126.793 11.68C125.806 11.68 124.966 11.36 124.273 10.72C123.579 10.0533 123.233 9.24 123.233 8.28ZM132.193 32H121.833V29.8C122.633 29.5867 123.193 29.2933 123.513 28.92C123.859 28.52 124.033 27.92 124.033 27.12V20.36C124.033 19.5867 123.859 19.0133 123.513 18.64C123.166 18.2667 122.606 18 121.833 17.84V15.64L127.473 13.6H129.993V27.24C129.993 28.0133 130.166 28.5867 130.513 28.96C130.886 29.3333 131.446 29.6133 132.193 29.8V32ZM146.298 16.56H137.178V13.6H146.298V16.56ZM146.538 28.4L147.218 30.44C146.472 30.92 145.538 31.3467 144.418 31.72C143.325 32.0933 142.232 32.28 141.138 32.28C139.352 32.28 137.925 31.7467 136.858 30.68C135.792 29.5867 135.258 28.1867 135.258 26.48V16.56H133.618V14.2C134.765 13.8 135.765 13.2 136.618 12.4C137.498 11.5733 138.098 10.5867 138.418 9.44H141.218V25.72C141.218 26.6267 141.498 27.36 142.058 27.92C142.645 28.48 143.392 28.76 144.298 28.76C144.645 28.76 145.005 28.7333 145.378 28.68C145.752 28.6 146.138 28.5067 146.538 28.4ZM164.554 27.68L165.394 29.96C164.648 30.44 163.621 30.9467 162.314 31.48C161.034 32.0133 159.541 32.28 157.834 32.28C156.021 32.28 154.381 31.9067 152.914 31.16C151.474 30.4133 150.328 29.36 149.474 28C148.621 26.64 148.194 25.0267 148.194 23.16C148.194 21.2933 148.608 19.6267 149.434 18.16C150.288 16.6667 151.448 15.4933 152.914 14.64C154.381 13.76 156.048 13.32 157.914 13.32C159.728 13.32 161.234 13.76 162.434 14.64C163.661 15.4933 164.581 16.6533 165.194 18.12C165.808 19.5867 166.114 21.2267 166.114 23.04H154.034V20.48L160.554 20.12C160.554 19.4267 160.448 18.8 160.234 18.24C160.048 17.68 159.741 17.24 159.314 16.92C158.914 16.5733 158.408 16.4 157.794 16.4C156.994 16.4 156.354 16.6933 155.874 17.28C155.394 17.8667 155.048 18.5867 154.834 19.44C154.648 20.2933 154.554 21.12 154.554 21.92C154.554 23.8667 155.048 25.4667 156.034 26.72C157.021 27.9467 158.341 28.56 159.994 28.56C160.661 28.56 161.421 28.4667 162.274 28.28C163.128 28.0933 163.888 27.8933 164.554 27.68ZM174.64 32.28C173.227 32.28 172.04 32.1467 171.08 31.88C170.12 31.6133 169.32 31.3067 168.68 30.96V25.96H171.28C171.493 27.1067 171.893 27.9867 172.48 28.6C173.093 29.2133 173.973 29.52 175.12 29.52C175.893 29.52 176.493 29.3333 176.92 28.96C177.347 28.5867 177.56 28.0933 177.56 27.48C177.56 27 177.333 26.6 176.88 26.28C176.453 25.9333 175.893 25.6133 175.2 25.32C174.533 25.0267 173.813 24.72 173.04 24.4C172.267 24.0533 171.533 23.6667 170.84 23.24C170.173 22.7867 169.613 22.24 169.16 21.6C168.733 20.96 168.52 20.1733 168.52 19.24C168.52 18.0133 168.827 16.96 169.44 16.08C170.053 15.2 170.933 14.52 172.08 14.04C173.227 13.56 174.587 13.32 176.16 13.32C177.44 13.32 178.52 13.4267 179.4 13.64C180.307 13.8533 181.16 14.1467 181.96 14.52V19.08H179.36C179.173 18.04 178.787 17.28 178.2 16.8C177.64 16.32 176.96 16.08 176.16 16.08C175.467 16.08 174.933 16.2667 174.56 16.64C174.187 17.0133 174 17.4667 174 18C174 18.48 174.213 18.8933 174.64 19.24C175.093 19.56 175.667 19.8667 176.36 20.16C177.08 20.4533 177.827 20.7733 178.6 21.12C179.373 21.44 180.107 21.8133 180.8 22.24C181.52 22.6667 182.093 23.1867 182.52 23.8C182.973 24.4133 183.2 25.1733 183.2 26.08C183.2 28 182.427 29.52 180.88 30.64C179.36 31.7333 177.28 32.28 174.64 32.28Z" fill="#443023"/>
<rect x="95" y="1" width="25" height="36" rx="2" fill="#E1DCD3"/>
</g>
</g>
<defs>

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 14 KiB

22
front/src/lib/APIDEV.js Normal file
View file

@ -0,0 +1,22 @@
import Items from '%/lib/testData.js';
export function getPopularToday() {
return Items;
}
export function getMenuItems() {
return [
{
name: "Main Menu",
items: Items,
},
{
name: "Breakfast",
items: [],
},
{
name: "Seasonal",
items: Items,
},
];
}

View file

@ -32,22 +32,22 @@ export default Items = [
price: -9999,
labels: ["nut"],
},
{
name: "GwaGwa",
price: "Priceless",
labels: ["nut"],
// image: "/dab.jpg",
},
// {
// name: "GwaGwa",
// price: "Priceless",
// labels: ["nut"],
// image: "/dab.jpg",
// },
{
name: "Hogermellon",
price: "balls",
price: "1111",
labels: ["fish"],
image: "/wathog.jpg",
},
{
name: "Blue HOGGGGG",
price: "ARUGH",
labels: ["nut", "gluten", "spicy"],
image: "/sonichog.jpg",
},
// {
// name: "Blue HOGGGGG",
// price: "ARUGH",
// labels: ["nut", "gluten", "spicy"],
// image: "/sonichog.jpg",
// },
];

View file

@ -13,6 +13,3 @@
<div class="spacer"></div>
<p>Looking past orders? Check out the <a href="/contact" use:link>commonly asked questions</a></p>
<style>
</style>

View file

@ -1,5 +1,24 @@
<script>
import DropDown from "%/components/DropDown.svelte";
const minMessageLength = 150;
let name = "";
let email = "";
let message = "";
let nameValid = true;
let emailValid = true;
let messageValid = false;
function expandTextAera(event) {
event.target.style.height = "";
event.target.style.height = (event.target.scrollHeight + 5) + "px";
}
function onSubmit(event) {
console.log(name, email, message);
}
</script>
<h1>Contact us</h1>
@ -26,6 +45,141 @@
<div class="spacer" />
<h2>Contact From</h2>
<form>
<form on:submit|preventDefault={onSubmit}>
<div class="form-element">
<label class="form-label" for="name">Name</label>
<input
bind:value={name}
on:blur={() => {nameValid = name.length > 1}}
type="text"
id="name"
name="name"
class="form-input"
/>
{#if !nameValid}
<span class="form-notice error">Enter a name</span>
{/if}
</div>
</form>
<div class="form-element">
<label class="form-label" for="email">Email</label>
<input
bind:value={email}
on:blur={() => {emailValid = email.length > 1}}
type="text"
id="email"
name="email"
class="form-input"
/>
{#if !emailValid}
<span class="form-notice error">Email not valid</span>
{/if}
</div>
<div class="form-element">
<label class="form-label" for="message">Message</label>
<textarea
bind:value={message}
on:input={expandTextAera}
on:input={() => {messageValid = message.length > minMessageLength}}
id="message"
name="message"
class="form-input"
/>
<span class="form-notice" class:error={!messageValid}>
({message.length}/{minMessageLength})
</span>
</div>
<button type="submit">Submit</button>
</form>
<style lang="scss">
@import "%/styles/vars";
.form-element {
margin-bottom: $spacing-normal;
width: fit-content;
overflow: hidden;
.form-label {
padding: $spacing-xsmall;
display: block;
font-size: $font-size-small;
color: $color-on-background;
}
.form-input {
padding: $spacing-small;
display: block;
font-family: $font-family;
font-size: $font-size-p;
border: 1px solid rgba($color-dark, 0.2);
border-radius: $border-radius-normal;
background-color: $color-light;
color: $color-on-light;
&:hover {
border: 1px solid rgba($color-dark, 0.4);
}
&:focus {
border: 1px solid rgba($color-primary, 0.9);
outline: 0 solid transparent;
}
}
.form-notice {
padding: 0 $spacing-xsmall;
display: block;
font-size: $font-size-xsmall;
color: rgba($color-on-background, 0.7);
&.error {
color: $color-error;
}
}
}
#name, #email {
width: 300px;
max-width: calc(100vw - calc(2 * $spacing-normal));
}
#message {
min-width: 250px;
max-width: calc(100vw - calc(2 * $spacing-normal));
resize: horizontal;
}
button {
padding: 0 $spacing-normal;
height: 30px;
display: flex;
justify-content: center;
align-items: center;
text-shadow: 0 1px 0.5px rgba($color-dark, 0.3);;
border: 0 solid transparent;
border-radius: 9999px;
background-color: $color-dark;
color: $color-on-dark;
&:hover, &:focus {
border: 0 solid transparent;
background-color: $color-primary;
color: $color-on-primary;
outline: 0 solid transparent
}
}
</style>

View file

@ -4,10 +4,12 @@
import { ArrowUpRight } from "phosphor-svelte";
import AnnouncementBanner from "%/pages/elements/AnnouncementBanner.svelte";
import MenuList from "%/pages/elements/MenuList.svelte";
import Items from '%/testData.js';
import { getPopularToday } from "%/lib/APIDEV.js";
import { map, tileLayer} from 'leaflet';
let items = Items;
let items = getPopularToday();
onMount(() => {
let Map = map('map').setView([51.505, -0.09], 13);
@ -57,8 +59,7 @@
a {
margin-top: 8px;
padding-left: 10px;
padding-right: 10px;
padding: 0 $spacing-small;
height: 30px;
@ -80,16 +81,6 @@
}
}
#contact {
display: flex;
flex-direction: row;
.container {
margin-left: $spacing-normal;
padding: $spacing-normal;
}
}
#map {
min-width: 550px;
height: 350px;
@ -97,25 +88,42 @@
border-radius: $border-radius-normal;
}
#contact {
display: flex;
flex-direction: row;
.container {
margin-left: $spacing-small;
padding: $spacing-normal;
}
}
@media only screen and (max-width: 900px) {
#map {
min-width: 400px;
height: 300px;
border-radius: $border-radius-normal 0 0 $border-radius-normal;
}
#contact {
.container {
margin-left: 0;
border-radius: 0 $border-radius-normal $border-radius-normal 0;
}
}
}
@media only screen and (max-width: 750px) {
#map {
min-width: unset;
height: 350px;
border-radius: $border-radius-normal $border-radius-normal 0 0;
}
#contact {
display: flex;
flex-direction: column;
.container {
margin-left: 0;
margin-top: $spacing-normal;
border-radius: 0 0 $border-radius-normal $border-radius-normal;
}
}
#map {
min-width: unset;
height: 350px;
}
}
</style>

View file

@ -1,7 +1,7 @@
<script>
import MenuList from "%/pages/elements/MenuList.svelte";
import LoadingImage from "/MenuItemLoading.svg";
import Items from '%/testData.js';
import Items from '%/lib/testData.js';
let items = Items;

View file

@ -2,9 +2,9 @@
import { ArrowClockwise } from "phosphor-svelte";
import MenuList from "%/pages/elements/MenuList.svelte";
import DropDown from "%/components/DropDown.svelte";
import Items from '%/testData.js';
import { getMenuItems } from "%/lib/APIDEV.js";
let items = Items;
let items = getMenuItems();
</script>
<div class="menu">
@ -138,16 +138,15 @@
</div>
<div id="menu-list">
<h2>Main Menu</h2>
<MenuList items={items} />
<div class="spacer"></div>
<h2>Pies</h2>
<MenuList items={items} />
<div class="spacer"></div>
<h2>Drinks</h2>
<MenuList items={items} />
{#each items as section}
<h2>{section.name}</h2>
{#if section.items.length > 0}
<MenuList items={section.items} />
{:else}
<p>No results</p>
{/if}
<div class="spacer" />
{/each}
</div>
</div>

View file

@ -17,6 +17,7 @@ nav {
background-color: $color-dark;
color: $color-light;
//transition: box-shadow 0.05s ease-in-out;
z-index: 9999999;
ul {
@ -39,6 +40,7 @@ nav {
padding: $spacing-xsmall $spacing-normal;
display: block;
text-decoration: none;
text-shadow: 0 1px 0.5px rgba(#000, 0.8);
color: inherit;
}
@ -66,7 +68,7 @@ nav {
}
&.scrolled {
//box-shadow: 0 0 15px 1px $color-background;
box-shadow: 0 0 3px 1px rgba(#000, 0.8);
}
&.mobile {

View file

@ -1,6 +1,7 @@
*, *::before, *::after {
box-sizing: border-box;
margin: 0;
text-rendering: optimizeLegibility;
box-sizing: border-box;
}
html {
@ -23,6 +24,7 @@ body {
h1, h2, h3, h4, h5, h6 {
padding-bottom: $spacing-small;
text-shadow: 0 1px 0.5px rgba($color-dark, 0.3);
}
h1 {
font-size: $font-size-h1;
@ -51,9 +53,11 @@ h6 {
p {
font-size: $font-size-p;
font-weight: $font-weight-normal;
text-shadow: 0 1px 0.5px rgba($color-dark, 0.3);
a {
text-decoration: none;
text-shadow: 0 1px 0.5px rgba($color-dark, 0.3);
color: $color-primary;
&:hover {

View file

@ -7,6 +7,8 @@ $color-light: #fff8eb;
$color-on-light: #33251a;
$color-primary: #6A9343;
$color-on-primary: #fffbf4;
$color-error: #ab5642;
$color-on-error: #fffbf4;
$color-vegan: #75a446;
$color-fish: #487fa6;