Restore Czech translation and default to English

Currently translated at 100.0% (206 of 206 strings)

Translation: GeoVisio Website/translations-json
Translate-URL: http://weblate.panoramax.xyz/projects/geovisio-website/translations-json/fr/

.drone.yml

@@ -0,0 +1,16 @@
+kind: pipeline
+name: default
+
+steps:
+- name: docker  
+  image: plugins/docker
+  settings:
+    registry: https://git.ivasoft.cz
+    username:
+      from_secret: repo_user
+    password:
+      from_secret: repo_pass
+    repo: git.ivasoft.cz/sw/geovisio-website
+    tags:
+      - latest
+      - ${DRONE_TAG:-latest}

.gitignore

@@ -90,6 +90,11 @@ sw.*
 *.swp
 
 # Cypress generated screen and videos files
+cypress/downloads/*
 cypress/screenshot/
 cypress/videos/
-*.cy.ts.mp4
+*.cy.ts.mp4
+
+# Mkdocs
+env/
+site/

.gitlab-ci.yml

@@ -8,9 +8,11 @@ variables:
   DOCKER_BUILDKIT: 1 # use buildkit for better performance
   DOCKER_DRIVER: overlay2 # better docker driver to avoid copying too many files on each run
   GITLAB_REGISTRY: registry.gitlab.com # We use docker.io for official images and gitlab's registry to store temporary images
-  IMAGE_NAME: geovisio/api
-  CI_IMAGE_CACHE: $GITLAB_REGISTRY/$IMAGE_NAME:build_cache
-  DOCKER_TLS_CERTDIR: ""
+  REPO_NAME: panoramax/server/website
+  DOCKER_IMAGE_NAME: geovisio/website
+  CI_IMAGE_CACHE: $GITLAB_REGISTRY/$REPO_NAME:build_cache
+  DOCKER_TLS_CERTDIR: ''
+  DOCKER_HOST: tcp://docker:2375
 
 before_script:
   ## chmod is unfortunately currently mandatory : https://github.com/nodejs/docker-node/issues/661
@@ -22,28 +24,29 @@ cache:
 
 install:
   stage: Install
-  image: node:18.16.0
+  image: node:20.9.0
   script:
     - yarn install
     - ls node_modules/.bin/cypress
 
 test:unit:
   stage: Test
-  image: node:18.16.0
+  image: node:20.9.0-alpine
   script:
     - yarn test:unit
   coverage: /All files[^|]*\|[^|]*\s+([\d\.]+)/
 
 test:e2e:
   stage: Test
-  image: cypress/browsers:node-18.16.0-chrome-113.0.5672.92-1-ff-113.0-edge-113.0.1774.35-1
+  image: node:20.9.0-alpine
+  services:
+    - docker:dind
   script:
-    - yarn install
-    - ./node_modules/.bin/cypress install
-    - echo "VITE_API_URL=https://geovisio-proxy-dev.osc-fr1.scalingo.io/" > .env
-    - echo "VITE_ENV=dev" >> .env
-    - PORT=5173 yarn start &
-    - yarn test:e2e
+    - apk add --update --no-cache docker-cli docker-cli-compose git
+    - PROJECT_DIR=$PWD docker compose -f cypress/docker-compose-geovisio.yml -f cypress/docker-compose-gitlab-override.yml run --rm e2e
+  after_script:
+    - PROJECT_DIR=$PWD docker compose -f cypress/docker-compose-geovisio.yml -f cypress/docker-compose-gitlab-override.yml logs web || true
+    - PROJECT_DIR=$PWD docker compose -f cypress/docker-compose-geovisio.yml -f cypress/docker-compose-gitlab-override.yml down || true
   coverage: /All files[^|]*\|[^|]*\s+([\d\.]+)/
   artifacts:
     when: always
@@ -54,7 +57,7 @@ test:e2e:
 
 deploy:
   stage: Deploy
-  image: node:18.16.0
+  image: node:20.9.0
   cache:
     paths:
       - node_modules
@@ -74,7 +77,7 @@ deploy:develop:
   stage: Deploy
   image: docker:latest
   services:
-      - docker:dind
+    - docker:dind
   before_script:
     # login to the gitlab docker registry to use the cache and to publish
     - echo $CI_DEPLOY_PASSWORD | docker login -u $CI_DEPLOY_USER --password-stdin $GITLAB_REGISTRY
@@ -86,7 +89,7 @@ deploy:develop:
     - docker buildx build
       --cache-from "type=registry,ref=$CI_IMAGE_CACHE"
       --cache-to "type=registry,mode=max,ref=$CI_IMAGE_CACHE"
-      --tag "$CI_REGISTRY_IMAGE:develop"
+      --tag "$DOCKER_IMAGE_NAME:develop"
       --label "org.opencontainers.image.title=$CI_PROJECT_TITLE"
       --label "org.opencontainers.image.url=$CI_PROJECT_URL"
       --label "org.opencontainers.image.created=$CI_JOB_STARTED_AT"
@@ -96,7 +99,7 @@ deploy:develop:
       .
 
     # publish image to dockerhub with the develop tag
-    - docker push "$CI_REGISTRY_IMAGE:develop"
+    - docker push "$DOCKER_IMAGE_NAME:develop"
 
 deploy:latest:
   # we consider that tag always land on main
@@ -106,7 +109,7 @@ deploy:latest:
   stage: Deploy
   image: docker:latest
   services:
-      - docker:dind
+    - docker:dind
   before_script:
     # login to the gitlab docker registry to use the cache and to publish
     - echo $CI_DEPLOY_PASSWORD | docker login -u $CI_DEPLOY_USER --password-stdin $GITLAB_REGISTRY
@@ -118,8 +121,8 @@ deploy:latest:
     - docker buildx build
       --cache-from "type=registry,ref=$CI_IMAGE_CACHE"
       --cache-to "type=registry,mode=max,ref=$CI_IMAGE_CACHE"
-      --tag "$CI_REGISTRY_IMAGE:$CI_COMMIT_REF_NAME"
-      --tag "$CI_REGISTRY_IMAGE:latest"
+      --tag "$DOCKER_IMAGE_NAME:$CI_COMMIT_REF_NAME"
+      --tag "$DOCKER_IMAGE_NAME:latest"
       --label "org.opencontainers.image.title=$CI_PROJECT_TITLE"
       --label "org.opencontainers.image.url=$CI_PROJECT_URL"
       --label "org.opencontainers.image.created=$CI_JOB_STARTED_AT"
@@ -129,5 +132,5 @@ deploy:latest:
       .
 
     # publish image to dockerhub
-    - docker push $CI_REGISTRY_IMAGE:$CI_COMMIT_REF_NAME
-    - docker push $CI_REGISTRY_IMAGE:latest
+    - docker push $DOCKER_IMAGE_NAME:$CI_COMMIT_REF_NAME
+    - docker push $DOCKER_IMAGE_NAME:latest

.idea/geovisio-website.iml

@@ -5,6 +5,10 @@
       <excludeFolder url="file://$MODULE_DIR$/temp" />
       <excludeFolder url="file://$MODULE_DIR$/.tmp" />
       <excludeFolder url="file://$MODULE_DIR$/tmp" />
+      <excludeFolder url="file://$MODULE_DIR$/.idea/codeStyles" />
+      <excludeFolder url="file://$MODULE_DIR$/.idea/jsLinters" />
+      <excludeFolder url="file://$MODULE_DIR$/cypress/videos" />
+      <excludeFolder url="file://$MODULE_DIR$/src/node_modules" />
     </content>
     <orderEntry type="inheritedJdk" />
     <orderEntry type="sourceFolder" forTests="false" />

.idea/inspectionProfiles/Project_Default.xml

@@ -2,5 +2,21 @@
   <profile version="1.0">
     <option name="myName" value="Project Default" />
     <inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
+    <inspection_tool class="HtmlUnknownTag" enabled="true" level="WARNING" enabled_by_default="true">
+      <option name="myValues">
+        <value>
+          <list size="7">
+            <item index="0" class="java.lang.String" itemvalue="nobr" />
+            <item index="1" class="java.lang.String" itemvalue="noembed" />
+            <item index="2" class="java.lang.String" itemvalue="comment" />
+            <item index="3" class="java.lang.String" itemvalue="noscript" />
+            <item index="4" class="java.lang.String" itemvalue="embed" />
+            <item index="5" class="java.lang.String" itemvalue="script" />
+            <item index="6" class="java.lang.String" itemvalue="div" />
+          </list>
+        </value>
+      </option>
+      <option name="myCustomValuesEnabled" value="true" />
+    </inspection_tool>
   </profile>
 </component>

CHANGELOG.md

@@ -7,6 +7,169 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 Before _0.1.0_, website development was on rolling release, meaning there are no version tags.
 
+## [2.6.2] - 2024-15-03
+
+### Changed
+
+- Change Nodejs version to LTS 20.9.0
+- Update dependencies (not prettier/typescript/eslint)
+- Add tutorial on Android mobile for the picture upload
+- Add tutorial on Android mobile when there is error on exif geoloc tag for the picture upload
+- Add a server.js to serve statics files on deploy
+
+### Fixed
+
+- Fix orientation viewer on mobile
+- Fix Header css
+- Fix tests unit
+
+## [2.6.1] - 2024-05-03
+
+### Fixed
+
+- Fix warning in browser console
+- Fix lang switcher using cookie to set the locale
+
+## [2.6.0] - 2024-05-02
+
+### Changed
+
+- Update Geovisio Viewer to 3.0.1
+  - Adapt the code for the new viewer version
+- Change some features after user testing:
+  - Upload page tooltip
+  - Add an upload cancel button
+  - New mobile sequence list version
+  - Add a return home button in the header
+  - Improve the interaction in the Sequence page
+- Improve the performance of the code
+- Some refactoring
+- Some bug fixes
+
+## [2.5.1] - 2024-03-19
+
+### Added
+
+- Panel management to edit a sequence:
+  - 3 tabs to edit in a sequence page
+  - add the possibility to re-orient all the pictures of a sequence with a widget
+  - add the possibility to sort the pictures of a sequence
+
+## [2.5.0] - 2024-03-11
+
+### Changed
+
+- GeoVisio web viewer updated to [2.5.0](https://gitlab.com/panoramax/clients/web-viewer/-/compare/2.4.0...2.5.0) to reduce tiles size.
+
+## [2.4.1] - 2024-02-01
+
+### Fixed
+
+- Fix geovisio version yarn.lock
+
+## [2.4.0] - 2024-01-31
+
+### Added
+
+- Possibility to edit a sequence title in the sequence page
+
+### Changed
+
+- GeoVisio web viewer updated to [2.4.0](https://gitlab.com/panoramax/clients/web-viewer/-/compare/2.3.1...2.4.0) to manage sequence by user
+
+### Fixed
+
+- Fix filter reset button to include bbox filter
+- Fix fullscreen button added by the widget viewer
+- Some UI and UX fixes before user tests
+
+## [2.3.1] - 2024-01-29
+
+### Added
+
+- Add the possibility to fullscreen the viewer in the homepage : https://gitlab.com/panoramax/server/website/-/issues/60
+- In the sequence list page add a filter by bbox in the map : https://gitlab.com/panoramax/server/website/-/issues/61
+- In the sequence list page add a filter by date in the list : https://gitlab.com/panoramax/server/website/-/issues/57
+- Add a cancel button to when a sequence is uploading to cancel the upload
+
+### Changed
+
+- GeoVisio web viewer updated to [2.3.1](https://gitlab.com/panoramax/clients/web-viewer/-/compare/2.3.0...2.3.1)
+
+### Fixed
+
+- Some UI and UX fixes before user tests
+
+## [2.3.0] - 2023-12-06
+
+### Added
+
+- Add the possibility to an user to select a sequence in the list using the map : https://gitlab.com/panoramax/server/website/-/merge_requests/100
+- For a selected sequence in the list, if the sequence is not displayed in the map, fly to the sequence on the map : https://gitlab.com/panoramax/server/website/-/merge_requests/108
+- Add the pagination to the sequence with sort with API routes : https://gitlab.com/panoramax/server/website/-/merge_requests/107
+- Add Hungarian translation : https://gitlab.com/panoramax/server/website/-/merge_requests/105
+- Add the possibility to hide/delete a sequence in the sequence list : https://gitlab.com/panoramax/server/website/-/merge_requests/101
+- Add the possibility for the user to change the title of the sequence before upload the pictures : https://gitlab.com/panoramax/server/website/-/merge_requests/101
+- Add the possibility to resize the sequence page by dragging the blocs : https://gitlab.com/panoramax/server/website/-/merge_requests/101
+
+### Changed
+
+- GeoVisio web viewer updated to [2.3.0](https://gitlab.com/panoramax/clients/web-viewer/-/compare/2.2.1...2.3.0)
+
+### Fixed
+
+- Nginx server in Docker container was not recognizing routes other than `/` on first loading.
+- Fix the cookie bug by decoding flask cookie : https://gitlab.com/panoramax/server/website/-/merge_requests/102
+
+## [2.2.3] - 2023-11-03
+
+### Added
+
+- Add translation based on the browser language (only trad for FR and EN for now)
+
+### Changed
+
+- Page My Sequences, add the possibility to select a sequence in the list with the map :
+
+  - the user can only see his sequences on the list
+  - display the selected sequence in blue in the map
+  - display a thumbnail the hovered sequence
+  - hover the sequence selected in the map on the list
+
+- add some test e2e
+- maj viewer Geovisio version to 2.2.1
+- fix some CSS
+
+## [2.2.2] - 2023-10-16
+
+### Changed
+
+- fix lazy loading on imgs
+- fix css to the license link
+
+## [2.2.1] - 2023-10-16
+
+### Changed
+
+- fix some wordings
+- licence text in bold
+- remove footer when logged
+- add tiles custom to the sequence page list
+
+## [2.2.0] - 2023-10-13
+
+### Added
+
+- New UI/UX version :
+  - new footer
+  - new header
+  - add a map to the sequence list page + the uploaded date
+  - new wordings
+
+### Changed
+
+- Hide buttons delete and hide sequences images when you are not the owner
+
 ## [2.1.3] - 2023-09-25
 
 ### Changed
@@ -28,7 +191,7 @@ Before _0.1.0_, website development was on rolling release, meaning there are no
 
 ### Changed
 
-- GeoVisio web viewer upgraded to 2.1.4, [with alls its changes embedded](https://gitlab.com/geovisio/web-viewer/-/blob/develop/CHANGELOG.md?ref_type=heads#213-2023-08-30).
+- GeoVisio web viewer upgraded to 2.1.4, [with alls its changes embedded](https://gitlab.com/panoramax/clients/web-viewer/-/blob/develop/CHANGELOG.md?ref_type=heads#213-2023-08-30).
 - Dockerfile creates smaller and faster containers, using pre-built website and Nginx for HTTP serving.
 - In the upload input you can now choose between gallery and camera on mobile IOS
 - Some CSS fix for the responsive of one Sequence
@@ -43,14 +206,14 @@ Before _0.1.0_, website development was on rolling release, meaning there are no
 
 ### Added
 
-- A new page `/envoyer` to upload picture with an interface ([#13](https://gitlab.com/geovisio/website/-/issues/13)) :
+- A new page `/envoyer` to upload picture with an interface ([#13](https://gitlab.com/panoramax/server/website/-/issues/13)) :
   - the user can upload multiples pictures with the interface
   - the pictures are sorted by name
   - the user can see all the pictures uploaded and all the errors
 
 ### Changed
 
-- Website releases now follow the synced `MAJOR.MINOR` API version rule, meaning that any version >= 2.1 of the website will be compatible with corresponding [GeoVisio API](https://gitlab.com/geovisio/api) version.
+- Website releases now follow the synced `MAJOR.MINOR` API version rule, meaning that any version >= 2.1 of the website will be compatible with corresponding [GeoVisio API](https://gitlab.com/panoramax/server/api) version.
 
 ### Fixed
 
@@ -60,13 +223,13 @@ Before _0.1.0_, website development was on rolling release, meaning there are no
 
 ### Added
 
-- A new page `/mes-sequences` to access to a list of sequences for a logged user ([#14](https://gitlab.com/geovisio/website/-/issues/14)) :
+- A new page `/mes-sequences` to access to a list of sequences for a logged user ([#14](https://gitlab.com/panoramax/server/website/-/issues/14)) :
 
   - the user can see all his sequences
   - the user can filter sequences
   - the user can enter to a specific sequence
 
-- A new page `/sequence/:id` to access to a sequence of photos for a logged user ([#14](https://gitlab.com/geovisio/website/-/issues/14)) :
+- A new page `/sequence/:id` to access to a sequence of photos for a logged user ([#14](https://gitlab.com/panoramax/server/website/-/issues/14)) :
   - the user can see the sequence on the map and move on the map from photos to photos
   - the user can see information about the sequence
   - the user can see all the sequence's photos
@@ -77,9 +240,22 @@ Before _0.1.0_, website development was on rolling release, meaning there are no
 - Header have now a new entry `Mes photos` when the user is logged to access to the sequence list
 - The router guard for logged pages has been changed to not call the api to check the token
 
-[unreleased]: https://gitlab.com/geovisio/website/-/compare/2.1.3...develop
-[2.1.3]: https://gitlab.com/geovisio/website/-/compare/2.1.2...2.1.3
-[2.1.2]: https://gitlab.com/geovisio/website/-/compare/2.1.1...2.1.2
-[2.1.1]: https://gitlab.com/geovisio/website/-/compare/2.1.0...2.1.1
-[2.1.0]: https://gitlab.com/geovisio/website/-/compare/0.1.0...2.1.0
-[0.1.0]: https://gitlab.com/geovisio/website/-/commits/0.1.0
+[unreleased]: https://gitlab.com/panoramax/server/website/-/compare/2.6.2...develop
+[2.6.2]: https://gitlab.com/panoramax/server/website/-/compare/2.6.1...2.6.2
+[2.6.1]: https://gitlab.com/panoramax/server/website/-/compare/2.6.0...2.6.1
+[2.6.0]: https://gitlab.com/panoramax/server/website/-/compare/2.5.1...2.6.0
+[2.5.1]: https://gitlab.com/panoramax/server/website/-/compare/2.5.0...2.5.1
+[2.5.0]: https://gitlab.com/panoramax/server/website/-/compare/2.4.1...2.5.0
+[2.4.1]: https://gitlab.com/panoramax/server/website/-/compare/2.4.0...2.4.1
+[2.4.0]: https://gitlab.com/panoramax/server/website/-/compare/2.3.1...2.4.0
+[2.3.1]: https://gitlab.com/panoramax/server/website/-/compare/2.3.0...2.3.1
+[2.3.0]: https://gitlab.com/panoramax/server/website/-/compare/2.2.3...2.3.0
+[2.2.3]: https://gitlab.com/panoramax/server/website/-/compare/2.2.2...2.2.3
+[2.2.2]: https://gitlab.com/panoramax/server/website/-/compare/2.2.1...2.2.2
+[2.2.1]: https://gitlab.com/panoramax/server/website/-/compare/2.2.0...2.2.1
+[2.2.0]: https://gitlab.com/panoramax/server/website/-/compare/2.1.3...2.2.0
+[2.1.3]: https://gitlab.com/panoramax/server/website/-/compare/2.1.2...2.1.3
+[2.1.2]: https://gitlab.com/panoramax/server/website/-/compare/2.1.1...2.1.2
+[2.1.1]: https://gitlab.com/panoramax/server/website/-/compare/2.1.0...2.1.1
+[2.1.0]: https://gitlab.com/panoramax/server/website/-/compare/0.1.0...2.1.0
+[0.1.0]: https://gitlab.com/panoramax/server/website/-/commits/0.1.0

Dockerfile

@@ -2,7 +2,7 @@
 #- Build image
 #-
 
-FROM node:18.16.0-alpine AS build
+FROM node:20.9.0-alpine AS build
 
 WORKDIR /opt/geovisio
 
@@ -19,6 +19,7 @@ COPY *.json *.js *.ts *.html ./
 
 # Replace env variables by placeholder for dynamic change on container start
 ENV VITE_INSTANCE_NAME=DOCKER_VITE_INSTANCE_NAME
+ENV VITE_RASTER_TILE=DOCKER_VITE_RASTER_TILE
 ENV VITE_API_URL=DOCKER_VITE_API_URL
 ENV VITE_TILES=DOCKER_VITE_TILES
 ENV VITE_MAX_ZOOM=DOCKER_VITE_MAX_ZOOM
@@ -26,7 +27,6 @@ ENV VITE_ZOOM=DOCKER_VITE_ZOOM
 ENV VITE_CENTER=DOCKER_VITE_CENTER
 
 # Build code
-ENV PORT=3000
 RUN yarn deploy
 
 
@@ -50,6 +50,7 @@ ENV VITE_INSTANCE_NAME="GeoVisio/Docker"
 ENV VITE_API_URL="https://panoramax.openstreetmap.fr"
 ENV VITE_TILES="https://tile-vect.openstreetmap.fr/styles/basic/style.json"
 ENV VITE_MAX_ZOOM=""
+ENV VITE_RASTER_TILE=""
 ENV VITE_ZOOM=""
 ENV VITE_CENTER=""
 

README.md

@@ -1,35 +1,19 @@
-# ![GeoVisio](https://gitlab.com/geovisio/api/-/raw/develop/images/logo_full.png)
+# ![Panoramax](https://upload.wikimedia.org/wikipedia/commons/thumb/a/a9/Panoramax.svg/40px-Panoramax.svg.png) Panoramax
 
-__GeoVisio__ is a complete solution for storing and __serving your own 📍📷 geolocated pictures__ (like [StreetView](https://www.google.com/streetview/) / [Mapillary](https://mapillary.com/)).
-
-➡️ __Give it a try__ at [panoramax.ign.fr](https://panoramax.ign.fr/) or [geovisio.fr](https://geovisio.fr/viewer) !
-
-## 📦 Components
-
-GeoVisio is __modular__ and made of several components, each of them standardized and ♻️ replaceable.
-
-![GeoVisio architecture](https://gitlab.com/geovisio/api/-/raw/develop/images/big_picture.png)
-
-All of them are 📖 __open-source__ and available online:
-
-|                               🌐 Server                                 |                      💻 Client                       |
-|:-----------------------------------------------------------------------:|:----------------------------------------------------:|
-|                 [API](https://gitlab.com/geovisio/api)                  |    [Website](https://gitlab.com/geovisio/website)    |
-|            [Blur API](https://gitlab.com/geovisio/blurring)             | [Web viewer](https://gitlab.com/geovisio/web-viewer) |
-| [GeoPic Tag Reader](https://gitlab.com/geovisio/geo-picture-tag-reader) |   [Command line](https://gitlab.com/geovisio/cli)    |
+__Panoramax__ is a digital resource for sharing and exploiting 📍📷 field photos. Anyone can take photographs of places visible from the public streets and contribute them to the Panoramax database. This data is then freely accessible and reusable by all. More information available at [gitlab.com/panoramax](https://gitlab.com/panoramax) and [panoramax.fr](https://panoramax.fr/).
 
 
 # 💻 GeoVisio Website
 
 This repository only contains __the web front-end of GeoVisio__.
 
-Note that the 📷 __web viewer__ (component showing pictures and their location on a map) is in [a separate, dedicated repository](https://gitlab.com/geovisio/web-viewer).
+Note that the 📷 __web viewer__ (component showing pictures and their location on a map) is in [a separate, dedicated repository](https://gitlab.com/panoramax/clients/web-viewer).
 
 ## ⚙️ Features
 
 The website offers these functionalities:
 
-- Display of pictures and their location (using the embed [web viewer](https://gitlab.com/geovisio/web-viewer))
+- Display of pictures and their location (using the embed [web viewer](https://gitlab.com/panoramax/clients/web-viewer))
 - Handle user authentication and account management
 - Show simple to read documentation
 
@@ -39,22 +23,8 @@ The website offers these functionalities:
 
 ## 💁 Contributing
 
-Pull requests are welcome. For major changes, please open an [issue](https://gitlab.com/geovisio/website/-/issues) first to discuss what you would like to change.
-
-## 🤗 Special thanks
-
-![Sponsors](https://gitlab.com/geovisio/api/-/raw/develop/images/sponsors.png)
-
-GeoVisio was made possible thanks to a group of ✨ __amazing__ people ✨ :
-
-- __[GéoVélo](https://geovelo.fr/)__ team, for 💶 funding initial development and for 🔍 testing/improving software
-- __[Carto Cité](https://cartocite.fr/)__ team (in particular Antoine Riche), for 💶 funding improvements on viewer (map browser, flat pictures support)
-- __[La Fabrique des Géocommuns (IGN)](https://www.ign.fr/institut/la-fabrique-des-geocommuns-incubateur-de-communs-lign)__ for offering long-term support and funding the [Panoramax](https://panoramax.fr/) initiative and core team (Camille Salou, Mathilde Ferrey, Christian Quest, Antoine Desbordes, Jean Andreani, Adrien Pavie)
-- Many _many_ __wonderful people__ who worked on various parts of GeoVisio or core dependencies we use : 🧙 Stéphane Péneau, 🎚 Albin Calais & Cyrille Giquello, 📷 [Damien Sorel](https://www.strangeplanet.fr/), Pascal Rhod, Nick Whitelegg...
-- __[Adrien Pavie](https://pavie.info/)__, for ⚙️ initial development of GeoVisio
-- And you all ✨ __GeoVisio users__ for making this project useful !
-
+Pull requests are welcome. For major changes, please open an [issue](https://gitlab.com/panoramax/server/website/-/issues) first to discuss what you would like to change.
 
 ## ⚖️ License
 
-Copyright (c) GeoVisio team 2022-2023, [released under MIT license](./LICENSE).
+Copyright (c) Panoramax team 2022-2024, [released under MIT license](./LICENSE).

bootstrap.d.ts

@@ -0,0 +1 @@
+declare module 'bootstrap'

cypress.config.ts

@@ -12,6 +12,6 @@ export default defineConfig({
     setupNodeEvents(on, config) {
       // implement node event listeners here
     },
-    baseUrl: 'http://localhost:5173'
+    baseUrl: 'http://localhost:5173/'
   }
 })

cypress.env.json

@@ -0,0 +1,3 @@
+{
+  "api_url": "http://localhost:5000/"
+}

cypress/docker-compose-geovisio.yml

@@ -0,0 +1,79 @@
+services:
+  api:
+    image: geovisio/api:develop
+    command: api
+    restart: always
+    ports:
+      - 5000:5000
+    depends_on:
+      db:
+        condition: service_healthy
+      auth:
+        condition: service_healthy
+    environment:
+      DB_URL: postgres://gvs:gvspwd@db/geovisio
+      PICTURE_PROCESS_THREADS_LIMIT: 2
+      PICTURE_PROCESS_DERIVATES_STRATEGY: ON_DEMAND
+      API_FORCE_AUTH_ON_UPLOAD: 'true'
+      OAUTH_CLIENT_ID: geovisio
+      OAUTH_CLIENT_SECRET: what_a_secret
+      OAUTH_OIDC_URL: http://localhost:8183/realms/geovisio
+      OAUTH_PROVIDER: oidc
+      FLASK_SECRET_KEY: a_very_secret_key_never_to_be_used_in_production
+    healthcheck:
+      test: python -c "import requests; requests.get('http://localhost:5000/api').raise_for_status()"
+      interval: 5s
+      timeout: 5s
+      retries: 10
+    extra_hosts:
+      - 'localhost:host-gateway'
+
+    networks:
+      db: {}
+      geovisio:
+        aliases:
+          - api.localtest.me
+
+  db:
+    image: postgis/postgis:13-3.2
+    environment:
+      - POSTGRES_USER=gvs
+      - POSTGRES_PASSWORD=gvspwd
+      - POSTGRES_DB=geovisio
+    healthcheck:
+      test: pg_isready -q -d $$POSTGRES_DB -U $$POSTGRES_USER
+      interval: 5s
+      timeout: 5s
+      retries: 5
+    networks:
+      db: {}
+
+  auth:
+    command: start-dev --import-realm
+    environment:
+      GEOVISIO_BASE_URL: http://localhost:5000
+      GEOVISIO_CLIENT_SECRET: what_a_secret
+      KEYCLOAK_ADMIN: admin
+      KEYCLOAK_ADMIN_PASSWORD: password
+      KEYCLOAK_FRONTEND_URL: http://localhost:5000/api/auth/login
+      KC_HTTP_PORT: 8183
+    ports:
+      - '8183:8183'
+    healthcheck:
+      test: curl --fail http://localhost:8183/realms/geovisio
+      timeout: 5s
+      interval: 2s
+      retries: 20
+      start_period: 15s
+    image: quay.io/keycloak/keycloak:20.0.1
+    volumes:
+      - ./keycloak-realm.json:/opt/keycloak/data/import/geovisio_realm.json
+
+    networks:
+      geovisio:
+        aliases:
+          - keycloak.localtest.me
+
+networks:
+  db: {}
+  geovisio: {}

cypress/docker-compose-gitlab-override.yml

@@ -0,0 +1,55 @@
+# Docker-compose used in gitlab-ci to run a container having access to all the other containers
+services:
+  web:
+    image: node:20.9.0-alpine
+    volumes:
+      - $PROJECT_DIR:/src
+    working_dir: /src
+    command: >
+      sh -c "apk add --update --no-cache curl && yarn install && yarn dev"
+    environment:
+      PORT: 5173
+      VITE_API_URL: http://api.localtest.me:5000
+      VITE_ENV: dev
+    depends_on:
+      api:
+        condition: service_healthy
+      auth:
+        condition: service_healthy
+    ports:
+      - 5173:5173
+    healthcheck:
+      test: curl --fail http://0.0.0.0:5173
+      timeout: 10s
+      interval: 3s
+      retries: 20
+      start_period: 15s
+    networks:
+      geovisio:
+        aliases:
+          - front.localtest.me
+  e2e:
+    image: cypress/included:cypress-13.8.1-node-22.0.0-chrome-124.0.6367.60-1-ff-125.0.2-edge-124.0.2478.51-1
+    volumes:
+      - $PROJECT_DIR:/src
+    working_dir: /src
+    environment:
+      - CYPRESS_baseUrl=http://front.localtest.me:5173/
+      - CYPRESS_api_url=http://api.localtest.me:5000/
+      - LANG=fr
+    command: sleep 2 && yarn add --dev cypress && ./node_modules/.bin/cypress install && yarn test:e2e
+    depends_on:
+      web:
+        condition: service_healthy
+    networks:
+      geovisio: {}
+
+  api:
+    environment:
+      OAUTH_OIDC_URL: http://keycloak.localtest.me:8183/realms/geovisio
+      FLASK_SESSION_COOKIE_DOMAIN: localtest.me
+
+  auth:
+    environment:
+      GEOVISIO_BASE_URL: http://api.localtest.me:5000
+      KEYCLOAK_FRONTEND_URL: http://api.localtest.me:5000/api/auth/login

cypress/e2e/contribute.cy.ts

@@ -0,0 +1,29 @@
+describe('In the contribute page', () => {
+  it('go to the login page', () => {
+    cy.visit('/pourquoi-contribuer')
+    cy.get('.upload-text').scrollIntoView()
+    cy.fixture('contribute').then((contributeData: contributeInterface) => {
+      cy.contains(contributeData.textButtonContribute).click()
+    })
+  })
+  it('go to the doc pages', () => {
+    cy.visit('pourquoi-contribuer')
+    cy.fixture('contribute').then((contributeData: contributeInterface) => {
+      cy.get('.upload-text').scrollIntoView()
+      cy.contains(contributeData.textButtonDocPython).click()
+      cy.contains(contributeData.textButtonCli).click()
+      cy.contains(contributeData.textButtonDocCli).click()
+      cy.contains(contributeData.textButtonTiles).click()
+      cy.contains(contributeData.textButtonDoc).click()
+    })
+  })
+})
+interface contributeInterface {
+  textButtonContribute: string
+  textButtonDocPython: string
+  textButtonCli: string
+  textButtonDocCli: string
+  textButtonTiles: string
+  textButtonDoc: string
+}
+export {}

cypress/e2e/home.cy.ts

@@ -1,9 +1,14 @@
 describe('In the home page', () => {
-  it('click on the link in the header to go to the upload page', () => {
+  it('click on the link in the footer to go to Panoramax.fr', () => {
     cy.visit('/')
     cy.fixture('home').then((homeData) => {
-      cy.contains(homeData.textLinkUpload).click()
-      cy.url().should('include', '/partager-des-photos')
+      cy.contains(homeData.textLinkPanoramax).click()
+    })
+  })
+  it('click on the link in the footer to go to Gitlab', () => {
+    cy.visit('/')
+    cy.fixture('home').then((homeData) => {
+      cy.contains(homeData.textLinkGitlab).click()
     })
   })
 })

cypress/e2e/login.cy.ts

@@ -1,7 +1,24 @@
 describe('In the login page', () => {
   it('type in the form to login', () => {
-    cy.visit('https://geovisio-proxy-dev.osc-fr1.scalingo.io/api/auth/login')
-    cy.get('#password').type('coucouc')
+    cy.visit(`${Cypress.env('api_url')}api/auth/login`)
+    cy.get('#username').type('Elysee')
+    cy.get('#password').type('my password')
+    cy.contains('Sign In').click()
+    cy.visit('/')
+  })
+  it('go to the register form and create an account', () => {
+    cy.visit(`${Cypress.env('api_url')}api/auth/login`)
+    cy.fixture('login').then((loginData) => {
+      cy.contains(loginData.textLinkRegister).click()
+      cy.get('#firstName').type('Tom')
+      cy.get('#lastName').type('Tom')
+      cy.get('#email').type('test@test123.com')
+      cy.get('#username').type('Elysee12445')
+      cy.get('#password').type('my password1')
+      cy.get('#password-confirm').type('my password1')
+      cy.get('form').submit()
+      cy.visit('/')
+    })
   })
 })
 

cypress/e2e/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "compilerOptions": {
+    "types": ["reflect-metadata", "jest", "cypress"],
+    "module": "commonjs",
+    "target": "es5",
+    "sourceMap": true
+  },
+  "exclude": ["node_modules"]
+}

cypress/e2e/upload.cy.ts

@@ -0,0 +1,32 @@
+describe('In the login page', () => {
+  it('login and go to the upload page to upload images', () => {
+    cy.visit(`${Cypress.env('api_url')}api/auth/login`)
+    cy.get('#username').type('Elysee')
+    cy.get('#password').type('my password')
+    cy.fixture('upload').then((uploadData: uploadInterface) => {
+      cy.contains(uploadData.textLinkLogin).click()
+      cy.visit('/envoyer')
+      cy.get('.edit-button').click()
+      cy.get('#upload-title').clear()
+      cy.get('#upload-title').type(uploadData.textTitle)
+      cy.contains(uploadData.textButtonTitle).click()
+      cy.contains(uploadData.textButtonUpload).click()
+    })
+    cy.get('.input-file').selectFile(
+      [
+        'cypress/fixtures/images/image1.jpg',
+        'cypress/fixtures/images/image2.jpg',
+        'cypress/fixtures/images/image3.jpg'
+      ],
+      { force: true }
+    )
+  })
+})
+interface uploadInterface {
+  textLinkLogin: string
+  textLinkUpload: string
+  textButtonUpload: string
+  textTitle: string
+  textButtonTitle: string
+}
+export {}

cypress/fixtures/contribute.json

@@ -0,0 +1,8 @@
+{
+  "textButtonContribute": "Partager des photos",
+  "textButtonDocCli": "Voir la documentation",
+  "textButtonDoc": "Retrouvez sa documentation ici",
+  "textButtonDocPython": "de python (au moins la version 3.8)",
+  "textButtonCli": "L'outil en ligne de commande",
+  "textButtonTiles": "de tuiles vectorielles"
+}

cypress/fixtures/home.json

@@ -1,5 +1,5 @@
 {
-  "addressToSearch": "97 boulevard Voltaire 75011 paris",
-  "textAddressToSelect": "Boulevard Voltaire, Quartier de la Folie-Méricourt, Paris 11e Arrondissement, Paris, Île-de-France, France métropolitaine, 75011, France",
-  "textLinkUpload": "À propos"
+  "textLinkContribute": "Pourquoi contribuer ?",
+  "textLinkPanoramax": "Découvrir Panoramax",
+  "textLinkGitlab": "Voir le code"
 }

cypress/fixtures/login.json

@@ -0,0 +1,4 @@
+{
+  "textLinkRegister": "Register",
+  "textLinkLogin": "Sign In"
+}

cypress/fixtures/upload.json

@@ -0,0 +1,7 @@
+{
+  "textLinkLogin": "Sign In",
+  "textLinkUpload": "Mes photos",
+  "textTitle": "My title",
+  "textButtonTitle": "Valider",
+  "textButtonUpload": "Glissez vos images ici ou cliquez sur"
+}

docker/docker-entrypoint.sh

@@ -1,10 +1,10 @@
 #!/bin/bash
 
 ROOT_DIR=/usr/share/nginx/html
-DOCKER_VARS=(VITE_INSTANCE_NAME VITE_API_URL VITE_TILES VITE_MAX_ZOOM VITE_ZOOM VITE_CENTER )
+DOCKER_VARS=(VITE_INSTANCE_NAME VITE_API_URL VITE_TILES VITE_MAX_ZOOM VITE_ZOOM VITE_CENTER VITE_RASTER_TILE )
 
 echo "Setting env variables in web files"
-for file in $ROOT_DIR/assets/*.js $ROOT_DIR/index.html; do
+for file in $ROOT_DIR/assets/*.js $ROOT_DIR/*.html; do
 	echo "Processing $file...";
 
 	for i in ${!DOCKER_VARS[@]}; do

docker/nginx.conf

@@ -18,5 +18,10 @@ http {
 
         root /usr/share/nginx/html;
         gzip_static on;
+
+        location / {
+            root /usr/share/nginx/html;
+            try_files $uri /index.html;
+        }
     }
 }

docs/01_Start.md

@@ -1,29 +0,0 @@
-# GeoVisio Website hands-on guide
-
-![GeoVisio logo](https://gitlab.com/geovisio/api/-/raw/develop/images/logo_full.png)
-
-Welcome to GeoVisio __Website__ documentation ! It will help you through all phases of setup, run and develop on GeoVisio Website.
-
-__Note that__ this only covers the Website / front-end component, if you're looking for docs on another component, you may go to [this page](https://gitlab.com/geovisio) instead.
-
-Also, if at some point you're lost or need help, you can contact us through [issues](https://gitlab.com/geovisio/website/-/issues) or by [email](mailto:panieravide@riseup.net).
-
-
-## Architecture
-
-The website relies on the following technologies and components:
-
-- Frontend website made in [Vue 3](https://vuejs.org/guide/introduction.html)
-- Project use [Vite](https://vitejs.dev/guide/) who offer a fast development server and an optimized compilation for production (like webpack)
-- The style is made with CSS/SASS and the [bootstrap library](https://getbootstrap.com/)
-- [Typescript](https://www.typescriptlang.org/) used to type
-- [Jest](https://jestjs.io/fr/) used for unit testing
-
-
-## All the docs
-
-You might want to dive into docs :
-
-- [Install and setup](./02_Setup.md)
-- [Change the settings](./03_Settings.md)
-- [Work on the code](./09_Develop.md)

docs/02_Setup.md

@@ -2,81 +2,63 @@
 
 GeoVisio website can be installed through classic method, or using Docker.
 
-__Contents__
+=== ":gear: Classic"
 
-[[_TOC_]]
+	You need to have installed on your system:
+
+	* [NodeJS](https://nodejs.org/en/download) >= 18.13.0
+	* [NPM](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm) or [Yarn](https://yarnpkg.com/)
+
+	The website can be installed locally by retrieving this repository and installing dependencies:
+
+	```bash
+	# Retrieve source code
+	git clone https://gitlab.com/panoramax/server/website.git
+	cd website/
+
+	# Install dependencies
+	npm install
+	```
+
+	Then, you need to define some settings. You have to create a `.env` file and edit its content.
+
+	```sh
+	cp env.example .env
+	```
+
+	See _Configuration_ for more details about available settings.
+
+	Then, building for production can be done with these commands:
+
+	```sh
+	npm run build
+	PORT=3000 npm run start
+	```
+
+	The website is now available at [localhost:3000](http://localhost:3000).
 
 
-## Classic install
+=== ":simple-docker: Docker"
 
-### System requirements
+	The [Docker](https://docs.docker.com/get-docker/) deployment is a really convenient way to have a Geovisio website running in an easy and fast way. Note that this setup documentation only covers __GeoVisio front-end__ (website), if you also need an API running, please refer to [Docker API deployment](https://gitlab.com/panoramax/server/api/-/blob/develop/docs/14_Running_Docker.md).
 
-**You need to have [Nodejs installed](https://nodejs.org/en/download)**
-Node version : >=18.13.0
+	You can use the provided __Docker Hub__ `geovisio/website:latest` image directly:
 
-**You need to have [Npm installed](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm)**
+	```bash
+	docker run \
+		-e VITE_API_URL="https://your.geovisio.api/" \
+		-e VITE_INSTANCE_NAME="My Own GeoVisio" \
+		-e VITE_TILES="https://your.geovisio.api/vector/tiles/style.json" \
+		-p 3000:3000 \
+		--name geovisio-website \
+		-d \
+		geovisio/website:latest
+	```
 
-You can use npm or [yarn](https://yarnpkg.com/) as package manager
+	This will run a container bound on [localhost:3000](http://localhost:3000).
 
-### Install
+	You can also build the image from the local source with:
 
-The website can be installed locally by retrieving this repository and installing dependencies:
-
-```sh
-# Retrieve source code
-git clone https://gitlab.com/geovisio/website.git
-cd website/
-
-# Install dependencies
-npm install
-```
-
-### Build for production
-
-Before building, you need to define a bit of settings. At least, you have to create a `.env` file and edit its content.
-
-```sh
-cp env.example .env
-```
-
-More details about settings [can be found in docs here](./03_Settings.md).
-
-Then, building for production can be done with these commands:
-
-```sh
-npm run build
-PORT=3000 npm run start
-```
-
-The website is now available at [localhost:3000](http://localhost:3000).
-
-
-## Docker setup
-
-The [Docker](https://docs.docker.com/get-docker/) deployment is a really convenient way to have a Geovisio website running in an easy and fast way. Note that this setup documentation only covers __GeoVisio front-end__ (website), if you also need an API running, please refer to [Docker API deployment](https://gitlab.com/geovisio/api/-/blob/develop/docs/14_Running_Docker.md).
-
-You can use the provided __Docker Hub__ `geovisio/website:latest` image directly:
-
-```bash
-docker run \
-	-e VITE_API_URL="https://your.geovisio.api/" \
-	-e VITE_INSTANCE_NAME="My Own GeoVisio" \
-	-e VITE_TILES="https://your.geovisio.api/vector/tiles/style.json" \
-	-p 3000:3000 \
-	--name geovisio-website \
-	-d \
-	geovisio/website:latest
-```
-
-This will run a container bound on [localhost:3000](http://localhost:3000).
-
-You can also build the image from the local source with:
-
-```bash
-docker build -t geovisio/website:latest .
-```
-
-
-## Next steps
-
-You can check out [the available settings for your instance](./03_Settings.md).
+	```bash
+	docker build -t geovisio/website:latest .
+	```

docs/03_Settings.md

@@ -8,16 +8,17 @@ Low-level settings can be changed through the `.env` file. An example is given i
 
 Available parameters are:
 
-- `VITE_API_URL`: the URL to the GeoVisio API (with trailing `/`, example: `https://geovisio.fr/`)
+- `VITE_API_URL`: the URL to the GeoVisio API (example: `https://panoramax.ign.fr/`)
 - `VITE_INSTANCE_NAME`: the name of the instance (example: `IGN`)
-- `VITE_TILES`: the URL of your tiles : default tiles are the Open Street Map Tiles (example: `https://wxs.ign.fr/essentiels/static/vectorTiles/styles/PLAN.IGN/attenue.json`)
+- `VITE_TILES`: the URL of your tiles : default tiles are the OpenStreetMap Tiles (example: `https://data.geopf.fr/annexes/ressources/vectorTiles/styles/PLAN.IGN/standard.json`)
 - `VITE_MAX_ZOOM`: the max zoom to use on the map (defaults to 24).
 - `VITE_ZOOM`: the zoom to use at the initialization of the map (defaults to 0).
 - `VITE_CENTER`: the center position to use at the initialization of the map (defaults to 0).
+- `VITE_RASTER_TILE`: the raster tile. Example : `https://maplibre.org/maplibre-style-spec/sources/#raster`.
 - Settings for the work environment:
-  - `NPM_CONFIG_PRODUCTION`: is it production environment (`true`, `false`)
-  - `YARN_PRODUCTION`: same as below, but if you use Yarn instead of NPM
-  - `VITE_ENV`: `dev`
+    - `NPM_CONFIG_PRODUCTION`: is it production environment (`true`, `false`)
+    - `YARN_PRODUCTION`: same as below, but if you use Yarn instead of NPM
+    - `VITE_ENV`: `dev`
 
 More settings are available [in official Vite documentation](https://vitejs.dev/guide/env-and-mode.html#env-files)
 
@@ -27,21 +28,17 @@ Note that you can also change the _Vite_ server configuration in the `vite.confi
 
 GeoVisio website can be customized to have wording reflecting your brand, licence and other elements.
 
-All the wordings of the website are on this [locale file](./src/locales/fr.json). In there, you might want to change:
+All the wordings of the website are on this [locale file](https://gitlab.com/panoramax/server/website/-/blob/develop/src/locales/en.json). In there, you might want to change:
 
 - The website title (properties `title` and `meta.title`)
 - The description (property `meta.description`)
 - Links to help pages:
-  - `upload.description`
-  - `upload.footer_description_terminal`
+    - `upload.description`
+    - `upload.footer_description_terminal`
 
 ## Visuals
 
 The following images can be changed to make the website more personal:
 
-- Logo: [`src/assets/images/logo.jpeg`](../src/assets/images/logo.jpeg)
-- Favicon: [`static/favicon.ico`](../static/favicon.ico)
-
-## Next steps
-
-You may be interested [in developing on the website](./09_Develop.md).
+- Logo: [`src/assets/images/logo.jpeg`](https://gitlab.com/panoramax/server/website/-/blob/develop/src/assets/images/logo.jpeg)
+- Favicon: [`static/favicon.ico`](https://gitlab.com/panoramax/server/website/-/blob/develop/static/favicon.ico)

docs/09_Develop.md

@@ -1,10 +1,16 @@
 # Work on the code
 
-## Available commands
+## Architecture
 
-Note that all the commands and packages used are available in the `package.json` file.
+The website relies on the following technologies and components:
 
-### Compile and Hot-Reload for Development
+- Frontend website made in [Vue 3](https://vuejs.org/guide/introduction.html)
+- Project use [Vite](https://vitejs.dev/guide/) who offer a fast development server and an optimized compilation for production (like webpack)
+- The style is made with CSS/SASS and the [bootstrap library](https://getbootstrap.com/)
+- [Typescript](https://www.typescriptlang.org/) used to type
+- [Jest](https://jestjs.io/fr/) used for unit testing
+
+## Compile and Hot-Reload for Development
 
 Launch your dev server :
 
@@ -18,7 +24,7 @@ or
 yarn dev
 ```
 
-### Run Unit Tests with [Vitest](https://vitest.dev/)
+## Run Unit Tests with [Vitest](https://vitest.dev/)
 
 ```sh
 npm run test:unit
@@ -30,7 +36,7 @@ or
 yarn test:unit
 ```
 
-### Lint with [ESLint](https://eslint.org/)
+## Lint with [ESLint](https://eslint.org/)
 
 ```sh
 npm run lint
@@ -41,3 +47,14 @@ or
 ```sh
 yarn lint
 ```
+
+## Documentation
+
+Documentation is located `docs` folder, and can be served with [Mkdocs](https://www.mkdocs.org/):
+
+```bash
+python -m venv env
+source ./env/bin/activate
+pip install mkdocs-material
+mkdocs serve
+```

docs/90_Releases.md

@@ -1,8 +1,9 @@
 # Make a release
 
-The web site uses [semantic versioning](https://semver.org/) for its release numbers.
+The website uses [semantic versioning](https://semver.org/) for its release numbers.
 
-__Note__ : make sure that versions are in-sync with other Website components. Each component can have different `PATCH` versions, but compatibility __must__ be ensured between `MAJOR.MINOR` versions.
+!!! note
+	Make sure that versions are in-sync with other GeoVisio components. Each component can have different `PATCH` versions, but compatibility __must__ be ensured between `MAJOR.MINOR` versions.
 
 Run these commands in order to issue a new release:
 

docs/index.md

@@ -0,0 +1,15 @@
+# Panoramax instance Website
+
+Welcome to GeoVisio __Website__ documentation ! It will help you through all phases of setup, run and develop on GeoVisio Website.
+
+The website offers these functionalities:
+
+- Display of pictures and their location (using the embed [web viewer](https://gitlab.com/panoramax/clients/web-viewer))
+- Handle user authentication and account management
+- Show simple to read documentation
+
+!!! note
+	The 📷 __web viewer__ (component showing pictures and their location on a map) is in [a separate, dedicated repository](https://gitlab.com/panoramax/clients/web-viewer). If you're looking for docs on another component, you may go to [this page](https://gitlab.com/panoramax) instead.
+
+!!! note
+	If at some point you're lost or need help, you can contact us through [issues](https://gitlab.com/panoramax/server/website/-/issues) or by [email](mailto:panieravide@riseup.net).

index.html

@@ -4,6 +4,31 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <link rel="icon" href="/static/favicon.ico" />
+    <title>
+      Panoramax <%- instanceName %> : photo-cartographier les territoires
+    </title>
+    <meta
+      name="description"
+      content="L'instance Panoramax <%- instanceName %> permet la publication de photo de terrain pour cartographier le territoire. Panoramax favorise la réutilisation des photos pour de nombreux cas d'usages."
+    />
+    <meta
+      name="twitter:title"
+      content="Panoramax <%- instanceName %> : photo-cartographier les territoires"
+    />
+    <meta
+      name="og:title"
+      content="Panoramax <%- instanceName %> : photo-cartographier les territoires"
+    />
+    <meta
+      name="twitter:description"
+      content="L'instance Panoramax <%- instanceName %> permet la publication de photo de terrain pour cartographier le territoire. Panoramax favorise la réutilisation des photos pour de nombreux cas d'usages."
+    />
+    <meta
+      name="og:description"
+      content="L'instance Panoramax <%- instanceName %> permet la publication de photo de terrain pour cartographier le territoire. Panoramax favorise la réutilisation des photos pour de nombreux cas d'usages."
+    />
+    <meta name="og:image" content="<%- frontUrl %>/static/meta-img.jpg" />
+    <meta name="twitter:image" content="<%- frontUrl %>/static/meta-img.jpg" />
   </head>
   <body>
     <div id="app"></div>

mkdocs.yml

@@ -0,0 +1,42 @@
+site_name: 'Panoramax - Website'
+site_url: https://docs.panoramax.fr
+
+theme:
+  name: material
+  logo: https://gitlab.com/panoramax/gitlab-profile/-/raw/main/images/panoramax_favicon.svg
+  features:
+    - navigation.footer
+    - navigation.tracking
+    - navigation.sections
+    - search.suggest
+    - search.share
+    - content.code.annotate
+    - content.code.copy
+    - content.code.select
+
+plugins:
+  - search
+
+markdown_extensions:
+  - admonition
+  - pymdownx.superfences
+  - pymdownx.tabbed:
+      alternate_style: true
+  - pymdownx.highlight:
+      anchor_linenums: true
+      line_spans: __span
+      pygments_lang_class: true
+  - pymdownx.inlinehilite
+  - pymdownx.snippets
+  - attr_list
+  - pymdownx.emoji:
+      emoji_index: !!python/name:material.extensions.emoji.twemoji
+      emoji_generator: !!python/name:material.extensions.emoji.to_svg
+
+nav:
+  - Home: 'index.md'
+  - Install: '02_Setup.md'
+  - Configuration: '03_Settings.md'
+  - Developping:
+    - 'Where to start': '09_Develop.md'
+    - 'Make a release': '90_Releases.md'

package.json

@@ -1,14 +1,14 @@
 {
   "name": "geovisio-website",
-  "version": "2.1.3",
+  "version": "2.6.2",
   "engines": {
-    "node": "18.16.0"
+    "node": "20.9.0"
   },
   "private": true,
   "scripts": {
     "dev": "vite",
-    "start": "vite --port $PORT",
-    "build": "run-p type-check build-only",
+    "start": "node server.js",
+    "build": "run-p build-only",
     "preview": "vite preview",
     "test:unit": "vitest --environment jsdom --root src/",
     "test:e2e": "yarn cypress run --browser chrome",
@@ -20,51 +20,61 @@
     "format": "prettier .  --write"
   },
   "dependencies": {
-    "@popperjs/core": "^2.11.6",
-    "@vueuse/core": "^10.2.1",
-    "axios": "^1.2.3",
-    "bootstrap": "^5.2.3",
-    "bootstrap-icons": "^1.10.3",
-    "geovisio": "2.1.4",
-    "moment": "^2.29.4",
-    "pinia": "^2.1.4",
-    "vue": "^3.2.45",
+    "@popperjs/core": "^2.11.8",
+    "@vueuse/core": "^10.9.0",
+    "axios": "^1.6.8",
+    "bootstrap": "^5.3.3",
+    "bootstrap-icons": "^1.11.3",
+    "express": "4.19.2",
+    "geovisio": "3.0.1",
+    "moment": "^2.30.1",
+    "pako": "^2.1.0",
+    "pinia": "^2.1.7",
+    "v-calendar": "^3.1.2",
+    "vue": "^3.4.21",
     "vue-axios": "^3.5.2",
-    "vue-eslint-parser": "^9.1.0",
-    "vue-i18n": "9.2.2",
-    "vue-meta": "^3.0.0-alpha.10",
-    "vue-router": "^4.1.6",
+    "vue-draggable-resizable-vue3": "^2.3.1-beta.13",
+    "vue-i18n": "9.13.1",
+    "vue-matomo": "^4.2.0",
+    "vue-router": "^4.3.2",
     "vue3-cookies": "^1.0.6",
     "vue3-smooth-scroll": "^0.8.1"
   },
   "devDependencies": {
-    "@pinia/testing": "^0.1.2",
+    "@pinia/testing": "^0.1.3",
     "@rushstack/eslint-patch": "^1.1.4",
+    "@types/jest": "^29.5.4",
     "@types/jsdom": "^20.0.1",
     "@types/node": "^18.11.18",
     "@typescript-eslint/eslint-plugin": "^5.46.0",
     "@typescript-eslint/parser": "^5.4.0",
-    "@vitejs/plugin-vue": "^3.2.0",
+    "@vitejs/plugin-vue": "^5.0.4",
     "@vue/cli-plugin-typescript": "~5.0.0",
     "@vue/eslint-config-prettier": "^7.0.0",
     "@vue/eslint-config-typescript": "^11.0.0",
-    "@vue/test-utils": "^2.2.4",
+    "@vue/test-utils": "^2.4.6",
     "@vue/tsconfig": "^0.1.3",
-    "cypress": "^12.12.0",
+    "cypress": "^13.9.0",
     "eslint": "^8.29.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-import-resolver-typescript": "^3.5.5",
     "eslint-plugin-import": "^2.27.5",
     "eslint-plugin-vue": "^9.8.0",
-    "jsdom": "^20.0.3",
+    "jest": "^29.7.0",
+    "jsdom": "^24.0.0",
+    "less": "^4.2.0",
+    "less-loader": "^12.2.0",
     "npm-run-all": "^4.1.5",
     "prettier": "2.8.1",
-    "sass": "^1.62.0",
+    "sass": "^1.77.1",
+    "terser": "^5.30.4",
     "typescript": "~4.7.4",
-    "vite": "^3.2.4",
+    "vite": "^5.2.11",
     "vite-plugin-eslint": "^1.8.1",
-    "vitest": "^0.25.3",
-    "vue-tsc": "^1.0.9"
+    "vite-plugin-html": "^3.2.2",
+    "vitest": "^1.6.0",
+    "vue-eslint-parser": "^9.4.2",
+    "vue-tsc": "^2.0.17"
   },
   "eslintConfig": {
     "extends": [

pako.d.ts

@@ -0,0 +1 @@
+declare module 'pako'

server.js

@@ -0,0 +1,13 @@
+const express = require('express')
+
+const app = express()
+const directory = '/' + (process.env.STATIC_DIR || 'dist')
+app.use(express.static(__dirname + directory))
+
+const port = process.env.PORT || 3003
+app.listen(port, function () {
+  console.log('Listening on', port)
+})
+app.get('*', function (request, response) {
+  response.sendFile(__dirname + '/dist/index.html')
+})

src/App.vue

@@ -1,25 +1,16 @@
 <script setup lang="ts">
+import { ref } from 'vue'
+import { RouterView } from 'vue-router'
+import { authConfig, isAuth } from './composables/auth'
+const { authConf } = authConfig()
+const { isLogged } = isAuth()
 import Header from '@/components/Header.vue'
 import Footer from '@/components/Footer.vue'
-import { RouterView } from 'vue-router'
-import { useMeta } from 'vue-meta'
-import { useI18n } from 'vue-i18n'
-import { title } from '@/utils/index'
-import authConfig from './composables/auth'
-const { authConf } = authConfig()
-const { t } = useI18n()
 
-useMeta({
-  title: title(t('general.title')),
-  og: {
-    title: title(t('general.meta.title')),
-    description: title(t('general.meta.description'))
-  },
-  twitter: {
-    title: title(t('general.meta.title')),
-    description: title(t('general.meta.description'))
-  }
-})
+let focusMap = ref<string>('focus-map')
+function setFocusMap(value: string) {
+  focusMap.value = value
+}
 </script>
 
 <template>
@@ -41,7 +32,7 @@ useMeta({
         : ''
     "
   />
-  <RouterView />
-  <Footer />
+  <RouterView @trigger="setFocusMap" :class="{ logged: isLogged }" />
+  <Footer v-if="!isLogged" />
 </template>
 <style scoped></style>

src/assets/components/index.scss

@@ -0,0 +1,14 @@
+@mixin switch-button-view() {
+  position: fixed;
+  right: 0;
+  top: toRem(22);
+  z-index: 3;
+  height: toRem(5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-top-left-radius: toRem(0.5);
+  border-bottom-left-radius: toRem(0.5);
+  background-color: var(--white);
+  border: toRem(0.1) solid var(--grey-pale);
+}

src/assets/font-size.scss

@@ -1,38 +1,61 @@
 @mixin text($size) {
   @if $size == h1 {
-    font-weight: normal;
-    font-size: toRem(4);
+    font-weight: 590;
+    line-height: toRem(2.6);
+    font-size: toRem(2.2);
 
     @media (max-width: toRem(50)) {
-      font-size: toRem(2.6);
+      font-size: toRem(2);
     }
   }
   @if $size == h2 {
-    font-weight: normal;
+    font-weight: 590;
     font-size: toRem(2);
+    line-height: toRem(2.4);
 
     @media (max-width: toRem(50)) {
-      font-size: toRem(1.8);
+      font-size: toRem(1.6);
+    }
+  }
+  @if $size == h3 {
+    font-weight: 590;
+    font-size: toRem(1.8);
+    line-height: toRem(2.1);
+
+    @media (max-width: toRem(50)) {
+      font-size: toRem(1.6);
     }
   }
   @if $size == h4 {
     font-weight: normal;
-    font-size: toRem(1.6);
+    font-size: toRem(1.8);
+  }
+  @if $size == xxl-regular {
+    font-size: toRem(3.2);
+    font-weight: normal;
   }
   @if $size == m-regular {
     font-size: toRem(1.6);
     font-weight: normal;
   }
+  @if $size == s-regular {
+    font-size: toRem(1.4);
+    font-weight: normal;
+  }
+
   @if $size == m-r-regular {
     font-size: toRem(1.6);
     font-weight: normal;
     @media (max-width: toRem(50)) {
-      font-size: toRem(1.2);
+      font-size: toRem(1.4);
     }
   }
-  @if $size == s-regular {
+  @if $size == s-r-regular {
     font-size: toRem(1.4);
     font-weight: normal;
+    @media (max-width: toRem(50)) {
+      font-size: toRem(1.2);
+    }
   }
   @if $size == xs-r-regular {
     font-size: toRem(1.2);
@@ -42,7 +65,7 @@
     }
   }
   @if $size == xss-regular {
-    font-size: toRem(0.9);
+    font-size: toRem(1);
     font-weight: normal;
   }
 }

src/assets/images/building.svg

@@ -0,0 +1,32 @@
+<svg width="80" height="71" viewBox="0 0 80 71" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="47.5" cy="38" r="32.5" fill="#F2F5FF"/>
+<path d="M51.2768 56.873H18.3615C17.7586 56.873 17.2734 56.3879 17.2734 55.7849V1.58811C17.2734 0.985114 17.7586 0.5 18.3615 0.5H51.2768C51.8798 0.5 52.3649 0.985114 52.3649 1.58811V55.7849C52.3649 56.3879 51.8752 56.873 51.2768 56.873ZM19.4497 54.6968H50.1887V2.67621H19.4497V54.6968Z" fill="#0A1F69"/>
+<path d="M27.8776 12.1926H22.7273C22.1243 12.1926 21.6392 11.7075 21.6392 11.1045V5.94956C21.6392 5.34656 22.1243 4.86145 22.7273 4.86145H27.8822C28.4852 4.86145 28.9703 5.34656 28.9703 5.94956V11.0999C28.9657 11.7029 28.4806 12.1926 27.8776 12.1926ZM23.8154 10.0164H26.7941V7.0422H23.8154V10.0164Z" fill="#0A1F69"/>
+<path d="M37.394 12.1926H32.2436C31.6406 12.1926 31.1555 11.7075 31.1555 11.1045V5.94956C31.1555 5.34656 31.6406 4.86145 32.2436 4.86145H37.394C37.997 4.86145 38.4821 5.34656 38.4821 5.94956V11.0999C38.4821 11.7029 37.997 12.1926 37.394 12.1926ZM33.3317 10.0164H36.3059V7.0422H33.3317V10.0164Z" fill="#0A1F69"/>
+<path d="M37.394 12.1926H32.2436C31.6406 12.1926 31.1555 11.7075 31.1555 11.1045V5.94956C31.1555 5.34656 31.6406 4.86145 32.2436 4.86145H37.394C37.997 4.86145 38.4821 5.34656 38.4821 5.94956V11.0999C38.4821 11.7029 37.997 12.1926 37.394 12.1926ZM33.3317 10.0164H36.3059V7.0422H33.3317V10.0164Z" fill="#0A1F69"/>
+<path d="M46.9106 12.1926H41.7602C41.1572 12.1926 40.6721 11.7075 40.6721 11.1045V5.94956C40.6721 5.34656 41.1572 4.86145 41.7602 4.86145H46.9151C47.5181 4.86145 48.0032 5.34656 48.0032 5.94956V11.0999C47.9987 11.7029 47.5136 12.1926 46.9106 12.1926ZM42.8483 10.0164H45.827V7.0422H42.8483V10.0164Z" fill="#0A1F69"/>
+<path d="M27.8776 21.709H22.7273C22.1243 21.709 21.6392 21.2239 21.6392 20.6209V15.466C21.6392 14.863 22.1243 14.3779 22.7273 14.3779H27.8822C28.4852 14.3779 28.9703 14.863 28.9703 15.466V20.6209C28.9657 21.2194 28.4806 21.709 27.8776 21.709ZM23.8154 19.5328H26.7941V16.5541H23.8154V19.5328Z" fill="#0A1F69"/>
+<path d="M37.394 21.709H32.2436C31.6406 21.709 31.1555 21.2239 31.1555 20.6209V15.466C31.1555 14.863 31.6406 14.3779 32.2436 14.3779H37.3985C38.0015 14.3779 38.4866 14.863 38.4866 15.466V20.6209C38.4821 21.2194 37.997 21.709 37.394 21.709ZM33.3317 19.5328H36.3104V16.5541H33.3317V19.5328Z" fill="#0A1F69"/>
+<path d="M37.394 21.709H32.2436C31.6406 21.709 31.1555 21.2239 31.1555 20.6209V15.466C31.1555 14.863 31.6406 14.3779 32.2436 14.3779H37.3985C38.0015 14.3779 38.4866 14.863 38.4866 15.466V20.6209C38.4821 21.2194 37.997 21.709 37.394 21.709ZM33.3317 19.5328H36.3104V16.5541H33.3317V19.5328Z" fill="#0A1F69"/>
+<path d="M46.9106 21.709H41.7602C41.1572 21.709 40.6721 21.2239 40.6721 20.6209V15.466C40.6721 14.863 41.1572 14.3779 41.7602 14.3779H46.9151C47.5181 14.3779 48.0032 14.863 48.0032 15.466V20.6209C47.9987 21.2194 47.5136 21.709 46.9106 21.709ZM42.8483 19.5328H45.827V16.5541H42.8483V19.5328Z" fill="#0A1F69"/>
+<path d="M27.8776 31.2254H22.7273C22.1243 31.2254 21.6392 30.7403 21.6392 30.1373V24.9824C21.6392 24.3794 22.1243 23.8943 22.7273 23.8943H27.8822C28.4852 23.8943 28.9703 24.3794 28.9703 24.9824V30.1373C28.9657 30.7358 28.4806 31.2254 27.8776 31.2254ZM23.8154 29.0492H26.7941V26.0705H23.8154V29.0492Z" fill="#0A1F69"/>
+<path d="M37.394 31.2254H32.2436C31.6406 31.2254 31.1555 30.7403 31.1555 30.1373V24.9824C31.1555 24.3794 31.6406 23.8943 32.2436 23.8943H37.3985C38.0015 23.8943 38.4866 24.3794 38.4866 24.9824V30.1373C38.4821 30.7358 37.997 31.2254 37.394 31.2254ZM33.3317 29.0492H36.3059V26.0705H33.3272L33.3317 29.0492Z" fill="#0A1F69"/>
+<path d="M37.394 31.2254H32.2436C31.6406 31.2254 31.1555 30.7403 31.1555 30.1373V24.9824C31.1555 24.3794 31.6406 23.8943 32.2436 23.8943H37.3985C38.0015 23.8943 38.4866 24.3794 38.4866 24.9824V30.1373C38.4821 30.7358 37.997 31.2254 37.394 31.2254ZM33.3317 29.0492H36.3059V26.0705H33.3272L33.3317 29.0492Z" fill="#0A1F69"/>
+<path d="M46.9106 31.2254H41.7602C41.1572 31.2254 40.6721 30.7403 40.6721 30.1373V24.9824C40.6721 24.3794 41.1572 23.8943 41.7602 23.8943H46.9151C47.5181 23.8943 48.0032 24.3794 48.0032 24.9824V30.1373C47.9987 30.7358 47.5136 31.2254 46.9106 31.2254ZM42.8483 29.0492H45.827V26.0705H42.8483V29.0492Z" fill="#0A1F69"/>
+<path d="M65.1547 56.8729H51.2768C50.6738 56.8729 50.1887 56.3878 50.1887 55.7848V13.3578C50.1887 12.7548 50.6738 12.2697 51.2768 12.2697H65.1547C65.7577 12.2697 66.2428 12.7548 66.2428 13.3578V55.7848C66.2428 56.3878 65.7577 56.8729 65.1547 56.8729ZM52.3649 54.6967H64.0666V14.4459H52.3649V54.6967Z" fill="#0A1F69"/>
+<path d="M60.7932 23.9622H55.6428C55.0398 23.9622 54.5547 23.4771 54.5547 22.8741V17.7237C54.5547 17.1207 55.0398 16.6356 55.6428 16.6356H60.7932C61.3962 16.6356 61.8813 17.1207 61.8813 17.7237V22.8786C61.8813 23.4771 61.3916 23.9622 60.7932 23.9622ZM56.7264 21.786H59.7005V18.8073H56.7264V21.786Z" fill="#0A1F69"/>
+<path d="M60.7929 33.4786H55.6425C55.0396 33.4786 54.5544 32.9934 54.5544 32.3905V27.2401C54.5544 26.6371 55.0396 26.152 55.6425 26.152H60.7929C61.3959 26.152 61.881 26.6371 61.881 27.2401V32.395C61.881 32.9934 61.3914 33.4786 60.7929 33.4786ZM56.7261 31.3023H59.7003V28.3237H56.7261V31.3023Z" fill="#0A1F69"/>
+<path d="M60.7929 42.9949H55.6425C55.0396 42.9949 54.5544 42.5098 54.5544 41.9068V36.7519C54.5544 36.1489 55.0396 35.6638 55.6425 35.6638H60.7929C61.3959 35.6638 61.881 36.1489 61.881 36.7519V41.9068C61.881 42.5098 61.3914 42.9949 60.7929 42.9949ZM56.7261 40.8187H59.7003V37.84H56.7261V40.8187Z" fill="#0A1F69"/>
+<path d="M60.7929 52.5114H55.6425C55.0396 52.5114 54.5544 52.0263 54.5544 51.4233V46.2684C54.5544 45.6654 55.0396 45.1803 55.6425 45.1803H60.7929C61.3959 45.1803 61.881 45.6654 61.881 46.2684V51.4233C61.881 52.0218 61.3914 52.5114 60.7929 52.5114ZM56.7261 50.3352H59.7003V47.3565H56.7261V50.3352Z" fill="#0A1F69"/>
+<path d="M18.3615 56.873H4.48361C3.88062 56.873 3.39551 56.3879 3.39551 55.7849V21.5141C3.39551 21.1287 3.59953 20.7706 3.93049 20.5756L17.8084 12.4194C18.1439 12.2199 18.561 12.2199 18.901 12.4148C19.2411 12.6098 19.4496 12.9679 19.4496 13.3578V55.7849C19.4496 56.3879 18.9645 56.873 18.3615 56.873ZM5.57172 54.6968H17.2734V15.2575L5.57172 22.1352V54.6968Z" fill="#0A1F69"/>
+<path d="M13.9998 52.5115H8.84494C8.24195 52.5115 7.75684 52.0264 7.75684 51.4234V46.273C7.75684 45.6701 8.24195 45.1849 8.84494 45.1849H13.9953C14.5983 45.1849 15.0834 45.6701 15.0834 46.273V51.4234C15.088 52.0219 14.5983 52.5115 13.9998 52.5115ZM9.93305 50.3353H12.9117V47.3611H9.93758L9.93305 50.3353Z" fill="#0A1F69"/>
+<path d="M13.9998 33.4787H8.84494C8.24195 33.4787 7.75684 32.9936 7.75684 32.3906V27.2402C7.75684 26.6372 8.24195 26.1521 8.84494 26.1521H13.9953C14.5983 26.1521 15.0834 26.6372 15.0834 27.2402V32.3951C15.088 32.9936 14.5983 33.4787 13.9998 33.4787ZM9.93305 31.3025H12.9072V28.3238H9.93305V31.3025Z" fill="#0A1F69"/>
+<path d="M13.9998 42.9951H8.84494C8.24195 42.9951 7.75684 42.5099 7.75684 41.9069V36.752C7.75684 36.1491 8.24195 35.6639 8.84494 35.6639H13.9953C14.5983 35.6639 15.0834 36.1491 15.0834 36.752V41.9069C15.088 42.5054 14.5983 42.9951 13.9998 42.9951ZM9.93305 40.8188H12.9072V37.8402H9.93305V40.8188Z" fill="#0A1F69"/>
+<path d="M27.8779 40.7418H22.7275C22.1245 40.7418 21.6394 40.2566 21.6394 39.6537V34.4988C21.6394 33.8958 22.1245 33.4106 22.7275 33.4106H27.8824C28.4854 33.4106 28.9705 33.8958 28.9705 34.4988V39.6537C28.966 40.2521 28.4809 40.7418 27.8779 40.7418ZM23.8156 38.5655H26.7943V35.5869H23.8156V38.5655Z" fill="#0A1F69"/>
+<path d="M37.3942 40.7418H32.2439C31.6409 40.7418 31.1558 40.2566 31.1558 39.6537V34.4988C31.1558 33.8958 31.6409 33.4106 32.2439 33.4106H37.3988C38.0018 33.4106 38.4869 33.8958 38.4869 34.4988V39.6491C38.4823 40.2521 37.9972 40.7418 37.3942 40.7418ZM33.332 38.5655H36.3061V35.5914H33.3274L33.332 38.5655Z" fill="#0A1F69"/>
+<path d="M37.3942 40.7418H32.2439C31.6409 40.7418 31.1558 40.2566 31.1558 39.6537V34.4988C31.1558 33.8958 31.6409 33.4106 32.2439 33.4106H37.3988C38.0018 33.4106 38.4869 33.8958 38.4869 34.4988V39.6491C38.4823 40.2521 37.9972 40.7418 37.3942 40.7418ZM33.332 38.5655H36.3061V35.5914H33.3274L33.332 38.5655Z" fill="#0A1F69"/>
+<path d="M46.9108 40.7418H41.7605C41.1575 40.7418 40.6724 40.2566 40.6724 39.6537V34.4988C40.6724 33.8958 41.1575 33.4106 41.7605 33.4106H46.9108C47.5138 33.4106 47.9989 33.8958 47.9989 34.4988V39.6537C47.9989 40.2521 47.5138 40.7418 46.9108 40.7418ZM42.8486 38.5655H45.8227V35.5869H42.8486V38.5655Z" fill="#0A1F69"/>
+<path d="M41.7603 56.8729H27.8779C27.2749 56.8729 26.7898 56.3878 26.7898 55.7848V44.201C26.7898 43.598 27.2749 43.1129 27.8779 43.1129H41.7558C42.3588 43.1129 42.8439 43.598 42.8439 44.201V55.7848C42.8484 56.3878 42.3588 56.8729 41.7603 56.8729ZM28.966 54.6967H40.6677V45.2891H28.966V54.6967Z" fill="#0A1F69"/>
+<path d="M34.8191 56.8729C34.2161 56.8729 33.731 56.3878 33.731 55.7848V44.201C33.731 43.598 34.2161 43.1129 34.8191 43.1129C35.4221 43.1129 35.9072 43.598 35.9072 44.201V55.7848C35.9072 56.3878 35.4221 56.8729 34.8191 56.8729Z" fill="#0A1F69"/>
+<path d="M68.5507 60.5H1.08811C0.485114 60.5 0 60.0149 0 59.4119V55.7849C0 55.1819 0.485114 54.6968 1.08811 54.6968H68.5507C69.1537 54.6968 69.6388 55.1819 69.6388 55.7849V59.4119C69.6388 60.0149 69.1537 60.5 68.5507 60.5ZM2.17621 58.3238H67.4626V56.873H2.17621V58.3238Z" fill="#0A1F69"/>
+</svg>

src/assets/images/car.svg

@@ -0,0 +1,37 @@
+<svg width="58" height="114" viewBox="0 0 58 114" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M54.5335 97.255C53.702 100.976 51.4048 104.696 50.7988 106.514C50.0096 108.882 39.7427 110.087 29.2996 110.136C29.1939 110.136 29.0953 110.136 28.9896 110.136C28.8839 110.136 28.7852 110.136 28.6795 110.136C18.2365 110.087 7.96957 108.882 7.18035 106.514C6.57434 104.696 4.2701 100.976 3.44565 97.255L2.7269 99.221C3.42451 103.238 6.02471 107.395 6.68004 109.361C7.4904 111.785 17.9898 113.018 28.6725 113.06C28.7782 113.06 28.8839 113.06 28.9896 113.06C29.0953 113.06 29.201 113.06 29.3067 113.06C39.9893 113.011 50.4887 111.778 51.2991 109.354C51.9544 107.381 54.5546 103.23 55.2522 99.2139L54.5335 97.2479V97.255Z" fill="#160302"/>
+<path d="M6.30663 32.0951C7.65253 25.2599 10.2386 11.8713 10.2386 11.8713L10.288 11.7304C11.9439 6.12836 27.087 5.0291 28.8276 5.08547C28.8839 5.08547 28.9333 5.08547 28.9896 5.08547C29.046 5.08547 29.0953 5.08547 29.1517 5.08547C30.8852 5.0291 46.0353 6.12836 47.6913 11.7304L47.7406 11.8713C47.7406 11.8713 50.3197 25.2528 51.6726 32.0951C54.5265 27.2752 55.203 21.4759 53.5611 16.1204C52.2786 11.9348 51.0807 8.97519 51.0807 8.97519L51.0173 8.81312C49.0654 2.2175 31.2234 0.920929 29.1799 0.984348C29.1165 0.984348 29.053 0.984348 28.9896 0.984348C28.9262 0.984348 28.8628 0.984348 28.7994 0.984348C26.7559 0.920929 8.91387 2.2175 6.95492 8.81312L6.8915 8.97519C6.8915 8.97519 5.69358 11.9277 4.4111 16.1204C2.76924 21.4759 3.44571 27.2752 6.29958 32.0951H6.30663Z" fill="#160302"/>
+<path d="M55.0126 70.3581L53.6879 66.3627L53.0396 48.5559C52.9621 43.6022 53.0466 41.8405 53.2017 37.373C53.2228 36.7881 54.7308 33.7863 54.7519 33.2155C55.1324 23.5969 49.5797 9.87012 49.5797 9.87012L49.5233 9.72214C47.7053 3.57046 31.0683 2.35845 29.1657 2.42187C29.1023 2.42187 29.0459 2.42187 28.9895 2.42187C28.9332 2.42187 28.8698 2.42187 28.8134 2.42187C26.9038 2.35845 10.2738 3.57046 8.44871 9.72214L8.39234 9.87012C8.39234 9.87012 2.83962 23.5969 3.22014 33.2155C3.24128 33.7863 4.74925 36.7881 4.77039 37.373C4.92541 41.8405 5.00997 43.6022 4.93246 48.5559L4.29122 66.257L2.95941 70.2595V93.8162L3.21309 95.9302V95.9795C3.7134 100.095 6.50385 104.485 7.17328 106.507C7.9625 108.875 18.2294 110.08 28.6724 110.129C28.7781 110.129 28.8768 110.129 28.9825 110.129C29.0882 110.129 29.1868 110.129 29.2925 110.129C39.7356 110.08 50.0025 108.875 50.7917 106.507C51.4682 104.478 54.2516 100.095 54.7519 95.9795V95.9302L55.0056 93.9149V70.3581H55.0126Z" fill="#17347A"/>
+<path d="M45.8168 47.795L26.0018 27.9799C24.7898 12.8016 31.9843 6.36803 39.1226 3.68328C34.5845 2.66857 30.1029 2.3867 29.1657 2.42194C29.1023 2.42194 29.0459 2.42194 28.9895 2.42194C28.9332 2.42194 28.8698 2.42194 28.8134 2.42194C26.9038 2.35852 10.2738 3.57053 8.44871 9.72221L8.39234 9.87019C8.39234 9.87019 2.83962 23.597 3.22014 33.2156C3.24128 33.7863 4.74925 36.7882 4.77039 37.3731C4.92541 41.8406 5.00997 43.6023 4.93246 48.556L4.29122 66.2571L2.95941 70.2595V93.8163L3.21309 95.9303V95.9796C3.64293 99.5029 5.74282 103.216 6.76458 105.485C9.08291 100.003 12.268 92.1674 12.268 92.1674L12.8881 51.276C20.139 52.9742 28.6302 52.6642 28.6302 52.6642C45.6054 52.8192 45.8239 47.7879 45.8239 47.7879L45.8168 47.795Z" fill="#1E4084"/>
+<path d="M43.9213 10.8637L49.0583 18.9673L51.0031 22.0396C49.6572 17.0788 48.0929 13.2173 48.0929 13.2173L48.0436 13.0763C47.4939 11.2231 45.4856 9.85605 42.9771 8.84839C43.2096 9.55305 43.5196 10.2295 43.9142 10.8637H43.9213Z" fill="#C1D1D0"/>
+<path d="M14.0508 10.8637C14.4524 10.2366 14.7555 9.55305 14.988 8.84839C12.4724 9.84901 10.4711 11.216 9.92149 13.0763L9.87216 13.2173C9.87216 13.2173 8.30781 17.0788 6.96191 22.0396L14.0508 10.8637Z" fill="#C1D1D0"/>
+<path d="M14.4102 10.2225C14.6427 9.77854 14.833 9.32051 14.988 8.84839C12.4724 9.84901 10.4711 11.216 9.92151 13.0763L9.87218 13.2173C9.87218 13.2173 9.40006 14.387 8.75177 16.2544C9.22389 16.1134 9.66078 15.8809 10.0554 15.5286C11.4154 14.3165 13.1488 12.2589 14.4102 10.2225Z" fill="#DFF3F4"/>
+<path d="M43.562 10.2225C44.8233 12.266 46.5638 14.3165 47.9167 15.5286C48.3114 15.8809 48.7482 16.1064 49.2204 16.2544C48.5721 14.38 48.1 13.2173 48.1 13.2173L48.0506 13.0763C47.501 11.2231 45.4927 9.85605 42.9841 8.84839C43.1392 9.32051 43.3294 9.78559 43.562 10.2225Z" fill="#DFF3F4"/>
+<path d="M45.3729 106.655C39.0521 107.578 33.1189 107.578 28.9826 107.578C24.8462 107.578 18.913 107.578 12.5922 106.655C7.37065 105.894 8.97727 104.097 8.97727 104.097L12.3455 97.6073C18.3633 98.8052 39.5877 98.8052 45.6055 97.6073L48.9738 104.097C48.9738 104.097 50.5874 105.894 45.3589 106.655H45.3729Z" fill="#373637"/>
+<path d="M28.9896 107.656C24.9871 107.656 18.9482 107.656 12.5922 106.733C10.3161 106.401 9.01955 105.838 8.73769 105.048C8.55448 104.534 8.87862 104.125 8.92795 104.055L12.3174 97.5227L12.3737 97.5368C18.4268 98.7488 39.5454 98.7488 45.6055 97.5368L45.6619 97.5227L45.69 97.572L49.0583 104.055C49.1147 104.118 49.4388 104.534 49.2486 105.048C48.9667 105.838 47.6701 106.401 45.3941 106.733C39.0381 107.656 32.9921 107.656 28.9967 107.656H28.9896ZM12.4019 97.6989L9.04774 104.154C9.04774 104.154 8.7095 104.541 8.87862 104.999C9.06183 105.499 9.8581 106.183 12.6133 106.585C18.9623 107.508 24.9942 107.508 28.9896 107.508C32.985 107.508 39.024 107.508 45.3659 106.585C48.1211 106.183 48.9174 105.499 49.1006 104.999C49.2697 104.534 48.9385 104.161 48.9315 104.154L48.9174 104.139L45.5773 97.6989C39.4538 98.8968 18.5254 98.8968 12.4019 97.6989Z" fill="#160302"/>
+<path d="M44.6753 105.774C38.6223 106.627 32.9427 106.641 28.9896 106.641C25.0365 106.641 19.3499 106.627 13.3039 105.774C8.30079 105.07 9.84399 103.407 9.84399 103.407L12.8177 97.861C19.223 98.9532 38.7562 98.9532 45.1545 97.861L48.1282 103.407C48.1282 103.407 49.6714 105.07 44.6683 105.774H44.6753Z" fill="#DFF3F4"/>
+<path d="M48.1282 103.407L47.8674 102.92C47.346 102.765 46.6907 102.624 45.8662 102.512C39.3551 101.596 33.2457 101.582 28.9826 101.582C24.7194 101.582 18.61 101.596 12.0989 102.512C11.2745 102.624 10.6191 102.765 10.0977 102.92L9.83694 103.407C9.83694 103.407 8.29374 105.07 13.2968 105.774C19.3499 106.627 25.0294 106.641 28.9826 106.641C32.9357 106.641 38.6223 106.627 44.6683 105.774C49.6714 105.07 48.1282 103.407 48.1282 103.407Z" fill="#C1D1D0"/>
+<path d="M35.8953 109.03L35.8741 108.988L35.8389 108.931L35.7473 108.769C35.5571 108.713 35.3245 108.67 35.0567 108.628C32.6609 108.29 30.406 108.29 28.9192 108.29C27.4323 108.29 25.1774 108.29 22.7816 108.628C22.5138 108.663 22.2883 108.713 22.091 108.769L22.0135 108.917C22.0135 108.917 21.9853 108.952 21.9712 108.981L21.9501 109.023H21.9007C18.2717 108.868 15.0162 108.537 11.9509 108.022C9.66785 107.635 8.33604 106.986 7.98371 106.084C7.71594 105.394 8.13874 104.837 8.15283 104.816L11.9791 97.3396C12.0919 97.1141 12.4301 96.9872 12.7543 97.0577C19.2724 98.3684 38.6787 98.3684 45.1968 97.0577C45.5209 96.9943 45.8592 97.1141 45.9719 97.3396L49.8053 104.816C49.8546 104.879 50.2281 105.422 49.9744 106.077C49.6221 106.979 48.2832 107.628 46.0072 108.015C42.9137 108.537 39.6159 108.868 35.9376 109.023H35.8882L35.8953 109.03ZM35.9658 108.847C35.9658 108.847 35.9728 108.861 35.9869 108.875C39.6441 108.72 42.9137 108.396 45.9931 107.874C48.7624 107.402 49.615 106.613 49.8476 106.035C50.0871 105.429 49.6996 104.922 49.6996 104.915V104.901L45.8521 97.4171C45.7676 97.255 45.4928 97.1634 45.2391 97.2127C38.7069 98.5234 19.2653 98.5234 12.7331 97.2127C12.4794 97.1634 12.2046 97.255 12.1201 97.4171L8.28672 104.901C8.28672 104.901 7.89211 105.429 8.13169 106.035C8.35718 106.613 9.21687 107.409 11.9862 107.874C15.0303 108.389 18.2647 108.713 21.8655 108.868C21.8796 108.847 21.8937 108.833 21.8937 108.833L21.9923 108.642H22.0205C22.2249 108.572 22.4715 108.523 22.7604 108.48C25.1704 108.142 27.4253 108.142 28.9192 108.142C30.413 108.142 32.6679 108.142 35.0779 108.48C35.3668 108.523 35.6134 108.572 35.8178 108.628H35.846L35.9517 108.84L35.9658 108.847Z" fill="#160302"/>
+<path d="M45.3166 26.8032C39.0169 24.513 33.1119 24.4778 28.9826 24.4778C24.8533 24.4778 18.9482 24.513 12.6486 26.8032C7.44113 28.6987 9.04775 32.8844 9.04775 32.8844L12.1483 47.7879C13.7478 52.939 44.161 52.8262 45.8099 47.7879L48.9104 32.8844C48.9104 32.8844 50.517 28.6987 45.3095 26.8032H45.3166Z" fill="#160302"/>
+<path d="M44.6753 29.0792C38.6223 27.0427 32.9427 27.0145 28.9896 27.0145C25.0364 27.0145 19.3498 27.0427 13.3038 29.0792C8.30076 30.7633 9.84396 34.7376 9.84396 34.7376L12.8176 47.9922C14.3538 52.5725 43.569 52.4668 45.1545 47.9922L48.1281 34.7376C48.1281 34.7376 49.6713 30.7633 44.6683 29.0792H44.6753Z" fill="#DFF3F4"/>
+<path d="M44.6753 29.0792C38.6223 27.0427 32.9427 27.0145 28.9896 27.0145C25.0364 27.0145 19.3498 27.0427 13.3038 29.0792C8.30076 30.7633 9.84396 34.7376 9.84396 34.7376L10.3654 37.0489C10.8728 37.4083 11.514 37.7324 12.2962 38.0002C12.3314 38.9233 12.4583 39.783 12.7401 40.5299C12.1693 40.6356 11.6549 40.7554 11.2321 40.8963L11.7606 43.2428C13.2193 43.6234 15.3403 43.87 17.7009 43.87C22.1121 43.87 25.6847 43.0314 25.6847 41.9956C25.6847 41.4037 24.515 40.8752 22.6829 40.5369C22.7463 40.389 22.7956 40.241 22.8449 40.093C25.3394 40.2903 27.5943 40.2974 29.4899 40.2974C33.8094 40.2974 39.9964 40.2692 46.599 38.0425C46.9161 37.9368 47.205 37.817 47.4728 37.6972L48.1352 34.7446C48.1352 34.7446 49.6784 30.7704 44.6753 29.0862V29.0792Z" fill="#C1D1D0"/>
+<path d="M6.10921 33.7792C6.1233 33.2789 6.8632 33.2014 6.99708 33.6806C8.54733 39.3037 11.8381 51.29 11.824 51.8185L10.76 92.428C10.7318 93.6823 9.49862 94.2813 8.95604 93.2032C8.95604 93.2032 5.36932 83.4718 5.35522 80.3431L6.10921 33.7792Z" fill="#17347A"/>
+<path d="M9.72417 93.8443C9.38594 93.8443 9.08293 93.6259 8.88563 93.2383C8.84335 93.1326 5.29186 83.4506 5.27777 80.3431L6.03176 33.7791C6.0388 33.4761 6.27134 33.3141 6.49683 33.2859C6.71528 33.2577 6.99009 33.3634 7.07465 33.6593C8.88563 40.2127 11.9227 51.297 11.9016 51.8184L10.8375 92.428C10.8164 93.2102 10.3513 93.7175 9.90739 93.8162C9.84397 93.8303 9.78759 93.8373 9.72417 93.8373V93.8443ZM6.18678 33.7862L5.4328 80.3501C5.44689 83.4295 8.99133 93.0833 9.02656 93.182C9.22387 93.5695 9.52687 93.7527 9.86511 93.6752C10.2527 93.5907 10.6614 93.1326 10.6755 92.435L11.7395 51.8255C11.7536 51.4591 9.94967 44.6873 6.91963 33.7087C6.86326 33.4973 6.673 33.4268 6.51093 33.448C6.36295 33.462 6.18678 33.5677 6.17974 33.7932L6.18678 33.7862Z" fill="#160302"/>
+<path d="M6.75751 34.822L10.8304 50.1624C10.9855 50.7473 11.0559 51.3462 11.0348 51.9452L9.87915 91.7303C9.86506 92.294 6.79274 84.1129 6.79274 82.3935L6.75751 34.8079V34.822Z" fill="#373637"/>
+<path d="M9.87217 91.8431C9.62554 91.8431 8.33601 88.1506 8.18803 87.7278C7.75114 86.4665 6.72234 83.4153 6.72234 82.4006L6.6871 34.223L10.908 50.1413C11.063 50.7332 11.1335 51.3392 11.1194 51.9452L9.96377 91.7303C9.96377 91.8149 9.9074 91.836 9.87217 91.836V91.8431ZM6.83508 35.4139L6.87031 82.4006C6.87031 83.9297 9.26616 90.3421 9.80875 91.5189L10.9573 51.9452C10.9714 51.3463 10.908 50.7543 10.753 50.1836L6.83508 35.4139Z" fill="#160302"/>
+<path d="M9.70307 82.5698L10.5205 52.3046C10.5346 51.7409 10.4782 51.1772 10.3443 50.6275L7.25085 37.6759L7.31427 75.4245C7.31427 77.4399 7.84982 79.427 8.86453 81.1675C9.13934 81.6396 9.42121 82.1188 9.70307 82.5768V82.5698Z" fill="#C1D1D0"/>
+<path d="M9.70304 82.5698L10.5204 52.3046C10.5345 51.7409 10.4782 51.1772 10.3443 50.6275L9.69599 47.9005C8.25144 54.0592 7.3847 61.9585 7.3847 70.5765C7.3847 73.0921 7.46222 75.5514 7.60315 77.9261C7.85683 79.0606 8.27962 80.1528 8.87154 81.1675C9.14635 81.6396 9.42822 82.1188 9.71008 82.5768L9.70304 82.5698Z" fill="#DFF3F4"/>
+<path d="M6.75049 69.3011C6.87028 70.6752 9.42819 75.2554 10.4147 76.0728L10.5275 72.2043C9.7312 70.4638 7.18033 67.2787 6.74344 65.5593L6.75753 69.294L6.75049 69.3011Z" fill="#160302"/>
+<path d="M6.7928 34.8502C6.7928 34.8502 0.373348 38.3383 0.373348 39.4587C0.373348 40.5791 -0.00012207 43.2075 -0.00012207 43.2075L5.2355 41.3472L7.66658 38.0705L6.78575 34.8502H6.7928Z" fill="#160302"/>
+<path d="M5.62918 66.4665L5.49713 66.5477L10.3844 74.4949L10.5164 74.4137L5.62918 66.4665Z" fill="#160302"/>
+<path d="M51.8629 33.8778C51.8488 33.3775 51.1089 33.3 50.975 33.7792C49.4248 39.4024 46.134 51.3886 46.1481 51.9171L47.2122 92.5267C47.2403 93.781 48.4735 94.3799 49.0161 93.3018C49.0161 93.3018 52.6028 83.5705 52.6169 80.4418L51.8629 33.8778Z" fill="#17347A"/>
+<path d="M48.2479 93.943C48.1916 93.943 48.1282 93.943 48.0647 93.9219C47.6138 93.8232 47.1487 93.3159 47.1275 92.5337L46.0705 51.9241C46.0494 51.3957 49.0865 40.3184 50.8975 33.7651C50.975 33.4691 51.2568 33.3634 51.4753 33.3916C51.7008 33.4198 51.9333 33.5818 51.9404 33.8849L52.6943 80.4488C52.6803 83.5563 49.1217 93.2383 49.0865 93.337C48.8892 93.7316 48.5862 93.95 48.2479 93.95V93.943ZM51.4119 33.5325C51.2639 33.5325 51.1018 33.61 51.0525 33.8003C48.0225 44.7789 46.2185 51.5507 46.2326 51.9171L47.2896 92.5337C47.3107 93.2313 47.7124 93.6893 48.1 93.7739C48.4382 93.8514 48.7483 93.6682 48.9456 93.2736C48.9808 93.182 52.5252 83.5281 52.5393 80.4488L51.7853 33.8849C51.7783 33.6594 51.6021 33.5607 51.4541 33.5466C51.4401 33.5466 51.4189 33.5466 51.4048 33.5466L51.4119 33.5325Z" fill="#160302"/>
+<path d="M51.2145 34.9207L47.1416 50.2612C46.9866 50.846 46.9161 51.445 46.9373 52.0439L48.0929 91.829C48.107 92.3928 51.1793 84.2117 51.1793 82.4923L51.2145 34.9066V34.9207Z" fill="#373637"/>
+<path d="M48.1 91.9418C48.1 91.9418 48.0154 91.9207 48.0083 91.8361L46.8598 52.051C46.8457 51.438 46.9091 50.832 47.0712 50.24L51.2921 34.3218V34.9137L51.2568 82.4923C51.2568 83.507 50.228 86.5582 49.7911 87.8195C49.6432 88.2423 48.3536 91.9277 48.107 91.9348L48.1 91.9418ZM51.137 35.5127L47.2191 50.2823C47.0641 50.8601 47.0007 51.4521 47.0148 52.044L48.1634 91.6177C48.713 90.4479 51.1018 84.0285 51.1018 82.4994L51.137 35.5127Z" fill="#160302"/>
+<path d="M48.2691 82.6615L47.4517 52.3963C47.4376 51.8326 47.494 51.2689 47.6279 50.7192L50.7213 37.7676L50.6579 75.5162C50.6579 77.5315 50.1224 79.5187 49.1076 81.2592C48.8328 81.7313 48.551 82.2105 48.2691 82.6685V82.6615Z" fill="#C1D1D0"/>
+<path d="M48.2691 82.5698L47.4517 52.3046C47.4376 51.7409 47.494 51.1772 47.6279 50.6275L48.2761 47.9005C49.7207 54.0592 50.5874 61.9585 50.5874 70.5765C50.5874 73.0921 50.5099 75.5514 50.369 77.9261C50.1153 79.0606 49.6925 80.1528 49.1006 81.1675C48.8258 81.6396 48.5439 82.1188 48.2621 82.5768L48.2691 82.5698Z" fill="#DFF3F4"/>
+<path d="M51.2217 69.3998C51.1019 70.7739 48.544 75.3542 47.5574 76.1716L47.4447 72.303C48.241 70.5625 50.7918 67.3775 51.2287 65.6581L51.2146 69.3928L51.2217 69.3998Z" fill="#160302"/>
+<path d="M51.1864 34.9489C51.1864 34.9489 57.6058 38.4299 57.6058 39.5573C57.6058 40.6848 57.9793 43.3061 57.9793 43.3061L52.7437 41.4458L50.3126 38.1691L51.1934 34.9489H51.1864Z" fill="#160302"/>
+<path d="M52.342 66.5611L47.4576 74.51L47.5897 74.5912L52.4741 66.6423L52.342 66.5611Z" fill="#160302"/>
+<path d="M7.87093 29.7697L7.80047 29.509C7.26492 27.4584 6.55322 24.6821 6.25021 23.0754V23.0472L6.25726 23.0191L13.9803 10.8425C14.6498 9.78555 15.0866 8.62286 15.2699 7.38266L15.5024 5.82536L15.5376 5.80422C15.5729 5.78308 19.3428 3.95097 27.3971 3.38019C27.5944 3.35905 27.7987 3.34496 28.0242 3.33791H28.1158C28.1158 3.33791 28.3906 3.31677 28.7852 3.31677H28.9684H29.1446C29.5533 3.31677 29.8211 3.33087 29.8211 3.33087H29.9127C30.1382 3.35201 30.3425 3.3661 30.5398 3.38019C38.5871 3.95097 42.364 5.78308 42.3993 5.80422L42.4345 5.82536L42.667 7.38266C42.8573 8.62286 43.2871 9.78555 43.9566 10.8425L51.7008 23.0472V23.0754C51.3837 24.6821 50.679 27.4584 50.1435 29.509L50.073 29.7697L49.9955 29.516C49.5093 27.9799 48.2338 26.8454 46.2044 26.1337C39.5243 23.8083 33.1682 23.8083 28.9614 23.8083C24.7546 23.8083 18.3985 23.8083 11.7184 26.1337C9.68895 26.8383 8.41352 27.9799 7.9273 29.516L7.84979 29.7697H7.87093ZM28.9896 23.6603C33.2035 23.6603 39.5806 23.6603 46.2819 25.9927C48.255 26.6762 49.5304 27.7685 50.0871 29.2271C50.6086 27.2259 51.2709 24.6257 51.5669 23.0825L43.8579 10.9271C43.1744 9.84897 42.7305 8.67219 42.5402 7.41085L42.3147 5.93811C41.913 5.74785 38.1502 4.08485 30.5469 3.54226C30.3496 3.52112 30.1452 3.50703 29.9197 3.49998H29.8281C29.8281 3.49998 29.5604 3.47884 29.1658 3.47884H28.9825H28.8134C28.4118 3.47884 28.144 3.49294 28.1369 3.49294H28.0453C27.8199 3.51408 27.6155 3.52817 27.4252 3.54226C19.822 4.08485 16.0591 5.74785 15.6574 5.93811L15.4319 7.41085C15.2417 8.67219 14.7977 9.85602 14.1142 10.9271L6.40524 23.0825C6.7012 24.6186 7.36358 27.2188 7.88502 29.2271C8.44171 27.7614 9.71714 26.6762 11.6902 25.9927C18.3915 23.6603 24.7687 23.6603 28.9825 23.6603H28.9896Z" fill="#160302"/>
+</svg>

src/assets/images/cloud.svg

@@ -0,0 +1,6 @@
+<svg width="65" height="66" viewBox="0 0 65 66" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="32.5" cy="33" r="32.5" fill="#F2F5FF"/>
+<path d="M47.5742 20.5197C47.4489 11.3719 39.9685 3.96826 30.7914 3.96826C26.7092 3.96826 22.7763 5.45326 19.7175 8.14974C16.9875 10.5562 15.12 13.772 14.3804 17.3028C14.3264 17.3022 14.2728 17.3017 14.2194 17.3017C6.37897 17.3017 0 23.6806 0 31.5211C0 39.3616 6.37897 45.7405 14.2195 45.7405H24.1503C24.8568 45.7405 25.4299 45.1677 25.4299 44.4609C25.4299 43.7542 24.8568 43.1814 24.1503 43.1814H14.2195C7.78991 43.1814 2.55914 37.9506 2.55914 31.5211C2.55914 25.0916 7.78991 19.8608 14.2195 19.8608C14.562 19.8608 14.9242 19.8792 15.3267 19.9171C16.009 19.981 16.6215 19.4957 16.7144 18.816C17.1752 15.4387 18.8427 12.3324 21.4098 10.0694C24.0009 7.78517 27.3326 6.52728 30.7913 6.52728C38.6352 6.52728 45.0166 12.9087 45.0166 20.7525C45.0166 21.0349 44.9956 21.326 44.9734 21.6342L44.9639 21.7653C44.9373 22.1417 45.0782 22.5107 45.3491 22.7735C45.6197 23.0364 45.9923 23.1662 46.3683 23.1286C46.7086 23.0943 47.052 23.0771 47.3888 23.0771C52.9314 23.0771 57.4409 27.5864 57.4409 33.1291C57.4409 38.6718 52.9315 43.1811 47.3888 43.1811H36.9461C36.2396 43.1811 35.6665 43.7539 35.6665 44.4607C35.6665 45.1674 36.2396 45.7403 36.9461 45.7403H47.3888C54.3426 45.7403 60 40.083 60 33.1291C59.9999 26.2377 54.4429 20.6192 47.5742 20.5197Z" fill="#0A1F69"/>
+<path d="M30.7916 9.98218C25.4411 9.98218 20.8609 13.9807 20.1376 19.283C20.0421 19.9832 20.5324 20.6283 21.2325 20.7238C21.2912 20.7318 21.3495 20.7358 21.407 20.7358C22.0369 20.7358 22.5858 20.2705 22.6731 19.629C23.2242 15.5884 26.7144 12.5413 30.7915 12.5413C31.4982 12.5413 32.071 11.9685 32.071 11.2617C32.0712 10.5551 31.4982 9.98218 30.7916 9.98218Z" fill="#0A1F69"/>
+<path d="M36.6105 35.161L31.9561 31.0032C31.1537 30.286 29.9432 30.2861 29.1404 31.0031L24.486 35.1611C23.9589 35.6319 23.9134 36.4408 24.3842 36.9679C24.8549 37.4948 25.6637 37.5406 26.1909 37.0697L29.2687 34.3203V50.0622C29.2687 50.7689 29.8416 51.3417 30.5483 51.3417C31.255 51.3417 31.8279 50.7689 31.8279 50.0622V34.3201L34.9058 37.0696C35.1498 37.2877 35.4544 37.3949 35.7578 37.3949C36.1096 37.3949 36.4597 37.2509 36.7126 36.9678C37.1831 36.4407 37.1375 35.6319 36.6105 35.161Z" fill="#0A1F69"/>
+</svg>

src/assets/images/cursor.svg

@@ -0,0 +1,3 @@
+<svg width="202" height="135" viewBox="0 0 202 135" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4.18153 39.6234C17.011 27.3107 32.2015 17.7116 48.8458 11.4109C66.2695 4.81515 84.892 1.98332 103.49 3.10152C122.087 4.21972 140.239 9.26262 156.751 17.8989C172.525 26.149 186.463 37.4998 197.732 51.2619L95.8009 131.621L4.18153 39.6234Z" fill="#2954E9" fill-opacity="0.55" stroke="white" stroke-width="5"/>
+</svg>

src/assets/images/fr.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512" version="1.1"><path d="M 341 256 L 341 424.064 412.272 423.782 L 483.545 423.500 490.127 420.259 C 498.055 416.355, 505.078 409.201, 508.820 401.218 L 511.500 395.500 511.500 256 L 511.500 116.500 508.820 110.782 C 505.078 102.799, 498.055 95.645, 490.127 91.741 L 483.545 88.500 412.272 88.218 L 341 87.936 341 256" stroke="none" fill="#ff4b55" fill-rule="evenodd"/><path d="M 171 256 L 171 424 256 424 L 341 424 341 256 L 341 88 256 88 L 171 88 171 256" stroke="none" fill="#f4f4f4" fill-rule="evenodd"/><path d="M 27.929 89.367 C 17.637 92.142, 8.008 100.484, 3.160 110.825 L 0.500 116.500 0.500 256 L 0.500 395.500 3.180 401.218 C 6.922 409.201, 13.945 416.355, 21.873 420.259 L 28.455 423.500 99.728 423.782 L 171 424.064 171 256.032 L 171 88 101.750 88.067 C 50.201 88.118, 31.332 88.450, 27.929 89.367" stroke="none" fill="#44449c" fill-rule="evenodd"/></svg>

src/assets/images/gitlab-logo.svg

@@ -0,0 +1,16 @@
+<svg version="1.2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" width="200" height="200">
+	<title>Nouveau projet</title>
+	<defs>
+		<image  width="200" height="200" id="img1" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADIAQMAAACXljzdAAAAAXNSR0IB2cksfwAAAANQTFRF////p8QbyAAAABxJREFUeJztwYEAAAAAw6D5U1/hAFUBAAAAAHwGFFAAAdqgEPkAAAAASUVORK5CYII="/>
+	</defs>
+	<style>
+		.s0 { fill: #e24329 } 
+		.s1 { fill: #fc6d26 } 
+		.s2 { fill: #fca326 } 
+	</style>
+	<use id="Background" href="#img1" x="0" y="0"/>
+	<path id="Layer copy 2" class="s0" d="m192.8 80.7l-0.2-0.7-26.2-68.2q-0.2-0.5-0.5-0.9-0.2-0.5-0.6-0.9-0.3-0.4-0.7-0.8-0.4-0.3-0.9-0.6-0.9-0.6-1.9-0.9-1.1-0.2-2.1-0.2-1.1 0.1-2.1 0.5-1 0.3-1.9 1-0.4 0.3-0.7 0.7-0.4 0.4-0.7 0.9-0.3 0.4-0.5 0.9-0.2 0.5-0.4 1l-17.6 54h-71.5l-17.7-54q-0.1-0.5-0.3-1-0.2-0.5-0.5-0.9-0.3-0.5-0.7-0.9-0.4-0.4-0.8-0.7-0.8-0.7-1.8-1-1-0.4-2.1-0.5-1.1 0-2.1 0.2-1.1 0.3-2 0.9-0.4 0.3-0.8 0.6-0.4 0.4-0.8 0.8-0.3 0.4-0.6 0.9-0.3 0.4-0.5 0.9l-26.2 68.2-0.2 0.7c-1.9 4.9-3 10-3.2 15.3-0.2 5.2 0.4 10.4 1.9 15.4 1.4 5.1 3.6 9.8 6.6 14.1 3 4.3 6.6 8.1 10.8 11.3l0.1 0.1 0.2 0.1 39.8 29.8 19.7 15 12 9q1.1 0.8 2.3 1.2 1.3 0.5 2.6 0.5 1.3 0 2.6-0.5 1.2-0.4 2.3-1.2l12-9 19.7-15 40-30h0.1c4.2-3.2 7.8-7 10.8-11.3 3-4.3 5.2-9 6.6-14.1 1.5-5 2.1-10.2 1.9-15.4-0.2-5.2-1.3-10.4-3.2-15.3z"/>
+	<path id="Layer" class="s1" d="m192.8 80.7l-0.2-0.7q-4.8 1-9.4 2.5-4.7 1.5-9.1 3.5-4.4 2-8.6 4.5-4.2 2.4-8.1 5.3l-57.4 43.4c19.5 14.8 36.6 27.7 36.6 27.7l40-30 0.1-0.1c4.2-3.1 7.8-6.9 10.8-11.3 3-4.3 5.2-9 6.6-14 1.5-5.1 2.1-10.3 1.9-15.5-0.2-5.2-1.3-10.4-3.2-15.3z"/>
+	<path id="Layer" class="s2" d="m63.4 166.9l19.7 14.9 12 9.1q1.1 0.8 2.3 1.2 1.3 0.4 2.6 0.4 1.3 0 2.6-0.4 1.2-0.4 2.3-1.2l12-9.1 19.7-14.9c0 0-17-12.9-36.6-27.7-19.6 14.8-36.6 27.7-36.6 27.7z"/>
+	<path id="Layer" class="s1" d="m42.6 95.8q-3.9-2.9-8.1-5.4-4.2-2.4-8.6-4.4-4.4-2-9.1-3.5-4.6-1.5-9.4-2.5l-0.2 0.7c-1.9 4.9-3 10-3.2 15.3-0.2 5.2 0.4 10.4 1.9 15.4 1.4 5.1 3.6 9.8 6.6 14.1 3 4.3 6.6 8.1 10.8 11.3l0.1 0.1 0.2 0.1 39.8 29.8c0 0 17-12.8 36.6-27.6z"/>
+</svg>

src/assets/images/hu.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512" version="1.1"><path d="M 50 17.886 C 41.197 20.732, 35.982 23.858, 29.912 29.928 C 23.834 36.006, 20.197 42.216, 17.612 50.932 C 16.208 55.662, 16 64.083, 16 116.182 L 16 176 256 176 L 496 176 496 116.182 C 496 51.184, 496.061 51.984, 490.272 40.554 C 487.059 34.209, 477.791 24.941, 471.446 21.728 C 459.317 15.586, 474.887 15.995, 255.568 16.054 C 66.632 16.105, 55.194 16.206, 50 17.886" stroke="none" fill="#c0392b" fill-rule="evenodd"/><path d="M 16 256 L 16 336 256 336 L 496 336 496 256 L 496 176 256 176 L 16 176 16 256" stroke="none" fill="#fcfcfc" fill-rule="evenodd"/><path d="M 16 395.818 C 16 460.816, 15.939 460.016, 21.728 471.446 C 24.941 477.791, 34.209 487.059, 40.554 490.272 C 52.678 496.412, 37.187 496, 256 496 C 474.813 496, 459.322 496.412, 471.446 490.272 C 477.791 487.059, 487.059 477.791, 490.272 471.446 C 496.061 460.016, 496 460.816, 496 395.818 L 496 336 256 336 L 16 336 16 395.818" stroke="none" fill="#24ac64" fill-rule="evenodd"/></svg>

src/assets/images/icon/arrow-down.svg

@@ -0,0 +1,3 @@
+<svg width="10" height="7" viewBox="0 0 10 7" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5 6.343L0 0.157104L10 0.157105L5 6.343Z" fill="#0A1F69"/>
+</svg>

src/assets/images/icon/check-green.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10 0.5C4.47719 0.5 0 4.97719 0 10.5C0 16.0231 4.47719 20.5 10 20.5C15.5231 20.5 20 16.0231 20 10.5C20 4.97719 15.5231 0.5 10 0.5ZM10 19.2697C5.17531 19.2697 1.25 15.3247 1.25 10.5C1.25 5.67527 5.17531 1.74996 10 1.74996C14.8247 1.74996 18.75 5.67529 18.75 10.5C18.75 15.3246 14.8247 19.2697 10 19.2697ZM13.9909 6.84094L8.12373 12.745L5.48154 10.1028C5.23748 9.85875 4.84186 9.85875 4.59748 10.1028C4.35342 10.3469 4.35342 10.7425 4.59748 10.9866L7.69092 14.0803C7.93498 14.3241 8.33061 14.3241 8.57498 14.0803C8.60311 14.0522 8.62719 14.0215 8.64906 13.9897L14.8753 7.72498C15.1191 7.48092 15.1191 7.08529 14.8753 6.84094C14.6309 6.59688 14.2353 6.59688 13.9909 6.84094Z" fill="#68C149"/>
+</svg>

src/assets/images/icon/cursor-arrow.svg

@@ -0,0 +1,18 @@
+<svg width="33" height="33" viewBox="0 0 33 33" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g filter="url(#filter0_d_193_56)">
+<circle cx="16.8921" cy="14.0595" r="12" transform="rotate(2.04823 16.8921 14.0595)" fill="white" fill-opacity="0.45"/>
+<path d="M12.542 9.32783C12.2352 9.04959 11.7609 9.07278 11.4826 9.37962C11.2044 9.68647 11.2276 10.1608 11.5344 10.439L12.542 9.32783ZM22.446 20.0368C22.8597 20.0165 23.1787 19.6648 23.1584 19.251L22.8288 12.5091C22.8086 12.0954 22.4568 11.7764 22.0431 11.7966C21.6294 11.8168 21.3104 12.1686 21.3306 12.5823L21.6236 18.5752L15.6308 18.8682C15.217 18.8884 14.8981 19.2402 14.9183 19.6539C14.9385 20.0676 15.2903 20.3866 15.704 20.3664L22.446 20.0368ZM11.5344 10.439L21.9055 19.8433L22.9131 18.7321L12.542 9.32783L11.5344 10.439Z" fill="#0A1F69"/>
+</g>
+<defs>
+<filter id="filter0_d_193_56" x="0.891907" y="0.0593262" width="32.0003" height="32.0004" 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 dy="2"/>
+<feGaussianBlur stdDeviation="2"/>
+<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.12 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_193_56"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_193_56" result="shape"/>
+</filter>
+</defs>
+</svg>

src/assets/images/icon/info-blue.svg

@@ -0,0 +1,3 @@
+<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11 8.64286C11.2084 8.64286 11.4082 8.72564 11.5556 8.87299C11.7029 9.02034 11.7857 9.22019 11.7857 9.42857V16.5C11.7857 16.7084 11.7029 16.9082 11.5556 17.0556C11.4082 17.2029 11.2084 17.2857 11 17.2857C10.7916 17.2857 10.5918 17.2029 10.4444 17.0556C10.2971 16.9082 10.2143 16.7084 10.2143 16.5V9.42857C10.2143 9.22019 10.2971 9.02034 10.4444 8.87299C10.5918 8.72564 10.7916 8.64286 11 8.64286ZM11 7.07143C11.3126 7.07143 11.6123 6.94726 11.8334 6.72623C12.0544 6.50521 12.1786 6.20543 12.1786 5.89286C12.1786 5.58028 12.0544 5.28051 11.8334 5.05948C11.6123 4.83846 11.3126 4.71429 11 4.71429C10.6874 4.71429 10.3876 4.83846 10.1666 5.05948C9.9456 5.28051 9.82143 5.58028 9.82143 5.89286C9.82143 6.20543 9.9456 6.50521 10.1666 6.72623C10.3876 6.94726 10.6874 7.07143 11 7.07143ZM0 11C0 4.92486 4.92486 0 11 0C17.0751 0 22 4.92486 22 11C22 17.0751 17.0751 22 11 22C4.92486 22 0 17.0751 0 11ZM11 1.57143C5.79307 1.57143 1.57143 5.79307 1.57143 11C1.57143 16.2069 5.79307 20.4286 11 20.4286C16.2069 20.4286 20.4286 16.2069 20.4286 11C20.4286 5.79307 16.2069 1.57143 11 1.57143Z" fill="#0A1F69"/>
+</svg>

src/assets/images/icon/information.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20 9.99C20 4.475 15.52 0 10 0C4.48 0 0 4.475 0 9.99C0 13.0275 1.38 15.765 3.54 17.6025C3.56 17.6225 3.58 17.6225 3.58 17.6425C3.76 17.7825 3.94 17.9225 4.14 18.0625C4.24 18.1225 4.32 18.2013 4.42 18.2812C6.07258 19.4017 8.02339 20.0004 10.02 20C12.0166 20.0004 13.9674 19.4017 15.62 18.2812C15.72 18.2213 15.8 18.1425 15.9 18.0812C16.08 17.9425 16.28 17.8025 16.46 17.6625C16.48 17.6425 16.5 17.6425 16.5 17.6225C18.62 15.7637 20 13.0275 20 9.99ZM10 18.7412C8.12 18.7412 6.4 18.1413 4.98 17.1425C5 16.9825 5.04 16.8237 5.08 16.6637C5.19917 16.2301 5.37396 15.8138 5.6 15.425C5.82 15.045 6.08 14.705 6.4 14.405C6.7 14.105 7.06 13.8263 7.42 13.6063C7.8 13.3863 8.2 13.2262 8.64 13.1062C9.08342 12.9867 9.54075 12.9266 10 12.9275C11.3633 12.9178 12.6765 13.4408 13.66 14.385C14.12 14.845 14.48 15.385 14.74 16.0037C14.88 16.3638 14.98 16.7437 15.04 17.1425C13.564 18.1802 11.8043 18.7384 10 18.7412ZM6.94 9.49125C6.76378 9.08778 6.67516 8.6515 6.68 8.21125C6.68 7.7725 6.76 7.3325 6.94 6.9325C7.12 6.5325 7.36 6.17375 7.66 5.87375C7.96 5.57375 8.32 5.335 8.72 5.155C9.12 4.975 9.56 4.895 10 4.895C10.46 4.895 10.88 4.975 11.28 5.155C11.68 5.335 12.04 5.575 12.34 5.87375C12.64 6.17375 12.88 6.53375 13.06 6.9325C13.24 7.3325 13.32 7.7725 13.32 8.21125C13.32 8.67125 13.24 9.09125 13.06 9.49C12.8863 9.88408 12.6423 10.2433 12.34 10.55C12.0332 10.8519 11.674 11.0954 11.28 11.2688C10.4535 11.6084 9.52647 11.6084 8.7 11.2688C8.30602 11.0954 7.94684 10.8519 7.64 10.55C7.33727 10.2477 7.09912 9.88836 6.94 9.49125ZM16.22 16.1238C16.22 16.0837 16.2 16.0638 16.2 16.0238C16.0033 15.398 15.7134 14.8055 15.34 14.2663C14.9663 13.723 14.507 13.2438 13.98 12.8475C13.5775 12.5447 13.1413 12.2897 12.68 12.0875C12.8899 11.9491 13.0843 11.7886 13.26 11.6087C13.5582 11.3144 13.82 10.9854 14.04 10.6287C14.4829 9.90101 14.7117 9.06311 14.7 8.21125C14.7062 7.58064 14.5837 6.9554 14.34 6.37375C14.0994 5.8133 13.7531 5.30445 13.32 4.875C12.8876 4.45004 12.3786 4.11074 11.82 3.875C11.2374 3.63174 10.6113 3.50968 9.98 3.51625C9.34859 3.51007 8.72253 3.63256 8.14 3.87625C7.57657 4.11148 7.06639 4.45798 6.64 4.895C6.21505 5.32698 5.87574 5.83552 5.64 6.39375C5.39631 6.9754 5.27381 7.60064 5.28 8.23125C5.28 8.67125 5.34 9.09125 5.46 9.49C5.58 9.91 5.74 10.29 5.96 10.6488C6.16 11.0087 6.44 11.3288 6.74 11.6288C6.92 11.8088 7.12 11.9675 7.34 12.1075C6.87729 12.3151 6.4409 12.5769 6.04 12.8875C5.52 13.2875 5.06 13.7662 4.68 14.2863C4.30282 14.8233 4.0126 15.4164 3.82 16.0438C3.8 16.0837 3.8 16.1238 3.8 16.1437C2.22 14.545 1.24 12.3875 1.24 9.99C1.24 5.175 5.18 1.23875 10 1.23875C14.82 1.23875 18.76 5.175 18.76 9.99C18.7574 12.2899 17.8441 14.4953 16.22 16.1238Z" fill="#0A1F69"/>
+</svg>

src/assets/images/icon/logout.svg

@@ -0,0 +1,4 @@
+<svg width="19" height="20" viewBox="0 0 19 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.64616 0.247477L7.13749 2.38744C6.86416 2.77517 7.14249 3.31107 7.61639 3.31107H8.53913V13.5861C8.53913 13.9097 8.80147 14.1721 9.1251 14.1721C9.44874 14.1721 9.71104 13.9097 9.71104 13.5861V3.31115H10.6337C11.1108 3.31115 11.3839 2.7724 11.1126 2.38756L9.60397 0.247594C9.37374 -0.0792028 8.88163 -0.085804 8.64616 0.247477Z" fill="#0A1F69"/>
+<path d="M12.8875 3.18472C12.7256 3.46476 12.8212 3.82327 13.1013 3.98534C15.4809 5.36175 17.0783 7.93468 17.0783 10.8749C17.0783 15.2603 13.5105 18.8281 9.12512 18.8281C4.73973 18.8281 1.17191 15.2603 1.17191 10.8749C1.17191 7.93273 2.77086 5.36097 5.14883 3.98538C5.42899 3.82335 5.52457 3.46476 5.36266 3.18476C5.20063 2.90464 4.84215 2.80894 4.56203 2.97093C1.82539 4.55398 -1.47058e-07 7.51058 0 10.8749C2.20457e-07 15.9184 4.08121 20 9.12512 20C14.1686 20 18.2502 15.9188 18.2502 10.8749C18.2502 7.50913 16.4236 4.55327 13.6881 2.97089C13.408 2.8089 13.0496 2.9046 12.8875 3.18472Z" fill="#0A1F69"/>
+</svg>

src/assets/images/icon/photos.svg

@@ -0,0 +1,4 @@
+<svg width="20" height="19" viewBox="0 0 20 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18.2422 0.789062H4.29688C3.32762 0.789062 2.53906 1.57762 2.53906 2.54688V3.28906H1.75781C0.788555 3.28906 0 4.07762 0 5.04688V16.4531C0 17.4224 0.788555 18.2109 1.75781 18.2109H15.7031C16.6724 18.2109 17.4609 17.4224 17.4609 16.4531V15.7109H18.2422C19.2114 15.7109 20 14.9224 20 13.9531V2.54688C20 1.57762 19.2114 0.789062 18.2422 0.789062ZM4.29688 1.96094H18.2422C18.5653 1.96094 18.8281 2.22379 18.8281 2.54688V8.05477L15.3386 5.58426C15.1175 5.42781 14.818 5.44312 14.6141 5.62152L10 9.65891L7.88586 7.80902C7.67375 7.62348 7.35961 7.61512 7.13797 7.78926L3.71094 10.482V2.54688C3.71094 2.22379 3.97379 1.96094 4.29688 1.96094ZM16.2891 16.4531C16.2891 16.7762 16.0262 17.0391 15.7031 17.0391H1.75781C1.43473 17.0391 1.17188 16.7762 1.17188 16.4531V5.04688C1.17188 4.72379 1.43473 4.46094 1.75781 4.46094H2.53906V13.9531C2.53906 14.9224 3.32762 15.7109 4.29688 15.7109H16.2891V16.4531ZM18.2422 14.5391H4.29688C3.97379 14.5391 3.71094 14.2762 3.71094 13.9531V11.9723L7.47988 9.01098L9.61414 10.8785C9.83508 11.0718 10.1649 11.0718 10.3859 10.8785L15.0384 6.80758L18.8281 9.49059V13.9531C18.8281 14.2762 18.5653 14.5391 18.2422 14.5391Z" fill="#0A1F69"/>
+<path d="M10 6.96094C11.0123 6.96094 11.8359 6.13734 11.8359 5.125C11.8359 4.11266 11.0123 3.28906 10 3.28906C8.98766 3.28906 8.16406 4.11266 8.16406 5.125C8.16406 6.13734 8.98766 6.96094 10 6.96094ZM10 4.46094C10.3662 4.46094 10.6641 4.75883 10.6641 5.125C10.6641 5.49117 10.3662 5.78906 10 5.78906C9.63383 5.78906 9.33594 5.49117 9.33594 5.125C9.33594 4.75883 9.63383 4.46094 10 4.46094Z" fill="#0A1F69"/>
+</svg>

src/assets/images/icon/settings.svg

@@ -0,0 +1,5 @@
+<svg width="20" height="17" viewBox="0 0 20 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0.585938 3.4375H11.9953C12.2591 4.51676 13.2339 5.32027 14.3932 5.32027C15.5526 5.32027 16.5274 4.51676 16.7912 3.4375H19.4141C19.7377 3.4375 20 3.17516 20 2.85156C20 2.52797 19.7377 2.26563 19.4141 2.26563H16.7912C16.5274 1.18637 15.5526 0.382812 14.3932 0.382812C13.2339 0.382812 12.2591 1.18637 11.9953 2.26563H0.585938C0.262344 2.26563 0 2.52797 0 2.85156C0 3.17516 0.262344 3.4375 0.585938 3.4375ZM14.3932 1.55469C15.1084 1.55469 15.6901 2.13648 15.6901 2.85156C15.6901 3.56664 15.1083 4.1484 14.3932 4.1484C13.6782 4.1484 13.0964 3.5666 13.0964 2.85156C13.0964 2.13648 13.6781 1.55469 14.3932 1.55469Z" fill="#0A1F69"/>
+<path d="M19.4141 7.91406H8.00469C7.7409 6.8348 6.76617 6.03125 5.60676 6.03125C4.44734 6.03125 3.47266 6.8348 3.20887 7.91406H0.585938C0.262344 7.91406 0 8.17641 0 8.5C0 8.82359 0.262344 9.08594 0.585938 9.08594H3.20887C3.47266 10.1652 4.44738 10.9688 5.6068 10.9688C6.76621 10.9688 7.74094 10.1652 8.00473 9.08594H19.4141C19.7377 9.08594 20 8.82359 20 8.5C20 8.17641 19.7377 7.91406 19.4141 7.91406ZM5.60676 9.79688C4.89164 9.79688 4.30988 9.21508 4.30988 8.5C4.30988 7.78492 4.89168 7.20312 5.60676 7.20312C6.32184 7.20312 6.90363 7.78492 6.90363 8.5C6.90363 9.21508 6.32188 9.79688 5.60676 9.79688Z" fill="#0A1F69"/>
+<path d="M19.4141 13.5625H13.6531C13.3893 12.4833 12.4146 11.6797 11.2552 11.6797C10.0959 11.6797 9.12109 12.4832 8.8573 13.5625H0.585938C0.262344 13.5625 0 13.8249 0 14.1485C0 14.4721 0.262344 14.7344 0.585938 14.7344H8.8573C9.12109 15.8137 10.0958 16.6172 11.2552 16.6172C12.4146 16.6172 13.3893 15.8137 13.6531 14.7344H19.4141C19.7377 14.7344 20 14.4721 20 14.1485C20 13.8249 19.7377 13.5625 19.4141 13.5625ZM11.2552 15.4453C10.5401 15.4453 9.95836 14.8635 9.95836 14.1485C9.95836 13.4334 10.5402 12.8516 11.2552 12.8516C11.9703 12.8516 12.5521 13.4334 12.5521 14.1485C12.5521 14.8635 11.9703 15.4453 11.2552 15.4453Z" fill="#0A1F69"/>
+</svg>

src/assets/images/logo-geovisio.svg

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   width="48"
+   height="48"
+   viewBox="0 0 12.7 12.7"
+   version="1.1"
+   id="svg1"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1" />
+  <path
+     d="M-3.007-.005a5.978 5.978 0 0 1-5.979 5.978V-.005z"
+     style="fill:#1a237e;fill-opacity:1;stroke:#fff;stroke-width:0.661458;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     transform="rotate(-135)"
+     id="path1" />
+  <circle
+     cx="6.35"
+     cy="6.545"
+     r="2.64"
+     style="fill:#1e88e5;fill-opacity:1;stroke:#fff;stroke-width:0.660027;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     id="circle1" />
+</svg>

src/assets/images/no-uploaded-img.svg

@@ -0,0 +1,61 @@
+<svg width="189" height="150" viewBox="0 0 189 150" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_1_68)">
+<path d="M94.495 149.13C146.614 149.13 188.865 146.663 188.865 143.62C188.865 140.577 146.614 138.11 94.495 138.11C42.3759 138.11 0.125 140.577 0.125 143.62C0.125 146.663 42.3759 149.13 94.495 149.13Z" fill="#F0F6FF"/>
+<path d="M131.285 2.53003H26.1949V105.43H131.285V2.53003Z" fill="#0F264C"/>
+<path d="M128.585 5.82001H28.8949V105.43H128.585V5.82001Z" fill="white"/>
+<path d="M131.285 103.98V105.43H78.325L89.775 93.99L105.535 78.22L131.285 103.98Z" fill="#0F264C"/>
+<path d="M26.1949 105.43V95.54L58.7549 62.98L101.215 105.43H26.1949Z" fill="#0F264C"/>
+<path d="M96.075 51.65C104.961 51.65 112.165 44.4463 112.165 35.56C112.165 26.6738 104.961 19.47 96.075 19.47C87.1887 19.47 79.985 26.6738 79.985 35.56C79.985 44.4463 87.1887 51.65 96.075 51.65Z" fill="#0F264C"/>
+<path d="M150.287 7.86711L150.239 8.3548L153.723 8.69512L153.77 8.20744L150.287 7.86711Z" fill="#0053CC"/>
+<path d="M138.447 6.7085L138.399 7.19617L146.909 8.02753L146.956 7.53986L138.447 6.7085Z" fill="#0053CC"/>
+<path d="M57.363 0.505688L47.3574 102.918L151.949 113.137L161.955 10.7242L57.363 0.505688Z" fill="#0053CC"/>
+<path d="M59.7374 4.04914L50.0518 103.187L149.269 112.881L158.955 13.7425L59.7374 4.04914Z" fill="white"/>
+<path d="M152.085 111.69L151.945 113.13L99.235 107.98L111.735 97.71L128.955 83.55L152.085 111.69Z" fill="#0053CC"/>
+<path d="M47.355 102.92L48.315 93.07L83.885 63.83L122.015 110.21L47.355 102.92Z" fill="#0053CC"/>
+<path d="M138.424 46.6175C141.992 38.4788 138.286 28.989 130.148 25.4215C122.009 21.8539 112.519 25.5596 108.952 33.6982C105.384 41.8369 109.09 51.3267 117.228 54.8943C125.367 58.4618 134.857 54.7562 138.424 46.6175Z" fill="#0053CC"/>
+<path d="M115.296 14.0952L10.4298 20.9501L17.1419 123.631L122.008 116.776L115.296 14.0952Z" fill="#9FC6FF"/>
+<path d="M112.826 17.5571L13.3484 24.0598L19.8458 123.458L119.324 116.955L112.826 17.5571Z" fill="white"/>
+<path d="M121.915 115.34L122.015 116.79L69.165 120.24L79.835 108.08L94.535 91.32L121.915 115.34Z" fill="#9FC6FF"/>
+<path d="M17.145 123.64L16.495 113.77L46.865 79.15L91.995 118.75L17.145 123.64Z" fill="#9FC6FF"/>
+<path d="M93.6987 60.7395C99.9822 54.4559 99.9822 44.2683 93.6987 37.9848C87.4152 31.7012 77.2275 31.7012 70.944 37.9848C64.6605 44.2683 64.6605 54.4559 70.944 60.7395C77.2275 67.023 87.4152 67.023 93.6987 60.7395Z" fill="#9FC6FF"/>
+<path d="M157.355 65.8701L153.935 67.0001L157.025 70.3101C157.025 70.3101 159.725 68.7001 159.025 67.1801L157.355 65.8701Z" fill="#FFC3BD"/>
+<path d="M151.595 70.05L154.265 72.63L157.025 70.32L153.935 67L151.595 70.05Z" fill="#FFC3BD"/>
+<path d="M162.945 38.8201C163.295 39.4601 163.575 40.0301 163.865 40.6401C164.145 41.2401 164.425 41.8401 164.695 42.4501C165.215 43.6701 165.705 44.9101 166.135 46.1701C166.575 47.4301 166.945 48.7301 167.265 50.0501L167.495 51.0501L167.685 52.0701C167.755 52.4101 167.795 52.7601 167.835 53.1101L167.905 53.6301L167.925 53.7601L167.945 53.9801C167.965 54.1501 167.965 54.2901 167.965 54.4401C167.925 55.6101 167.625 56.3901 167.335 57.1301C167.025 57.8601 166.685 58.4901 166.325 59.1001C165.605 60.3101 164.805 61.3901 163.975 62.4401C162.315 64.5201 160.525 66.3901 158.575 68.1701L156.595 66.3901C158.015 64.3401 159.415 62.2301 160.685 60.1401C161.315 59.0901 161.905 58.0301 162.385 57.0001C162.625 56.4901 162.835 55.9701 162.975 55.5101C163.115 55.0601 163.185 54.6001 163.145 54.4801C163.145 54.4801 163.145 54.4601 163.135 54.4701C163.135 54.4701 163.135 54.5001 163.135 54.4501L163.115 54.3401L163.025 53.9201C162.965 53.6401 162.915 53.3601 162.825 53.0801L162.605 52.2301L162.355 51.3801C162.005 50.2501 161.605 49.1101 161.165 47.9801C160.725 46.8501 160.255 45.7301 159.755 44.6101C159.275 43.5001 158.725 42.3601 158.225 41.3301L162.975 38.8101L162.945 38.8201Z" fill="#FFC3BD"/>
+<path d="M168.535 47.33L161.915 50.83L160.315 51.68C160.315 51.68 159.945 50.58 159.405 48.99C158.975 47.72 158.445 46.14 157.915 44.54C157.745 44.03 157.585 43.53 157.425 43.04C157.375 42.9 157.325 42.76 157.285 42.62C155.855 38.23 159.825 36.27 162.525 36.83C167.155 37.8 168.535 47.33 168.535 47.33Z" fill="#9FC6FF"/>
+<path d="M161.905 50.83L160.305 51.68C160.305 51.68 159.935 50.58 159.395 48.99C158.965 47.72 158.435 46.14 157.905 44.54C157.735 44.03 157.575 43.53 157.415 43.04L161.065 42.32C161.065 42.32 161.565 48.11 161.895 50.83H161.905Z" fill="#77B3FC"/>
+<path d="M157.255 26.79C156.495 29.32 155.515 34 157.155 35.9C157.155 35.9 156.185 38.45 151.395 37.97C146.115 37.45 149.135 35.1 149.135 35.1C152.085 34.7 152.225 32.56 151.915 30.5L157.255 26.78V26.79Z" fill="#FFC3BD"/>
+<path d="M148.105 36.0001C148.345 35.5301 148.005 33.7801 148.005 33.7801C148.005 33.7801 155.535 32.7701 158.225 33.7301C159.675 34.2501 158.405 36.8501 158.405 36.8501L148.115 36.0001H148.105Z" fill="#14365B"/>
+<path d="M148.265 22.9601C148.235 23.2401 148.065 23.4601 147.875 23.4401C147.685 23.4201 147.565 23.1801 147.585 22.8901C147.615 22.6101 147.785 22.3901 147.975 22.4101C148.165 22.4301 148.285 22.6701 148.265 22.9601Z" fill="#0F264C"/>
+<path d="M148.255 23.1C148.255 23.1 147.445 24.68 146.655 25.4C147.115 25.92 147.985 25.79 147.985 25.79L148.255 23.1Z" fill="#ED847E"/>
+<path d="M149.345 22.0201C149.285 22.0201 149.235 21.9901 149.205 21.9401C148.815 21.3001 148.195 21.2801 148.195 21.2801C148.105 21.2801 148.025 21.2001 148.035 21.1101C148.035 21.0201 148.105 20.9401 148.205 20.9501C148.235 20.9501 149.015 20.9801 149.495 21.7801C149.545 21.8601 149.515 21.9601 149.435 22.0101C149.405 22.0301 149.375 22.0301 149.345 22.0301V22.0201Z" fill="#0F264C"/>
+<path d="M132.935 136.07L129.395 135.81L129.065 127.55L132.595 127.81L132.935 136.07Z" fill="#FFC3BD"/>
+<path d="M155.535 139.23H151.985L149.225 131.01H152.775L155.535 139.23Z" fill="#FFC3BD"/>
+<path d="M151.515 138.81H155.835C155.985 138.81 156.105 138.91 156.135 139.05L156.835 142.2C156.905 142.53 156.655 142.84 156.315 142.83C154.925 142.81 153.905 142.72 152.155 142.72C151.075 142.72 148.855 142.83 147.365 142.83C145.875 142.83 145.685 141.36 146.295 141.22C149.025 140.62 150.055 139.8 150.935 139.01C151.095 138.87 151.295 138.79 151.515 138.79V138.81Z" fill="#14365B"/>
+<path d="M129.225 135.02L133.085 135.31C133.225 135.32 133.345 135.43 133.365 135.57L133.825 138.77C133.875 139.1 133.605 139.39 133.265 139.36C131.875 139.23 129.865 139 128.115 138.87C126.065 138.72 124.705 138.65 122.305 138.47C120.855 138.36 120.555 136.86 121.175 136.78C123.985 136.38 125.835 136.54 128.335 135.24C128.605 135.1 128.905 135.01 129.205 135.03L129.225 135.02Z" fill="#14365B"/>
+<path d="M129.065 127.55L129.235 131.81L132.775 132.07L132.605 127.82L129.065 127.55Z" fill="#F29994"/>
+<path d="M152.775 131.01H149.225L150.655 135.25H154.205L152.775 131.01Z" fill="#F29994"/>
+<path d="M160.115 67.75C157.345 67.55 146.895 66.77 141.195 66.34C140.515 60.82 140.395 56.03 140.575 51.99C140.655 50.27 140.785 48.68 140.955 47.23C141.835 39.64 143.685 35.79 143.685 35.79C143.685 35.79 146.375 35.26 149.195 35.21C151.335 35.18 154.835 35.51 157.235 35.81C160.315 36.19 162.965 36.94 162.965 36.94C159.145 50.41 160.465 64.85 160.115 67.75Z" fill="#9FC6FF"/>
+<path d="M142.865 48.69L140.585 52C140.665 50.28 140.795 48.6901 140.965 47.2401L142.865 48.7001V48.69Z" fill="#77B3FC"/>
+<path d="M141.415 38.2401C141.095 38.7901 140.715 39.4201 140.355 40.0201C139.985 40.62 139.615 41.22 139.225 41.8C138.455 42.98 137.665 44.14 136.845 45.26C136.015 46.38 135.165 47.4601 134.265 48.4701C133.455 49.3701 132.615 50.2 131.745 50.91C130.995 51.08 130.235 51.1901 129.465 51.2401C128.505 51.2801 127.525 51.24 126.545 51.07C125.565 50.91 124.595 50.63 123.645 50.26C123.165 50.07 122.695 49.87 122.235 49.64C122.005 49.52 121.785 49.4001 121.555 49.2701C121.345 49.1501 121.095 49 120.945 48.91L119.085 50.82C119.355 51.12 119.545 51.3301 119.785 51.5601C120.015 51.7801 120.255 51.99 120.505 52.19C120.995 52.6 121.505 52.98 122.045 53.32C123.115 54.01 124.295 54.5701 125.525 54.9901C126.765 55.4001 128.065 55.66 129.395 55.75C130.715 55.83 132.055 55.76 133.355 55.5201L133.765 55.4501L134.225 55.1501C135.645 54.2101 136.875 53.1501 137.995 52.0201C139.115 50.9001 140.135 49.72 141.085 48.51C142.045 47.3 142.925 46.05 143.765 44.78C144.185 44.14 144.585 43.5 144.985 42.85C145.385 42.19 145.755 41.5601 146.145 40.8301L141.425 38.26L141.415 38.2401Z" fill="#FFC3BD"/>
+<path d="M147.835 39.8701C147.585 43.2501 143.575 49.8301 143.575 49.8301L134.515 45.0701C134.515 45.0701 137.585 40.1401 140.935 37.2001C144.325 34.2301 148.105 36.1501 147.825 39.8601L147.835 39.8701Z" fill="#9FC6FF"/>
+<path d="M122.535 50.0701L119.885 47.7601L117.845 51.2401C117.845 51.2401 119.725 53.3501 121.945 52.0201L122.535 50.0801V50.0701Z" fill="#FFC3BD"/>
+<path d="M116.205 46.2101L114.795 49.4101L117.845 51.2301L119.885 47.7501L116.205 46.2101Z" fill="#FFC3BD"/>
+<path d="M157.955 22.9401C157.395 26.4101 157.245 28.4801 155.295 30.1001C152.375 32.5401 148.215 30.5101 147.725 26.9301C147.285 23.7101 148.275 18.5701 151.835 17.5201C155.345 16.4801 158.505 19.4701 157.945 22.9401H157.955Z" fill="#FFC3BD"/>
+<path d="M161.885 21.1101C164.485 22.9301 158.295 29.6101 156.095 29.5401C153.895 29.4701 149.785 23.3601 151.125 20.1201C149.985 19.6601 149.625 19.5101 149.165 18.3501C148.335 16.2501 149.335 12.7501 154.475 13.7301C153.195 14.6001 154.085 15.2801 156.505 14.9501C155.555 16.0901 157.125 16.9201 159.475 16.4401C159.065 18.5201 164.315 18.8201 161.885 21.1101Z" fill="#0F264C"/>
+<path d="M153.065 24.0101C152.895 24.9401 152.315 25.7201 151.675 26.1501C150.705 26.8101 149.845 26.0301 149.805 24.9101C149.775 23.9101 150.235 22.3601 151.355 22.1501C152.465 21.9401 153.255 22.9301 153.065 24.0001V24.0101Z" fill="#FFC3BD"/>
+<path d="M155.485 134.43H148.985C148.985 134.43 142.655 112.67 141.065 101.39C140.725 98.96 140.925 95.75 141.435 92.26C142.305 86.3 144.065 79.53 145.535 74.47C146.845 69.98 147.915 66.84 147.915 66.84C147.915 66.84 152.885 67.21 160.125 67.75C159.465 76.61 150.695 91.17 151.305 103.19C151.865 114.27 155.485 134.42 155.485 134.42V134.43Z" fill="#14365B"/>
+<path d="M148.765 77.04C148.695 82.94 144.555 89.46 141.435 92.26C142.305 86.3 144.065 79.53 145.535 74.47C146.445 74.29 148.005 76.02 148.765 77.03V77.04Z" fill="#0A1B35"/>
+<path d="M141.205 66.35C141.205 66.35 125.885 89.53 125.465 100.34C125.035 111.59 127.965 130.89 127.965 130.89L133.955 131.34C133.955 131.34 134.655 112.98 135.735 101.98C136.915 89.99 154.225 76.63 154.915 67.36C149.065 66.93 141.195 66.34 141.195 66.34L141.205 66.35Z" fill="#14365B"/>
+<path d="M147.835 134.57H156.325V132.28L146.835 132.13L147.835 134.57Z" fill="#0053CC"/>
+<path d="M126.765 130.93L135.085 131.57L135.255 129.26L125.945 128.43L126.765 130.93Z" fill="#0053CC"/>
+<path d="M150.345 139.43C150.075 139.43 149.825 139.38 149.665 139.25C149.535 139.14 149.475 138.99 149.495 138.81C149.495 138.67 149.575 138.6 149.635 138.57C150.035 138.37 151.175 139.07 151.305 139.15C151.335 139.17 151.345 139.2 151.345 139.23C151.345 139.26 151.315 139.29 151.285 139.3C151.035 139.36 150.685 139.43 150.355 139.43H150.345ZM149.815 138.7C149.815 138.7 149.735 138.7 149.705 138.72C149.685 138.73 149.655 138.75 149.655 138.82C149.655 138.95 149.685 139.05 149.765 139.12C149.955 139.28 150.425 139.31 151.025 139.18C150.625 138.95 150.085 138.69 149.815 138.69V138.7Z" fill="#407BFF"/>
+<path d="M151.255 139.31C151.255 139.31 151.225 139.31 151.215 139.3C150.845 139.1 150.135 138.32 150.215 137.93C150.225 137.86 150.285 137.73 150.485 137.71C150.615 137.69 150.735 137.73 150.845 137.82C151.255 138.16 151.345 139.18 151.345 139.22C151.345 139.25 151.335 139.28 151.305 139.3C151.295 139.3 151.275 139.31 151.255 139.31ZM150.535 137.87C150.535 137.87 150.505 137.87 150.495 137.87C150.385 137.88 150.375 137.93 150.375 137.96C150.335 138.19 150.785 138.78 151.145 139.06C151.105 138.76 150.995 138.16 150.725 137.95C150.665 137.9 150.605 137.88 150.535 137.88V137.87Z" fill="#407BFF"/>
+<path d="M128.015 135.54C127.555 135.54 127.085 135.48 126.865 135.25C126.755 135.14 126.715 135 126.735 134.83C126.755 134.73 126.805 134.66 126.885 134.62C127.335 134.42 128.705 135.24 128.855 135.33C128.885 135.35 128.905 135.38 128.895 135.42C128.895 135.45 128.855 135.48 128.825 135.49C128.595 135.52 128.305 135.54 128.005 135.54H128.015ZM127.085 134.75C127.085 134.75 126.995 134.75 126.965 134.77C126.925 134.79 126.915 134.81 126.905 134.86C126.885 134.97 126.905 135.06 126.985 135.14C127.185 135.35 127.765 135.43 128.555 135.35C128.065 135.07 127.395 134.75 127.075 134.75H127.085Z" fill="#407BFF"/>
+<path d="M128.815 135.48C128.815 135.48 128.785 135.48 128.775 135.47C128.365 135.25 127.575 134.42 127.665 134.02C127.685 133.93 127.765 133.82 127.995 133.81C128.165 133.81 128.315 133.87 128.445 133.99C128.865 134.39 128.895 135.35 128.895 135.39C128.895 135.42 128.885 135.45 128.855 135.46C128.845 135.46 128.825 135.47 128.815 135.47V135.48ZM128.015 133.98C128.015 133.98 128.015 133.98 128.005 133.98C127.855 133.98 127.835 134.04 127.835 134.06C127.775 134.3 128.305 134.94 128.725 135.23C128.705 134.95 128.615 134.37 128.335 134.1C128.245 134.01 128.135 133.97 128.015 133.97V133.98Z" fill="#407BFF"/>
+</g>
+<defs>
+<clipPath id="clip0_1_68">
+<rect width="188.75" height="148.63" fill="white" transform="translate(0.125 0.5)"/>
+</clipPath>
+</defs>
+</svg>

src/assets/images/photos.svg

@@ -0,0 +1,6 @@
+<svg width="66" height="66" viewBox="0 0 66 66" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="32.75" cy="33" r="32.5" fill="#F2F5FF"/>
+<path d="M55.0182 15.3341H54.5036C54.2024 12.7533 52.1255 10.7071 49.53 10.4567C49.232 7.67438 46.8718 5.5 44.0121 5.5H8.59589C3.8562 5.5 0 9.3562 0 14.0954V38.9277C0 41.8075 2.20367 44.181 5.01251 44.4525C5.30731 47.205 7.62131 49.3611 10.4398 49.4064C10.4471 49.8948 10.5235 50.3663 10.6622 50.8113C11.2935 52.8378 13.1877 54.3132 15.4193 54.3132H55.0182C57.7652 54.3132 60 52.0784 60 49.3318V20.316C60 17.5689 57.7652 15.3341 55.0182 15.3341ZM57.6562 20.316V39.5041L52.5586 35.6533C51.1656 34.6014 49.2819 34.5849 47.8711 35.6126L41.4226 40.3111L29.1252 27.6329C27.6604 26.1223 25.2768 26.0293 23.6989 27.4218L12.7817 37.0536V20.316C12.7817 18.8612 13.965 17.6779 15.4193 17.6779H55.0182C56.4729 17.6779 57.6562 18.8612 57.6562 20.316ZM57.6562 49.3313C57.6562 50.7861 56.4729 51.9694 55.0186 51.9694H15.4193C14.2378 51.9694 13.2349 51.188 12.9007 50.115C12.8233 49.8674 12.7817 49.6042 12.7817 49.3318V40.1788L25.2498 29.1792C25.8875 28.6161 26.8506 28.6537 27.4429 29.2643L32.9929 34.9864C32.9929 34.9868 32.9929 34.9868 32.9933 34.9868L44.0396 46.3755C44.2694 46.6127 44.5747 46.7317 44.881 46.7317C45.1749 46.7317 45.4692 46.6218 45.6967 46.4012C46.1609 45.9503 46.1723 45.2087 45.7219 44.7441L43.0705 42.0103L49.2513 37.5073C49.8216 37.0916 50.5829 37.0981 51.1459 37.5233L57.6562 42.4411V49.3313ZM7.32422 43.8578V16.1888C7.32422 16.0711 7.33017 15.9544 7.34207 15.84C7.51694 14.1201 8.974 12.7739 10.7391 12.7739H25.0735C25.7208 12.7739 26.2454 12.2493 26.2454 11.602C26.2454 10.9547 25.7208 10.4301 25.0735 10.4301H10.7391C7.56363 10.4301 4.98047 13.0133 4.98047 16.1888V42.0845C3.48312 41.8148 2.34375 40.502 2.34375 38.9277V14.0954C2.34375 10.6485 5.14847 7.84375 8.59589 7.84375H44.0121C45.5676 7.84375 46.8681 8.95749 47.1579 10.4301H34.4485C33.8013 10.4301 33.2767 10.9547 33.2767 11.602C33.2767 12.2493 33.8013 12.7739 34.4485 12.7739H48.3902H48.3916H48.9926C50.5389 12.7739 51.8335 13.8748 52.1333 15.3341H15.4193C12.6727 15.3341 10.4379 17.5689 10.4379 20.316V39.6492V39.6501V47.0626C8.71262 47.0137 7.32422 45.5951 7.32422 43.8578Z" fill="#0A1F69"/>
+<path d="M45.5292 22.4473C42.7634 22.4473 40.5139 24.6972 40.5139 27.4621C40.5139 30.2274 42.7638 32.4773 45.5292 32.4773C48.2941 32.4773 50.544 30.2274 50.544 27.4621C50.544 24.6972 48.2941 22.4473 45.5292 22.4473ZM45.5292 30.1336C44.0561 30.1336 42.8577 28.9351 42.8577 27.4625C42.8577 25.9894 44.0561 24.791 45.5292 24.791C47.0018 24.791 48.2002 25.9894 48.2002 27.4625C48.2002 28.9351 47.0018 30.1336 45.5292 30.1336Z" fill="#0A1F69"/>
+<path d="M28.6793 12.0506C28.7086 12.1211 28.7448 12.1888 28.7869 12.2524C28.8294 12.3165 28.8784 12.3765 28.9324 12.4305C28.9865 12.4841 29.046 12.5335 29.1105 12.577C29.1737 12.6191 29.2428 12.6553 29.3133 12.6846C29.3833 12.7139 29.4575 12.7363 29.5326 12.7514C29.6072 12.7665 29.6845 12.7738 29.761 12.7738C29.8383 12.7738 29.9143 12.7665 29.9908 12.7514C30.0654 12.7363 30.1382 12.7139 30.2096 12.6846C30.2801 12.6553 30.3478 12.6191 30.4115 12.577C30.4756 12.5335 30.5355 12.4841 30.5895 12.4305C30.6445 12.3765 30.6925 12.3165 30.736 12.2524C30.7781 12.1888 30.8143 12.1211 30.8436 12.0506C30.8729 11.9791 30.8953 11.9054 30.9104 11.8317C30.9255 11.7553 30.9329 11.6779 30.9329 11.602C30.9329 11.5255 30.9255 11.4481 30.9104 11.3735C30.8953 11.2985 30.8729 11.2243 30.8436 11.1543C30.8143 11.0828 30.7781 11.0146 30.736 10.9515C30.6925 10.8869 30.6445 10.8274 30.5895 10.7734C30.5355 10.7194 30.4756 10.6704 30.4115 10.6278C30.3478 10.5857 30.2801 10.5496 30.2096 10.5203C30.1382 10.491 30.0654 10.4685 29.9908 10.4534C29.8393 10.4228 29.6836 10.4228 29.5326 10.4534C29.4575 10.4685 29.3833 10.491 29.3133 10.5203C29.2428 10.5496 29.1737 10.5857 29.1105 10.6278C29.046 10.6704 28.9865 10.7194 28.9324 10.7734C28.8784 10.8274 28.8294 10.8869 28.7869 10.9515C28.7448 11.0146 28.7086 11.0828 28.6793 11.1543C28.65 11.2243 28.6276 11.2985 28.6125 11.3735C28.5974 11.4481 28.5891 11.5255 28.5891 11.602C28.5891 11.6779 28.5974 11.7553 28.6125 11.8317C28.6276 11.9054 28.65 11.9791 28.6793 12.0506Z" fill="#0A1F69"/>
+</svg>

src/assets/images/pt.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512" version="1.1"><path d="M 170.377 245.461 C 170.056 246.296, 169.957 252.497, 170.157 259.240 C 170.443 268.882, 170.911 272.141, 172.345 274.500 C 178.068 283.914, 190.051 284.114, 195.500 274.887 C 197.234 271.950, 197.500 269.704, 197.500 258 L 197.500 244.500 184.230 244.221 C 173.107 243.987, 170.865 244.187, 170.377 245.461" stroke="none" fill="#004cba" fill-rule="evenodd"/><path d="M 153.189 250.776 L 153.500 276.551 156.787 283.223 C 164.622 299.127, 181.991 306.147, 195.922 299.040 C 202.361 295.755, 208.630 289.450, 211.728 283.143 L 214.500 277.500 214.824 251.250 L 215.147 225 184.012 225 L 152.877 225 153.189 250.776 M 170.377 245.461 C 170.056 246.296, 169.953 252.497, 170.147 259.240 C 170.453 269.872, 170.801 271.984, 172.766 275.144 C 176.832 281.682, 184.484 283.718, 190.656 279.903 C 196.539 276.268, 197.480 273.250, 197.491 258 L 197.500 244.500 184.230 244.221 C 173.107 243.987, 170.865 244.187, 170.377 245.461" stroke="none" fill="#ffffff" fill-rule="evenodd"/><path d="M 173.500 148.570 C 140.174 153.092, 115.707 166.576, 97.570 190.413 C 61.447 237.890, 70.878 305.962, 118.472 341.285 C 153.937 367.605, 199.632 369.859, 238.444 347.202 C 249.571 340.707, 267.651 322.620, 274.392 311.242 C 279.888 301.965, 285.403 288.090, 287.784 277.546 C 290.041 267.558, 290.033 243.939, 287.771 233.765 C 283.057 212.569, 274.214 196.340, 259 180.962 C 242.241 164.022, 226.242 155.179, 203.819 150.462 C 196.553 148.933, 178.928 147.834, 173.500 148.570 M 128.750 201.080 C 127.133 202.022, 127 204.912, 127 239 C 127 261.889, 127.417 277.914, 128.097 281.201 C 130.603 293.305, 140.064 308.220, 149.714 315.277 C 164.345 325.975, 179.016 329.755, 193.451 326.543 C 211.705 322.482, 226.548 310.919, 234.893 294.260 C 240.551 282.965, 240.969 279.203, 240.985 239.405 C 240.999 205.696, 240.879 203.201, 239.171 201.655 C 237.517 200.158, 232.254 200.003, 183.921 200.030 C 149.501 200.050, 129.878 200.423, 128.750 201.080" stroke="none" fill="#ffe600" fill-rule="evenodd"/><path d="M 75 1.553 C 40.842 8.877, 14.816 32.647, 3.340 67 L 0.500 75.500 0.236 253.351 C -0.024 429.355, -0.006 431.291, 2.013 439.791 C 9.839 472.741, 35.014 498.784, 69.067 509.155 C 76.325 511.366, 77.765 511.427, 130.250 511.758 L 184 512.097 184 437.765 L 184 363.434 172.750 362.225 C 158.801 360.727, 149.219 358.088, 137.148 352.421 C 81.316 326.207, 59.078 258.161, 88.643 204 C 106.061 172.094, 138.074 151.693, 175.750 148.493 L 184 147.792 184 73.896 L 184 0 132.750 0.079 C 92.950 0.141, 80.048 0.470, 75 1.553" stroke="none" fill="#04a206" fill-rule="evenodd"/><path d="M 184 73.898 L 184 147.841 190.750 148.526 C 210.176 150.497, 226.827 156.307, 242.910 166.727 C 251.981 172.603, 268.750 190.300, 274.476 200.037 C 280.234 209.831, 285.314 222.719, 287.771 233.765 C 290.033 243.939, 290.041 267.558, 287.784 277.546 C 283.274 297.513, 274.210 314.428, 260.101 329.208 C 241.790 348.391, 220.088 359.179, 193.793 362.169 L 184 363.282 184 437.641 L 184 512 306.542 512 C 414.592 512, 429.996 511.812, 436.792 510.412 C 473.570 502.834, 503.058 473.237, 510.450 436.484 C 511.895 429.301, 512.027 410.846, 511.773 252.500 L 511.490 76.500 509.204 69 C 499.478 37.085, 474.881 12.491, 443 2.803 L 435.500 0.523 309.750 0.239 L 184 -0.045 184 73.898 M 128.750 201.080 C 127.133 202.022, 127 204.912, 127 239 C 127 261.889, 127.417 277.914, 128.097 281.201 C 130.603 293.305, 140.064 308.220, 149.714 315.277 C 164.345 325.975, 179.016 329.755, 193.451 326.543 C 211.705 322.482, 226.548 310.919, 234.893 294.260 C 240.551 282.965, 240.969 279.203, 240.985 239.405 C 240.999 205.696, 240.879 203.201, 239.171 201.655 C 237.517 200.158, 232.254 200.003, 183.921 200.030 C 149.501 200.050, 129.878 200.423, 128.750 201.080 M 153.189 251.250 L 153.500 277.500 156.272 283.143 C 161.388 293.558, 171.743 300.889, 182.568 301.758 C 190.722 302.412, 199.009 298.836, 205.555 291.838 C 214.130 282.670, 214.456 281.242, 214.811 251.250 L 215.121 225 184 225 L 152.879 225 153.189 251.250" stroke="none" fill="#f3042b" fill-rule="evenodd"/></svg>

src/assets/images/road.svg

@@ -0,0 +1,6 @@
+<svg width="173" height="360" viewBox="0 0 173 360" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="173" height="360" fill="#D5DAE8"/>
+<line x1="6.5" y1="-1.09278e-07" x2="6.50002" y2="360" stroke="white" stroke-width="5"/>
+<line x1="166.5" y1="1.3381e-07" x2="166.5" y2="358.776" stroke="white" stroke-width="5"/>
+<line x1="85.0001" y1="5.35242e-08" x2="85" y2="358.776" stroke="white" stroke-width="2" stroke-dasharray="4 4"/>
+</svg>

src/assets/images/success.svg

@@ -0,0 +1,3 @@
+<svg width="113" height="114" viewBox="0 0 113 114" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M56.5 0.5C25.2961 0.5 0 25.7961 0 57C0 88.2057 25.2961 113.5 56.5 113.5C87.7057 113.5 113 88.2057 113 57C113 25.7961 87.7057 0.5 56.5 0.5ZM56.5 106.549C29.2405 106.549 7.0625 84.2595 7.0625 56.9998C7.0625 29.7403 29.2405 7.56228 56.5 7.56228C83.7595 7.56228 105.938 29.7404 105.938 56.9998C105.938 84.2591 83.7595 106.549 56.5 106.549ZM79.0488 36.3263L45.8991 69.6842L30.9707 54.7559C29.5918 53.3769 27.3565 53.3769 25.9758 54.7559C24.5968 56.1348 24.5968 58.3701 25.9758 59.7491L43.4537 77.2288C44.8326 78.606 47.0679 78.606 48.4486 77.2288C48.6075 77.0699 48.7436 76.8967 48.8672 76.7167L84.0455 41.3211C85.4227 39.9422 85.4227 37.7069 84.0455 36.3263C82.6648 34.9473 80.4295 34.9473 79.0488 36.3263Z" fill="#68C149"/>
+</svg>

src/assets/images/upload-illustration.svg

@@ -0,0 +1,61 @@
+<svg width="189" height="150" viewBox="0 0 189 150" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_5_57)">
+<path d="M94.495 149.13C146.614 149.13 188.865 146.663 188.865 143.62C188.865 140.577 146.614 138.11 94.495 138.11C42.3759 138.11 0.125 140.577 0.125 143.62C0.125 146.663 42.3759 149.13 94.495 149.13Z" fill="#F0F6FF"/>
+<path d="M131.285 2.52991H26.1951V105.43H131.285V2.52991Z" fill="#0F264C"/>
+<path d="M128.585 5.81995H28.895V105.43H128.585V5.81995Z" fill="white"/>
+<path d="M131.285 103.98V105.43H78.325L89.775 93.99L105.535 78.22L131.285 103.98Z" fill="#0F264C"/>
+<path d="M26.1951 105.43V95.5399L58.7551 62.9799L101.215 105.43H26.1951Z" fill="#0F264C"/>
+<path d="M96.0751 51.6498C104.961 51.6498 112.165 44.4461 112.165 35.5599C112.165 26.6736 104.961 19.4698 96.0751 19.4698C87.1888 19.4698 79.9851 26.6736 79.9851 35.5599C79.9851 44.4461 87.1888 51.6498 96.0751 51.6498Z" fill="#0F264C"/>
+<path d="M150.287 7.86705L150.24 8.35474L153.723 8.69506L153.771 8.20738L150.287 7.86705Z" fill="#0053CC"/>
+<path d="M138.447 6.70838L138.4 7.19604L146.909 8.02741L146.957 7.53974L138.447 6.70838Z" fill="#0053CC"/>
+<path d="M57.3632 0.505566L47.3577 102.918L151.95 113.136L161.955 10.724L57.3632 0.505566Z" fill="#0053CC"/>
+<path d="M59.7376 4.04914L50.052 103.187L149.27 112.881L158.955 13.7425L59.7376 4.04914Z" fill="white"/>
+<path d="M152.085 111.69L151.945 113.13L99.2351 107.98L111.735 97.7099L128.955 83.5499L152.085 111.69Z" fill="#0053CC"/>
+<path d="M47.3552 102.92L48.3152 93.07L83.8852 63.83L122.015 110.21L47.3552 102.92Z" fill="#0053CC"/>
+<path d="M138.425 46.6174C141.992 38.4787 138.287 28.989 130.148 25.4214C122.009 21.8539 112.519 25.5595 108.952 33.6982C105.384 41.8369 109.09 51.3266 117.229 54.8942C125.367 58.4617 134.857 54.7561 138.425 46.6174Z" fill="#0053CC"/>
+<path d="M115.296 14.0952L10.4299 20.9501L17.142 123.631L122.008 116.776L115.296 14.0952Z" fill="#9FC6FF"/>
+<path d="M112.826 17.5571L13.3486 24.0598L19.8461 123.458L119.324 116.955L112.826 17.5571Z" fill="white"/>
+<path d="M121.915 115.34L122.015 116.79L69.165 120.24L79.835 108.08L94.535 91.3201L121.915 115.34Z" fill="#9FC6FF"/>
+<path d="M17.1451 123.64L16.4951 113.77L46.8651 79.15L91.9951 118.75L17.1451 123.64Z" fill="#9FC6FF"/>
+<path d="M93.6987 60.7395C99.9822 54.456 99.9822 44.2684 93.6987 37.9848C87.4152 31.7013 77.2275 31.7013 70.944 37.9848C64.6605 44.2684 64.6605 54.456 70.944 60.7395C77.2275 67.0231 87.4152 67.0231 93.6987 60.7395Z" fill="#9FC6FF"/>
+<path d="M157.355 65.87L153.935 67L157.025 70.31C157.025 70.31 159.725 68.7 159.025 67.18L157.355 65.87Z" fill="#FFC3BD"/>
+<path d="M151.595 70.05L154.265 72.63L157.025 70.32L153.935 67L151.595 70.05Z" fill="#FFC3BD"/>
+<path d="M162.945 38.8201C163.295 39.4601 163.575 40.0301 163.865 40.6401C164.145 41.2401 164.425 41.8401 164.695 42.4501C165.215 43.6701 165.705 44.9101 166.135 46.1701C166.575 47.4301 166.945 48.7301 167.265 50.0501L167.495 51.0501L167.685 52.0701C167.755 52.4101 167.795 52.7601 167.835 53.1101L167.905 53.6301L167.925 53.7601L167.945 53.9801C167.965 54.1501 167.965 54.2901 167.965 54.4401C167.925 55.6101 167.625 56.3901 167.335 57.1301C167.025 57.8601 166.685 58.4901 166.325 59.1001C165.605 60.3101 164.805 61.3901 163.975 62.4401C162.315 64.5201 160.525 66.3901 158.575 68.1701L156.595 66.3901C158.015 64.3401 159.415 62.2301 160.685 60.1401C161.315 59.0901 161.905 58.0301 162.385 57.0001C162.625 56.4901 162.835 55.9701 162.975 55.5101C163.115 55.0601 163.185 54.6001 163.145 54.4801C163.145 54.4801 163.145 54.4601 163.135 54.4701C163.135 54.4701 163.135 54.5001 163.135 54.4501L163.115 54.3401L163.025 53.9201C162.965 53.6401 162.915 53.3601 162.825 53.0801L162.605 52.2301L162.355 51.3801C162.005 50.2501 161.605 49.1101 161.165 47.9801C160.725 46.8501 160.255 45.7301 159.755 44.6101C159.275 43.5001 158.725 42.3601 158.225 41.3301L162.975 38.8101L162.945 38.8201Z" fill="#FFC3BD"/>
+<path d="M168.535 47.33L161.915 50.83L160.315 51.68C160.315 51.68 159.945 50.58 159.405 48.99C158.975 47.72 158.445 46.14 157.915 44.54C157.745 44.03 157.585 43.53 157.425 43.04C157.375 42.9 157.325 42.76 157.285 42.62C155.855 38.23 159.825 36.27 162.525 36.83C167.155 37.8 168.535 47.33 168.535 47.33Z" fill="#9FC6FF"/>
+<path d="M161.905 50.8301L160.305 51.6801C160.305 51.6801 159.935 50.5801 159.395 48.9901C158.965 47.7201 158.435 46.1401 157.905 44.5401C157.735 44.0301 157.575 43.5301 157.415 43.0401L161.065 42.3201C161.065 42.3201 161.565 48.1101 161.895 50.8301H161.905Z" fill="#77B3FC"/>
+<path d="M157.255 26.79C156.495 29.32 155.515 34 157.155 35.9C157.155 35.9 156.185 38.45 151.395 37.97C146.115 37.45 149.135 35.1 149.135 35.1C152.085 34.7 152.225 32.56 151.915 30.5L157.255 26.78V26.79Z" fill="#FFC3BD"/>
+<path d="M148.105 36C148.345 35.53 148.005 33.78 148.005 33.78C148.005 33.78 155.535 32.77 158.225 33.73C159.675 34.25 158.405 36.85 158.405 36.85L148.115 36H148.105Z" fill="#14365B"/>
+<path d="M148.265 22.96C148.235 23.24 148.065 23.46 147.875 23.44C147.685 23.42 147.565 23.18 147.585 22.89C147.615 22.61 147.785 22.39 147.975 22.41C148.165 22.43 148.285 22.67 148.265 22.96Z" fill="#0F264C"/>
+<path d="M148.255 23.1C148.255 23.1 147.445 24.68 146.655 25.4C147.115 25.92 147.985 25.79 147.985 25.79L148.255 23.1Z" fill="#ED847E"/>
+<path d="M149.345 22.0199C149.285 22.0199 149.235 21.9899 149.205 21.9399C148.815 21.2999 148.195 21.2799 148.195 21.2799C148.105 21.2799 148.025 21.1999 148.035 21.1099C148.035 21.0199 148.105 20.9399 148.205 20.9499C148.235 20.9499 149.015 20.9799 149.495 21.7799C149.545 21.8599 149.515 21.9599 149.435 22.0099C149.405 22.0299 149.375 22.0299 149.345 22.0299V22.0199Z" fill="#0F264C"/>
+<path d="M132.935 136.07L129.395 135.81L129.065 127.55L132.595 127.81L132.935 136.07Z" fill="#FFC3BD"/>
+<path d="M155.535 139.23H151.985L149.225 131.01H152.775L155.535 139.23Z" fill="#FFC3BD"/>
+<path d="M151.515 138.81H155.835C155.985 138.81 156.105 138.91 156.135 139.05L156.835 142.2C156.905 142.53 156.655 142.84 156.315 142.83C154.925 142.81 153.905 142.72 152.155 142.72C151.075 142.72 148.855 142.83 147.365 142.83C145.875 142.83 145.685 141.36 146.295 141.22C149.025 140.62 150.055 139.8 150.935 139.01C151.095 138.87 151.295 138.79 151.515 138.79V138.81Z" fill="#14365B"/>
+<path d="M129.225 135.02L133.085 135.31C133.225 135.32 133.345 135.43 133.365 135.57L133.825 138.77C133.875 139.1 133.605 139.39 133.265 139.36C131.875 139.23 129.865 139 128.115 138.87C126.065 138.72 124.705 138.65 122.305 138.47C120.855 138.36 120.555 136.86 121.175 136.78C123.985 136.38 125.835 136.54 128.335 135.24C128.605 135.1 128.905 135.01 129.205 135.03L129.225 135.02Z" fill="#14365B"/>
+<path d="M129.065 127.55L129.235 131.81L132.775 132.07L132.605 127.82L129.065 127.55Z" fill="#F29994"/>
+<path d="M152.775 131.01H149.225L150.655 135.25H154.205L152.775 131.01Z" fill="#F29994"/>
+<path d="M160.115 67.75C157.345 67.55 146.895 66.77 141.195 66.34C140.515 60.82 140.395 56.03 140.575 51.99C140.655 50.27 140.785 48.68 140.955 47.23C141.835 39.64 143.685 35.79 143.685 35.79C143.685 35.79 146.375 35.26 149.195 35.21C151.335 35.18 154.835 35.51 157.235 35.81C160.315 36.19 162.965 36.94 162.965 36.94C159.145 50.41 160.465 64.85 160.115 67.75Z" fill="#9FC6FF"/>
+<path d="M142.865 48.69L140.585 52C140.665 50.28 140.795 48.69 140.965 47.24L142.865 48.7V48.69Z" fill="#77B3FC"/>
+<path d="M141.415 38.24C141.095 38.79 140.715 39.42 140.355 40.02C139.985 40.62 139.615 41.22 139.225 41.8C138.455 42.98 137.665 44.14 136.845 45.26C136.015 46.38 135.165 47.46 134.265 48.47C133.455 49.37 132.615 50.2 131.745 50.91C130.995 51.08 130.235 51.19 129.465 51.24C128.505 51.28 127.525 51.24 126.545 51.07C125.565 50.91 124.595 50.63 123.645 50.26C123.165 50.07 122.695 49.87 122.235 49.64C122.005 49.52 121.785 49.4 121.555 49.27C121.345 49.15 121.095 49 120.945 48.91L119.085 50.82C119.355 51.12 119.545 51.33 119.785 51.56C120.015 51.78 120.255 51.99 120.505 52.19C120.995 52.6 121.505 52.98 122.045 53.32C123.115 54.01 124.295 54.57 125.525 54.99C126.765 55.4 128.065 55.66 129.395 55.75C130.715 55.83 132.055 55.76 133.355 55.52L133.765 55.45L134.225 55.15C135.645 54.21 136.875 53.15 137.995 52.02C139.115 50.9 140.135 49.72 141.085 48.51C142.045 47.3 142.925 46.05 143.765 44.78C144.185 44.14 144.585 43.5 144.985 42.85C145.385 42.19 145.755 41.56 146.145 40.83L141.425 38.26L141.415 38.24Z" fill="#FFC3BD"/>
+<path d="M147.835 39.87C147.585 43.25 143.575 49.83 143.575 49.83L134.515 45.07C134.515 45.07 137.585 40.14 140.935 37.2C144.325 34.23 148.105 36.15 147.825 39.86L147.835 39.87Z" fill="#9FC6FF"/>
+<path d="M122.535 50.07L119.885 47.76L117.845 51.24C117.845 51.24 119.725 53.35 121.945 52.02L122.535 50.08V50.07Z" fill="#FFC3BD"/>
+<path d="M116.205 46.21L114.795 49.41L117.845 51.23L119.885 47.75L116.205 46.21Z" fill="#FFC3BD"/>
+<path d="M157.955 22.94C157.395 26.41 157.245 28.48 155.295 30.1C152.375 32.54 148.215 30.51 147.725 26.93C147.285 23.71 148.275 18.57 151.835 17.52C155.345 16.48 158.505 19.47 157.945 22.94H157.955Z" fill="#FFC3BD"/>
+<path d="M161.885 21.11C164.485 22.93 158.295 29.61 156.095 29.54C153.895 29.47 149.785 23.36 151.125 20.12C149.985 19.66 149.625 19.51 149.165 18.35C148.335 16.25 149.335 12.75 154.475 13.73C153.195 14.6 154.085 15.28 156.505 14.95C155.555 16.09 157.125 16.92 159.475 16.44C159.065 18.52 164.315 18.82 161.885 21.11Z" fill="#0F264C"/>
+<path d="M153.065 24.0099C152.895 24.9399 152.315 25.7199 151.675 26.1499C150.705 26.8099 149.845 26.0299 149.805 24.9099C149.775 23.9099 150.235 22.3599 151.355 22.1499C152.465 21.9399 153.255 22.9299 153.065 23.9999V24.0099Z" fill="#FFC3BD"/>
+<path d="M155.485 134.43H148.985C148.985 134.43 142.655 112.67 141.065 101.39C140.725 98.96 140.925 95.75 141.435 92.26C142.305 86.3 144.065 79.53 145.535 74.47C146.845 69.98 147.915 66.84 147.915 66.84C147.915 66.84 152.885 67.21 160.125 67.75C159.465 76.61 150.695 91.17 151.305 103.19C151.865 114.27 155.485 134.42 155.485 134.42V134.43Z" fill="#14365B"/>
+<path d="M148.765 77.04C148.695 82.94 144.555 89.46 141.435 92.26C142.305 86.3 144.065 79.53 145.535 74.47C146.445 74.29 148.005 76.02 148.765 77.03V77.04Z" fill="#0A1B35"/>
+<path d="M141.205 66.35C141.205 66.35 125.885 89.53 125.465 100.34C125.035 111.59 127.965 130.89 127.965 130.89L133.955 131.34C133.955 131.34 134.655 112.98 135.735 101.98C136.915 89.99 154.225 76.63 154.915 67.36C149.065 66.93 141.195 66.34 141.195 66.34L141.205 66.35Z" fill="#14365B"/>
+<path d="M147.835 134.57H156.325V132.28L146.835 132.13L147.835 134.57Z" fill="#0053CC"/>
+<path d="M126.765 130.93L135.085 131.57L135.255 129.26L125.945 128.43L126.765 130.93Z" fill="#0053CC"/>
+<path d="M150.345 139.43C150.075 139.43 149.825 139.38 149.665 139.25C149.535 139.14 149.475 138.99 149.495 138.81C149.495 138.67 149.575 138.6 149.635 138.57C150.035 138.37 151.175 139.07 151.305 139.15C151.335 139.17 151.345 139.2 151.345 139.23C151.345 139.26 151.315 139.29 151.285 139.3C151.035 139.36 150.685 139.43 150.355 139.43H150.345ZM149.815 138.7C149.815 138.7 149.735 138.7 149.705 138.72C149.685 138.73 149.655 138.75 149.655 138.82C149.655 138.95 149.685 139.05 149.765 139.12C149.955 139.28 150.425 139.31 151.025 139.18C150.625 138.95 150.085 138.69 149.815 138.69V138.7Z" fill="#407BFF"/>
+<path d="M151.255 139.31C151.255 139.31 151.225 139.31 151.215 139.3C150.845 139.1 150.135 138.32 150.215 137.93C150.225 137.86 150.285 137.73 150.485 137.71C150.615 137.69 150.735 137.73 150.845 137.82C151.255 138.16 151.345 139.18 151.345 139.22C151.345 139.25 151.335 139.28 151.305 139.3C151.295 139.3 151.275 139.31 151.255 139.31ZM150.535 137.87C150.535 137.87 150.505 137.87 150.495 137.87C150.385 137.88 150.375 137.93 150.375 137.96C150.335 138.19 150.785 138.78 151.145 139.06C151.105 138.76 150.995 138.16 150.725 137.95C150.665 137.9 150.605 137.88 150.535 137.88V137.87Z" fill="#407BFF"/>
+<path d="M128.015 135.54C127.555 135.54 127.085 135.48 126.865 135.25C126.755 135.14 126.715 135 126.735 134.83C126.755 134.73 126.805 134.66 126.885 134.62C127.335 134.42 128.705 135.24 128.855 135.33C128.885 135.35 128.905 135.38 128.895 135.42C128.895 135.45 128.855 135.48 128.825 135.49C128.595 135.52 128.305 135.54 128.005 135.54H128.015ZM127.085 134.75C127.085 134.75 126.995 134.75 126.965 134.77C126.925 134.79 126.915 134.81 126.905 134.86C126.885 134.97 126.905 135.06 126.985 135.14C127.185 135.35 127.765 135.43 128.555 135.35C128.065 135.07 127.395 134.75 127.075 134.75H127.085Z" fill="#407BFF"/>
+<path d="M128.815 135.48C128.815 135.48 128.785 135.48 128.775 135.47C128.365 135.25 127.575 134.42 127.665 134.02C127.685 133.93 127.765 133.82 127.995 133.81C128.165 133.81 128.315 133.87 128.445 133.99C128.865 134.39 128.895 135.35 128.895 135.39C128.895 135.42 128.885 135.45 128.855 135.46C128.845 135.46 128.825 135.47 128.815 135.47V135.48ZM128.015 133.98C128.015 133.98 128.015 133.98 128.005 133.98C127.855 133.98 127.835 134.04 127.835 134.06C127.775 134.3 128.305 134.94 128.725 135.23C128.705 134.95 128.615 134.37 128.335 134.1C128.245 134.01 128.135 133.97 128.015 133.97V133.98Z" fill="#407BFF"/>
+</g>
+<defs>
+<clipPath id="clip0_5_57">
+<rect width="188.75" height="148.63" fill="white" transform="translate(0.125 0.5)"/>
+</clipPath>
+</defs>
+</svg>

src/assets/images/uploading-person.svg

@@ -0,0 +1,65 @@
+<svg width="81" height="158" viewBox="0 0 81 158" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_1_1028)">
+<path d="M40.5 157.5C62.5914 157.5 80.5 156.415 80.5 155.077C80.5 153.739 62.5914 152.654 40.5 152.654C18.4086 152.654 0.5 153.739 0.5 155.077C0.5 156.415 18.4086 157.5 40.5 157.5Z" fill="#F5F5F5"/>
+<path d="M29.6244 152.173L25.9674 150.929L27.7777 141.822L31.4348 143.067L29.6244 152.173Z" fill="#FFB573"/>
+<path d="M61.4325 152.221H57.5844L56.6246 142.982H60.4727L61.4325 152.221Z" fill="#FFB573"/>
+<path d="M57.2659 151.759H61.9601C62.1192 151.759 62.2557 151.872 62.2875 152.032L63.0472 155.577C63.1245 155.944 62.847 156.293 62.4831 156.284C60.973 156.256 59.8723 156.166 57.971 156.166C56.802 156.166 53.2723 156.293 51.6576 156.293C50.0428 156.293 49.8291 154.639 50.4931 154.488C53.4588 153.814 55.6921 152.89 56.6428 152.004C56.8156 151.844 57.0385 151.759 57.2659 151.759Z" fill="#263238"/>
+<path d="M26.031 150.33L30.0837 151.49C30.2338 151.532 30.3385 151.679 30.3294 151.844L30.152 155.473C30.1338 155.85 29.7835 156.109 29.4378 156.006C27.9823 155.563 25.8945 154.87 24.0569 154.347C21.91 153.734 21.5097 153.522 18.9898 152.8C17.466 152.367 17.466 150.651 18.1438 150.684C21.2232 150.854 22.1238 151.264 25.0576 150.378C25.376 150.283 25.7126 150.241 26.031 150.335V150.33Z" fill="#263238"/>
+<path d="M44.994 31.0308C44.7484 31.3655 44.5573 31.6059 44.339 31.884C44.1298 32.1527 43.9114 32.4119 43.6931 32.6664C43.2564 33.1802 42.8107 33.6799 42.3513 34.1701C41.4416 35.16 40.4682 36.0886 39.4402 36.9795C37.3751 38.7377 35.0872 40.364 32.2762 41.3916C31.5757 41.6461 30.8343 41.8488 30.0611 41.9808C29.8655 42.0138 29.6744 42.0468 29.4789 42.0703L28.8784 42.1269C28.7147 42.1505 28.4008 42.1505 28.1234 42.1457C27.8687 42.1269 27.6049 42.1033 27.382 42.0609C26.4632 41.9006 25.7399 41.6084 25.0622 41.3067C24.389 41.005 23.7795 40.6656 23.1973 40.3027C22.0329 39.5862 20.9731 38.799 19.9633 37.96C18.949 37.1209 18.0119 36.2489 17.0931 35.2731L18.8398 32.8833C20.9776 33.9863 23.1609 35.1412 25.2532 35.9802C25.7763 36.1829 26.2903 36.3667 26.7725 36.5081C27.2501 36.6495 27.7186 36.725 28.0233 36.7297C28.1006 36.7297 28.1507 36.7203 28.2007 36.7203C28.2326 36.7061 28.228 36.7108 28.369 36.6825L28.6874 36.626L29.0149 36.5458C29.2287 36.5034 29.4561 36.4091 29.6744 36.3432C29.8973 36.2489 30.1202 36.1782 30.3476 36.0698C31.2528 35.6832 32.1625 35.1412 33.0449 34.5001C33.9364 33.8779 34.8052 33.152 35.6512 32.3789C36.5018 31.6106 37.316 30.781 38.1166 29.9325C38.5168 29.5035 38.908 29.0699 39.2855 28.6268L39.8496 27.9622L40.3681 27.3305L44.9894 31.0261L44.994 31.0308Z" fill="#FFB573"/>
+<path d="M47.1044 29.0557C47.391 32.8597 39.1263 40.6185 39.1263 40.6185L31.8213 34.0523C31.8213 34.0523 34.8961 30.6773 38.353 27.2834C40.7274 24.9454 46.7951 24.9454 47.1044 29.0557Z" fill="white"/>
+<path opacity="0.4" d="M47.1044 29.0557C47.391 32.8597 39.1263 40.6185 39.1263 40.6185L31.8213 34.0523C31.8213 34.0523 34.8961 30.6773 38.353 27.2834C40.7274 24.9454 46.7951 24.9454 47.1044 29.0557Z" fill="#407BFF"/>
+<path opacity="0.2" d="M43.3837 31.0119C39.9859 31.3325 37.8163 34.1607 36.8702 37.2859C36.7656 37.6347 36.6746 37.993 36.6018 38.3465L39.1308 40.6185C39.1308 40.6185 42.8879 37.0879 45.2486 33.6233C45.3669 31.983 44.9166 30.8705 43.3837 31.0119Z" fill="black"/>
+<path d="M19.7313 34.5755L18.4804 31.2853L14.2139 32.6429C14.2139 32.6429 15.6649 34.2691 17.2705 35.4004L19.7313 34.5755Z" fill="#FFB573"/>
+<path d="M16.329 28.7116L12.813 30.1776L14.2139 32.6429L18.485 31.2853L16.329 28.7116Z" fill="#FFB573"/>
+<path opacity="0.2" d="M27.7777 141.827L26.6906 147.29L30.4022 148.271L31.4347 143.071L27.7777 141.827Z" fill="black"/>
+<path opacity="0.2" d="M60.4773 142.986H56.6246L57.1204 147.747H60.9731L60.4773 142.986Z" fill="black"/>
+<path d="M62.747 27.2174C61.5598 31.6247 60.8002 36.1122 60.2999 40.3404C59.936 43.4326 59.7176 46.3787 59.5812 49.0561C59.2628 55.3253 59.3947 60.105 59.2128 61.7266C56.2016 61.5097 44.8621 60.6943 38.676 60.2464C35.8787 37.5593 41.2187 25.8646 41.2187 25.8646C41.2187 25.8646 43.493 25.3932 46.1357 25.2329C46.4814 25.2093 46.8361 25.1952 47.1955 25.1905C49.5198 25.1386 53.3133 25.5016 55.9287 25.8221C56.4791 25.8881 57.034 25.973 57.5753 26.0625C60.3272 26.5245 62.747 27.2221 62.747 27.2221V27.2174Z" fill="white"/>
+<path opacity="0.4" d="M62.747 27.2174C61.5598 31.6247 60.8002 36.1122 60.2999 40.3404C59.936 43.4326 59.7176 46.3787 59.5812 49.0561C59.2628 55.3253 59.3947 60.105 59.2128 61.7266C56.2016 61.5097 44.8621 60.6943 38.676 60.2464C35.8787 37.5593 41.2187 25.8646 41.2187 25.8646C41.2187 25.8646 43.493 25.3932 46.1357 25.2329C46.4814 25.2093 46.8361 25.1952 47.1955 25.1905C49.5198 25.1386 53.3133 25.5016 55.9287 25.8221C56.4791 25.8881 57.034 25.973 57.5753 26.0625C60.3272 26.5245 62.747 27.2221 62.747 27.2221V27.2174Z" fill="#407BFF"/>
+<path opacity="0.2" d="M57.5617 32.9587C57.548 36.527 58.4987 39.5391 60.1043 42.1787C60.1634 41.5707 60.2317 40.9579 60.3044 40.3404C60.5774 38.0165 60.9321 35.6125 61.4007 33.185L57.5662 32.9587H57.5617Z" fill="black"/>
+<path d="M55.7513 15.5698C55.0054 18.4404 54.0956 23.7339 55.9287 25.8174C54.3822 27.2504 52.1625 28.4052 49.0104 28.1036C46.5951 27.8726 46.5951 26.1144 47.1955 25.1858C50.3795 24.639 50.4613 22.2208 50.0702 19.9205L55.7468 15.5651L55.7513 15.5698Z" fill="#FFB573"/>
+<path opacity="0.2" d="M53.4361 17.3421L50.0747 19.9158C50.1702 20.4626 50.2339 21.0094 50.2339 21.5421C51.4438 21.4478 53.1768 20.2081 53.3906 18.9165C53.4998 18.2754 53.5134 17.6485 53.4315 17.3421H53.4361Z" fill="black"/>
+<path d="M49.6471 11.2756C48.7374 12.6096 46.354 10.1537 46.4404 7.94768C49.9019 7.4716 48.2507 4.85548 51.3983 5.52483C54.0092 6.08105 50.6433 9.81432 49.6471 11.2756Z" fill="#263238"/>
+<path d="M58.2666 12.1382C57.1068 15.9092 56.6155 18.1812 54.273 19.6613C50.7433 21.8862 46.6087 18.9401 46.6542 14.8863C46.6951 11.2379 48.5828 5.68038 52.5719 5.10059C56.5018 4.53023 59.4265 8.3672 58.2666 12.1429V12.1382Z" fill="#FFB573"/>
+<path d="M56.0788 15.5698C56.0788 15.5698 55.7604 13.8823 55.9287 12.7368C56.0924 11.6527 56.5973 10.5968 56.5973 10.5968C56.5973 10.5968 54.4185 9.26281 54.3685 7.65543C54.3685 7.65543 50.4704 8.848 48.3963 7.03322C46.3176 5.21844 48.1734 3.11612 47.109 2.31478C49.6562 2.05553 50.4295 3.66291 52.0396 3.31409C53.5907 2.97942 52.2261 1.79156 52.4399 0.5C57.2932 4.83191 59.4038 2.8003 61.7599 5.27972C63.2655 6.86353 61.6826 9.83789 61.6826 9.83789C61.6826 9.83789 64.0842 14.0708 56.0788 15.5698Z" fill="#263238"/>
+<path d="M60.9139 9.7389C60.9139 9.7389 63.2974 10.248 63.3611 7.66014C64.5892 10.2951 63.0518 10.6864 60.9139 9.7389Z" fill="#263238"/>
+<path d="M50.1565 15.7348C51.6848 16.1213 52.64 15.2162 52.681 15.1738C52.7219 15.1361 52.7219 15.0701 52.681 15.0324C52.6446 14.99 52.5809 14.99 52.5445 15.0277C52.5354 15.0371 51.6211 15.8997 50.202 15.5368C50.1474 15.5226 50.0974 15.5556 50.0837 15.6122C50.0701 15.664 50.1019 15.7206 50.152 15.7348H50.1565Z" fill="#263238"/>
+<path d="M58.908 16.3051C58.1711 17.0499 57.1705 17.3704 56.3244 17.3421C55.0508 17.3044 54.7916 16.027 55.4647 14.99C56.0697 14.0567 57.457 12.9489 58.5805 13.491C59.6904 14.0284 59.754 15.4519 58.908 16.3051Z" fill="#FFB573"/>
+<path d="M25.6671 145.329L31.9487 147.12C31.9487 147.12 39.8177 121.416 41.7508 107.299C42.2648 103.556 43.0562 98.2909 44.2616 92.6816C45.7854 85.611 47.7003 77.97 49.265 71.9836C50.9161 65.6814 52.1761 61.2175 52.1761 61.2175L38.676 60.2417C38.676 60.2417 33.1495 91.5833 31.8577 103.683C30.5159 116.264 25.6671 145.329 25.6671 145.329Z" fill="#407BFF"/>
+<path opacity="0.3" d="M25.6671 145.329L31.9487 147.12C31.9487 147.12 39.8177 121.416 41.7508 107.299C42.2648 103.556 43.0562 98.2909 44.2616 92.6816C45.7854 85.611 47.7003 77.97 49.265 71.9836C50.9161 65.6814 52.1761 61.2175 52.1761 61.2175L38.676 60.2417C38.676 60.2417 33.1495 91.5833 31.8577 103.683C30.5159 116.264 25.6671 145.329 25.6671 145.329Z" fill="black"/>
+<path opacity="0.2" d="M44.2662 92.6769C45.79 85.6063 47.7049 77.9653 49.2696 71.9789L47.8687 68.8537C44.5209 72.9782 43.6203 85.743 44.2662 92.6769Z" fill="black"/>
+<path d="M45.9628 60.765C45.9628 60.765 47.4183 94.9159 49.0467 106.479C50.8252 119.144 55.3464 146.823 55.3464 146.823H62.3967C62.3967 146.823 60.0633 117.697 59.0353 105.263C57.8618 91.1025 59.2218 61.7218 59.2218 61.7218L45.9719 60.765H45.9628Z" fill="#407BFF"/>
+<path opacity="0.3" d="M45.9628 60.765C45.9628 60.765 47.4183 94.9159 49.0467 106.479C50.8252 119.144 55.3464 146.823 55.3464 146.823H62.3967C62.3967 146.823 60.0633 117.697 59.0353 105.263C57.8618 91.1025 59.2218 61.7218 59.2218 61.7218L45.9719 60.765H45.9628Z" fill="black"/>
+<path d="M54.5004 146.984H62.8015V144.415L53.5179 144.245L54.5004 146.984Z" fill="#407BFF"/>
+<path d="M25.235 145.367L32.3262 147.394L33.3496 144.858L25.2623 142.539L25.235 145.367Z" fill="#407BFF"/>
+<path d="M52.399 11.7469C52.3217 12.058 52.1034 12.2702 51.9032 12.2183C51.7076 12.1665 51.6076 11.8742 51.6849 11.5584C51.7622 11.2426 51.9805 11.0352 52.1807 11.087C52.3808 11.1389 52.4763 11.4311 52.399 11.7469Z" fill="#263238"/>
+<path d="M48.9921 10.8561C48.9148 11.1672 48.6965 11.3793 48.5009 11.3274C48.3053 11.2756 48.2052 10.9833 48.2825 10.6675C48.3599 10.3564 48.5782 10.1443 48.7783 10.1961C48.9739 10.248 49.074 10.5402 48.9967 10.8561H48.9921Z" fill="#263238"/>
+<path d="M50.0384 11.2944C50.0384 11.2944 48.9149 12.9159 47.9506 13.59C48.3599 14.2452 49.3788 14.1745 49.3788 14.1745L50.0338 11.2944H50.0384Z" fill="#ED893E"/>
+<path d="M53.7317 10.8796C53.6635 10.8749 53.6044 10.8325 53.5771 10.7665C53.2587 9.98873 52.5991 9.86146 52.5946 9.86146C52.4945 9.8426 52.4308 9.74361 52.449 9.63991C52.4672 9.53621 52.5582 9.4655 52.6628 9.48907C52.6992 9.49378 53.527 9.65876 53.9182 10.6204C53.9591 10.7146 53.9182 10.8278 53.8227 10.8702C53.7954 10.8843 53.7681 10.889 53.7408 10.8843L53.7317 10.8796Z" fill="#263238"/>
+<path d="M47.8323 9.26281C47.7959 9.26281 47.7595 9.24396 47.7276 9.22039C47.6503 9.1544 47.6412 9.03184 47.7049 8.95642C48.3553 8.15509 49.1877 8.24936 49.2241 8.25408C49.3242 8.26822 49.397 8.36249 49.3833 8.46619C49.3697 8.5699 49.2741 8.6406 49.1832 8.63118C49.1559 8.63118 48.5054 8.56047 47.9824 9.19682C47.9414 9.24396 47.8868 9.26753 47.8277 9.26281H47.8323Z" fill="#263238"/>
+<path d="M55.9923 152.456C55.7012 152.456 55.4238 152.404 55.2509 152.254C55.1145 152.136 55.0508 151.966 55.0644 151.754C55.0735 151.598 55.1554 151.523 55.2191 151.485C55.6466 151.259 56.8884 152.051 57.0249 152.141C57.0567 152.159 57.0703 152.197 57.0658 152.235C57.0612 152.272 57.034 152.301 56.9976 152.31C56.7292 152.376 56.3471 152.452 55.9923 152.452V152.456ZM55.4192 151.631C55.3737 151.631 55.3328 151.641 55.301 151.655C55.2782 151.669 55.2464 151.693 55.2418 151.768C55.2327 151.919 55.2737 152.032 55.3646 152.112C55.5739 152.296 56.0788 152.32 56.7292 152.183C56.2971 151.924 55.7103 151.631 55.4147 151.631H55.4192Z" fill="#407BFF"/>
+<path d="M56.9795 152.315C56.9795 152.315 56.9476 152.315 56.934 152.305C56.5337 152.079 55.765 151.207 55.8469 150.764C55.8605 150.684 55.9197 150.543 56.138 150.514C56.279 150.495 56.4109 150.538 56.5246 150.637C56.9704 151.014 57.0659 152.169 57.0659 152.216C57.0659 152.249 57.0522 152.282 57.0249 152.301C57.0113 152.31 56.9931 152.315 56.9749 152.315H56.9795ZM56.2017 150.698C56.2017 150.698 56.1744 150.698 56.1607 150.698C56.0425 150.712 56.0334 150.769 56.0288 150.792C55.9788 151.056 56.47 151.716 56.8657 152.027C56.8203 151.693 56.6975 151.019 56.4109 150.778C56.3472 150.722 56.2744 150.693 56.2017 150.693V150.698Z" fill="#407BFF"/>
+<path d="M25.5306 150.755C25.5306 150.755 25.5215 150.755 25.5124 150.755C24.8802 150.708 23.7794 150.557 23.4701 150.066C23.3792 149.92 23.361 149.755 23.4247 149.576C23.4611 149.473 23.5338 149.402 23.6339 149.374C24.1479 149.246 25.4351 150.453 25.5807 150.59C25.608 150.618 25.6171 150.66 25.6034 150.698C25.5898 150.731 25.5625 150.75 25.5306 150.755ZM23.7021 149.553C23.7021 149.553 23.6839 149.553 23.6748 149.553C23.6339 149.562 23.6112 149.586 23.593 149.633C23.552 149.755 23.5611 149.859 23.6203 149.958C23.7931 150.231 24.3935 150.444 25.2486 150.538C24.7301 150.076 23.9978 149.515 23.6976 149.548L23.7021 149.553Z" fill="#407BFF"/>
+<path d="M25.4579 150.726C25.4579 150.726 25.4488 150.717 25.4488 150.712C25.1031 150.165 24.5436 149.166 24.7347 148.615C24.7893 148.45 24.9075 148.337 25.0804 148.28C25.185 148.247 25.2805 148.261 25.3624 148.332C25.7717 148.681 25.6353 150.472 25.6171 150.675C25.6171 150.712 25.5853 150.75 25.5489 150.759C25.517 150.769 25.4852 150.759 25.4624 150.731L25.4579 150.726ZM25.2669 148.492C25.2669 148.492 25.2532 148.478 25.2487 148.473C25.2168 148.445 25.1804 148.44 25.1349 148.454C25.0167 148.492 24.9439 148.563 24.903 148.676C24.7984 148.987 25.003 149.609 25.4533 150.368C25.4943 149.661 25.4715 148.718 25.2669 148.492Z" fill="#407BFF"/>
+<path d="M63.3201 29.513C64.2071 30.8092 64.9621 32.0631 65.7308 33.3688C66.4995 34.6604 67.2091 35.9943 67.9005 37.3472C69.256 40.067 70.5023 42.8717 71.3756 46.0063C71.4802 46.4022 71.5803 46.7982 71.6712 47.2083C71.7167 47.411 71.7622 47.6184 71.7986 47.8258L71.8577 48.1369L71.8896 48.2972L71.926 48.5517C72.0761 49.881 71.8714 50.8567 71.6485 51.7429C71.1754 53.5011 70.4886 54.9294 69.7517 56.3105C69.0103 57.6822 68.2007 58.969 67.3365 60.204C66.4722 61.4437 65.5762 62.6175 64.5755 63.7723L62.2102 62.0518C63.4429 59.4923 64.6983 56.8667 65.6626 54.293C65.9037 53.652 66.122 53.0109 66.3039 52.384C66.495 51.7617 66.6451 51.149 66.7224 50.5927C66.8043 50.0507 66.7952 49.5416 66.7361 49.4049C66.7361 49.4002 66.7315 49.3907 66.727 49.386L66.6997 49.2776L66.6405 49.0514C66.6041 48.9005 66.5632 48.7497 66.5132 48.5988C66.4268 48.2972 66.3221 47.9861 66.2175 47.6797C65.3578 45.1955 64.1161 42.6737 62.7879 40.2131C62.1238 38.9734 61.4142 37.7573 60.7092 36.5317C60.0042 35.3203 59.2355 34.09 58.5214 32.9493L63.3201 29.513Z" fill="#FFB573"/>
+<path d="M62.747 27.2174C66.354 27.9716 69.5198 37.1162 69.5198 37.1162L61.992 43.4703C61.992 43.4703 59.5266 38.8226 57.5526 34.3398C55.4011 29.4564 58.3804 26.3076 62.7516 27.2174H62.747Z" fill="white"/>
+<path opacity="0.4" d="M62.747 27.2174C66.354 27.9716 69.5198 37.1162 69.5198 37.1162L61.992 43.4703C61.992 43.4703 59.5266 38.8226 57.5526 34.3398C55.4011 29.4564 58.3804 26.3076 62.7516 27.2174H62.747Z" fill="#407BFF"/>
+<path d="M12.3952 40.1631L10.5768 46.9584L11.0107 47.0831L12.8292 40.2878L12.3952 40.1631Z" fill="#407BFF"/>
+<path d="M9.91085 49.4681L9.12439 52.407L9.55832 52.5317L10.3448 49.5928L9.91085 49.4681Z" fill="#407BFF"/>
+<path d="M61.188 37.0039L23.3755 26.1516C20.5018 25.3268 17.5271 27.0724 16.7312 30.0504L6.25908 69.236C5.46321 72.214 7.14762 75.2968 10.0213 76.1215L47.8338 86.9739C50.7075 87.7987 53.6823 86.0531 54.4781 83.0751L64.9503 43.8895C65.7461 40.9115 64.0617 37.8287 61.188 37.0039Z" fill="#407BFF"/>
+<path d="M38.6214 47.6184C38.4213 47.6184 38.2211 47.5901 38.021 47.5335C36.8247 47.1894 36.1197 45.9073 36.4518 44.6629L38.2666 37.8751C38.5987 36.6354 39.8404 35.9048 41.0367 36.2489C42.233 36.593 42.938 37.8751 42.606 39.1195L40.7911 45.9073C40.5136 46.9396 39.6085 47.6184 38.626 47.6184H38.6214Z" fill="white"/>
+<path d="M30.7797 76.028C30.6615 76.028 30.5387 76.0091 30.4204 75.9761C29.7017 75.7687 29.2787 75.0004 29.4789 74.2556L31.2937 67.4679C31.4939 66.7231 32.2353 66.2894 32.954 66.4921C33.6726 66.6995 34.0956 67.4679 33.8955 68.2126L32.0806 75.0004C31.9169 75.6179 31.3711 76.028 30.7797 76.028Z" fill="white"/>
+<path d="M45.4308 51.4978C45.1942 51.4978 44.9668 51.3705 44.844 51.1443C44.6621 50.8096 44.7758 50.3806 45.0987 50.1921L51.0164 46.7181C51.3393 46.5295 51.7533 46.6474 51.9352 46.982C52.1171 47.3167 52.0034 47.7457 51.6805 47.9342L45.7628 51.4082C45.6582 51.4695 45.5445 51.4978 45.4308 51.4978Z" fill="white"/>
+<path d="M19.8678 67.4302C19.3175 67.4302 18.7853 67.1332 18.4942 66.6005C18.0666 65.8181 18.3304 64.8188 19.09 64.3757L25.0077 60.9017C25.7628 60.4586 26.7271 60.732 27.1546 61.5192C27.5822 62.3016 27.3184 63.3009 26.5588 63.744L20.6411 67.218C20.3955 67.3642 20.1317 67.4302 19.8678 67.4302Z" fill="white"/>
+<path d="M53.0404 62.4996C52.9631 62.4996 52.8812 62.4902 52.7993 62.4666L46.2494 60.5858C45.7718 60.4491 45.4898 59.9353 45.6217 59.4404C45.7536 58.9455 46.2494 58.6532 46.727 58.7899L53.2769 60.6707C53.7545 60.8074 54.0365 61.3212 53.9046 61.8161C53.7955 62.2309 53.4316 62.4996 53.0359 62.4996H53.0404Z" fill="white"/>
+<path d="M24.7257 55.3065C24.5665 55.3065 24.4073 55.2829 24.2435 55.2405L17.6936 53.3597C16.7338 53.0863 16.1744 52.0587 16.4382 51.0641C16.702 50.0695 17.6936 49.4897 18.6533 49.7631L25.2033 51.6439C26.163 51.9173 26.7225 52.9449 26.4587 53.9395C26.2358 54.7644 25.5126 55.3065 24.7257 55.3065Z" fill="white"/>
+<path d="M44.5211 74.0388C44.1299 74.0388 43.7478 73.8267 43.5431 73.4496L40.1908 67.317C39.8861 66.7561 40.0771 66.0443 40.6139 65.7285C41.1551 65.4127 41.842 65.6107 42.1467 66.1669L45.499 72.2994C45.8038 72.8604 45.6127 73.5721 45.076 73.888C44.8986 73.9917 44.7121 74.0388 44.5211 74.0388Z" fill="white"/>
+<path d="M30.0475 48.481C29.3425 48.481 28.6556 48.0992 28.2827 47.4157L24.9304 41.2831C24.38 40.2744 24.7211 38.9923 25.6945 38.4219C26.6679 37.8515 27.9051 38.2051 28.4555 39.2138L31.8078 45.3464C32.3582 46.3551 32.017 47.6372 31.0436 48.2076C30.7298 48.3914 30.3841 48.481 30.0475 48.481Z" fill="white"/>
+<path d="M63.5748 61.1373L59.6721 60.9912L61.5643 65.6955C61.5643 65.6955 64.9166 65.0544 64.7847 63.1737L63.5793 61.1326L63.5748 61.1373Z" fill="#FFB573"/>
+<path d="M57.0568 62.9333L57.9938 66.5298L61.5598 65.6955L59.6676 60.9912L57.0568 62.9333Z" fill="#FFB573"/>
+</g>
+<defs>
+<clipPath id="clip0_1_1028">
+<rect width="80" height="157" fill="white" transform="translate(0.5 0.5)"/>
+</clipPath>
+</defs>
+</svg>

src/assets/main.scss

@@ -30,19 +30,21 @@ h5 {
   --black-pale: #1b1a17;
   --red: #f70000;
   --red-pale: #ff726f;
-  --grey: #e6e6e6;
+  --grey: #f5f5f5;
   --grey-pale: #cfd2cf;
   --grey-semi-dark: #808080;
-  --grey-dark: #54595e;
-  --blue: #4945ff;
-  --blue-dark: #051f61;
+  --grey-dark: #3e3e3e;
+  --blue-dark: #0a1f69;
+  --blue: #2954e9;
+  --blue-semi-pale: #f2f5ff;
+  --blue-pale: #f2f5ff;
+  --blue-very-pale: #f9faff;
   --blue-geovisio: #34495e;
-  --blue-semi: rgba(207, 226, 255, 0.5);
-  --blue-pale: #f9fafd;
   --beige: #f5f3ec;
   --yellow: #fec868;
   --orange: #ff6f00;
-  --green: #59ce8f;
+  --orange-pale: #fffafa;
+  --green: #7ec636;
   --green-pale: #f0ffee;
 }
 
@@ -52,13 +54,3 @@ h5 {
     place-items: center;
   }
 }
-@media (max-width: toRem(50)) {
-  @supports (-webkit-touch-callout: none) {
-    /* CSS specific to iOS devices */
-    body {
-      min-height: -webkit-fill-available;
-      min-height: moz-available;
-      min-height: fill-available;
-    }
-  }
-}

src/components-viewer/reportLink.ts

@@ -1,3 +1,45 @@
 export function createLink(href: string, text: string): string {
-  return `<a href='mailto:signalement.ign@panoramax.fr${href}' target='_blank' title='${text}' class='gvs-btn gvs-widget-bg gvs-btn-large' style='font-size: 1.6em;display: block'><i class="bi bi-exclamation-triangle"></i></a>`
+  return `<a href='mailto:signalement.ign@panoramax.fr${href}' target='_blank' title='${text}' class='gvs-btn gvs-widget-bg gvs-btn-large' style='font-size: 1.6em;display: block; margin-top: 0.5em;'><i class="bi bi-exclamation-triangle"></i></a>`
+}
+export function createSequenceLink(href: string, title: string): string {
+  return `<a href='${href}' title='${title}' class='gvs-btn gvs-widget-bg gvs-btn-large' style='font-size: 1.6em;display: block; position: relative; margin-top: 0.5em;'>
+            <i class="bi bi-images"></i>
+          </a>`
+}
+export function createFullScreenButton(): string {
+  return `<button type='button' onClick="
+                                  const header = document.getElementById('navHeader')
+                                  const footer = document.getElementById('navFooter')
+                                  const icon = document.getElementById('iconScreen')
+                                  const home = document.getElementById('homePage')
+                                  if (header) {
+                                    const isHiddenHeader = header.classList.contains('hidden')
+                                    if (isHiddenHeader) header.classList.remove('hidden')
+                                    else header.classList.add('hidden')
+                                  }
+                                  if (footer) {
+                                    const isHiddenHeader = footer.classList.contains('hidden')
+                                    if (isHiddenHeader) footer.classList.remove('hidden')
+                                    else footer.classList.add('hidden')
+                                  }
+                                  if (icon) {
+                                    const isIconNotFull = icon.classList.contains('bi-fullscreen')
+                                    if(isIconNotFull) {
+                                      icon.classList.remove('bi-fullscreen')
+                                      icon.classList.add('bi-fullscreen-exit') 
+                                    } else {
+                                      icon.classList.remove('bi-fullscreen-exit')
+                                      icon.classList.add('bi-fullscreen')
+                                    }
+                                  }
+                                  if (home) {
+                                    const isHomeFull = home.classList.contains('full-viewer')
+                                    if(isHomeFull) home.classList.remove('full-viewer')
+                                    else home.classList.add('full-viewer')
+                                  }
+                                  "
+                                  class='gvs-btn gvs-widget-bg gvs-btn-large'
+          >
+            <i id='iconScreen' class="bi bi-fullscreen"></i>
+          </button>`
 }

src/components/BetaText.vue

@@ -1,44 +0,0 @@
-<template>
-  <p class="instance-beta">
-    {{ title($t('general.header.title')) }}
-    <span class="beta">{{ $t('general.header.beta_text') }}</span>
-  </p>
-</template>
-
-<script lang="ts" setup>
-import { title } from '@/utils/index'
-</script>
-
-<style lang="scss" scoped>
-.beta {
-  @include text(xs-r-regular);
-  color: var(--red);
-  border: toRem(0.1) solid var(--red);
-  border-radius: toRem(0.5);
-  padding: toRem(0.2) toRem(0.3);
-  margin-left: toRem(0.5);
-  position: absolute;
-  top: toRem(-1);
-  right: toRem(-9.5);
-  width: toRem(9);
-  display: flex;
-  justify-content: center;
-}
-
-@media (max-width: toRem(76.8)) {
-  .instance-beta {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background-color: var(--grey);
-    padding: toRem(1);
-    margin-bottom: 0;
-  }
-  .beta {
-    position: relative;
-    top: initial;
-    right: initial;
-    margin-left: toRem(1);
-  }
-}
-</style>

src/components/Button.vue

@@ -35,7 +35,7 @@ defineProps({
   }
 }
 .default {
-  height: toRem(3.5);
+  height: toRem(3);
   min-width: toRem(3.5);
   @include text(s-regular);
   display: flex;
@@ -45,8 +45,9 @@ defineProps({
   background-color: transparent;
   position: relative;
   z-index: 1;
-  border-radius: toRem(0.5);
-  padding: toRem(1.3) toRem(2) toRem(1.3);
+  border-radius: toRem(1);
+  padding: toRem(1.3);
+
   .icon {
     font-size: toRem(2);
   }
@@ -54,13 +55,34 @@ defineProps({
     visibility: visible;
   }
 }
+.row-reverse {
+  flex-direction: row-reverse;
+  justify-content: flex-start;
+  width: 100%;
+  padding: 0;
+  font-size: toRem(1.2);
+  .icon {
+    margin-left: toRem(0.5);
+    margin-right: 0;
+  }
+}
 .button--black {
   color: var(--white);
   background-color: var(--black);
 }
+.button-border--black {
+  font-size: toRem(1.4);
+  background-color: var(--white);
+  border: toRem(0.1) solid var(--black);
+  .icon {
+    font-size: toRem(1.4);
+    color: var(--black);
+  }
+}
 .button--blue {
   color: var(--white);
   background-color: var(--blue);
+  height: toRem(4);
   &.disabled {
     opacity: 0.6;
     color: var(--white);
@@ -74,29 +96,37 @@ defineProps({
   color: var(--white);
 }
 .button--red {
-  color: var(--red);
-  background-color: var(--white);
-  border: toRem(0.1) solid var(--red);
+  color: var(--white);
+  background-color: var(--red-pale);
+  border: toRem(0.1) solid var(--red-pale);
   .icon {
     margin-right: 0;
     font-size: toRem(1.4);
-    color: var(--red);
+    color: var(--white);
   }
   .text {
     margin-left: toRem(1);
   }
+  &.background-white {
+    color: var(--red-pale);
+    .icon {
+      color: var(--red-pale);
+    }
+    &.disabled {
+      .icon {
+        color: var(--grey-pale);
+      }
+    }
+  }
 }
 .button--white {
-  color: var(--black);
+  color: var(--blue);
   background-color: var(--white);
-  border: toRem(0.1) solid var(--black);
+  border: toRem(0.1) solid var(--blue);
   .icon {
     font-size: toRem(1.4);
-    color: var(--black);
-    margin-right: 0;
-  }
-  .text {
-    margin-left: toRem(1);
+    color: var(--blue);
+    margin-right: toRem(1);
   }
 }
 .no-text {
@@ -104,11 +134,36 @@ defineProps({
   width: toRem(3);
   padding: 0;
   .icon {
-    color: var(---black);
     font-size: toRem(1.8);
     margin-right: 0;
   }
 }
+.no-text-white .icon {
+  color: var(--white);
+  margin-right: 0;
+  font-size: toRem(1.4);
+}
+.no-text-blue-dark .icon {
+  color: var(--blue-dark);
+  margin-right: 0;
+  font-size: toRem(1.4);
+}
+.no-text-blue .icon {
+  color: var(--blue);
+  margin-right: 0;
+  font-size: toRem(1.6);
+}
+.background-white {
+  background-color: var(--white);
+}
+.link--blue {
+  color: var(--blue);
+  text-decoration: underline;
+  .icon {
+    font-size: toRem(1.4);
+    color: var(--blue);
+  }
+}
 .link--grey {
   color: var(--grey-semi-dark);
   .icon {
@@ -116,12 +171,20 @@ defineProps({
     color: var(--grey-semi-dark);
   }
 }
-.link--red {
-  color: var(--red);
-  background-color: var(--white);
+.link--black {
+  color: var(--black);
+  text-decoration: underline;
   .icon {
     font-size: toRem(1.4);
-    color: var(--red);
+    color: var(--black);
+  }
+}
+.link--red {
+  color: var(--red-pale);
+  text-decoration: underline;
+  .icon {
+    font-size: toRem(1.4);
+    color: var(--red-pale);
   }
 }
 
@@ -136,8 +199,10 @@ defineProps({
   align-items: center;
   border-radius: 50%;
   padding: 0;
-  height: toRem(2.5);
-  width: toRem(2.5);
+  height: toRem(4);
+  width: toRem(4);
+  background-color: var(--white);
+  border: toRem(0.1) solid var(--grey-pale);
   .icon {
     color: var(---black);
     font-size: toRem(1.8);
@@ -153,8 +218,9 @@ defineProps({
   position: absolute;
   bottom: -100%;
   visibility: hidden;
-  width: toRem(18);
+  width: toRem(20);
   right: 0;
+  z-index: 9;
   @include text(xss-regular);
 }
 

src/components/EditText.vue

@@ -0,0 +1,150 @@
+<template>
+  <div :class="['entry-edit', { 'edit-mode': isEditTitle }]">
+    <span v-if="isEditTitle && formTitle" class="form-title">{{
+      formTitle
+    }}</span>
+    <div class="entry-form">
+      <form
+        v-if="isEditTitle && !isDisabled"
+        @submit.prevent="isEditTitle = false"
+        class="edit-form"
+      >
+        <div class="wrapper-input">
+          <Input
+            id="upload-title"
+            :text="text || ''"
+            :placeholder="$t('pages.upload.edit_placeholder_input')"
+            @input="changeTextValue"
+          />
+        </div>
+        <Button
+          id="valid-button"
+          :text="$t('pages.upload.ok_button')"
+          type="submit"
+          look="button--white"
+          @trigger="validNewName"
+        />
+        <div class="close-button">
+          <Button
+            id="close-button"
+            look="no-text-blue-dark"
+            icon="bi bi-x-lg"
+            @trigger="closeEdition"
+          />
+        </div>
+      </form>
+      <span v-else class="title">{{ text }}</span>
+      <div v-if="!isEditTitle" class="edit-button">
+        <Button
+          :text="$t('pages.upload.edit_title')"
+          look="link--black row-reverse"
+          icon="bi bi-pen"
+          :disabled="isDisabled"
+          @trigger="goToEditMode"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { ref, computed } from 'vue'
+import Button from '@/components/Button.vue'
+import Input from '@/components/Input.vue'
+
+const emit = defineEmits<{
+  (e: 'triggerNewText', value: string | null): void
+}>()
+const props = defineProps({
+  defaultText: { type: String, default: null },
+  isLoading: { type: Boolean, default: false },
+  isLoaded: { type: Boolean, default: false },
+  formTitle: { type: String, default: null }
+})
+let titleToEdit = ref<string | null>(null)
+let isEditTitle = ref<boolean>(false)
+
+function changeTextValue(value: string): void {
+  titleToEdit.value = value
+}
+function closeEdition(): void {
+  isEditTitle.value = false
+  titleToEdit.value = null
+}
+function validNewName(): void {
+  emit('triggerNewText', titleToEdit.value)
+  isEditTitle.value = false
+}
+function goToEditMode(): void {
+  isEditTitle.value = true
+  titleToEdit.value = props.defaultText
+}
+
+const text = computed<string | null>(() => {
+  if (isEditTitle.value) return titleToEdit.value
+  if (props.defaultText) return props.defaultText
+  return null
+})
+
+const isDisabled = computed<boolean>(() => props.isLoading && !props.isLoaded)
+</script>
+
+<style scoped lang="scss">
+.title {
+  color: var(--blue-dark);
+  text-align: left;
+}
+.form-title {
+  text-align: left;
+  width: 100%;
+  @include text(xs-r-regular);
+  margin-bottom: toRem(0.3);
+}
+.entry-edit {
+  display: flex;
+  flex-direction: column;
+  position: relative;
+}
+.entry-form {
+  display: flex;
+  align-items: center;
+}
+.edit-mode {
+  background-color: var(--blue-very-pale);
+  padding: toRem(1);
+  border-radius: toRem(0.4);
+  width: 100%;
+}
+.wrapper-edit {
+  display: flex;
+  align-items: center;
+  margin-bottom: toRem(1);
+  width: 100%;
+}
+.edit-button {
+  min-width: toRem(11);
+  margin-left: toRem(1);
+  z-index: 2;
+}
+.wrapper-input {
+  position: relative;
+  margin-right: toRem(1.5);
+  width: 100%;
+}
+.edit-form {
+  width: 100%;
+  display: flex;
+  align-items: center;
+}
+.close-button {
+  position: absolute;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: toRem(2);
+  width: toRem(2);
+  top: toRem(0.5);
+  right: toRem(0.5);
+  border-radius: toRem(0.5);
+}
+</style>

src/components/Footer.vue

@@ -1,104 +1,56 @@
 <template>
-  <footer class="footer">
-    <div class="wrapper-footer">
-      <div class="wrapper-section">
-        <h3 class="title">{{ $t('general.footer.panoramax_title') }}</h3>
-        <ul class="link-list">
-          <li class="link">
-            <Link
-              :text="$t('general.footer.panoramax_site')"
-              type="external"
-              path-external="https://panoramax.fr/"
-              look="link"
-            />
-          </li>
-          <li class="link">
-            <Link
-              :text="$t('general.footer.panoramax_faq')"
-              type="external"
-              path-external="https://panoramax.fr/foire-aux-questions"
-              look="link"
-            />
-          </li>
-        </ul>
-      </div>
-      <div class="wrapper-section">
-        <h3 class="title">{{ $t('general.footer.information_title') }}</h3>
-        <ul class="link-list">
-          <li class="link">
-            <Link
-              :text="$t('general.footer.information_forum')"
-              type="external"
-              path-external="https://forum.geocommuns.fr/c/panoramax/6"
-              look="link"
-            />
-          </li>
-          <li class="link">
-            <Link
-              :text="$t('general.footer.information_gitlab')"
-              type="external"
-              path-external="https://gitlab.com/geovisio"
-              look="link"
-            />
-          </li>
-          <li class="link">
-            <Link
-              :text="$t('general.footer.information_github')"
-              type="external"
-              path-external="https://github.com/panoramax-project/"
-              look="link"
-            />
-          </li>
-        </ul>
-      </div>
-      <div class="wrapper-section">
-        <h3 class="title">{{ $t('general.footer.rs_title') }}</h3>
-        <ul class="logo-list">
-          <li class="logo">
-            <Link
-              :image="{
-                url: 'mastodon.svg',
-                alt: $t('general.footer.mastodon_alt')
-              }"
-              type="external"
-              path-external="https://mapstodon.space/@panoramax"
-            />
-          </li>
-          <li class="logo">
-            <Link
-              :image="{
-                url: 'linkedin.svg',
-                alt: $t('general.footer.linkedin_alt')
-              }"
-              type="external"
-              path-external="https://github.com/panoramax-project/"
-            />
-          </li>
-          <li>
-            <Link
-              :image="{
-                url: 'x.svg',
-                alt: $t('general.footer.twitter_alt')
-              }"
-              type="external"
-              path-external="https://twitter.com/panoramax_"
-            />
-          </li>
-        </ul>
-      </div>
-    </div>
-    <div class="ay11-text">
-      <Link
-        :text="$t('general.footer.ay11_text')"
-        :route="{ name: 'ay11' }"
-        look="link"
-      />
-    </div>
+  <footer id="navFooter" class="footer">
+    <ul class="link-list">
+      <li class="link-item">
+        <div class="link">
+          <Link
+            :text="$t('general.footer.panoramax_site')"
+            type="external"
+            target="_blank"
+            path-external="https://panoramax.fr/"
+            look="link"
+            :image="{
+              url: 'logo.jpeg',
+              alt: $t('general.footer.gitlab_logo')
+            }"
+          />
+        </div>
+      </li>
+      <li class="link-item">
+        <div class="link">
+          <Link
+            :text="$t('general.footer.information_gitlab')"
+            type="external"
+            target="_blank"
+            path-external="https://gitlab.com/geovisio"
+            look="link"
+            :image="{
+              url: 'gitlab-logo.svg',
+              alt: $t('general.footer.gitlab_logo')
+            }"
+          />
+        </div>
+      </li>
+      <li v-if="isInstanceIGN" class="link-item">
+        <div class="link">
+          <Link
+            :text="$t('general.footer.ay11_text')"
+            :route="{ name: 'ay11' }"
+            look="link link--grey"
+          />
+        </div>
+      </li>
+    </ul>
   </footer>
 </template>
 
 <script setup lang="ts">
 import Link from './Link.vue'
+import { computed } from 'vue'
+
+const isInstanceIGN = computed((): boolean =>
+  window.location.href.includes('.ign.')
+)
 </script>
 
 <style scoped lang="scss">
@@ -107,54 +59,64 @@ ul {
   margin: 0;
 }
 .footer {
-  padding: toRem(2);
+  padding: toRem(1.5) toRem(3);
   border-top: toRem(0.1) solid var(--grey);
 }
-.wrapper-footer {
-  display: flex;
-}
-.wrapper-section {
-  width: 33%;
-  display: flex;
-  flex-direction: column;
-}
-.title {
-  @include text(m-regular);
-  color: var(--blue);
-  margin-bottom: toRem(1.5);
+.hidden {
+  display: none;
 }
 .link-list {
   display: flex;
-  flex-direction: column;
-  align-items: initial;
+  justify-content: center;
+  width: 100%;
 }
 .logo-list {
   display: flex;
   align-items: center;
 }
+
+.link-item {
+  width: fit-content;
+  margin-right: toRem(2);
+  &:last-child {
+    margin-right: 0;
+  }
+}
 .link {
-  margin-bottom: toRem(0.3);
+  color: var(--blue-dark);
+  @include text(s-regular);
+  height: toRem(2);
   width: fit-content;
 }
 .logo {
   margin-right: toRem(2);
-  height: toRem(3);
+  height: toRem(2);
 }
-.ay11-text {
-  display: flex;
-  justify-content: center;
-  width: 100%;
+@media (max-width: toRem(76.8)) {
+  .footer {
+    padding: toRem(1);
+    height: toRem(6.5);
+  }
+  .link-list {
+    flex-wrap: wrap;
+    align-items: center;
+    height: 100%;
+  }
+  .logo {
+    margin-right: toRem(0.5);
+    height: toRem(1.5);
+  }
+  .link-item {
+    margin-right: toRem(1);
+    margin-bottom: toRem(1);
+  }
+  .link {
+    height: toRem(1.5);
+  }
 }
 @media (max-width: toRem(50)) {
-  .footer {
-    padding: toRem(2);
-  }
-  .wrapper-footer {
-    flex-direction: column;
-  }
-  .ay11-text {
-    margin-top: toRem(2);
-    justify-content: initial;
+  .title {
+    margin-bottom: 0;
   }
 }
 </style>

src/components/Header.vue

@@ -1,15 +1,18 @@
 <template>
-  <header class="header">
-    <div class="responsive beta">
-      <beta-text />
+  <header id="navHeader" class="header">
+    <div class="responsive entry-instance">
+      <InstanceName />
     </div>
     <nav class="nav">
       <div class="wrapper-logo desktop">
         <Link
           :image="{ url: 'logo.jpeg', alt: $t('general.header.alt_logo') }"
-          :text="title($t('general.header.title'))"
           :route="{ name: 'home' }"
-        />
+        >
+          <template v-slot:content>
+            <InstanceName />
+          </template>
+        </Link>
       </div>
       <div class="wrapper-logo responsive">
         <Link
@@ -21,80 +24,94 @@
         />
       </div>
       <div ref="list" class="wrapper-entries">
-        <ul
+        <HeaderOpen
           v-if="isLogged && authEnabled"
-          :class="['nav-list', { 'menu-open': !menuIsClosed }]"
-        >
-          <li class="logged-link">
-            <Link
-              :text="$t('general.header.sequences_text')"
-              icon="bi bi-images"
-              :route="{ name: 'my-sequences' }"
-              @click.native="closeModal"
-            />
-          </li>
-          <li v-if="userProfileUrl.length" class="logged-link">
-            <Link
-              :route="{ name: 'my-information' }"
-              icon="bi bi-person"
-              :text="$t('general.header.my_information_text')"
-              @click.native="closeModal"
-            />
-          </li>
-          <li class="logged-link">
-            <Link
-              :route="{ name: 'my-settings' }"
-              icon="bi bi-gear"
-              :text="$t('general.header.my_settings_text')"
-              @click.native="closeModal"
-            />
-          </li>
-          <li class="logged-link">
-            <Link
-              type="external"
-              icon="bi bi-power"
-              :text="$t('general.header.logout_text')"
-              :path-external="getAuthRoute('auth/logout', route.path)"
-              @click.native="closeModal"
-            />
-          </li>
-        </ul>
+          :menu-is-closed="menuIsClosed"
+          :user-profile-url-length="userProfileUrl.length"
+          @triggerClose="closeModal"
+        />
         <div class="wrapper-right-entries">
-          <div v-if="isLogged && authEnabled">
+          <div>
             <Link
-              :text="$t('general.header.upload_text')"
-              look="button button--blue"
-              :route="{ name: 'upload-pictures' }"
+              :text="$t('general.header.viewer')"
+              :route="{ name: 'home' }"
+              look="link--blue"
+              class="desktop"
               @click.native="closeModal"
             />
           </div>
           <div>
             <Link
+              v-if="isLogged"
+              :text="$t('general.header.sequences_text')"
+              :route="{ name: 'my-sequences' }"
+              look="link--blue"
+              class="desktop"
+              @click.native="closeModal"
+            />
+            <Link
+              v-else
               :text="$t('general.header.contribute_text')"
-              :route="{ name: 'share-pictures' }"
+              :route="{ name: 'why-contribute' }"
+              look="link--blue"
               @click.native="closeModal"
             />
           </div>
-          <button
-            v-if="isLogged && authEnabled"
-            class="menu-burger"
-            :aria-label="ariaLabel"
-            @click="toggleMenu"
-          >
-            <div v-if="isLogged" class="item-with-sub">
-              <span>{{ userName }}</span>
-            </div>
-            <div v-else>
-              <i v-if="!menuIsClosed" class="cross bi bi-x-lg"></i>
-              <i v-else class="bi bi-list"></i>
-            </div>
-          </button>
-          <div v-else-if="!isLogged && authEnabled">
+          <div v-if="isLogged && authEnabled" class="link-upload">
             <Link
-              type="external"
-              icon="bi bi-person-circle"
-              :path-external="getAuthRoute('auth/login', route.path)"
+              :text="$t('general.header.upload_text')"
+              look="button button--blue"
+              :route="{ name: 'upload-pictures' }"
+              class="desktop"
+              @click.native="closeModal"
             />
+            <Link
+              data-test="link-logged-upload"
+              look="button button--blue"
+              icon="bi bi-plus-lg"
+              :route="{ name: 'upload-pictures' }"
+              class="responsive"
+              @click.native="closeModal"
+            />
+          </div>
+          <AccountButton
+            v-if="isLogged && authEnabled"
+            :aria-label="ariaLabel"
+            :is-logged="isLogged"
+            :user-name="userName"
+            :menu-is-closed="menuIsClosed"
+            @triggerToggleMenu="toggleMenu"
+          />
+          <div
+            v-else-if="!isLogged && authEnabled"
+            class="button-login-responsive"
+          >
+            <div class="desktop" data-test="button-login-desktop">
+              <Link
+                type="external"
+                :path-external="getAuthRoute('auth/login', route.path)"
+              >
+                <template v-slot:content>
+                  <span class="login-text">{{
+                    $t('general.header.login_text')
+                  }}</span>
+                  <span class="register-text">{{
+                    $t('general.header.register_text')
+                  }}</span>
+                </template>
+              </Link>
+            </div>
+            <div class="responsive" data-test="button-login-responsive">
+              <Link
+                type="external"
+                icon="bi bi-person-circle"
+                look="link--blue-dark"
+                :path-external="getAuthRoute('auth/login', route.path)"
+              />
+            </div>
+          </div>
+          <div class="entry-lang-switcher">
+            <LangSwitcher />
           </div>
         </div>
       </div>
@@ -105,15 +122,16 @@
 <script lang="ts" setup>
 import { ref, computed } from 'vue'
 import { onClickOutside } from '@vueuse/core'
-import { useCookies } from 'vue3-cookies'
 import { useRoute } from 'vue-router'
 import { useI18n } from 'vue-i18n'
-import { getAuthRoute } from '@/utils/auth'
-import { title } from '@/utils/index'
+import { getAuthRoute, hasASessionCookieDecoded } from '@/utils/auth'
+import { isAuth } from '../composables/auth'
 import Link from '@/components/Link.vue'
-import BetaText from '@/components/BetaText.vue'
-
-const { cookies } = useCookies()
+import InstanceName from '@/components/InstanceName.vue'
+import HeaderOpen from '@/components/header/HeaderOpen.vue'
+import AccountButton from '@/components/header/AccountButton.vue'
+import LangSwitcher from '@/components/header/LangSwitcher.vue'
+const { isLogged } = isAuth()
 const { t } = useI18n()
 const route = useRoute()
 defineProps({
@@ -125,41 +143,46 @@ let menuIsClosed = ref<boolean>(true)
 
 onClickOutside(list, () => closeModal())
 
-function closeModal() {
+function closeModal(): void {
   menuIsClosed.value = true
 }
-
 function toggleMenu(): void {
   menuIsClosed.value = !menuIsClosed.value
 }
-const isLogged = computed((): boolean => !!cookies.get('user_id'))
 const ariaLabel = computed((): string =>
   menuIsClosed.value
     ? t('general.header.burger_menu_aria_label_open')
     : t('general.header.burger_menu_aria_label_closed')
 )
-const userName = computed((): string =>
-  cookies!
-    .get('user_name')
-    .match(/\b(\w)/g)!
-    .join('')
-    .toUpperCase()
-)
+const userName = computed((): string => {
+  const cookie = hasASessionCookieDecoded()
+  if (cookie && cookie.account) {
+    return cookie.account.name
+      .match(/\b(\w)/g)!
+      .join('')
+      .toUpperCase()
+  }
+  return ''
+})
 </script>
 
 <style lang="scss" scoped>
 .header {
   display: flex;
   align-items: center;
-  height: toRem(8);
-  background-color: var(--blue-pale);
+  min-height: toRem(8);
+  background-color: var(--white);
+  border-bottom: toRem(0.1) solid var(--grey-pale);
+}
+.hidden {
+  display: none;
 }
 .nav {
   width: 100%;
-  padding-right: toRem(2);
-  padding-left: toRem(2);
   display: flex;
   justify-content: space-between;
+  align-items: center;
+  padding: toRem(1.5) toRem(3);
 }
 .wrapper-logo {
   display: flex;
@@ -173,43 +196,7 @@ const userName = computed((): string =>
   display: none;
 }
 .desktop {
-  display: block;
-}
-.wrapper-logo p {
-  @include text(m-r-regular);
-  margin-bottom: 0;
-  margin-left: toRem(1);
-  position: relative;
-}
-.item-with-sub {
-  position: relative;
   display: flex;
-  align-items: center;
-}
-.item-with-sub:hover .sub-nav-block {
-  display: block;
-}
-.sub-nav-block {
-  display: none;
-  border-radius: toRem(0.5);
-  border: toRem(0.1) solid var(--black);
-  background-color: var(--white);
-  position: absolute;
-  right: 0;
-  top: toRem(3.5);
-  z-index: 1;
-  width: toRem(15);
-}
-.logged-link {
-  display: flex;
-  padding: toRem(0.5) toRem(2) toRem(0.7);
-}
-.logged-link:hover {
-  border-radius: toRem(0.5);
-  background-color: var(--grey);
-}
-.nav-list-item {
-  margin-right: toRem(1.5);
 }
 .wrapper-right-entries {
   display: flex;
@@ -217,70 +204,55 @@ const userName = computed((): string =>
   div {
     margin-right: toRem(2);
   }
-}
-.cross {
-  font-size: toRem(2);
-}
-.item-with-sub {
-  margin-right: toRem(1.5);
-}
-.nav {
-  align-items: center;
-  padding: toRem(1.5);
-}
-.nav-list {
-  display: none;
-  flex-direction: column;
-  justify-content: center;
-  align-items: initial;
-  position: absolute;
-  width: toRem(20);
-  top: toRem(8);
-  right: 0;
-  z-index: 2;
-  background-color: var(--white);
-  box-shadow: 0 toRem(0.2) toRem(0.4) rgb(0 0 0 / 10%);
-  padding-left: 0;
-  padding-top: toRem(1);
-  padding-bottom: toRem(1);
-  border-radius: toRem(1);
-}
-.menu-burger {
-  display: block;
-  background-color: transparent;
-  border: none;
-  width: toRem(2.5);
-  font-size: toRem(2.5);
-  padding: 0;
-  .item-with-sub {
-    @include text(s-regular);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    background-color: var(--blue);
-    color: var(--white);
-    height: toRem(3);
-    width: toRem(3);
-    border-radius: 50%;
+  div:last-child {
     margin-right: 0;
   }
 }
-.menu-open {
-  display: flex;
+.link-upload {
+  margin-right: toRem(2);
 }
-@media (max-width: toRem(50)) {
+.login-text {
+  color: var(--blue-dark);
+  border-right: toRem(0.1) solid var(--blue-dark);
+  padding-right: toRem(0.5);
+}
+.register-text {
+  padding-left: toRem(0.5);
+  color: var(--blue);
+}
+.entry-lang-switcher {
+  margin-left: toRem(2);
+}
+@media (max-width: toRem(102.4)) {
+  .nav {
+    padding-right: toRem(2);
+    padding-left: toRem(2);
+  }
+  .wrapper-right-entries {
+    div {
+      margin-right: toRem(1.5);
+    }
+  }
+}
+@media (max-width: toRem(84.8)) {
+  .nav {
+    padding-right: toRem(2);
+    padding-left: toRem(2);
+  }
   .header {
     flex-direction: column;
-    height: toRem(11);
+    min-height: toRem(10);
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     z-index: 4;
   }
-  .nav-list {
-    top: toRem(11);
+  .entry-instance {
+    background-color: var(--blue-pale);
     width: 100%;
+    display: flex;
+    justify-content: center;
   }
   .desktop {
     display: none;
@@ -288,11 +260,8 @@ const userName = computed((): string =>
   .responsive {
     display: flex;
   }
-  .beta {
-    width: 100%;
-    .instance-beta {
-      width: 100%;
-    }
+  .wrapper-right-entries .button-login-responsive {
+    margin-right: toRem(-1);
   }
 }
 </style>

src/components/ImageItem.vue

@@ -2,7 +2,7 @@
   <div :class="status">
     <div class="wrapper-image">
       <button
-        :class="[{ selected }, 'button-image-item']"
+        :class="[{ selected: selectedOnMap }, 'button-image-item']"
         :disabled="status === 'waiting-for-process'"
         type="button"
         @click="$emit('trigger')"
@@ -14,9 +14,9 @@
           <i v-if="status === 'hidden'" class="bi bi-eye-slash icon-hidden"></i>
           <img
             v-if="href"
+            loading="lazy"
             :src="href"
             alt=""
-            loading="lazy"
             class="photo-img"
           />
         </div>
@@ -33,18 +33,8 @@
             $t('pages.sequence.waiting_process')
           }}</span>
         </div>
-        <div
-          v-if="selectedOnMap && !selected"
-          class="icon-img pointer-map"
-        ></div>
-        <div v-if="selected && !selectedOnMap" class="icon-img button-check">
-          <i class="bi bi-check-lg" />
-        </div>
-        <div
-          v-if="selected && selectedOnMap"
-          class="icon-img button-check-pointer"
-        >
-          <i class="bi bi-check-lg" />
+        <div v-if="selectedOnMap" class="pointer-map">
+          <img src="@/assets/images/logo-geovisio.svg" alt="" />
         </div>
         <div
           v-if="status.length && (status === 'ready' || status === 'hidden')"
@@ -64,6 +54,9 @@
           </div>
         </div>
       </button>
+      <div class="geovisio-pointer">
+        <slot name="checkbox"></slot>
+      </div>
     </div>
   </div>
 </template>
@@ -75,7 +68,6 @@ defineProps({
   created: { type: String, default: null },
   href: { type: String, default: null },
   hrefHd: { type: String, default: null },
-  selected: { type: Boolean, default: false },
   selectedOnMap: { type: Boolean, default: false },
   status: {
     type: String,
@@ -95,12 +87,16 @@ defineProps({
   position: relative;
 }
 .selected {
-  border: toRem(0.1) solid var(--blue);
-  border-radius: toRem(0.5);
+  border: toRem(0.2) solid var(--blue);
+  border-radius: toRem(1.5);
   box-shadow: 0px 4px 4px 0px #00000040;
+  .photo-img-wrapper {
+    padding: toRem(0.2);
+  }
 }
 .wrapper-image {
   display: flex;
+  position: relative;
 }
 .photo-img-wrapper {
   display: flex;
@@ -115,7 +111,7 @@ defineProps({
 .photo-img {
   height: 100%;
   width: 100%;
-  border-radius: toRem(0.5);
+  border-radius: toRem(1.5);
 }
 .icon-hidden {
   color: var(--grey-dark);
@@ -141,13 +137,12 @@ defineProps({
 }
 .waiting-info {
   text-align: center;
-  width: 100%;
   color: var(--black);
   width: fit-content;
 }
 
 .info {
-  @include text(xs-r-regular);
+  @include text(xss-regular);
   padding: toRem(0.5) toRem(0.8);
   background-color: var(--white);
   border-radius: toRem(0.5);
@@ -165,9 +160,15 @@ defineProps({
   align-items: center;
   font-size: toRem(1.3);
 }
-.pointer-map,
-.button-check-pointer {
-  background-color: var(--orange);
+.geovisio-pointer {
+  position: absolute;
+  top: toRem(1.5);
+  right: toRem(1.5);
+}
+.pointer-map {
+  position: absolute;
+  top: toRem(1);
+  left: 0;
 }
 .delete-checked {
   opacity: 1;

src/components/InformationCard.vue

@@ -0,0 +1,75 @@
+<template>
+  <div :class="['information-block', look]">
+    <div class="wrapper-cross">
+      <slot name="cross"></slot>
+    </div>
+    <div>
+      <div class="icon-block">
+        <img
+          src="@/assets/images/icon/info-blue.svg"
+          alt=""
+          class="icon-block-img"
+        />
+        <slot name="title"></slot>
+      </div>
+      <p v-if="text" v-html="text" class="information-text"></p>
+    </div>
+    <slot name="button"></slot>
+  </div>
+</template>
+
+<script setup lang="ts">
+defineProps({
+  text: { type: String, default: null },
+  look: { type: String, default: '' }
+})
+</script>
+
+<style scoped lang="scss">
+h3 {
+  padding: 0;
+  margin: 0;
+}
+.information-block {
+  position: relative;
+  border-left: toRem(1.4) solid var(--blue);
+  padding: toRem(1.8) toRem(1.8) toRem(1.3);
+  background-color: var(--white);
+  border-radius: toRem(1.5);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-wrap: wrap;
+}
+.wrapper-cross {
+  position: absolute;
+  top: toRem(1);
+  right: toRem(1);
+}
+.blue {
+  background-color: var(--blue-pale);
+}
+.icon-block {
+  display: flex;
+  align-items: center;
+  margin-bottom: toRem(0.5);
+}
+.icon-block-img {
+  margin-right: toRem(0.5);
+  height: toRem(2);
+}
+.information-text {
+  margin-top: toRem(1);
+  @include text(m-r-regular);
+  white-space: pre-wrap;
+}
+@media (max-width: toRem(50)) {
+  .information-block {
+    border-left: toRem(1) solid var(--blue);
+  }
+  .icon-block {
+    flex-direction: column;
+    align-items: flex-start;
+  }
+}
+</style>

src/components/Input.vue

@@ -0,0 +1,39 @@
+<template>
+  <input
+    :value="text"
+    :required="true"
+    :placeholder="placeholder"
+    :type="type"
+    :min="min"
+    :max="max"
+    @input="emitValue"
+    class="input"
+  />
+</template>
+
+<script lang="ts" setup>
+const emit = defineEmits<{ (e: 'input', value: string): void }>()
+defineProps({
+  type: { type: String, default: 'text' },
+  min: { type: String, default: '' },
+  max: { type: String, default: '' },
+  text: { type: [String, Number], default: null },
+  placeholder: { type: String, default: '' }
+})
+
+function emitValue(event: Event): void {
+  const inputValue = (event.target as HTMLInputElement).value
+  emit('input', inputValue)
+}
+</script>
+
+<style scoped lang="scss">
+.input {
+  padding: toRem(0.5) toRem(1);
+  border-radius: toRem(0.5);
+  border: toRem(0.1) solid var(--blue-dark);
+  color: var(--blue-dark);
+  width: 100%;
+  @include text(s-r-regular);
+}
+</style>

src/components/InputCheckbox.vue

@@ -1,18 +1,18 @@
 <template>
-  <div class="wrapper-checkbox">
+  <div :class="['wrapper-checkbox', { checked: isChecked || isIndeterminate }]">
     <div class="input-checkbox">
       <i v-if="isChecked && !isIndeterminate" class="icon bi bi-check-square" />
       <i v-if="!isChecked && !isIndeterminate" class="icon bi bi-square" />
       <i v-if="isIndeterminate && !isChecked" class="icon bi bi-dash-square" />
       <input
-        id="checkbox"
+        :id="name"
         v-model="inputValue"
         type="checkbox"
         @input="updateValue(!inputValue)"
         class="input"
       />
     </div>
-    <label v-if="label && label.length" for="checkbox" class="label">{{
+    <label v-if="label && label.length" :for="name" class="label">{{
       label
     }}</label>
   </div>
@@ -35,6 +35,7 @@ watchEffect(async () => {
   if (htmlCheckbox) {
     htmlCheckbox.indeterminate = props.isIndeterminate
   }
+  inputValue.value = props.isChecked
 })
 
 function updateValue(value: boolean): void {
@@ -42,7 +43,11 @@ function updateValue(value: boolean): void {
     htmlCheckbox.indeterminate = false
   }
   inputValue.value = value
-  emit('trigger', { isChecked: value, isIndeterminate: false })
+  emit('trigger', {
+    isChecked: value,
+    isIndeterminate: false,
+    name: props.name
+  })
 }
 </script>
 
@@ -54,6 +59,8 @@ function updateValue(value: boolean): void {
   align-items: center;
   height: toRem(2);
   width: toRem(2);
+  background-color: var(--white);
+  border-radius: toRem(0.5);
 }
 .input {
   -webkit-appearance: none;
@@ -68,7 +75,7 @@ function updateValue(value: boolean): void {
 .icon {
   font-size: toRem(2);
   position: absolute;
-  color: var(--grey-semi-dark);
+  color: var(--blue);
 }
 .wrapper-checkbox {
   display: flex;
@@ -77,5 +84,14 @@ function updateValue(value: boolean): void {
 .label {
   cursor: pointer;
   margin-left: toRem(0.5);
+  @include text(s-r-regular);
+}
+.checked {
+  .input-checkbox {
+    background-color: var(--blue);
+  }
+  .icon {
+    color: var(--white);
+  }
 }
 </style>

src/components/InputRadio.vue

@@ -0,0 +1,36 @@
+<template>
+  <div class="input-radio">
+    <input
+      :id="id"
+      :name="name"
+      :value="id"
+      type="radio"
+      :checked="props.value === id"
+      @change="updateValue"
+      class="input"
+    />
+    <label v-if="label && label.length" :for="id" class="label">{{
+      label
+    }}</label>
+  </div>
+</template>
+
+<script lang="ts" setup>
+const emit = defineEmits<{ (e: 'trigger', value: string): void }>()
+const props = defineProps({
+  name: { type: String, default: null },
+  id: { type: String, default: '' },
+  label: { type: String, default: '' },
+  value: { type: String, default: null }
+})
+
+function updateValue(): void {
+  emit('trigger', props.id)
+}
+</script>
+
+<style lang="scss" scoped>
+.label {
+  margin-left: toRem(0.5);
+}
+</style>

src/components/InputSwitch.vue

@@ -0,0 +1,76 @@
+<template>
+  <label class="toggle">
+    <input
+      type="checkbox"
+      v-model="inputValue"
+      @input="updateValue(inputValue)"
+      class="input"
+    />
+    <div :class="['labels increase', { increaseChecked: !inputValue }]">
+      <span>{{ $t('pages.sequence.sort_panel_settings_order_increase') }}</span>
+      <i class="bi bi-sort-up"></i>
+    </div>
+    <div :class="['labels decrease', { decreaseChecked: inputValue }]">
+      <span>{{ $t('pages.sequence.sort_panel_settings_order_decrease') }}</span>
+      <i class="bi bi-sort-down"></i>
+    </div>
+  </label>
+</template>
+
+<script setup lang="ts">
+import { ref, watchEffect } from 'vue'
+const emit = defineEmits<{
+  (e: 'trigger', value: { isIncreaseChecked: boolean }): void
+}>()
+let inputValue = ref<boolean>(false)
+const props = defineProps({
+  increased: { type: Boolean, default: false }
+})
+watchEffect(() => {
+  inputValue.value = !props.increased
+})
+
+function updateValue(value: boolean): void {
+  inputValue.value = value
+  emit('trigger', { isIncreaseChecked: value })
+}
+</script>
+
+<style scoped lang="scss">
+.toggle {
+  position: relative;
+  width: 14.5rem;
+  background-color: var(--blue-very-pale);
+  padding: toRem(0.7);
+  border-radius: toRem(0.7);
+  height: toRem(4.5);
+  cursor: pointer;
+}
+.input {
+  width: 100%;
+  border: none;
+  appearance: none;
+}
+.labels {
+  position: absolute;
+  top: toRem(0.7);
+  @include text(s-r-regular);
+  padding: toRem(0.5) toRem(1);
+  color: var(--grey-semi-dark);
+  span {
+    margin-right: toRem(0.5);
+  }
+}
+.increase {
+  left: toRem(0.7);
+}
+.decrease {
+  right: toRem(0.7);
+}
+.increaseChecked,
+.decreaseChecked {
+  background-color: var(--blue-dark);
+  color: var(--white);
+  border-radius: toRem(0.7);
+}
+</style>

src/components/InputUpload.vue

@@ -9,9 +9,9 @@
       ref="upload"
       type="file"
       multiple
-      :accept="accept"
-      class="input-file"
       @change="changeFile"
+      @cancel="cancelUpload"
+      class="input-file"
     />
     <i class="bi bi-cloud-upload-fill"></i>
     <span v-if="text" class="input-text">
@@ -26,19 +26,24 @@
 
 <script lang="ts" setup>
 import { ref } from 'vue'
-const emit = defineEmits<{ (e: 'trigger', value: FileList): void }>()
+const emit = defineEmits<{
+  (e: 'trigger', value: FileList): void
+  (e: 'triggerCancel'): void
+}>()
 let isDragging = ref<boolean>(false)
 
 defineProps({
   text: { type: String, default: null },
   textPictureType: { type: String, default: null },
-  textSecondPart: { type: String, default: null },
-  accept: { type: String, default: '' }
+  textSecondPart: { type: String, default: null }
 })
 
 interface HTMLInputChangeEvent extends Event {
   target: HTMLInputElement & EventTarget
 }
+function cancelUpload(): void {
+  if (navigator.userAgent.includes('Android')) emit('triggerCancel')
+}
 function changeFile(event: Event): void {
   const { target } = event as HTMLInputChangeEvent
   if (target && target.files) {
@@ -59,8 +64,9 @@ function drop(event: DragEvent): void | boolean {
   event.preventDefault()
   const { dataTransfer } = event
   if (dataTransfer && dataTransfer.files) {
-    if (!checkPicturesType(dataTransfer.files))
+    if (!checkPicturesType(dataTransfer.files)) {
       return (isDragging.value = false)
+    }
     emit('trigger', dataTransfer.files)
     isDragging.value = false
   }
@@ -74,9 +80,6 @@ function checkPicturesType(files: FileList): number {
 
 <style scoped lang="scss">
 .file-upload {
-  border: toRem(0.1) dashed var(--blue);
-  background-color: var(--blue-semi);
-  border-radius: toRem(0.5);
   padding: toRem(0.3) toRem(0.3) toRem(3);
   display: flex;
   flex-direction: column;
@@ -102,16 +105,17 @@ function checkPicturesType(files: FileList): number {
 }
 .input-text {
   font-size: toRem(2);
-  @include text(m-regular);
-  font-weight: bold;
+  @include text(m-r-regular);
   width: toRem(21);
   text-align: center;
   margin-bottom: toRem(1);
+  font-weight: 590;
 }
 .input-text-type {
   @include text(xs-r-regular);
 }
 .last-word {
   color: var(--blue);
+  text-decoration: underline;
 }
 </style>

src/components/InstanceName.vue

@@ -0,0 +1,50 @@
+<template>
+  <div class="wrapper-instance">
+    <span class="panoramax-text">{{ $t('general.header.title') }}</span>
+    <span v-if="instanceName" class="instance-text">{{ instanceName }}</span>
+    <span class="beta-version">{{ $t('general.header.beta_text') }}</span>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { computed } from 'vue'
+import { getEnv } from '@/utils'
+const instanceName = computed((): string | null => {
+  const instanceName = getEnv('VITE_INSTANCE_NAME')
+  if (instanceName) return instanceName
+  return null
+})
+</script>
+
+<style lang="scss" scoped>
+.wrapper-instance {
+  padding: toRem(1) toRem(1) toRem(1) 0;
+  position: relative;
+}
+.panoramax-text,
+.instance-text {
+  @include text(h2);
+}
+.panoramax-text {
+  font-weight: bolder;
+  margin-right: toRem(0.7);
+}
+.instance-text {
+  padding-left: toRem(0.7);
+  border-left: toRem(0.1) solid var(--blue-dark);
+  font-weight: normal;
+}
+.beta-version {
+  border: toRem(0.1) solid var(--blue);
+  color: var(--blue);
+  padding: toRem(0.2) toRem(0.5);
+  @include text(xss-regular);
+  border-radius: toRem(0.5);
+  background-color: var(--white);
+  position: absolute;
+  top: toRem(0.3);
+  margin-left: toRem(0.5);
+  width: toRem(7.3);
+  text-align: center;
+}
+</style>

src/components/License.vue

@@ -0,0 +1,46 @@
+<template>
+  <div class="icon-block">
+    <slot></slot>
+    <div class="text-block">
+      <p class="license-text">
+        {{
+          $t('pages.share_pictures.information_text2', {
+            word: 'la licence'
+          })
+        }}
+      </p>
+      <Link
+        :href="url"
+        :text="text"
+        target="_blank"
+        type="external"
+        look="link--grey"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import Link from '@/components/Link.vue'
+defineProps({
+  url: { type: String, default: null },
+  text: { type: String, default: null }
+})
+</script>
+
+<style scoped lang="scss">
+.icon-block {
+  display: flex;
+  font-weight: 600;
+}
+.text-block {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+}
+.license-text {
+  font-weight: bold;
+  margin-right: toRem(0.5);
+  margin-bottom: 0;
+}
+</style>

src/components/Link.vue

@@ -6,11 +6,12 @@
     :class="['default', look, { disabled }]"
     :title="titleImg"
     v-bind="$attrs"
-    @click="$emit('trigger')"
+    @click="triggerButton"
   >
     <i v-if="icon" :class="[icon, 'icon']"></i>
     <img v-if="image" :src="img(image.url)" :alt="image.alt" class="logo" />
     <span v-if="text" class="text">{{ text }}</span>
+    <slot name="content"></slot>
   </a>
   <router-link
     v-else
@@ -22,12 +23,14 @@
     <i v-if="icon" :class="[icon, 'icon']"></i>
     <img v-if="image" :src="img(image.url)" :alt="image.alt" class="logo" />
     <span v-if="text" class="text">{{ text }}</span>
+    <slot name="content"></slot>
   </router-link>
 </template>
 
 <script lang="ts" setup>
 import { useI18n } from 'vue-i18n'
 import { computed } from 'vue'
+const emit = defineEmits<{ (e: 'trigger'): void }>()
 import type { PropType } from 'vue'
 import type { RouteLocationRaw } from 'vue-router'
 import { img } from '../utils/image'
@@ -52,40 +55,59 @@ const props = defineProps({
 })
 
 const titleImg = computed<string>(() =>
-  props.disabled ? t('general.header.contribute_text') : ''
+  props.disabled ? t('general.header.about_text') : ''
 )
+function triggerButton() {
+  if (props.disabled) return
+  emit('trigger')
+}
 </script>
 
 <style lang="scss" scoped>
 .default {
-  @include text(s-regular);
+  @include text(m-r-regular);
   display: flex;
   align-items: center;
+  justify-content: center;
   color: var(--black);
   text-decoration: none;
   height: inherit;
+  width: inherit;
   .icon {
     margin-right: toRem(1);
   }
   &:hover {
-    opacity: toRem(0.8);
+    opacity: 0.8;
+  }
+  &.disabled {
+    pointer-events: none;
+    cursor: default;
+  }
+}
+.button {
+  height: toRem(4);
+  border-radius: toRem(1);
+  padding: toRem(1.5);
+  background-color: var(--black);
+  color: var(--white);
+  text-align: center;
+  .icon {
+    margin-right: 0;
+  }
+  &.disabled {
+    background-color: var(--grey);
+    opacity: 0.5;
   }
 }
 .icon {
   color: var(--black);
   font-size: toRem(2.4);
+  margin-right: toRem(1);
 }
 .logo {
+  height: inherit;
   border-radius: toRem(0.5);
   margin-right: toRem(1);
-  height: inherit;
-}
-.button {
-  height: toRem(4);
-  border-radius: toRem(0.5);
-  padding: toRem(1.3) toRem(2) toRem(1.3);
-  background-color: var(--black);
-  color: var(--white);
 }
 .text {
   width: 100%;
@@ -98,6 +120,36 @@ const titleImg = computed<string>(() =>
 .link--grey {
   color: var(--grey-semi-dark);
   text-decoration: underline;
+  font-weight: inherit;
+  font-size: toRem(1.4);
+  .icon {
+    color: var(--grey-semi-dark);
+    font-size: toRem(1.4);
+    margin-right: toRem(0.5);
+  }
+}
+.link--grey-dark {
+  color: var(--grey-dark);
+  text-decoration: underline;
+  font-weight: inherit;
+  font-size: toRem(1.4);
+  .icon {
+    color: var(--grey-dark);
+    font-size: toRem(1.4);
+    margin-right: toRem(0.5);
+  }
+}
+.link--blue-dark {
+  color: var(--blue-dark);
+  .icon {
+    color: var(--blue-dark);
+  }
+}
+.link--blue {
+  color: var(--blue);
+  .icon {
+    color: var(--blue);
+  }
 }
 .button--white {
   background-color: var(--white);
@@ -110,13 +162,14 @@ const titleImg = computed<string>(() =>
     background-color: var(--black);
     color: var(--white);
     .icon {
-      color: white;
+      color: var(--white);
     }
   }
 }
 .button--white-blue {
   background-color: var(--white);
   border: toRem(0.1) solid var(--blue);
+  color: var(--blue);
   .icon {
     font-size: toRem(1.4);
     color: var(--blue);
@@ -130,6 +183,10 @@ const titleImg = computed<string>(() =>
     color: var(--white);
   }
 }
+.button--blue-bleu {
+  background-color: var(--blue-semi-pale);
+  color: var(--blue);
+}
 .disabled {
   color: grey;
   cursor: not-allowed;
@@ -153,7 +210,6 @@ const titleImg = computed<string>(() =>
   .icon {
     color: var(--white);
     font-size: toRem(2.8);
-    margin-right: 0;
   }
 }
 .no-text {

src/components/Modal.vue

@@ -0,0 +1,86 @@
+<template>
+  <div
+    class="modal fade"
+    id="bs-modal"
+    tabindex="-1"
+    role="dialog"
+    aria-labelledby="exampleModalCenterTitle"
+    aria-hidden="true"
+  >
+    <div class="modal-dialog modal-dialog-centered" role="document">
+      <div class="modal-content">
+        <button class="close-button" type="button" @click="bsModal.hide()">
+          <i class="bi bi-x-circle-fill"></i>
+        </button>
+        <div class="modal-header">
+          <h5>{{ title }}</h5>
+        </div>
+        <div class="modal-body">
+          <slot name="body"></slot>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue'
+import { Modal } from 'bootstrap'
+let bsModal = ref()
+
+defineProps({
+  title: {
+    type: String,
+    default: ''
+  }
+})
+
+onMounted(() => {
+  bsModal.value = new Modal(document.getElementById('bs-modal'), {})
+})
+function displayModal() {
+  bsModal.value.show()
+}
+
+function closeModal() {
+  bsModal.value.hide()
+}
+defineExpose({ show: displayModal, close: closeModal })
+</script>
+
+<style scoped lang="scss">
+ul {
+  padding: 0;
+}
+.modal {
+  background: rgba(10, 31, 105, 0.6);
+}
+.modal-content {
+  border-radius: toRem(1.5);
+}
+.modal-body {
+  overflow-y: auto;
+  color: var(--grey-semi-dark);
+}
+.modal-header {
+  color: var(--blue-dark);
+}
+.close-button {
+  font-size: toRem(3);
+  width: fit-content;
+  border-radius: 50%;
+  border: none;
+  background: transparent;
+  position: absolute;
+  right: toRem(-4);
+  top: toRem(-4);
+  color: var(--white);
+}
+
+@media (max-width: toRem(50)) {
+  .close-button {
+    right: toRem(0);
+    top: toRem(-5);
+  }
+}
+</style>

src/components/TabPanel.vue

@@ -0,0 +1,56 @@
+<template>
+  <div class="tab">
+    <button
+      :class="['tablinks', { selected: panelSelected === 'photos' }]"
+      :disabled="isLoading"
+      @click="$emit('trigger', 'photos')"
+    >
+      {{ $t('pages.sequence.button_panel_photos') }}
+    </button>
+    <button
+      v-if="isSequenceOwner"
+      :class="['tablinks', { selected: panelSelected === 'orientation' }]"
+      :disabled="isLoading"
+      @click="$emit('trigger', 'orientation')"
+    >
+      {{ $t('pages.sequence.button_panel_orientation') }}
+    </button>
+    <button
+      v-if="isSequenceOwner"
+      :class="['tablinks', { selected: panelSelected === 'sort' }]"
+      :disabled="isLoading"
+      @click="$emit('trigger', 'sort')"
+    >
+      {{ $t('pages.sequence.button_panel_sort') }}
+    </button>
+  </div>
+</template>
+
+<script setup lang="ts">
+defineProps({
+  panelSelected: { type: String, default: '' },
+  isLoading: { type: Boolean, default: false },
+  isSequenceOwner: { type: Boolean, default: false }
+})
+</script>
+
+<style scoped lang="scss">
+.tab {
+  display: flex;
+  width: 100%;
+  @include text(s-regular);
+}
+.tablinks {
+  border: none;
+  border-top-right-radius: toRem(0.5);
+  border-top-left-radius: toRem(0.5);
+  margin-right: toRem(0.3);
+  background-color: var(--blue-very-pale);
+  padding: toRem(1);
+}
+.selected {
+  background-color: var(--blue-semi-pale);
+  color: var(--blue-dark);
+  font-weight: 600;
+}
+</style>

src/components/Terminal.vue

@@ -8,6 +8,8 @@
     <div class="editor">
       <code class="code">
         <div class="screen">
+          <span>## </span
+          ><span>{{ $t('pages.share_pictures.comment_install') }}</span>
           <div class="upload-command">
             <span class="tilde">~</span><span>{{ textInstall }}</span>
           </div>
@@ -22,6 +24,8 @@
           </div>
         </div>
         <div class="screen">
+          <span>## </span
+          ><span>{{ $t('pages.share_pictures.comment_upload') }}</span>
           <div class="upload-command">
             <span class="tilde">~</span><span>{{ textUpload }}</span>
           </div>
@@ -76,12 +80,11 @@ async function copyText(text: string): Promise<void> {
   border-bottom-right-radius: toRem(1.5);
   border-bottom-left-radius: toRem(1.5);
   background-color: var(--black-pale);
-  height: toRem(32);
   width: 100%;
   position: relative;
 }
 .screen {
-  padding: toRem(3) toRem(2) toRem(2);
+  padding: toRem(2.5) toRem(2) toRem(1.5);
   height: 100%;
 }
 .screen:nth-child(2n) {
@@ -90,7 +93,7 @@ async function copyText(text: string): Promise<void> {
 .upload-command {
   display: flex;
   align-items: center;
-  margin-top: toRem(2);
+  margin-top: toRem(1);
 }
 .entry-button-terminal {
   margin-top: toRem(2);
@@ -127,8 +130,5 @@ async function copyText(text: string): Promise<void> {
   .editor {
     min-height: toRem(27);
   }
-  .upload-command {
-    margin-top: 0;
-  }
 }
 </style>

src/components/Toast.vue

@@ -39,6 +39,7 @@ defineProps({
   min-width: toRem(10);
   padding-right: toRem(1);
   padding-left: toRem(1);
+  z-index: 3;
 }
 .button-close {
   position: absolute;

src/components/WebsiteViewer.vue

@@ -0,0 +1,245 @@
+<template>
+  <div :id="id" class="entry-viewer"></div>
+</template>
+
+<script setup lang="ts">
+import axios from 'axios'
+import { onMounted, onUnmounted, ref, computed } from 'vue'
+import { useSequenceStore } from '@/store/sequence'
+import { Viewer, StandaloneMap, Editor } from 'geovisio'
+import { createUrlLink, manageSlashUrl, getEnv } from '@/utils'
+import { isAuth } from '../composables/auth'
+import {
+  createLink,
+  createSequenceLink,
+  createFullScreenButton
+} from '@/components-viewer/reportLink'
+import { useI18n } from 'vue-i18n'
+import { hasASessionCookieDecoded } from '@/utils/auth'
+import type {
+  ViewerInterface,
+  EditorInterface,
+  StandAloneInterface,
+  ParamsViewerInterface,
+  ParamsEditorStandaloneInterface
+} from '@/views/interfaces/common'
+const sequenceStore = useSequenceStore()
+const { isLogged } = isAuth()
+const { t, locale } = useI18n()
+let mapIsLoaded = ref<boolean>(false)
+let viewer = ref()
+const props = defineProps({
+  id: { type: String, default: 'viewer' },
+  fetchOptions: { type: Object, default: {} },
+  viewerType: { type: String, default: 'viewer' },
+  bbox: { type: Array, default: null },
+  picId: { type: String, default: null },
+  seqId: { type: String, default: null },
+  userId: { type: String, default: '' },
+  seqBruteDeg: { type: Number, default: 0 },
+  roadDegrees: { type: Number, default: 0 }
+})
+const userName = computed((): string => {
+  const cookie = hasASessionCookieDecoded()
+  if (cookie && cookie.account) return cookie.account.name
+  return ''
+})
+defineExpose({
+  viewer
+})
+async function getSequenceId(imgId: string): Promise<{
+  sequenceId: string
+  username: string
+}> {
+  const { data } = await axios.get(`api/search?ids=${imgId}`)
+  return {
+    sequenceId: data.features[0].collection,
+    username: data.features[0].properties['geovisio:producer']
+  }
+}
+function createViewerButton(link: HTMLDivElement): void {
+  link.innerHTML = `<div id='instanceBtn'>${createFullScreenButton()}</div>`
+  viewer.value.addEventListener(
+    'psv:picture-loaded',
+    async (e: { detail: { picId: string } }): Promise<void> => {
+      const sequenceInformation = await getSequenceId(e.detail.picId)
+      let href: string
+      if (isLogged.value && sequenceInformation.username === userName.value) {
+        href = `${window.location.origin}/sequence/${sequenceInformation.sequenceId}?currentPic=${e.detail.picId}`
+        link.innerHTML = `<div id='instanceBtn'>
+                           ${createFullScreenButton()}
+                           ${createSequenceLink(
+                             href,
+                             t('pages.home.sequence_title')
+                           )}
+                          </div>`
+        sequenceStore.addSequence(e.detail.picId)
+      } else {
+        href = t('pages.home.report_mail', {
+          picId: e.detail.picId,
+          link: createUrlLink(e.detail.picId)
+        })
+        link.innerHTML = `<div id='instanceBtn'>
+                           ${createFullScreenButton()}
+                           ${createLink(
+                             href,
+                             t('pages.home.report_button_text')
+                           )}
+                          </div>`
+      }
+    }
+  )
+}
+function setupViewer(params: ParamsViewerInterface): void {
+  const maxZoom = getEnv('VITE_MAX_ZOOM')
+  const zoom = getEnv('VITE_ZOOM')
+  const center = getEnv('VITE_CENTER')
+  const reportLink = document.createElement('div')
+  reportLink.className = 'gvs-group gvs-group-large gvs-group-btnpanel'
+  let paramsViewer: ViewerInterface = {
+    ...params,
+    widgets: { customWidget: reportLink },
+    map: { startWide: true }
+  }
+  if (params.map && params.map.raster) {
+    paramsViewer = {
+      ...paramsViewer,
+      map: {
+        ...paramsViewer.map,
+        raster: params.map.raster
+      }
+    }
+  }
+  if (center && center.length > 0) {
+    const centerMap = center.split(',').map((el: string) => parseInt(el))
+    paramsViewer = {
+      ...paramsViewer,
+      map: {
+        ...paramsViewer.map,
+        center: centerMap
+      }
+    }
+  }
+  if (zoom && zoom.length > 0) {
+    paramsViewer = {
+      ...paramsViewer,
+      map: {
+        ...paramsViewer.map,
+        zoom: parseFloat(zoom)
+      }
+    }
+  }
+  if (maxZoom && maxZoom.length > 0) {
+    paramsViewer = {
+      ...paramsViewer,
+      map: {
+        ...paramsViewer.map,
+        maxZoom: parseInt(maxZoom)
+      }
+    }
+  }
+  viewer.value = new Viewer(
+    'viewer', // Div ID
+    `${manageSlashUrl()}api`,
+    {
+      ...paramsViewer
+    }
+  )
+  if (viewer.value && viewer.value.addEventListener) {
+    createViewerButton(reportLink)
+  }
+}
+function setupStandAlone(params: ParamsViewerInterface): void {
+  let paramsMap: StandAloneInterface = {
+    ...params,
+    padding: { top: 70, bottom: 70, left: 70, right: 70 },
+    minZoom: 7,
+    maxZoom: 14,
+    speed: 10,
+    zoom: 14
+  }
+  if (props.userId) paramsMap = { ...paramsMap, users: [props.userId] }
+  const bbox = [props.bbox[0], props.bbox[1], props.bbox[2], props.bbox[3]]
+  viewer.value = new StandaloneMap(
+    props.id, // Div ID
+    `${manageSlashUrl()}api`,
+    {
+      ...paramsMap,
+      bounds: bbox
+    }
+  )
+}
+function setupEditor(params: ParamsEditorStandaloneInterface): void {
+  let paramsMap: EditorInterface = { ...params, minZoom: 7 }
+  if (props.seqId) paramsMap = { ...paramsMap, selectedSequence: props.seqId }
+  if (props.userId) paramsMap = { ...paramsMap, users: [props.userId] }
+  try {
+    viewer.value = new Editor(
+      'viewer', // Div ID
+      `${manageSlashUrl()}api`,
+      {
+        ...paramsMap
+      }
+    )
+  } catch (e) {
+    console.log(e)
+  }
+}
+async function initViewer(): Promise<void> {
+  const tiles = getEnv('VITE_TILES')
+  const rasterTile = getEnv('VITE_RASTER_TILE')
+  let params: ParamsViewerInterface | ParamsEditorStandaloneInterface = {
+    lang: locale.value
+  }
+  if (rasterTile && rasterTile.length > 0) {
+    const raster = JSON.parse(rasterTile)
+    if (props.viewerType !== 'viewer') params = { ...params, raster }
+    else params = { ...params, map: { raster } }
+  }
+  if (tiles && tiles.length) {
+    params = { ...params, style: await fetchTiles(tiles) }
+  }
+  if (props.picId && props.picId.length) {
+    params = { ...params, selectedPicture: props.picId }
+  }
+  if (props.fetchOptions && props.fetchOptions.credentials) {
+    params = { ...params, fetchOptions: { ...props.fetchOptions } }
+  }
+  try {
+    if (props.viewerType === 'standAlone') setupStandAlone(params)
+    else if (props.viewerType === 'editor') setupEditor(params)
+    else setupViewer(params)
+    mapIsLoaded.value = true
+  } catch (err) {
+    mapIsLoaded.value = true
+  }
+}
+onMounted(() => {
+  initViewer()
+})
+onUnmounted((): void => {
+  if (viewer.value && props.viewerType) {
+    viewer.value.addEventListener('psv:picture-loaded', (): void => {
+      viewer.value.destroy()
+    })
+  }
+})
+
+async function fetchTiles(tiles: string): Promise<void> {
+  return fetch(tiles)
+    .then((res) => res.json())
+    .then((style) => style)
+}
+</script>
+
+<style scoped lang="scss">
+.entry-viewer {
+  font-size: initial;
+  position: relative;
+  width: 100%;
+  height: 100%;
+}
+.gvs-focus-map .entry-report-button {
+  display: none;
+}
+</style>

src/components/filters/CalendarFilter.vue

@@ -0,0 +1,166 @@
+<template>
+  <div class="wrapper-calendar">
+    <div class="inputs-wrapper">
+      <div class="input-wrapper">
+        <i class="bi bi-calendar-plus"></i>
+        <input
+          :value="
+            range && range.start
+              ? formatDate(new Date(range.start), 'YYYY-MM-DD')
+              : null
+          "
+          :placeholder="$t('pages.sequences.radio_date_placeholder')"
+          @input="setStartValue"
+          class="input"
+        />
+      </div>
+      <i class="bi bi-arrow-right"></i>
+      <div class="input-wrapper">
+        <i class="bi bi-calendar-plus"></i>
+        <input
+          :value="
+            range && range.end
+              ? formatDate(new Date(range.end), 'YYYY-MM-DD')
+              : null
+          "
+          :placeholder="$t('pages.sequences.radio_date_placeholder')"
+          @input="setEndValue"
+          class="input"
+        />
+      </div>
+    </div>
+  </div>
+  <v-date-picker
+    ref="datePicker"
+    v-model="range"
+    mode="date"
+    :masks="{
+      input: 'YYYY-MM-DD'
+    }"
+    is-range
+    expanded
+    :max-date="new Date()"
+  />
+  <div class="footer-modal">
+    <Button
+      :text="$t('pages.sequences.filter_date_close_button')"
+      look="button--transparent"
+      @trigger="$emit('triggerCloseModal')"
+    />
+    <Button
+      v-if="range && (range.start || range.end)"
+      :text="$t('pages.sequences.filter_date_reset_button')"
+      icon="bi bi-trash"
+      look="button--red"
+      @trigger="resetCalendar"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import moment from 'moment'
+import { ref, watch } from 'vue'
+import type { PropType } from 'vue'
+import { formatDate } from '@/utils/dates'
+import Button from '@/components/Button.vue'
+interface CalendarDateInterface {
+  start: Date | string | null
+  end: Date | string | null
+  type: string
+}
+const emit = defineEmits(['triggerDate', 'triggerCloseModal'])
+const props = defineProps({
+  type: { type: String, default: '' },
+  rangeSelected: {
+    type: Object as PropType<CalendarDateInterface>,
+    default: { start: null, end: null, type: '' }
+  }
+})
+let range = ref<CalendarDateInterface>({
+  start: props.rangeSelected.start,
+  end: props.rangeSelected.end,
+  type: props.rangeSelected.type
+})
+const datePicker = ref()
+function checkValidityDate(dateToValid: string): boolean {
+  const date = moment(dateToValid, 'YYYY-MM-DD', true)
+  return date.isValid() && date.format('YYYY-MM-DD') === dateToValid
+}
+function setStartValue(event: Event): void {
+  const value = (event.target as HTMLInputElement).value
+  if (checkValidityDate(value)) {
+    range.value.start = new Date(value)
+    const startDate = `${formatDate(new Date(value), 'YYYY-MM-DD')} 12:00 AM`
+    if (range && range.value.end && range.value.start) {
+      range.value = {
+        start: new Date(startDate),
+        end: range.value.end,
+        type: props.type
+      }
+      datePicker.value.updateValue(range.value)
+    }
+  }
+}
+function setEndValue(event: Event): void {
+  const value = (event.target as HTMLInputElement).value
+  if (checkValidityDate(value)) {
+    range.value.end = new Date(value)
+    const endDate = `${formatDate(new Date(value), 'YYYY-MM-DD')} 11:59 PM`
+    if (range && range.value.end && range.value.start) {
+      range.value = {
+        end: new Date(endDate),
+        start: range.value.start,
+        type: props.type
+      }
+      datePicker.value.updateValue(range.value)
+    }
+  }
+}
+function resetCalendar(): void {
+  range.value = { start: null, end: null, type: '' }
+  emit('triggerDate', { start: null, end: null, type: props.type })
+}
+watch(range, (range) => {
+  if (range && range.start && range.end) {
+    const startDate = `${formatDate(range.start, 'YYYY-MM-DD')} 12:00 AM`
+    const endDate = `${formatDate(range.end, 'YYYY-MM-DD')} 11:59 PM`
+    range.type = props.type
+    emit('triggerDate', { start: startDate, end: endDate, type: props.type })
+  }
+})
+</script>
+
+<style scoped lang="scss">
+.wrapper-calendar {
+  margin-bottom: toRem(2);
+}
+.inputs-wrapper {
+  display: flex;
+  align-items: center;
+  @include text(xs-r-regular);
+}
+.input-wrapper {
+  position: relative;
+  width: 100%;
+}
+.footer-modal {
+  margin-top: toRem(2);
+  display: flex;
+  justify-content: space-between;
+}
+.bi-arrow-right {
+  margin-right: toRem(1);
+  margin-left: toRem(1);
+}
+.bi-calendar-plus {
+  position: absolute;
+  left: 5%;
+  top: 20%;
+}
+.input {
+  padding: toRem(0.5) toRem(0.5) toRem(0.5) toRem(2.5);
+  border-radius: toRem(0.3);
+  border: toRem(0.1) solid var(--grey-pale);
+  width: 100%;
+}
+</style>

src/components/header/AccountButton.vue

@@ -0,0 +1,70 @@
+<template>
+  <button
+    class="menu-burger"
+    :aria-label="ariaLabel"
+    @click="$emit('triggerToggleMenu')"
+  >
+    <div v-if="isLogged" class="wrapper-name">
+      <div class="item-with-sub">
+        <span>{{ userName }}</span>
+      </div>
+      <span class="desktop">{{ $t('general.header.my_account') }}</span>
+      <img
+        src="@/assets/images/icon/arrow-down.svg"
+        alt=""
+        :class="['arrow-img', { 'arrow-up': !menuIsClosed }]"
+      />
+    </div>
+  </button>
+</template>
+
+<script setup lang="ts">
+defineProps({
+  menuIsClosed: { type: Boolean, default: true },
+  isLogged: { type: Boolean, default: false },
+  userName: { type: String, default: null },
+  ariaLabel: { type: String, default: null }
+})
+</script>
+
+<style scoped lang="scss">
+.menu-burger {
+  display: block;
+  background-color: transparent;
+  border: none;
+  font-size: toRem(2.5);
+  padding: 0;
+  color: var(--blue-dark);
+}
+.wrapper-name {
+  display: flex;
+  align-items: center;
+  @include text(m-r-regular);
+}
+.arrow-img {
+  margin-left: toRem(0.5);
+}
+.arrow-up {
+  transform: rotate(180deg);
+}
+.item-with-sub {
+  @include text(s-regular);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: var(--blue);
+  background-color: var(--blue-semi-pale);
+  height: toRem(3);
+  width: toRem(3);
+  border-radius: 50%;
+  margin-right: toRem(0.5);
+}
+.desktop {
+  display: flex;
+}
+@media (max-width: toRem(76.8)) {
+  .desktop {
+    display: none;
+  }
+}
+</style>