Pavle Golubovic пре 2 година
родитељ
комит
d2328bbe27

+ 2
- 0
frontend/src/App.js Прегледај датотеку

@@ -32,6 +32,7 @@ const PrivacyPolicy = lazy(() => import('./pages/PrivacyPolicy'));
const WorkWithUs = lazy(() => import('./pages/WorkWithUs'));
import NavigationNew from './components/shared/NavigationNew';
import ArticlePage from './pages/ArticlePage';
import NotFoundPage from './pages/NotFoundPage';

// Navigation Links
const links = routes.filter(item => item.nav === true);
@@ -94,6 +95,7 @@ function App() {
)}
<Suspense fallback={<Loader />}>
<Routes>
<Route path="*" element={<NotFoundPage />}/>
<Route exact path="/" element={<Home forwardedRef={forwardedRef} />} />
<Route exact path="/workwithus" element={<WorkWithUs />} />
<Route exact path="/portfolio" element={<Portfolio />} />

+ 205
- 0
frontend/src/assets/graphics/_404.svg Прегледај датотеку

@@ -0,0 +1,205 @@
<svg width="1221" height="414" viewBox="0 0 1221 414" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M719.444 88.7117C702.88 88.2369 689.068 101.279 688.593 117.843C688.119 134.406 701.161 148.218 717.724 148.693C734.288 149.168 748.1 136.125 748.575 119.562C749.049 102.999 736.007 89.1866 719.444 88.7117Z" fill="#B9CFE4"/>
<path d="M579.329 238.261C559.794 238.261 543.958 222.425 543.958 202.89C543.958 183.356 559.794 167.52 579.329 167.52C598.863 167.52 614.699 183.356 614.699 202.89C614.699 222.425 598.863 238.261 579.329 238.261Z" fill="#B9CFE4"/>
<path d="M730.327 261.363C730.327 261.736 730.216 262.102 730.008 262.412C729.8 262.723 729.505 262.965 729.16 263.108C728.814 263.25 728.434 263.287 728.068 263.214C727.701 263.14 727.365 262.96 727.101 262.695C726.837 262.43 726.658 262.093 726.586 261.726C726.514 261.36 726.553 260.98 726.697 260.635C726.841 260.29 727.084 259.996 727.395 259.789C727.707 259.583 728.072 259.473 728.446 259.475C728.694 259.475 728.939 259.523 729.168 259.618C729.396 259.713 729.604 259.853 729.779 260.028C729.953 260.203 730.092 260.412 730.186 260.641C730.28 260.87 730.328 261.115 730.327 261.363Z" fill="black"/>
<path d="M681.073 236.96C681.073 237.334 680.962 237.699 680.755 238.009C680.547 238.32 680.252 238.562 679.907 238.705C679.562 238.848 679.183 238.885 678.817 238.812C678.45 238.739 678.114 238.559 677.85 238.295C677.586 238.031 677.406 237.695 677.333 237.329C677.26 236.962 677.298 236.583 677.441 236.238C677.583 235.893 677.825 235.598 678.136 235.39C678.446 235.183 678.811 235.072 679.185 235.072C679.686 235.072 680.166 235.271 680.52 235.625C680.874 235.979 681.073 236.46 681.073 236.96Z" fill="white"/>
<path d="M705.71 236.96C705.71 237.334 705.599 237.699 705.391 238.009C705.184 238.32 704.889 238.562 704.544 238.705C704.199 238.848 703.82 238.885 703.453 238.812C703.087 238.739 702.751 238.559 702.487 238.295C702.223 238.031 702.043 237.695 701.97 237.329C701.897 236.962 701.934 236.583 702.077 236.238C702.22 235.893 702.462 235.598 702.773 235.39C703.083 235.183 703.448 235.072 703.822 235.072C704.322 235.072 704.803 235.271 705.157 235.625C705.511 235.979 705.71 236.46 705.71 236.96Z" fill="white"/>
<path d="M730.327 236.96C730.327 237.334 730.216 237.699 730.008 238.01C729.8 238.321 729.505 238.563 729.16 238.705C728.814 238.848 728.434 238.885 728.068 238.812C727.701 238.738 727.365 238.558 727.101 238.293C726.837 238.028 726.658 237.691 726.586 237.324C726.514 236.957 726.553 236.578 726.697 236.233C726.841 235.888 727.084 235.594 727.395 235.387C727.707 235.18 728.072 235.071 728.446 235.072C728.694 235.072 728.939 235.121 729.168 235.216C729.396 235.311 729.604 235.45 729.779 235.626C729.953 235.801 730.092 236.009 730.186 236.238C730.28 236.467 730.328 236.713 730.327 236.96Z" fill="black"/>
<path d="M754.952 236.96C754.952 237.334 754.841 237.699 754.634 238.009C754.426 238.32 754.131 238.562 753.786 238.705C753.441 238.848 753.062 238.885 752.695 238.812C752.329 238.739 751.993 238.559 751.729 238.295C751.465 238.031 751.285 237.695 751.212 237.329C751.139 236.962 751.177 236.583 751.32 236.238C751.462 235.893 751.704 235.598 752.015 235.39C752.325 235.183 752.69 235.072 753.064 235.072C753.565 235.072 754.045 235.271 754.399 235.625C754.753 235.979 754.952 236.46 754.952 236.96Z" fill="black"/>
<path d="M681.073 261.365C681.073 261.738 680.962 262.103 680.755 262.414C680.547 262.724 680.252 262.966 679.907 263.109C679.562 263.252 679.183 263.289 678.817 263.216C678.45 263.143 678.114 262.964 677.85 262.7C677.586 262.436 677.406 262.099 677.333 261.733C677.26 261.367 677.298 260.987 677.441 260.642C677.583 260.297 677.825 260.002 678.136 259.795C678.446 259.587 678.811 259.477 679.185 259.477C679.686 259.477 680.166 259.675 680.52 260.03C680.874 260.384 681.073 260.864 681.073 261.365Z" fill="black"/>
<path d="M705.71 261.365C705.71 261.738 705.599 262.103 705.391 262.414C705.184 262.724 704.889 262.966 704.544 263.109C704.199 263.252 703.82 263.289 703.453 263.216C703.087 263.143 702.751 262.964 702.487 262.7C702.223 262.436 702.043 262.099 701.97 261.733C701.897 261.367 701.934 260.987 702.077 260.642C702.22 260.297 702.462 260.002 702.773 259.795C703.083 259.587 703.448 259.477 703.822 259.477C704.322 259.477 704.803 259.675 705.157 260.03C705.511 260.384 705.71 260.864 705.71 261.365Z" fill="black"/>
<path d="M754.952 261.365C754.952 261.738 754.841 262.103 754.634 262.414C754.426 262.724 754.131 262.966 753.786 263.109C753.441 263.252 753.062 263.289 752.695 263.216C752.329 263.143 751.993 262.964 751.729 262.7C751.465 262.436 751.285 262.099 751.212 261.733C751.139 261.367 751.177 260.987 751.32 260.642C751.462 260.297 751.704 260.002 752.015 259.795C752.325 259.587 752.69 259.477 753.064 259.477C753.565 259.477 754.045 259.675 754.399 260.03C754.753 260.384 754.952 260.864 754.952 261.365Z" fill="black"/>
<path d="M681.073 285.771C681.073 286.144 680.962 286.509 680.755 286.82C680.547 287.13 680.252 287.372 679.907 287.515C679.562 287.658 679.183 287.695 678.817 287.623C678.45 287.55 678.114 287.37 677.85 287.106C677.586 286.842 677.406 286.505 677.333 286.139C677.26 285.773 677.298 285.393 677.441 285.048C677.583 284.703 677.825 284.408 678.136 284.201C678.446 283.994 678.811 283.883 679.185 283.883C679.686 283.883 680.166 284.082 680.52 284.436C680.874 284.79 681.073 285.27 681.073 285.771Z" fill="black"/>
<path d="M705.71 285.769C705.71 286.142 705.599 286.507 705.391 286.818C705.184 287.128 704.889 287.37 704.544 287.513C704.199 287.656 703.82 287.693 703.453 287.621C703.087 287.548 702.751 287.368 702.487 287.104C702.223 286.84 702.043 286.503 701.97 286.137C701.897 285.771 701.934 285.391 702.077 285.046C702.22 284.701 702.462 284.407 702.773 284.199C703.083 283.992 703.448 283.881 703.822 283.881C704.322 283.881 704.803 284.08 705.157 284.434C705.511 284.788 705.71 285.268 705.71 285.769Z" fill="black"/>
<path d="M730.327 285.769C730.327 286.143 730.216 286.508 730.008 286.819C729.8 287.129 729.505 287.371 729.16 287.514C728.814 287.657 728.434 287.694 728.068 287.62C727.701 287.547 727.365 287.366 727.101 287.101C726.837 286.837 726.658 286.499 726.586 286.133C726.514 285.766 726.553 285.386 726.697 285.041C726.841 284.696 727.084 284.402 727.395 284.196C727.707 283.989 728.072 283.879 728.446 283.881C728.694 283.881 728.939 283.93 729.168 284.025C729.396 284.12 729.604 284.259 729.779 284.434C729.953 284.61 730.092 284.818 730.186 285.047C730.28 285.276 730.328 285.521 730.327 285.769Z" fill="black"/>
<path d="M754.952 285.771C754.952 286.144 754.841 286.509 754.634 286.82C754.426 287.13 754.131 287.372 753.786 287.515C753.441 287.658 753.062 287.695 752.695 287.623C752.329 287.55 751.993 287.37 751.729 287.106C751.465 286.842 751.285 286.505 751.212 286.139C751.139 285.773 751.177 285.393 751.32 285.048C751.462 284.703 751.704 284.408 752.015 284.201C752.325 283.994 752.69 283.883 753.064 283.883C753.565 283.883 754.045 284.082 754.399 284.436C754.753 284.79 754.952 285.27 754.952 285.771Z" fill="black"/>
<path d="M681.073 310.173C681.073 310.547 680.962 310.912 680.755 311.222C680.547 311.533 680.252 311.775 679.907 311.918C679.562 312.06 679.183 312.098 678.817 312.025C678.45 311.952 678.114 311.772 677.85 311.508C677.586 311.244 677.406 310.908 677.333 310.542C677.26 310.175 677.298 309.796 677.441 309.451C677.583 309.106 677.825 308.811 678.136 308.603C678.446 308.396 678.811 308.285 679.185 308.285C679.686 308.285 680.166 308.484 680.52 308.838C680.874 309.192 681.073 309.672 681.073 310.173Z" fill="black"/>
<path d="M705.71 310.173C705.71 310.547 705.599 310.912 705.391 311.222C705.184 311.533 704.889 311.775 704.544 311.918C704.199 312.06 703.82 312.098 703.453 312.025C703.087 311.952 702.751 311.772 702.487 311.508C702.223 311.244 702.043 310.908 701.97 310.542C701.897 310.175 701.934 309.796 702.077 309.451C702.22 309.106 702.462 308.811 702.773 308.603C703.083 308.396 703.448 308.285 703.822 308.285C704.322 308.285 704.803 308.484 705.157 308.838C705.511 309.192 705.71 309.672 705.71 310.173Z" fill="black"/>
<path d="M730.327 310.173C730.327 310.547 730.216 310.912 730.008 311.223C729.8 311.534 729.505 311.776 729.16 311.918C728.814 312.061 728.434 312.098 728.068 312.024C727.701 311.951 727.365 311.77 727.101 311.506C726.837 311.241 726.658 310.904 726.586 310.537C726.514 310.17 726.553 309.79 726.697 309.446C726.841 309.101 727.084 308.806 727.395 308.6C727.707 308.393 728.072 308.284 728.446 308.285C728.694 308.285 728.939 308.334 729.168 308.429C729.396 308.524 729.604 308.663 729.779 308.839C729.953 309.014 730.092 309.222 730.186 309.451C730.28 309.68 730.328 309.926 730.327 310.173Z" fill="black"/>
<path d="M754.952 310.171C754.952 310.545 754.841 310.91 754.634 311.22C754.426 311.531 754.131 311.773 753.786 311.916C753.441 312.058 753.062 312.096 752.695 312.023C752.329 311.95 751.993 311.77 751.729 311.506C751.465 311.242 751.285 310.906 751.212 310.54C751.139 310.173 751.177 309.794 751.32 309.449C751.462 309.104 751.704 308.809 752.015 308.601C752.325 308.394 752.69 308.283 753.064 308.283C753.565 308.283 754.045 308.482 754.399 308.836C754.753 309.19 754.952 309.67 754.952 310.171Z" fill="black"/>
<path d="M635.189 294.533C641.834 298.515 650.131 298.515 656.775 294.533L752.18 237.373C758.511 233.579 762.387 226.74 762.387 219.359L762.387 103.671C762.387 96.2898 758.511 89.4505 752.18 85.6568L656.775 28.4962C650.131 24.5151 641.834 24.5151 635.189 28.4962L539.785 85.6568C533.453 89.4505 529.578 96.2898 529.578 103.671L529.578 219.359C529.578 226.74 533.453 233.579 539.785 237.373L635.189 294.533Z" fill="#E4E4E4"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M629.875 165.164C631.771 164.032 631.771 162.145 629.875 161.013L551.595 114.529C549.699 113.396 548.109 114.34 548.109 116.604L548.109 209.572C548.109 211.837 549.699 212.78 551.595 211.648L629.875 165.164Z" fill="#909090"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M600.412 74.1468C598.516 75.279 596.926 78.1096 596.926 80.374L596.926 126.732C596.926 128.997 598.516 131.764 600.412 132.897L642.487 157.868C644.383 159.001 645.973 158.057 645.973 155.793L645.973 109.183C645.973 106.918 647.563 105.975 649.459 107.107L691.351 132.016C693.247 133.148 694.837 135.916 694.837 138.18L694.837 187.935C694.837 190.2 693.247 192.967 691.351 194.099L649.459 219.071C647.563 220.204 645.973 219.26 645.973 216.996L645.973 170.386C645.973 168.121 644.383 167.178 642.487 168.31L600.473 193.282C598.577 194.414 596.987 197.182 596.987 199.446L596.987 245.804C596.987 248.069 598.516 250.836 600.473 252.032L642.548 277.255C644.444 278.387 647.563 278.387 649.459 277.255L740.399 223.286C742.295 222.153 743.885 219.386 743.885 217.121L743.885 109.057C743.885 106.793 742.295 104.025 740.399 102.893L649.459 48.9234C647.563 47.7912 644.444 47.7912 642.548 48.9234L600.412 74.1468Z" fill="#1F1F1F"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M552.941 105.286C551.046 104.154 551.046 102.33 552.941 101.135L584.62 82.3274C586.516 81.1952 588.106 82.1387 588.106 84.4032L588.106 122.018C588.106 124.283 586.516 125.226 584.62 124.094L552.941 105.286Z" fill="#909090"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M552.934 224.859C551.038 223.726 551.038 221.902 552.934 220.707L584.613 201.9C586.508 200.767 588.099 201.711 588.099 203.975L588.099 241.59C588.099 243.855 586.508 244.798 584.613 243.666L552.934 224.859Z" fill="#909090"/>
<path d="M777.364 150.177C779.556 151.199 779.699 154.263 777.612 155.485L738.533 178.365C736.723 179.426 734.411 178.347 734.06 176.279L726.474 131.639C726.069 129.254 728.507 127.395 730.699 128.417L777.364 150.177Z" fill="#909090"/>
<path d="M579.177 279.974C577.103 278.728 577.281 275.666 579.485 274.669L620.74 255.997C622.651 255.132 624.837 256.445 624.971 258.539L627.851 303.728C628.005 306.141 625.385 307.736 623.312 306.49L579.177 279.974Z" fill="#C4C4C4"/>
<path d="M356.584 209.92V180.112L424.84 82.48H466.096V177.952H483.808V209.92H466.096V238H429.16V209.92H356.584ZM431.752 123.088L395.464 177.952H431.752V123.088Z" fill="#1F1F1F"/>
<path d="M809.584 209.92V180.112L877.84 82.48H919.096V177.952H936.808V209.92H919.096V238H882.16V209.92H809.584ZM884.752 123.088L848.464 177.952H884.752V123.088Z" fill="#1F1F1F"/>
<g filter="url(#filter0_d_1240_33844)">
<path d="M966.792 322.197L966.792 293.599L967.281 293.498L1037.66 279.29L1038.15 279.39L1108.52 293.594L1108.56 322.217L1108.08 322.318L1037.69 336.496L1037.2 336.396L966.792 322.197ZM968.75 293.991L968.721 321.795L1037.64 335.701L1106.55 321.795L1106.55 293.981L1037.59 280.11L968.75 293.991Z" fill="#828282"/>
</g>
<g filter="url(#filter1_d_1240_33844)">
<path d="M1023.3 288.76C1026.16 289.011 1028.4 289.793 1029.12 290.795L1049.87 319.733C1050.55 320.688 1049.76 321.698 1047.76 322.394L985.365 344.207C983.374 344.903 980.484 345.182 977.753 344.943L894.971 337.689C892.105 337.438 889.867 336.656 889.149 335.654L868.398 306.716C867.713 305.761 868.512 304.751 870.503 304.055L932.903 282.242C934.894 281.546 937.784 281.267 940.515 281.506L1023.3 288.76Z" fill="#B4B4B4"/>
</g>
<g filter="url(#filter2_d_1240_33844)">
<path d="M1095.06 333.856C1098.1 334.92 1096.48 336.742 1092.24 337.012L1064.16 338.805C1060.49 339.039 1057.28 337.917 1057.95 336.633L1063.08 326.817C1063.85 325.337 1069.06 324.769 1072.11 325.833L1095.06 333.856Z" fill="#D3D3D3"/>
</g>
<g filter="url(#filter3_d_1240_33844)">
<path d="M1049.06 304.188C1052.1 305.252 1050.48 307.074 1046.24 307.344L1018.16 309.137C1014.49 309.371 1011.28 308.249 1011.95 306.965L1017.08 297.149C1017.85 295.669 1023.06 295.101 1026.11 296.165L1049.06 304.188Z" fill="#EDEDED"/>
</g>
<g filter="url(#filter4_d_1240_33844)">
<path d="M1127.87 335.426C1142.22 340.442 1165.48 340.442 1179.83 335.426C1194.18 330.41 1194.18 322.278 1179.83 317.262C1165.48 312.246 1142.22 312.246 1127.87 317.262C1113.52 322.278 1113.52 330.41 1127.87 335.426Z" fill="#BCBCBC"/>
</g>
<g filter="url(#filter5_d_1240_33844)">
<path d="M1092.41 261.163C1094.7 261.961 1093.48 263.327 1090.3 263.53L1036.83 266.943C1034.08 267.119 1031.67 266.278 1032.17 265.315L1041.94 246.626C1042.52 245.515 1046.43 245.089 1048.72 245.887L1092.41 261.163Z" fill="#888888"/>
</g>
<g filter="url(#filter6_d_1240_33844)">
<path d="M1214.87 379.698C1217.15 380.496 1215.94 381.862 1212.76 382.065L1178.84 384.23C1176.09 384.406 1173.68 383.564 1174.18 382.601L1180.38 370.747C1180.96 369.636 1184.87 369.21 1187.15 370.008L1214.87 379.698Z" fill="#E3E3E3"/>
</g>
<g filter="url(#filter7_d_1240_33844)">
<path d="M395.339 334.55C344.862 348.634 263.021 348.634 212.544 334.55C162.066 320.466 162.066 297.631 212.544 283.547C263.021 269.463 344.862 269.463 395.339 283.547C445.817 297.631 445.817 320.466 395.339 334.55Z" stroke="#828282" shape-rendering="crispEdges"/>
</g>
<g filter="url(#filter8_d_1240_33844)">
<path d="M299.537 254.956C302.462 255.16 304.745 255.797 305.478 256.613L328.404 282.131C329.102 282.909 328.286 283.731 326.255 284.298L257.347 303.525C255.316 304.091 252.367 304.319 249.58 304.124L158.122 297.727C155.198 297.523 152.915 296.886 152.182 296.07L129.256 270.552C128.557 269.774 129.373 268.952 131.404 268.385L200.313 249.159C202.344 248.592 205.293 248.364 208.079 248.559L299.537 254.956Z" fill="#B4B4B4"/>
</g>
<g filter="url(#filter9_d_1240_33844)">
<path d="M338.369 287.572C341.293 287.776 343.576 288.413 344.309 289.229L354.298 300.347C354.997 301.125 354.181 301.948 352.15 302.514L321.914 310.95C319.883 311.517 316.934 311.745 314.148 311.55L274.299 308.763C271.375 308.558 269.092 307.921 268.359 307.105L258.37 295.987C257.671 295.21 258.487 294.387 260.518 293.82L290.754 285.384C292.785 284.817 295.734 284.59 298.52 284.785L338.369 287.572Z" fill="#EDEDED"/>
</g>
<g filter="url(#filter10_d_1240_33844)">
<path d="M100.421 283.163C120.914 288.881 154.14 288.881 174.633 283.163C195.126 277.445 195.126 268.174 174.633 262.457C154.14 256.739 120.914 256.739 100.421 262.457C79.9283 268.174 79.9283 277.445 100.421 283.163Z" fill="#D3D3D3"/>
</g>
<g filter="url(#filter11_d_1240_33844)">
<path d="M324.404 351.681C337.175 355.244 357.88 355.244 370.65 351.681C383.421 348.118 383.421 342.341 370.65 338.778C357.88 335.215 337.175 335.215 324.404 338.778C311.634 342.341 311.634 348.118 324.404 351.681Z" fill="#D3D3D3"/>
</g>
<g filter="url(#filter12_d_1240_33844)">
<path d="M60.7484 243.922C63.0783 244.572 61.8343 245.684 58.5929 245.85L37.8151 246.908C35.0038 247.051 32.5473 246.366 33.061 245.582L36.8573 239.785C37.4496 238.881 41.4372 238.534 43.767 239.184L60.7484 243.922Z" fill="#888888"/>
</g>
<ellipse cx="668" cy="357.5" rx="258" ry="6.5" fill="url(#paint0_radial_1240_33844)"/>
<defs>
<filter id="filter0_d_1240_33844" x="934.793" y="276.289" width="173.773" height="89.207" 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="-16" dy="13"/>
<feGaussianBlur stdDeviation="8"/>
<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.05 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1240_33844"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1240_33844" result="shape"/>
</filter>
<filter id="filter1_d_1240_33844" x="836.156" y="278.422" width="213.953" height="95.6055" 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="-16" dy="13"/>
<feGaussianBlur stdDeviation="8"/>
<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.05 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1240_33844"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1240_33844" result="shape"/>
</filter>
<filter id="filter2_d_1240_33844" x="1025.86" y="322.285" width="70.7695" height="45.5508" 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="-16" dy="13"/>
<feGaussianBlur stdDeviation="8"/>
<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.05 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1240_33844"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1240_33844" result="shape"/>
</filter>
<filter id="filter3_d_1240_33844" x="979.859" y="292.617" width="70.7695" height="45.5508" 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="-16" dy="13"/>
<feGaussianBlur stdDeviation="8"/>
<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.05 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1240_33844"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1240_33844" result="shape"/>
</filter>
<filter id="filter4_d_1240_33844" x="1085.11" y="310.5" width="105.484" height="57.6875" 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="-16" dy="13"/>
<feGaussianBlur stdDeviation="8"/>
<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.05 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1240_33844"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1240_33844" result="shape"/>
</filter>
<filter id="filter5_d_1240_33844" x="1000.11" y="242.477" width="93.4805" height="53.4902" 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="-16" dy="13"/>
<feGaussianBlur stdDeviation="8"/>
<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.05 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1240_33844"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1240_33844" result="shape"/>
</filter>
<filter id="filter6_d_1240_33844" x="1142.12" y="366.598" width="73.9297" height="46.6562" 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="-16" dy="13"/>
<feGaussianBlur stdDeviation="8"/>
<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.05 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1240_33844"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1240_33844" result="shape"/>
</filter>
<filter id="filter7_d_1240_33844" x="142.004" y="269.795" width="291.875" height="104.508" 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="-16" dy="13"/>
<feGaussianBlur stdDeviation="8"/>
<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.05 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1240_33844"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1240_33844" result="shape"/>
</filter>
<filter id="filter8_d_1240_33844" x="97.0117" y="245.49" width="231.637" height="87.7031" 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="-16" dy="13"/>
<feGaussianBlur stdDeviation="8"/>
<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.05 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1240_33844"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1240_33844" result="shape"/>
</filter>
<filter id="filter9_d_1240_33844" x="226.125" y="281.717" width="128.418" height="58.9023" 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="-16" dy="13"/>
<feGaussianBlur stdDeviation="8"/>
<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.05 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1240_33844"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1240_33844" result="shape"/>
</filter>
<filter id="filter10_d_1240_33844" x="53.0508" y="255.168" width="136.953" height="61.2832" 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="-16" dy="13"/>
<feGaussianBlur stdDeviation="8"/>
<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.05 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1240_33844"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1240_33844" result="shape"/>
</filter>
<filter id="filter11_d_1240_33844" x="282.828" y="333.105" width="97.3984" height="50.248" 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="-16" dy="13"/>
<feGaussianBlur stdDeviation="8"/>
<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.05 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1240_33844"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1240_33844" result="shape"/>
</filter>
<filter id="filter12_d_1240_33844" x="0.992188" y="235.848" width="60.957" height="40.0801" 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="-16" dy="13"/>
<feGaussianBlur stdDeviation="8"/>
<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.05 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1240_33844"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1240_33844" result="shape"/>
</filter>
<radialGradient id="paint0_radial_1240_33844" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(668 357.5) rotate(90) scale(6.5 258)">
<stop stop-color="#1F1F1F"/>
<stop offset="1" stop-color="#1F1F1F" stop-opacity="0"/>
</radialGradient>
</defs>
</svg>

BIN
frontend/src/assets/images/404.png Прегледај датотеку


+ 12
- 0
frontend/src/components/IllustrationContainer.jsx Прегледај датотеку

@@ -0,0 +1,12 @@
import React from 'react'
import Illustration404 from '../assets/images/404.png';

const IllustrationContainer = () => {
return (
<div className='flex justify-center w-full'>
<img src={Illustration404} alt='Page Not found'/>
</div>
)
}

export default IllustrationContainer;

+ 15
- 0
frontend/src/components/atoms/Paragraph.jsx Прегледај датотеку

@@ -0,0 +1,15 @@
import React from 'react'
import PropTypes from 'prop-types';

const Paragraph = (props) => {
return (
<p className={"paragraph pb-8p" + (props.textCenter ? " text-center" : '') + (props.textRight ? " text-end" : '')}>{props.children}</p>
)
}

Paragraph.propTypes = {
textRight: PropTypes.bool,
textCenter:PropTypes.bool,
};

export default Paragraph;

+ 12
- 0
frontend/src/components/atoms/PrimaryButton.jsx Прегледај датотеку

@@ -0,0 +1,12 @@
import React from 'react'
import PropTypes from 'prop-types';

const PrimaryButton = ({action, content, children }) => {
return (
<button className="btn-primary px-64p py-20p w-full lg:w-max whitespace-nowrap" onClick={()=>action}>{content ? content : children}</button>
)
}

PrimaryButton.propTypes = {}

export default PrimaryButton

+ 3
- 3
frontend/src/layout/PageLayout.jsx Прегледај датотеку

@@ -2,9 +2,9 @@ import React, {useEffect} from "react";

const PageLayout = ({children}) => {

useEffect(() => {
window.scrollTo(0, 0)
}, [])
// useEffect(() => {
// window.scrollTo(0, 0)
// }, [])
return (
<div className="">{children}</div>

+ 33
- 0
frontend/src/pages/NotFoundPage.jsx Прегледај датотеку

@@ -0,0 +1,33 @@
import React from 'react'
import PageLayout from '../layout/PageLayout'
import PageTitle from '../components/shared/PageTitle'
import Paragraph from '../components/atoms/Paragraph'
import PrimaryButton from './../components/atoms/PrimaryButton';
import { Link } from 'react-router-dom';
import IllustrationContainer from '../components/IllustrationContainer';
import { PropTypes } from 'prop-types';
import Wrapper from '../layout/Wrapper';

const NotFoundPage = () => {
return (
<PageLayout>
<Wrapper>
<div className="mt-[120px] md:mt-[180px] flex flex-col justify-center gap-[36px]">
<IllustrationContainer/>
<Paragraph textCenter>Oops! Unfortunately, we didn’t find the page you are looking for!</Paragraph>
<Link className='flex justify-center' to='/'>
<PrimaryButton>back to home page</PrimaryButton>
</Link>
</div>
</Wrapper>
</PageLayout>
)
}

NotFoundPage.propTypes = {
};

export default NotFoundPage

Loading…
Откажи
Сачувај