SW/geovisio-website
2
0
Fork 0
forked from Ivasoft/geovisio-website
Code Pull Requests Packages Releases Activity

Compare commits

base: SW:2.2.2
Branches Tags
SW:develop SW:main SW:fix/conf-bug SW:57-filter-sequence-page-list SW:61-filter-sequence-page-list-by-bbox SW:tech-add-test-e2e SW:fix/cookie-bug SW:cquest-develop-patch-90327 SW:fix/maxzoom SW:feat/new-upload-version SW:tech/test-geovisio SW:feat/add-script-to-maj-geovisio
SW:2.5.1 SW:2.5.0 SW:2.4.1 SW:2.4.0 SW:2.3.1 SW:2.3.0 SW:2.2.3 SW:2.2.2 SW:2.2.1 SW:2.2.0 SW:2.1.3 SW:2.1.2 SW:2.1.1 SW:2.1.0 SW:0.1.0
..
compare: SW:feat/add-script-to-maj-geovisio
Branches Tags
SW:develop SW:main SW:fix/conf-bug SW:57-filter-sequence-page-list SW:61-filter-sequence-page-list-by-bbox SW:tech-add-test-e2e SW:fix/cookie-bug SW:cquest-develop-patch-90327 SW:fix/maxzoom SW:feat/new-upload-version SW:tech/test-geovisio SW:feat/add-script-to-maj-geovisio
SW:2.5.1 SW:2.5.0 SW:2.4.1 SW:2.4.0 SW:2.3.1 SW:2.3.0 SW:2.2.3 SW:2.2.2 SW:2.2.1 SW:2.2.0 SW:2.1.3 SW:2.1.2 SW:2.1.1 SW:2.1.0 SW:0.1.0

1 Commits
2.2.2 ... feat/add-s

Author SHA1 Message Date
Andreani Jean
6c7fb6c217 add commande pckage json to upgrade geovisio 2023-06-05 16:07:47 +02:00
136 changed files with 10449 additions and 9084 deletions
Expand all files Collapse all files

7
.dockerignore
View File

@@ -1,7 +0,0 @@
docs/
.git/
.idea/
dist/
node_modules/
*.md
LICENSE

2
.env Normal file
View File

@@ -0,0 +1,2 @@
VITE_API_URL=https://geovisio-backend-dev.osc-fr1.scalingo.io/
VITE_ENV=dev

0
env.example → .env.example
View File

3
.eslintrc.js
View File

@@ -29,8 +29,7 @@ module.exports = {
rules: {
'vue/require-default-prop': 'off',
'prettier/prettier': 'error',
'@typescript-eslint/no-namespace': 'off',
'@typescript-eslint/no-non-null-assertion': 'off'
'@typescript-eslint/no-namespace': 'off'
// override/add rules settings here, such as:
// 'vue/no-unused-vars': 'error'
}

5
.gitignore vendored
View File

@@ -90,6 +90,5 @@ sw.*
*.swp
# Cypress generated screen and videos files
cypress/screenshot/
cypress/videos/
*.cy.ts.mp4
src/tests/cypress/screenshot/
src/tests/cypress/videos/

77
.gitlab-ci.yml
View File

@@ -5,12 +5,6 @@ stages:
variables:
CYPRESS_CACHE_FOLDER: '$CI_PROJECT_DIR/cache/Cypress'
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: ""
before_script:
## chmod is unfortunately currently mandatory : https://github.com/nodejs/docker-node/issues/661
@@ -40,8 +34,6 @@ test:e2e:
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
coverage: /All files[^|]*\|[^|]*\s+([\d\.]+)/
@@ -62,72 +54,5 @@ deploy:
CI: 1
script:
- yarn install
- yarn upgrade geovisio@develop
- yarn build
deploy:develop:
rules:
# run job only for fork that have the credentials to pull images from the gitlab-registry
# and only for merge on 'develop' branch
- if: $CI_DEPLOY_PASSWORD == null || $CI_DEPLOY_USER == null
when: never
- if: $CI_COMMIT_REF_SLUG == "develop"
stage: Deploy
image: docker:latest
services:
- 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
- docker buildx create --use --name "geovisio-image-builder" --driver=docker-container # use docker-container driver to be able to publish a full cache
# login to dockerhub
- echo $CI_REGISTRY_PASSWORD | docker login -u $CI_REGISTRY_USER --password-stdin $CI_REGISTRY
script:
# build image using repository as cache
- 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"
--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"
--label "org.opencontainers.image.revision=$CI_COMMIT_SHORT_SHA"
--load
--progress=plain
.
# publish image to dockerhub with the develop tag
- docker push "$CI_REGISTRY_IMAGE:develop"
deploy:latest:
# we consider that tag always land on main
# and they always should publish a tagged image and the `latest` docker image
only:
- tags
stage: Deploy
image: docker:latest
services:
- 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
- docker buildx create --use --name "geovisio-image-builder" --driver=docker-container # use docker-container driver to be able to publish a full cache
# login to dockerhub
- echo $CI_REGISTRY_PASSWORD | docker login -u $CI_REGISTRY_USER --password-stdin $CI_REGISTRY
script:
# build image using repository as cache
- 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"
--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"
--label "org.opencontainers.image.revision=$GIT_DESCRIBE"
--load
--progress=plain
.
# publish image to dockerhub
- docker push $CI_REGISTRY_IMAGE:$CI_COMMIT_REF_NAME
- docker push $CI_REGISTRY_IMAGE:latest

4
.idea/geovisio-website.iml generated
View File

@@ -5,10 +5,6 @@
<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" />

16
.idea/inspectionProfiles/Project_Default.xml generated
View File

@@ -2,21 +2,5 @@
<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>

118
CHANGELOG.md
View File

@@ -1,118 +0,0 @@
# Changelog
All notable changes to this project will be documented in this file.
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
Before _0.1.0_, website development was on rolling release, meaning there are no version tags.
## [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
- fix the format date from YY to YYYY in a sequence page
### Added
- Add a first version of a footer
- Add a ay11 page
## [2.1.2] - 2023-09-12
### Changed
- add a fix to center the map with ENV variables
## [2.1.1] - 2023-09-06
### 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).
- 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
- Insert the report button in the viewer by passing a params
### Added
- Get the License with the API route
- Add ENV var for maxZoom params of the viewer
## [2.1.0] - 2023-08-29
### Added
- A new page `/envoyer` to upload picture with an interface ([#13](https://gitlab.com/geovisio/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.
### Fixed
- fix a bug in the header hidden sub menu when authentication is not with keycloak
## [0.1.0] - 2023-07-04
### 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)) :
- 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)) :
- 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
- the user can disable and delete one or many photo(s) of the sequence
### Changed
- 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.2.2...develop
[2.2.1]: https://gitlab.com/geovisio/website/-/compare/2.2.1...2.2.2
[2.2.1]: https://gitlab.com/geovisio/website/-/compare/2.2.0...2.2.1
[2.2.0]: https://gitlab.com/geovisio/website/-/compare/2.1.3...2.2.0
[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

59
Dockerfile
View File

@@ -1,59 +0,0 @@
#--------------------------------------------------------------
#- Build image
#-
FROM node:18.16.0-alpine AS build
WORKDIR /opt/geovisio
# Import dependencies files
COPY package.json yarn.lock ./
# Install NodeJS dependencies
RUN yarn install --frozen-lockfile
# Import source code
COPY static ./static
COPY src ./src
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_API_URL=DOCKER_VITE_API_URL
ENV VITE_TILES=DOCKER_VITE_TILES
ENV VITE_MAX_ZOOM=DOCKER_VITE_MAX_ZOOM
ENV VITE_ZOOM=DOCKER_VITE_ZOOM
ENV VITE_CENTER=DOCKER_VITE_CENTER
# Build code
ENV PORT=3000
RUN yarn deploy
#--------------------------------------------------------------
#- Final image
#-
FROM nginx:1-alpine
RUN apk add bash
# Retrieve files from build
COPY --from=build /opt/geovisio/dist /usr/share/nginx/html
# Add Docker scripts and Nginx conf
COPY docker/nginx.conf /etc/nginx/nginx.conf
COPY docker/docker-entrypoint.sh /etc/nginx/docker-entrypoint.sh
RUN chmod +x /etc/nginx/docker-entrypoint.sh
# Define env variables defaults
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_ZOOM=""
ENV VITE_CENTER=""
# Start Nginx
EXPOSE 3000
ENTRYPOINT ["/etc/nginx/docker-entrypoint.sh"]
CMD ["nginx", "-g", "daemon off;"]

119
README.md
View File

@@ -1,60 +1,109 @@
# ![GeoVisio](https://gitlab.com/geovisio/api/-/raw/develop/images/logo_full.png)
# panoramax-website
__GeoVisio__ is a complete solution for storing and __serving your own 📍📷 geolocated pictures__ (like [StreetView](https://www.google.com/streetview/) / [Mapillary](https://mapillary.com/)).
Welcome to the Panoramax website documentation !
[Panoramax](http://panoramax.ign.fr/) is a website where you can upload a lots of photos to see them in map web viewer based on [Geovisio](https://gitlab.com/geovisio).
➡️ __Give it a try__ at [panoramax.ign.fr](https://panoramax.ign.fr/) or [geovisio.fr](https://geovisio.fr/viewer) !
## Technologies
## 📦 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
GeoVisio is __modular__ and made of several components, each of them standardized and ♻️ replaceable.
## Configuration
![GeoVisio architecture](https://gitlab.com/geovisio/api/-/raw/develop/images/big_picture.png)
All the commands and packages used are available in the `package.json` file.
All of them are 📖 __open-source__ and available online:
You can change the vite server configuration in the `vite.config.ts` file. See [Vite Configuration Reference](https://vitejs.dev/config/) if you need.
| 🌐 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) |
## Project Setup
**You need to have [Nodejs installed](https://nodejs.org/en/download)**
Node version : >=18.13.0
# 💻 GeoVisio Website
**You need to have [Npm installed](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm)**
This repository only contains __the web front-end of GeoVisio__.
You can use npm or [yarn](https://yarnpkg.com/) as package manager
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).
Install all dependencies :
## ⚙️ Features
```sh
npm install
```
The website offers these functionalities:
or
- Display of pictures and their location (using the embed [web viewer](https://gitlab.com/geovisio/web-viewer))
- Handle user authentication and account management
- Show simple to read documentation
```sh
yarn install
```
## 🕮 Documentation
### Compile and Hot-Reload for Development
[A full documentation](./docs/) is available to help you through the install, setup and usage of the GeoVisio website.
Launch your dev server :
## 💁 Contributing
```sh
npm run dev
```
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.
or
## 🤗 Special thanks
```sh
yarn dev
```
![Sponsors](https://gitlab.com/geovisio/api/-/raw/develop/images/sponsors.png)
### Run Unit Tests with [Vitest](https://vitest.dev/)
GeoVisio was made possible thanks to a group of ✨ __amazing__ people ✨ :
```sh
npm run test:unit
```
- __[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 !
or
```sh
yarn test:unit
```
## ⚖️ License
### Lint with [ESLint](https://eslint.org/)
Copyright (c) GeoVisio team 2022-2023, [released under MIT license](./LICENSE).
```sh
npm run lint
```
or
```sh
yarn lint
```
### Build in Production
In your production app, you must set some env variables [like the .env.example file here](https://gitlab.com/geovisio/website/-/blob/main/.env.example)
```sh
npm install
npm run build
npm run start
```
or
```sh
yarn install
yarn build
yarn start
```
## Instance customization
### Wordings
- All the wordings of the website are on this [locale file](https://gitlab.com/geovisio/website/-/blob/main/src/locales/fr.json)
- You can change the title `"title": "Instance Panoramax IGN"` of your instance on the [locale file](https://gitlab.com/geovisio/website/-/blob/main/src/locales/fr.json)
- In the same [locale file](https://gitlab.com/geovisio/website/-/blob/main/src/locales/fr.json) you can change the meta data wordings inside the `"meta": {}` object
- You can change the instance name inside the documentation of the page /partager-des-photos for the keys `"terminal_text_logged"` and `"terminal_text_not_logged"` on the [locale file](https://gitlab.com/geovisio/website/-/blob/main/src/locales/fr.json)
### Images
- If you want to change the logo in the header you can replace the logo.jpeg in the [assets/images folder](https://gitlab.com/geovisio/geovisio_website/-/tree/main/src/assets/images) file by your own jpeg logo with the same file name
- You can change the favicon [inside the static folder](https://gitlab.com/geovisio/website/-/tree/main/static)

1
bootstrap.d.ts vendored
View File

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

7
cypress.config.ts
View File

@@ -12,6 +12,11 @@ export default defineConfig({
setupNodeEvents(on, config) {
// implement node event listeners here
},
baseUrl: 'http://localhost:5173'
baseUrl: 'http://localhost:5173',
supportFile: 'src/tests/cypress/support/e2e.{js,jsx,ts,tsx}',
specPattern: 'src/tests/cypress/**/*.cy.{js,jsx,ts,tsx}',
fixturesFolder: 'src/tests/cypress/fixtures',
videosFolder: 'src/tests/cypress/videos',
screenshotsFolder: 'src/tests/cypress/screenshot'
}
})

16
docker/docker-entrypoint.sh
View File

@@ -1,16 +0,0 @@
#!/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 )
echo "Setting env variables in web files"
for file in $ROOT_DIR/assets/*.js $ROOT_DIR/index.html; do
echo "Processing $file...";
for i in ${!DOCKER_VARS[@]}; do
sed -i "s|DOCKER_${DOCKER_VARS[i]}|${!DOCKER_VARS[i]}|g" $file
done
done
echo "GeoVisio website is now ready !"
exec "$@"

22
docker/nginx.conf
View File

@@ -1,22 +0,0 @@
events {
worker_connections 1024;
}
http {
include mime.types;
sendfile on;
server {
listen 3000;
listen [::]:3000;
resolver 127.0.0.11;
autoindex off;
server_name _;
server_tokens off;
root /usr/share/nginx/html;
gzip_static on;
}
}

29
docs/01_Start.md
View File

@@ -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)

82
docs/02_Setup.md
View File

@@ -1,82 +0,0 @@
# Setup
GeoVisio website can be installed through classic method, or using Docker.
__Contents__
[[_TOC_]]
## Classic install
### System requirements
**You need to have [Nodejs installed](https://nodejs.org/en/download)**
Node version : >=18.13.0
**You need to have [Npm installed](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm)**
You can use npm or [yarn](https://yarnpkg.com/) as package manager
### Install
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).

47
docs/03_Settings.md
View File

@@ -1,47 +0,0 @@
# Settings
Many things can be customized in your GeoVisio Website.
## Basic settings
Low-level settings can be changed through the `.env` file. An example is given in `env.example` file.
Available parameters are:
- `VITE_API_URL`: the URL to the GeoVisio API (with trailing `/`, example: `https://geovisio.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_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).
- 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`
More settings are available [in official Vite documentation](https://vitejs.dev/guide/env-and-mode.html#env-files)
Note that you can also change the _Vite_ server configuration in the `vite.config.ts` file. See [Vite Configuration Reference](https://vitejs.dev/config/) if you need.
## Wording customization
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:
- The website title (properties `title` and `meta.title`)
- The description (property `meta.description`)
- Links to help pages:
- `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).

43
docs/09_Develop.md
View File

@@ -1,43 +0,0 @@
# Work on the code
## Available commands
Note that all the commands and packages used are available in the `package.json` file.
### Compile and Hot-Reload for Development
Launch your dev server :
```sh
npm run dev
```
or
```sh
yarn dev
```
### Run Unit Tests with [Vitest](https://vitest.dev/)
```sh
npm run test:unit
```
or
```sh
yarn test:unit
```
### Lint with [ESLint](https://eslint.org/)
```sh
npm run lint
```
or
```sh
yarn lint
```

24
docs/90_Releases.md
View File

@@ -1,24 +0,0 @@
# Make a release
The web site 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.
Run these commands in order to issue a new release:
```bash
git checkout develop
vim package.json # Change version
npm run doc
vim CHANGELOG.md # Replace unreleased to version number and update versions links (at bottom)
git add *
git commit -m "Release x.x.x"
git tag -a x.x.x -m "Release x.x.x"
git push origin develop
git checkout main
git merge develop
git push origin main --tags
```

11
package.json
View File

@@ -1,12 +1,13 @@
{
"name": "geovisio-website",
"version": "2.2.2",
"version": "0.0.0",
"engines": {
"node": "18.16.0"
},
"private": true,
"scripts": {
"dev": "vite",
"scalingo-prebuild": "yarn upgrade geovisio@develop",
"start": "vite --port $PORT",
"build": "run-p type-check build-only",
"preview": "vite preview",
@@ -21,24 +22,20 @@
},
"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.2.0",
"moment": "^2.29.4",
"pinia": "^2.1.4",
"geovisio": "^2.0.2-develop-33c2d8bd",
"vue": "^3.2.45",
"vue-axios": "^3.5.2",
"vue-eslint-parser": "^9.1.0",
"vue-i18n": "9.2.2",
"vue-i18n": "^9.2.2",
"vue-meta": "^3.0.0-alpha.10",
"vue-router": "^4.1.6",
"vue3-cookies": "^1.0.6",
"vue3-smooth-scroll": "^0.8.1"
},
"devDependencies": {
"@pinia/testing": "^0.1.2",
"@rushstack/eslint-patch": "^1.1.4",
"@types/jsdom": "^20.0.1",
"@types/node": "^18.11.18",

43
src/App.vue
View File

@@ -1,37 +1,23 @@
<script setup lang="ts">
import { ref, computed } from 'vue'
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 { useRoute } from 'vue-router'
import { useCookies } from 'vue3-cookies'
import { title } from '@/utils/index'
import authConfig from './composables/auth'
const { authConf } = authConfig()
const { t } = useI18n()
const { cookies } = useCookies()
const route = useRoute()
let focusMap = ref<string>('focus-map')
useMeta({
title: title(t('general.title')),
title: t('general.title'),
og: {
title: title(t('general.meta.title')),
description: title(t('general.meta.description'))
title: t('general.meta.title'),
description: t('general.meta.description')
},
twitter: {
title: title(t('general.meta.title')),
description: title(t('general.meta.description'))
title: t('general.meta.title'),
description: t('general.meta.description')
}
})
function setFocusMap(value: string) {
focusMap.value = value
}
const getUserId = computed<string>(() => cookies.get('user_id'))
</script>
<template>
@@ -39,21 +25,10 @@ const getUserId = computed<string>(() => cookies.get('user_id'))
<template v-slot:title="{ content }">{{ content }}</template>
</metainfo>
<Header
:auth-enabled="
authConf && authConf.auth && authConf.auth.enabled
? authConf.auth.enabled
: true
"
:user-profile-url="
authConf &&
authConf.auth &&
authConf.auth.user_profile &&
authConf.auth.user_profile.url
? authConf.auth.user_profile.url
: ''
"
v-if="authConf.user_profile"
:auth-enabled="authConf.enabled"
:user-profile-url="authConf.user_profile.url"
/>
<RouterView @trigger="setFocusMap" :class="{ logged: getUserId }" />
<Footer v-if="!getUserId" />
<RouterView />
</template>
<style scoped></style>

BIN
src/assets/.DS_Store vendored Normal file
View File

Binary file not shown.

69
src/assets/font-size.scss
View File

@@ -1,71 +1,44 @@
@mixin text($size) {
@if $size == h1 {
font-weight: 590;
line-height: toRem(2.6);
font-size: toRem(2.2);
font-weight: normal;
font-size: 4rem;
@media (max-width: toRem(50)) {
font-size: toRem(2);
@media (max-width: 500px) {
font-size: 2.6rem;
}
}
@if $size == h2 {
font-weight: 590;
font-size: toRem(2);
line-height: toRem(2.4);
font-weight: normal;
font-size: 2rem;
@media (max-width: toRem(50)) {
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);
@media (max-width: 500px) {
font-size: 1.8rem;
}
}
@if $size == h4 {
font-weight: normal;
font-size: toRem(1.6);
}
@if $size == xxl-regular {
font-size: toRem(3.2);
font-weight: normal;
font-size: 1.6rem;
}
@if $size == m-regular {
font-size: toRem(1.6);
font-size: 1.6rem;
font-weight: normal;
}
@if $size == m-r-regular {
font-size: 1.6rem;
font-weight: normal;
@media (max-width: 500px) {
font-size: 1.2rem;
}
}
@if $size == s-regular {
font-size: toRem(1.4);
font-size: 1.4rem;
font-weight: normal;
}
@if $size == xss-regular {
font-size: toRem(0.9);
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.4);
}
}
@if $size == xs-r-regular {
font-size: toRem(1.2);
font-size: 1.2rem;
font-weight: normal;
@media (max-width: toRem(50)) {
font-size: toRem(1);
}
}
@if $size == s-r-regular {
font-size: toRem(1.4);
font-weight: normal;
@media (max-width: toRem(50)) {
font-size: toRem(1.2);
@media (max-width: 500px) {
font-size: 1rem;
}
}
}

BIN
src/assets/images/.DS_Store vendored Normal file
View File

Binary file not shown.

4
src/assets/images/360.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

Before

Width:  |  Height:  |  Size: 5.3 KiB

32
src/assets/images/building.svg
View File

@@ -1,32 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 9.0 KiB

6
src/assets/images/cloud.svg
View File

@@ -1,6 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 2.2 KiB

BIN
src/assets/images/doc-illustration.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 16 KiB

16
src/assets/images/gitlab-logo.svg
View File

@@ -1,16 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 2.0 KiB

BIN
src/assets/images/how-to-share-map.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 51 KiB

3
src/assets/images/icon/arrow-down.svg
View File

@@ -1,3 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 169 B

3
src/assets/images/icon/check-green.svg
View File

@@ -1,3 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 802 B

3
src/assets/images/icon/info-blue.svg
View File

@@ -1,3 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 1.2 KiB

3
src/assets/images/icon/information.svg
View File

@@ -1,3 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 2.7 KiB

4
src/assets/images/icon/logout.svg
View File

@@ -1,4 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 1.0 KiB

4
src/assets/images/icon/photos.svg
View File

@@ -1,4 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 1.6 KiB

5
src/assets/images/icon/settings.svg
View File

@@ -1,5 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 2.0 KiB

3
src/assets/images/linkedin.svg
View File

@@ -1,3 +0,0 @@
<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.873 0.179993C5.35013 0.179993 0.873047 4.65708 0.873047 10.18C0.873047 15.7029 5.35013 20.18 10.873 20.18C16.396 20.18 20.873 15.7029 20.873 10.18C20.873 4.65708 16.396 0.179993 10.873 0.179993ZM8.42513 14.3248H6.40013V7.80812H8.42513V14.3248ZM7.40013 7.00812C6.76055 7.00812 6.347 6.55499 6.347 5.99458C6.347 5.4227 6.77305 4.98312 7.42617 4.98312C8.0793 4.98312 8.4793 5.4227 8.4918 5.99458C8.4918 6.55499 8.0793 7.00812 7.40013 7.00812ZM15.821 14.3248H13.796V10.7133C13.796 9.8727 13.5022 9.30187 12.7699 9.30187C12.2105 9.30187 11.8783 9.68833 11.7314 10.0602C11.6772 10.1925 11.6637 10.38 11.6637 10.5665V14.3237H9.63763V9.88624C9.63763 9.0727 9.61159 8.39249 9.58451 7.80708H11.3439L11.4366 8.71228H11.4772C11.7439 8.28728 12.397 7.6602 13.4897 7.6602C14.822 7.6602 15.821 8.55291 15.821 10.4717V14.3248Z" fill="#0A1F69"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 945 B

3
src/assets/images/mastodon.svg
View File

@@ -1,3 +0,0 @@
<svg width="19" height="21" viewBox="0 0 19 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M13.4847 15.4241C16.0048 15.1241 18.1973 13.5803 18.4723 12.1703C18.9073 9.94774 18.8723 6.74641 18.8723 6.74641C18.8723 2.4088 16.0148 1.13627 16.0148 1.13627C14.5747 0.4775 12.1009 0.201243 9.53086 0.179993H9.46836C6.89705 0.201243 4.42448 0.4775 2.98445 1.13627C2.98445 1.13627 0.128126 2.40755 0.128126 6.74641L0.125626 7.57393C0.120626 8.37395 0.116876 9.26147 0.139377 10.1877C0.243129 14.4303 0.921896 18.613 4.86449 19.6505C6.68204 20.1292 8.24333 20.2292 9.50086 20.1605C11.7797 20.0355 13.0597 19.3517 13.0597 19.3517L12.9847 17.7054C12.9847 17.7054 11.3559 18.2179 9.52586 18.1554C7.71332 18.0929 5.80077 17.9604 5.50701 15.7454C5.47905 15.5399 5.46526 15.3327 5.46576 15.1254C5.46576 15.1254 7.2458 15.5579 9.50086 15.6604C10.8796 15.7229 12.1722 15.5804 13.486 15.4241H13.4847ZM15.501 12.3365H13.4097V7.23642C13.4097 6.16264 12.9547 5.61763 12.0459 5.61763C11.0409 5.61763 10.5371 6.26389 10.5371 7.54393V10.3352H8.45708V7.54268C8.45708 6.26264 7.95332 5.61638 6.9483 5.61638C6.03952 5.61638 5.58451 6.16139 5.58451 7.23642V12.3353H3.49321V7.08266C3.49321 6.00889 3.76822 5.15637 4.31823 4.5251C4.88825 3.89384 5.63326 3.57008 6.55954 3.57008C7.62956 3.57008 8.43958 3.98009 8.97585 4.79886L9.49711 5.66763L10.0184 4.79886C10.5546 3.98009 11.3647 3.57008 12.4359 3.57008C13.361 3.57008 14.106 3.89384 14.6747 4.5251C15.2273 5.15637 15.501 6.00889 15.501 7.08266V12.3365Z" fill="#0A1F69"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.5 KiB

61
src/assets/images/no-uploaded-img.svg
View File

@@ -1,61 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 13 KiB

6
src/assets/images/photos.svg
View File

@@ -1,6 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 4.1 KiB

3
src/assets/images/success.svg
View File

@@ -1,3 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 837 B

BIN
src/assets/images/thumb.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 14 KiB

BIN
src/assets/images/téléchargement.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 4.2 KiB

61
src/assets/images/upload-illustration.svg
View File

@@ -1,61 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 13 KiB

BIN
src/assets/images/upload.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 MiB

65
src/assets/images/uploading-person.svg
View File

@@ -1,65 +0,0 @@
<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>
Side by Side

Before

Width:  |  Height:  |  Size: 17 KiB

3
src/assets/images/x.svg
View File

@@ -1,3 +0,0 @@
<svg width="23" height="21" viewBox="0 0 23 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18.2989 0.179993H21.6917L14.2792 8.65277L23 20.18H16.172L10.8246 13.1879L4.7047 20.18H1.31005L9.23888 11.1172L0.873047 0.180915H7.87438L12.7082 6.57192L18.2989 0.179993ZM17.1087 18.1498H18.9886L6.85286 2.10412H4.83562L17.1087 18.1498Z" fill="#0A1F69"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 366 B

32
src/assets/main.scss → src/assets/main.css
View File

@@ -1,4 +1,5 @@
html {
font-size: 62.5%; /* 1rem = 10px */
height: -webkit-fill-available;
}
body {
@@ -24,32 +25,33 @@ h5 {
padding: 0;
list-style: none;
}
:root {
--white: #ffffff;
--black: #181818;
--black-pale: #1b1a17;
--red: #f70000;
--red-pale: #ff726f;
--grey: #f5f5f5;
--grey-pale: #cfd2cf;
--grey-semi-dark: #808080;
--grey-dark: #3e3e3e;
--blue: #2954e9;
--blue-dark: #0a1f69;
--blue-geovisio: #34495e;
--blue-semi: #d7dffc;
--blue-pale: #f2f5ff;
--grey: #e6e6e6;
--grey-dark: #808080;
--blue: #4945ff;
--beige: #f5f3ec;
--yellow: #fec868;
--orange: #ff6f00;
--orange-pale: #fffafa;
--green: #7ec636;
--green-pale: #f0ffee;
--green: #59ce8f;
}
@media (min-width: toRem(102.4)) {
@media (min-width: 1024px) {
body {
display: flex;
place-items: center;
}
}
@media (max-width: 500px) {
@supports (-webkit-touch-callout: none) {
/* CSS specific to iOS devices */
body {
min-height: -webkit-fill-available;
min-height: moz-available;
min-height: fill-available;
}
}
}

4
src/assets/rem-calc.scss
View File

@@ -1,4 +0,0 @@
@function toRem($value) {
$remValue: calc($value / 1.6) + rem;
@return $remValue;
}

3
src/components-viewer/reportLink.ts
View File

@@ -1,3 +0,0 @@
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>`
}

BIN
src/components/.DS_Store vendored Normal file
View File

Binary file not shown.

39
src/components/BetaText.vue Normal file
View File

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

141
src/components/Button.vue
View File

@@ -1,135 +1,56 @@
<template>
<button
:disabled="isLoading || disabled"
:type="type"
:class="[look, 'default', { disabled: disabled || isLoading }]"
type="button"
@click="$emit('trigger')"
:class="['default', look]"
>
<i v-if="icon" :class="[icon, 'icon']"></i>
<span v-if="text.length" class="text">{{ text }}</span>
<span v-if="tooltip && tooltip.length" class="tooltip-button">{{
tooltip
}}</span>
{{ text }}
</button>
</template>
<script lang="ts" setup>
import type { PropType } from 'vue'
type TypeInterface = 'button' | 'submit' | 'reset'
defineProps({
icon: { type: String, default: null },
disabled: { type: Boolean, default: false },
isLoading: { type: Boolean, default: false },
text: { type: String, default: '' },
tooltip: { type: String, default: '' },
look: { type: String, default: '' },
type: { type: String as PropType<TypeInterface>, default: 'button' }
look: { type: String, default: '' }
})
</script>
<style lang="scss" scoped>
@media (min-width: toRem(76.8)) {
@media (min-width: 764px) {
.default:hover {
opacity: 0.8;
opacity: 0.7;
}
}
.default {
height: toRem(3.5);
min-width: toRem(3.5);
@include text(s-regular);
display: flex;
align-items: center;
justify-content: center;
border: none;
background-color: transparent;
position: relative;
z-index: 1;
border-radius: toRem(1);
padding: toRem(1.3) toRem(2) toRem(1.3);
.icon {
font-size: toRem(2);
}
&:hover .tooltip-button {
visibility: visible;
}
padding: 1rem;
}
.button--black {
color: var(--white);
background-color: var(--black);
}
.button--blue {
color: var(--white);
background-color: var(--blue);
&.disabled {
opacity: 0.6;
color: var(--white);
cursor: not-allowed;
}
}
.button--transparent {
border: toRem(0.1) solid var(--white);
height: 4.5rem;
border-radius: 0.5rem;
padding: 1.3rem 2rem 1.3rem;
background-color: var(--black);
color: var(--white);
}
.button--red {
color: var(--red);
background-color: transparent;
border: toRem(0.1) solid var(--red);
.icon {
margin-right: 0;
font-size: toRem(1.4);
color: var(--red);
}
.text {
margin-left: toRem(1);
}
}
.button--white {
color: var(--blue);
border: toRem(0.1) solid var(--blue);
.icon {
font-size: toRem(1.4);
color: var(--blue);
margin-right: 0;
}
.text {
margin-left: toRem(1);
}
padding: 0.5rem 1rem;
border-radius: 0.5rem;
border: 0.1rem solid var(--white);
background-color: var(--black);
color: var(--white);
}
.no-text {
height: toRem(3);
width: toRem(3);
padding: 0;
.icon {
color: var(---black);
font-size: toRem(1.8);
margin-right: 0;
}
}
.background-white {
background-color: var(--white);
}
.link--grey {
color: var(--grey-semi-dark);
.icon {
font-size: toRem(1.4);
color: var(--grey-semi-dark);
}
}
.link--red {
color: var(--red);
background-color: var(--white);
.icon {
font-size: toRem(1.4);
color: var(--red);
}
}
.icon {
margin-right: toRem(1);
font-size: toRem(2);
margin-right: 1rem;
font-size: 2rem;
color: var(--white);
}
.button--rounded {
@@ -138,34 +59,12 @@ defineProps({
align-items: center;
border-radius: 50%;
padding: 0;
height: toRem(2.5);
width: toRem(2.5);
height: 2.5rem;
width: 2.5rem;
.icon {
color: var(---black);
font-size: toRem(1.8);
font-size: 1.8rem;
margin-right: 0;
}
}
.tooltip-button {
background-color: var(--black);
color: var(--white);
text-align: center;
border-radius: toRem(0.5);
padding: toRem(0.5) toRem(1);
position: absolute;
bottom: -100%;
visibility: hidden;
width: toRem(18);
right: 0;
@include text(xss-regular);
}
.disabled {
color: var(--grey-pale);
border-color: var(--grey-pale);
cursor: not-allowed;
.icon {
color: var(--grey-pale);
}
}
</style>

100
src/components/Footer.vue
View File

@@ -1,100 +0,0 @@
<template>
<footer 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">
ul {
padding: 0;
margin: 0;
}
.footer {
padding: toRem(1.5) toRem(3);
border-top: toRem(0.1) solid var(--grey);
}
.link-list {
display: flex;
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 {
color: var(--blue-dark);
@include text(s-regular);
height: toRem(2);
width: fit-content;
}
.logo {
margin-right: toRem(2);
height: toRem(2);
}
@media (max-width: toRem(50)) {
.title {
margin-bottom: 0;
}
.footer {
padding: toRem(2);
}
}
</style>

316
src/components/Header.vue
View File

@@ -1,103 +1,80 @@
<template>
<header class="header">
<div class="responsive entry-instance">
<InstanceName />
<div class="responsive">
<beta-text />
</div>
<nav class="nav">
<div class="wrapper-logo desktop">
<Link
:image="{ url: 'logo.jpeg', alt: $t('general.header.alt_logo') }"
:route="{ name: 'home' }"
>
<template v-slot:content>
<InstanceName />
</template>
</Link>
</div>
<div class="wrapper-logo responsive">
<div class="wrapper-logo">
<Link
:image="{
url: 'logo.jpeg',
alt: $t('general.header.alt_logo')
}"
:route="{ name: 'home' }"
path="/"
/>
<div class="desktop">
<beta-text />
</div>
</div>
<div ref="list" class="wrapper-entries">
<HeaderOpen
v-if="isLogged && authEnabled"
:menu-is-closed="menuIsClosed"
:user-profile-url-length="userProfileUrl.length"
@triggerClose="closeModal"
/>
<div class="wrapper-right-entries">
<div>
<div class="wrapper-entries">
<ul :class="['nav-list', { 'mobile-menu-open': !menuIsClosed }]">
<li class="nav-list-item desktop">
<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: 'why-contribute' }"
look="link--blue"
@click.native="closeModal"
icon="bi bi-upload"
look="button white"
path="/partager-des-photos"
/>
</li>
</ul>
<div class="wrapper-right-entries">
<div class="responsive">
<Link
:text="$t('general.header.contribute_text_responsive')"
icon="bi bi-upload"
look="button white"
path="/partager-des-photos"
/>
</div>
<div v-if="isLogged && authEnabled" class="link-upload">
<div v-if="authEnabled" class="item-with-sub">
<Link
: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"
type="external"
icon="bi bi-person-circle"
:look="isLogged ? 'disable-mobile' : ''"
:path="userUrl"
:text="userName"
/>
<i v-if="isLogged" class="chevron bi bi-chevron-up"></i>
<div v-if="isLogged" class="sub-nav-block">
<div v-if="userProfileUrl" class="logged-link">
<Link
path="mes-informations"
:text="$t('general.header.my_information_text')"
/>
</div>
<div class="logged-link">
<Link
path="mes-parametres"
:text="$t('general.header.my_settings_text')"
/>
</div>
<div class="logged-link">
<Link
type="external"
:path="logoutUrl"
:text="$t('general.header.logout_text')"
/>
</div>
</div>
</div>
<AccountButton
v-if="isLogged && authEnabled"
<button
class="menu-burger"
:aria-label="ariaLabel"
:is-logged="isLogged"
:user-name="userName"
:menu-is-closed="menuIsClosed"
@triggerToggleMenu="toggleMenu"
/>
<div v-else-if="!isLogged && authEnabled">
<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>
@click="toggleMenu"
>
<i v-if="!menuIsClosed" class="cross bi bi-x-lg"></i>
<i v-else class="bi bi-list"></i>
</button>
</div>
</div>
</nav>
@@ -106,32 +83,22 @@
<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 Link from '@/components/Link.vue'
import InstanceName from '@/components/InstanceName.vue'
import HeaderOpen from '@/components/header/HeaderOpen.vue'
import AccountButton from '@/components/header/AccountButton.vue'
import BetaText from '@/components/BetaText.vue'
const { cookies } = useCookies()
const { t } = useI18n()
const route = useRoute()
defineProps({
authEnabled: { type: Boolean, default: true },
userProfileUrl: { type: String, default: '' }
userProfileUrl: { type: String, default: null }
})
const list = ref(null)
let menuIsClosed = ref<boolean>(true)
onClickOutside(list, () => closeModal())
function closeModal() {
menuIsClosed.value = true
}
function toggleMenu(): void {
menuIsClosed.value = !menuIsClosed.value
}
@@ -141,12 +108,17 @@ const ariaLabel = computed((): string =>
? t('general.header.burger_menu_aria_label_open')
: t('general.header.burger_menu_aria_label_closed')
)
const logoutUrl = computed(
(): string =>
`${import.meta.env.VITE_API_URL}api/auth/logout?next_url=${route.path}`
)
const userUrl = computed((): string =>
isLogged.value
? ''
: `${import.meta.env.VITE_API_URL}api/auth/login?next_url=${route.path}`
)
const userName = computed((): string =>
cookies!
.get('user_name')
.match(/\b(\w)/g)!
.join('')
.toUpperCase()
isLogged.value ? cookies.get('user_name') : t('general.header.login_text')
)
</script>
@@ -154,21 +126,19 @@ const userName = computed((): string =>
.header {
display: flex;
align-items: center;
min-height: toRem(8);
background-color: var(--white);
border-bottom: toRem(0.1) solid var(--grey-pale);
height: 8rem;
border-bottom: 0.1rem solid var(--black);
}
.nav {
width: 100%;
padding-right: 2rem;
padding-left: 2rem;
display: flex;
justify-content: space-between;
align-items: center;
padding: toRem(1.5) toRem(3);
}
.wrapper-logo {
display: flex;
align-items: center;
height: toRem(4);
}
.wrapper-entries {
display: flex;
@@ -177,57 +147,129 @@ const userName = computed((): string =>
display: none;
}
.desktop {
display: block;
}
.wrapper-logo p {
@include text(m-r-regular);
margin-bottom: 0;
margin-left: 1rem;
position: relative;
}
.nav-list {
display: flex;
align-items: center;
margin-bottom: 0;
}
.item-with-sub {
position: relative;
display: flex;
align-items: center;
margin-left: 1rem;
}
.item-with-sub:hover .sub-nav-block {
display: block;
}
.item-with-sub:hover .chevron {
transform: rotate(180deg);
}
.chevron {
margin-left: 0.5rem;
}
.sub-nav-block {
display: none;
border-radius: 0.5rem;
border: 1px solid var(--black);
background-color: var(--white);
position: absolute;
right: 0;
top: 3.5rem;
z-index: 1;
width: 15rem;
}
.logged-link {
display: flex;
justify-content: center;
padding: 1rem 1rem 1.5rem;
}
.logged-link:first-child {
padding-top: 1.5rem;
}
.logged-link:nth-child(2) {
padding-bottom: 1.5rem;
}
.logged-link:hover {
border-radius: 0.5rem;
background-color: var(--grey);
}
.nav-list-item {
margin-right: 1.5rem;
}
.menu-burger {
display: none;
}
.wrapper-right-entries {
display: flex;
align-items: center;
div:first-child {
margin-right: toRem(2);
}
div:last-child {
.desktop {
margin-right: 0;
}
}
}
.link-upload {
margin-right: toRem(2);
}
.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);
}
@media (max-width: toRem(76.8)) {
.nav {
padding-right: toRem(2);
padding-left: toRem(2);
}
@media (max-width: 768px) {
.header {
flex-direction: column;
min-height: toRem(10);
height: 11rem;
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 4;
z-index: 2;
background: var(--white);
}
.entry-instance {
background-color: var(--blue-pale);
width: 100%;
display: flex;
justify-content: center;
.cross {
font-size: 2rem;
}
.item-with-sub {
margin-right: 1.5rem;
}
.desktop {
display: none;
}
.responsive {
width: 100%;
display: block;
}
.nav {
align-items: center;
padding: 1.5rem;
}
.nav-list {
display: none;
flex-direction: column;
justify-content: center;
align-items: initial;
position: fixed;
width: 100%;
height: 20rem;
top: 11rem;
left: 0;
z-index: 2;
background-color: var(--white);
box-shadow: 0 0.2rem 0.4rem rgb(0 0 0 / 10%);
}
.menu-burger {
display: block;
background-color: transparent;
border: none;
font-size: 2.5rem;
padding: 0;
}
.mobile-menu-open {
display: flex;
}
.nav-list-item {
margin-bottom: 2.5rem;
}
}
@media (max-width: 500px) {
.item-with-sub {
margin-right: 1rem;
}
}
</style>

204
src/components/ImageItem.vue
View File

@@ -1,204 +0,0 @@
<template>
<div :class="status">
<div class="wrapper-image">
<button
:class="[{ selected }, 'button-image-item']"
:disabled="status === 'waiting-for-process'"
type="button"
@click="$emit('trigger')"
>
<div
v-if="status.length && (status === 'ready' || status === 'hidden')"
class="photo-img-wrapper"
>
<i v-if="status === 'hidden'" class="bi bi-eye-slash icon-hidden"></i>
<img
v-if="href"
:src="href"
alt=""
loading="lazy"
class="photo-img"
/>
</div>
<div
v-else-if="status.length && status === 'broken'"
class="waiting-wrapper error"
>
<i class="bi bi-exclamation-octagon icon-waiting"></i>
<span class="waiting info">{{ $t('pages.sequence.broken') }}</span>
</div>
<div v-else class="waiting-wrapper">
<i class="bi bi-card-image icon-waiting"></i>
<span class="waiting info">{{
$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>
<div
v-if="status.length && (status === 'ready' || status === 'hidden')"
class="photo-info"
>
<span v-if="created" class="info"
><i class="bi bi-clock"></i> {{ created }}</span
>
<div class="button-info">
<Link
look="button button--white-blue no-text"
icon="bi bi-cloud-download-fill"
type="external"
target="_blank"
:path-external="hrefHd"
/>
</div>
</div>
</button>
</div>
</div>
</template>
<script lang="ts" setup>
import Link from '@/components/Link.vue'
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,
validator: (value: string): boolean =>
['waiting-for-process', 'ready', 'hidden', 'broken', ''].includes(value),
default: ''
}
})
</script>
<style lang="scss" scoped>
.button-image-item {
background-color: transparent;
border: none;
width: 100%;
padding: 0;
position: relative;
}
.selected {
border: toRem(0.1) solid var(--blue);
border-radius: toRem(0.5);
box-shadow: 0px 4px 4px 0px #00000040;
}
.wrapper-image {
display: flex;
}
.photo-img-wrapper {
display: flex;
justify-content: center;
align-items: center;
border-top-right-radius: toRem(0.5);
border-top-left-radius: toRem(0.5);
height: toRem(16);
width: 100%;
object-fit: cover;
}
.photo-img {
height: 100%;
width: 100%;
border-radius: toRem(0.5);
}
.icon-hidden {
color: var(--grey-dark);
position: absolute;
font-size: toRem(4);
}
.waiting-wrapper {
height: toRem(16);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: var(--blue);
margin-right: toRem(1);
margin-left: toRem(1);
&.error {
color: var(--red);
}
}
.icon-waiting {
font-size: toRem(3);
margin-bottom: toRem(1);
}
.waiting-info {
text-align: center;
width: 100%;
color: var(--black);
width: fit-content;
}
.info {
@include text(xs-r-regular);
padding: toRem(0.5) toRem(0.8);
background-color: var(--white);
border-radius: toRem(0.5);
}
.icon-img {
top: toRem(1);
right: toRem(1);
background-color: var(--white);
border-radius: 50%;
position: absolute;
height: toRem(2);
width: toRem(2);
display: flex;
justify-content: center;
align-items: center;
font-size: toRem(1.3);
}
.pointer-map,
.button-check-pointer {
background-color: var(--orange);
}
.delete-checked {
opacity: 1;
}
.photo-info {
height: toRem(5);
display: flex;
justify-content: space-between;
align-items: center;
padding: toRem(1);
position: absolute;
bottom: 0;
width: 100%;
}
.button-image-item:hover {
.photo-img {
opacity: 0.5;
}
}
.hidden {
.photo-img,
.info {
opacity: 0.3;
}
&:hover {
.photo-img,
.info {
opacity: 1;
}
}
}
</style>

82
src/components/InformationCard.vue
View File

@@ -1,82 +0,0 @@
<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"
/>
<h3 v-if="title" class="subtitle">
{{ title }}
</h3>
</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 },
title: { 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(2) toRem(2) toRem(1.5);
background-color: var(--white);
border-radius: toRem(1.5);
display: flex;
align-items: flex-end;
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.2);
}
.subtitle {
@include text(h2);
color: var(--blue-dark);
}
.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>

81
src/components/InputCheckbox.vue
View File

@@ -1,81 +0,0 @@
<template>
<div class="wrapper-checkbox">
<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"
v-model="inputValue"
type="checkbox"
@input="updateValue(!inputValue)"
class="input"
/>
</div>
<label v-if="label && label.length" for="checkbox" class="label">{{
label
}}</label>
</div>
</template>
<script lang="ts" setup>
import { ref, watchEffect } from 'vue'
import type { CheckboxInterface } from '@/views/interfaces/MySequenceView'
const emit = defineEmits<{ (e: 'trigger', value: CheckboxInterface): void }>()
const props = defineProps({
name: { type: String, default: null },
label: { type: String, default: '' },
isChecked: { type: Boolean, default: false },
isIndeterminate: { type: Boolean, default: false }
})
let inputValue = ref<boolean>(props.isChecked)
const htmlCheckbox = <HTMLInputElement>document.getElementById('checkbox')
watchEffect(async () => {
if (htmlCheckbox) {
htmlCheckbox.indeterminate = props.isIndeterminate
}
})
function updateValue(value: boolean): void {
if (htmlCheckbox) {
htmlCheckbox.indeterminate = false
}
inputValue.value = value
emit('trigger', { isChecked: value, isIndeterminate: false })
}
</script>
<style lang="scss" scoped>
.input-checkbox {
position: relative;
display: flex;
justify-content: center;
align-items: center;
height: toRem(2);
width: toRem(2);
}
.input {
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
appearance: none;
cursor: pointer;
position: absolute;
height: 100%;
width: 100%;
}
.icon {
font-size: toRem(2);
position: absolute;
color: var(--grey-semi-dark);
}
.wrapper-checkbox {
display: flex;
align-items: center;
}
.label {
cursor: pointer;
margin-left: toRem(0.5);
}
</style>

115
src/components/InputUpload.vue
View File

@@ -1,115 +0,0 @@
<template>
<label
@dragover="dragover"
@dragleave="dragleave"
@drop="drop"
:class="['file-upload', { dragging: isDragging }]"
>
<input
ref="upload"
type="file"
multiple
:accept="accept"
class="input-file"
@change="changeFile"
/>
<i class="bi bi-cloud-upload-fill"></i>
<span v-if="text" class="input-text">
{{ text }}
<span v-if="textSecondPart" class="last-word">{{ textSecondPart }}</span>
</span>
<span v-if="textPictureType" class="input-text-type">{{
textPictureType
}}</span>
</label>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
const emit = defineEmits<{ (e: 'trigger', value: FileList): 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: '' }
})
interface HTMLInputChangeEvent extends Event {
target: HTMLInputElement & EventTarget
}
function changeFile(event: Event): void {
const { target } = event as HTMLInputChangeEvent
if (target && target.files) {
if (!checkPicturesType(target.files)) return
emit('trigger', target.files)
}
}
function dragover(event: DragEvent): void {
event.preventDefault()
isDragging.value = true
}
function dragleave(): void {
isDragging.value = false
}
function drop(event: DragEvent): void | boolean {
event.preventDefault()
const { dataTransfer } = event
if (dataTransfer && dataTransfer.files) {
if (!checkPicturesType(dataTransfer.files))
return (isDragging.value = false)
emit('trigger', dataTransfer.files)
isDragging.value = false
}
}
function checkPicturesType(files: FileList): number {
const picturesToUpload = [...files].filter((p) => p.type == 'image/jpeg')
return picturesToUpload.length
}
</script>
<style scoped lang="scss">
.file-upload {
padding: toRem(0.3) toRem(0.3) toRem(3);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
cursor: pointer;
}
.dragging {
border-color: var(--green);
background-color: var(--green-pale);
.last-word,
.bi-cloud-upload-fill {
color: var(--green);
}
}
.file-upload input {
overflow: hidden;
width: 0;
}
.bi-cloud-upload-fill {
color: var(--blue);
font-size: toRem(7);
}
.input-text {
font-size: toRem(2);
@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>

49
src/components/InstanceName.vue
View File

@@ -1,49 +0,0 @@
<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'
const instanceName = computed((): string | null => {
const instanceName = import.meta.env.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);
text-align: center;
}
</style>

46
src/components/License.vue
View File

@@ -1,46 +0,0 @@
<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>

177
src/components/Link.vue
View File

@@ -1,38 +1,33 @@
<template>
<a
v-if="type === 'external'"
:href="pathExternal"
:href="path"
:target="target"
:class="['default', look, { disabled }]"
:title="titleImg"
v-bind="$attrs"
@click="triggerButton"
@click="$emit('trigger')"
>
<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
:to="route"
:target="target"
:to="path"
:class="['default', look, { disabled }]"
:title="text"
>
<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'
const { t } = useI18n()
@@ -43,8 +38,7 @@ interface ImageInterface {
const props = defineProps({
text: { type: String, default: null },
route: { type: Object as PropType<RouteLocationRaw>, default: {} },
pathExternal: { type: String, default: '' },
path: { type: String, default: '' },
look: { type: String, default: '' },
type: { type: String, default: null },
alt: { type: String, default: '' },
@@ -57,125 +51,65 @@ const props = defineProps({
const titleImg = computed<string>(() =>
props.disabled ? t('general.header.contribute_text') : ''
)
function triggerButton() {
if (props.disabled) return
emit('trigger')
}
</script>
<style lang="scss" scoped>
.default {
@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: 0.8;
}
}
.icon {
color: var(--black);
font-size: toRem(2.4);
margin-right: toRem(1);
font-size: 2.4rem;
margin-right: 1rem;
}
.logo {
height: inherit;
border-radius: toRem(0.5);
margin-right: toRem(1);
}
.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;
}
}
.text {
width: 100%;
white-space: break-spaces;
.default {
@include text(s-regular);
display: flex;
align-items: center;
color: var(--black);
text-decoration: none;
}
.link:hover {
background-color: transparent;
text-decoration: underline;
}
.link--grey {
color: var(--grey-semi-dark);
text-decoration: underline;
font-weight: inherit;
.button {
height: 4.5rem;
border-radius: 0.5rem;
padding: 1.3rem 2rem 1.3rem;
background-color: var(--black);
color: var(--white);
}
.link--blue-dark {
color: var(--blue-dark);
.icon {
color: var(--blue-dark);
}
}
.link--blue {
color: var(--blue);
.icon {
color: var(--blue);
}
}
.button--white {
.white {
background-color: var(--white);
color: var(--black);
border: toRem(0.1) solid var(--black);
.icon {
font-size: toRem(1.6);
}
&:hover {
background-color: var(--black);
color: var(--white);
.icon {
color: var(--white);
}
}
border: 0.1rem solid var(--black);
}
.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);
}
.white .icon {
font-size: 1.6rem;
}
.button--blue {
background-color: var(--blue);
border: toRem(0.1) solid var(--blue);
.icon {
font-size: toRem(1.4);
color: var(--white);
}
.button:hover {
opacity: 0.9;
}
.button--blue-bleu {
background-color: var(--blue-semi);
color: var(--blue);
.white:hover {
background-color: var(--black);
color: var(--white);
}
.white:hover > .icon {
color: white;
}
.logo {
height: 4rem;
border-radius: 0.5rem;
}
.disabled {
color: grey;
cursor: not-allowed;
.icon {
color: grey;
cursor: not-allowed;
}
&:hover {
text-decoration: none;
}
}
.disabled .icon {
color: grey;
cursor: not-allowed;
}
.disabled:hover {
text-decoration: none;
}
.button--rounded {
background-color: var(--black);
@@ -184,32 +118,21 @@ function triggerButton() {
align-items: center;
border-radius: 50%;
padding: 0;
height: toRem(4);
width: toRem(4);
height: 4.5rem;
width: 4.5rem;
.icon {
color: var(--white);
font-size: toRem(2.8);
font-size: 2.8rem;
margin-right: 0;
}
}
.no-text {
height: toRem(3);
width: toRem(3);
padding: 0;
@media (max-width: 500px) {
.icon {
margin: auto;
}
}
@media (max-width: toRem(50)) {
.default {
min-height: toRem(4);
min-width: toRem(4);
}
.icon {
margin-right: toRem(0.5);
margin-right: 0.5rem;
}
.button {
padding-right: toRem(1);
padding-left: toRem(1);
padding-right: 1rem;
padding-left: 1rem;
}
.disable-mobile {
pointer-events: none;

87
src/components/Loader.vue
View File

@@ -1,87 +0,0 @@
<template>
<div :class="['lds-ring', look, { loaded: isLoaded }]">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</template>
<script setup lang="ts">
defineProps({
text: { type: String, default: null },
look: {
type: String,
validator: (value: string): boolean => ['sm', 'md', 'lg'].includes(value),
default: 'sm'
},
isLoaded: { type: Boolean, default: true }
})
</script>
<style scoped lang="scss">
.lds-ring {
position: relative;
display: flex;
justify-content: center;
align-items: center;
}
.lds-ring div {
box-sizing: border-box;
display: block;
position: absolute;
width: 256px;
height: 256px;
margin: 10px;
border: 10px solid var(--blue);
border-radius: 50%;
animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
border-color: var(--blue) transparent transparent transparent;
}
.loaded {
div {
border-color: var(--blue);
}
}
.sm {
width: toRem(8);
height: toRem(8);
div {
width: toRem(8.4);
height: toRem(8.4);
}
}
.md {
width: toRem(16);
height: toRem(16);
div {
width: toRem(16.8);
height: toRem(16.8);
}
}
.lg {
width: toRem(32);
height: toRem(32);
div {
width: toRem(25.6);
height: toRem(25.6);
}
}
.lds-ring div:nth-child(1) {
animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
animation-delay: -0.15s;
}
@keyframes lds-ring {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
</style>

99
src/components/Modal.vue
View File

@@ -1,99 +0,0 @@
<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>{{ $t('pages.upload.modal_error_title') }}</h5>
</div>
<div class="modal-body">
<ul>
<li v-for="item in uploadErrors" class="error-item">
<span>{{ item.name }} - </span>
<span>{{ item.message }}</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import type { PropType } from 'vue'
import { Modal } from 'bootstrap'
let bsModal = ref()
import type { uploadErrorInterface } from '@/views/interfaces/UploadPicturesView'
defineProps({
uploadErrors: {
type: Array as PropType<uploadErrorInterface[]>,
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);
}
.error-item {
padding: toRem(1);
&:nth-child(odd) {
background-color: var(--grey);
}
}
.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>

81
src/components/Pagination.vue
View File

@@ -1,81 +0,0 @@
<template>
<div
:class="['wrapper-pagination', { 'no-border': type.includes('double') }]"
>
<button
:disabled="linkDisabled"
:class="['pagination-button', { disabled: linkDisabled }]"
>
<i
v-if="type.length"
:class="`bi bi-chevron-${type} chevron`"
@click="triggerPagination"
></i>
</button>
</div>
</template>
<script setup lang="ts">
import { computed } from 'vue'
const emit = defineEmits<{ (e: 'trigger', value: string): void }>()
const props = defineProps({
href: { type: String, default: null },
selfLink: { type: Object, default: {} },
type: { type: String, default: '' }
})
const linkDisabled = computed((): boolean => {
return (
(props.type === 'double-left' || props.type === 'double-right') &&
props.href === props.selfLink.href
)
})
function triggerPagination(): void {
if (linkDisabled.value) return
emit('trigger', props.href)
}
</script>
<style lang="scss" scoped>
.wrapper-pagination {
border: toRem(0.1) solid var(--black);
border-radius: 50%;
background-color: var(--blue-pale);
height: toRem(3);
width: toRem(3);
display: flex;
&:first-child {
margin-right: toRem(2);
}
&:last-child {
margin-left: toRem(2);
}
&:nth-child(2) {
margin-right: toRem(1);
}
&:nth-child(3) {
margin-left: toRem(1);
}
}
.pagination-button {
background-color: transparent;
border: none;
font-size: toRem(1.7);
width: 100%;
display: flex;
align-items: center;
.chevron {
width: toRem(3.5);
}
}
.no-border {
border: none;
background-color: transparent;
}
.disabled {
cursor: default;
pointer-events: unset;
}
</style>

46
src/components/Terminal.vue
View File

@@ -8,15 +8,13 @@
<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>
<div class="entry-button-terminal">
<Button
look="button--transparent"
:text="$t('pages.share_pictures.button_copy')"
look="button--white"
:text="$t('pages.upload.button_copy')"
:icon="clipboardIcon"
@trigger="copyText(textInstall)"
class="entry-button"
@@ -24,15 +22,13 @@
</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>
<div class="entry-button-terminal">
<Button
look="button--transparent"
:text="$t('pages.share_pictures.button_copy')"
look="button--white"
:text="$t('pages.upload.button_copy')"
:icon="clipboardIcon"
@trigger="copyText(textUpload)"
class="entry-button"
@@ -69,22 +65,23 @@ async function copyText(text: string): Promise<void> {
.header {
display: flex;
align-items: center;
border-top-right-radius: toRem(1.5);
border-top-left-radius: toRem(1.5);
border-top-right-radius: 1.5rem;
border-top-left-radius: 1.5rem;
background-color: var(--grey);
padding-left: toRem(0.5);
height: toRem(3);
padding-left: 0.5rem;
height: 3rem;
width: 100%;
}
.editor {
border-bottom-right-radius: toRem(1.5);
border-bottom-left-radius: toRem(1.5);
border-bottom-right-radius: 1.5rem;
border-bottom-left-radius: 1.5rem;
background-color: var(--black-pale);
height: 32rem;
width: 100%;
position: relative;
}
.screen {
padding: toRem(2.5) toRem(2) toRem(1.5);
padding: 3rem 2rem 2rem;
height: 100%;
}
.screen:nth-child(2n) {
@@ -93,10 +90,10 @@ async function copyText(text: string): Promise<void> {
.upload-command {
display: flex;
align-items: center;
margin-top: toRem(1);
margin-top: 2rem;
}
.entry-button-terminal {
margin-top: toRem(2);
margin-top: 2rem;
margin-left: auto;
}
.code {
@@ -108,13 +105,13 @@ async function copyText(text: string): Promise<void> {
}
.tilde {
color: var(--green);
margin-right: toRem(1);
margin-right: 1rem;
}
.round {
height: toRem(1.5);
width: toRem(1.5);
height: 1.5rem;
width: 1.5rem;
border-radius: 50%;
margin: toRem(0.5);
margin: 0.5rem;
}
.red {
background-color: var(--red);
@@ -126,9 +123,12 @@ async function copyText(text: string): Promise<void> {
background-color: var(--green);
}
@media (max-width: toRem(50)) {
@media (max-width: 500px) {
.editor {
min-height: toRem(27);
min-height: 27rem;
}
.upload-command {
margin-top: 0;
}
}
</style>

70
src/components/Toast.vue
View File

@@ -1,70 +0,0 @@
<template>
<div :class="['toast-wrapper', look, { display: text.length }]">
<button class="button-close" @click="$emit('trigger')">
<i class="bi bi-x"></i>
</button>
<i v-if="look === 'error'" class="bi bi-exclamation-triangle"></i>
<i v-else class="bi bi-check-circle"></i>
<p v-if="text.length" class="toast-text">
{{ text }}
</p>
</div>
</template>
<script lang="ts" setup>
defineProps({
text: { type: String, default: '' },
look: {
type: String,
validator: (value: string): boolean =>
['success', 'error', ''].includes(value),
default: ''
}
})
</script>
<style lang="scss" scoped>
.toast-wrapper {
position: fixed;
right: 0;
bottom: toRem(2);
transform: translateX(100%);
display: flex;
justify-content: center;
align-items: center;
color: var(--white);
@include text(s-regular);
border-radius: toRem(0.5);
height: toRem(4);
min-width: toRem(10);
padding-right: toRem(1);
padding-left: toRem(1);
}
.button-close {
position: absolute;
top: toRem(-0.5);
right: toRem(-0.5);
height: toRem(1.8);
width: toRem(1.8);
border: toRem(0.1) solid var(--black);
background-color: var(--white);
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
}
.toast-text {
margin-bottom: 0;
margin-left: toRem(1);
}
.display {
transform: translateX(toRem(-3));
transition: transform 0.3s ease-in-out;
}
.error {
background-color: var(--red);
}
.success {
background-color: var(--green);
}
</style>

137
src/components/Viewer.vue
View File

@@ -1,137 +0,0 @@
<template>
<div id="viewer" class="entry-viewer"></div>
</template>
<script setup lang="ts">
import { onMounted, onUnmounted, ref } from 'vue'
import type { ViewerInterface } from '@/views/interfaces/common'
import { getIgnTiles } from '@/utils/mapAndViewer'
import { Viewer, StandaloneMap } from 'geovisio'
import { createUrlLink } from '@/utils'
import { createLink } from '@/components-viewer/reportLink'
import { useI18n } from 'vue-i18n'
const { t } = useI18n()
let mapIsLoaded = ref<boolean>(false)
let viewer = ref()
const props = defineProps({
fetchOptions: { type: Object, default: {} },
geovisioViewer: { type: Boolean, default: true },
bbox: { type: Array, default: null }
})
defineExpose({
viewer
})
onMounted(async () => {
const tiles = import.meta.env.VITE_TILES
const maxZoom = import.meta.env.VITE_MAX_ZOOM
const zoom = import.meta.env.VITE_ZOOM
const center = import.meta.env.VITE_CENTER
let paramsViewer: ViewerInterface
try {
if (props.geovisioViewer) {
paramsViewer = { map: { startWide: true } }
if (center && center !== '') {
const centerMap = center.split(',').map((el: string) => parseInt(el))
paramsViewer = {
map: {
...paramsViewer.map,
center: centerMap
}
}
}
if (zoom && zoom !== '') {
paramsViewer = {
map: {
...paramsViewer.map,
zoom: parseFloat(zoom)
}
}
}
if (maxZoom && maxZoom !== '') {
paramsViewer = {
map: {
...paramsViewer.map,
maxZoom: parseInt(maxZoom)
}
}
}
if (tiles) {
const style = tiles.includes('wxs.ign.fr') ? await getIgnTiles() : tiles
paramsViewer = {
map: {
...paramsViewer.map,
style
}
}
}
if (props.fetchOptions) {
paramsViewer = {
...paramsViewer,
...props.fetchOptions
}
}
const reportLink = document.createElement('div')
reportLink.className = 'gvs-group gvs-group-large gvs-group-btnpanel'
viewer.value = new Viewer(
'viewer', // Div ID
`${import.meta.env.VITE_API_URL}/api/search`,
{
...paramsViewer,
widgets: { customWidget: reportLink }
}
)
if (viewer.value && viewer.value.addEventListener) {
viewer.value.addEventListener(
'picture-loaded',
async (e: { detail: { picId: string } }): Promise<void> => {
const href = t('pages.home.report_mail', {
picId: e.detail.picId,
link: createUrlLink(e.detail.picId)
})
reportLink.innerHTML = createLink(
href,
t('pages.home.report_button_text')
)
}
)
}
} else {
let paramsMap = {}
if (tiles) {
const style = tiles.includes('wxs.ign.fr') ? await getIgnTiles() : tiles
paramsMap = {
...paramsMap,
style
}
}
viewer.value = new StandaloneMap(
'viewer', // Div ID
`${import.meta.env.VITE_API_URL}/api/search`,
{
...paramsMap
}
)
}
mapIsLoaded.value = true
} catch (err) {
console.log(err)
}
})
onUnmounted(() => {
if (viewer.value && props.geovisioViewer) viewer.value.destroy()
})
</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>

70
src/components/header/AccountButton.vue
View File

@@ -1,70 +0,0 @@
<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);
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>

162
src/components/header/HeaderOpen.vue
View File

@@ -1,162 +0,0 @@
<template>
<div :class="['nav-list', { 'menu-open': !menuIsClosed }]">
<ul class="responsive">
<li class="logged-link link-first">
<Link
:text="$t('general.header.contribute_text')"
:route="{ name: 'why-contribute' }"
look="link--blue-dark"
@click.native="$emit('triggerClose')"
/>
</li>
<li class="logged-link">
<Link
:text="$t('general.header.upload_text')"
look="button button--blue"
:route="{ name: 'upload-pictures' }"
@click.native="$emit('triggerClose')"
/>
</li>
</ul>
<div class="separator responsive"></div>
<ul>
<li class="logged-link responsive">
<Link
:text="$t('general.header.sequences_text')"
:route="{ name: 'my-sequences' }"
:image="{
url: 'icon/photos.svg',
alt: $t('general.header.alt_photos')
}"
look="link--blue-dark"
@click.native="$emit('triggerClose')"
/>
</li>
<li class="logged-link desktop">
<Link
:text="$t('general.header.contribute_text')"
:route="{ name: 'why-contribute' }"
:image="{
url: 'icon/photos.svg',
alt: $t('general.header.alt_photos')
}"
look="link--blue-dark"
@click.native="$emit('triggerClose')"
/>
</li>
<li v-if="userProfileUrlLength" class="logged-link">
<Link
:route="{ name: 'my-information' }"
:image="{
url: 'icon/information.svg',
alt: $t('general.header.alt_information')
}"
:text="$t('general.header.my_information_text')"
look="link--blue-dark"
@click.native="$emit('triggerClose')"
/>
</li>
<li class="logged-link">
<Link
:route="{ name: 'my-settings' }"
:image="{
url: 'icon/settings.svg',
alt: $t('general.header.alt_logo')
}"
:text="$t('general.header.my_settings_text')"
look="link--blue-dark"
@click.native="$emit('triggerClose')"
/>
</li>
<li class="logged-link">
<Link
type="external"
:text="$t('general.header.logout_text')"
:image="{
url: 'icon/logout.svg',
alt: $t('general.header.alt_logout')
}"
:path-external="getAuthRoute('auth/logout', route.path)"
look="link--blue-dark"
@click.native="$emit('triggerClose')"
/>
</li>
</ul>
</div>
</template>
<script setup lang="ts">
import { useRoute } from 'vue-router'
import { getAuthRoute } from '@/utils/auth'
const route = useRoute()
import Link from '@/components/Link.vue'
defineProps({
menuIsClosed: { type: Boolean, default: true },
userProfileUrlLength: { type: Number, default: 0 }
})
</script>
<style scoped lang="scss">
ul {
margin: 0;
padding: toRem(2) 0;
}
.nav-list {
display: none;
flex-direction: column;
justify-content: center;
align-items: initial;
position: absolute;
width: toRem(25);
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%);
border-radius: toRem(1);
padding: toRem(1) toRem(2);
}
.separator {
height: toRem(0.1);
background-color: var(--grey);
width: 100%;
margin-top: toRem(1);
margin-bottom: toRem(0.5);
}
.menu-open {
display: flex;
}
.logged-link {
padding: toRem(1);
display: flex;
}
.link-first {
margin-bottom: toRem(1);
}
.logged-link:hover {
border-radius: toRem(0.5);
background-color: var(--grey);
}
.responsive {
display: none;
}
.desktop {
display: flex;
}
@media (max-width: toRem(76.8)) {
.nav-list {
top: toRem(11);
width: 100%;
border-radius: initial;
}
.desktop {
display: none;
}
.responsive {
display: block;
}
.logged-link {
padding: toRem(0);
}
}
</style>

43
src/components/share-pictures/Card.vue
View File

@@ -1,43 +0,0 @@
<template>
<div class="wrapper-card">
<img :src="img(imgSrc)" :alt="imgAlt" class="image" />
<h2 class="subtitle">{{ title }}</h2>
<p class="description">{{ description }}</p>
</div>
</template>
<script lang="ts" setup>
import { img } from '../../utils/image'
defineProps({
title: { type: String, default: null },
description: { type: String, default: null },
imgSrc: { type: String, default: null },
imgAlt: { type: String, default: null }
})
</script>
<style lang="scss" scoped>
.wrapper-card {
display: flex;
flex-direction: column;
}
.subtitle {
@include text(h2);
max-width: toRem(25);
color: var(--blue-dark);
}
.image {
height: toRem(7);
width: fit-content;
margin-bottom: toRem(1);
}
.description {
margin: 0;
color: var(--grey-dark);
}
@media (max-width: toRem(76.8)) {
.subtitle {
max-width: 100%;
}
}
</style>

52
src/components/upload/PictureItem.vue
View File

@@ -1,52 +0,0 @@
<template>
<li :class="['uploaded-picture-item', look]">
<div class="uploaded-information">
<span v-if="itemUploadedText">{{ itemUploadedText }}</span>
</div>
<slot></slot>
</li>
</template>
<script setup lang="ts">
import { computed } from 'vue'
const props = defineProps({
name: { type: String, default: '' },
text: { type: String, default: '' },
look: {
type: String,
validator: (value: string): boolean =>
['error', 'success', 'default'].includes(value),
default: 'default'
}
})
const itemUploadedText = computed<string | null>(
() => `${props.name} - ${props.text}`
)
</script>
<style scoped lang="scss">
.uploaded-picture-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: toRem(1) toRem(2);
margin-top: toRem(1);
border-radius: toRem(0.5);
width: 100%;
@include text(s-regular);
}
.success {
background-color: var(--white);
border: toRem(0.1) solid var(--grey);
color: var(--black);
}
.error {
background-color: var(--white);
border: toRem(0.1) solid var(--red-pale);
color: var(--red);
}
.uploaded-information {
margin-right: toRem(1);
}
</style>

180
src/components/upload/UploadLoader.vue
View File

@@ -1,180 +0,0 @@
<template>
<div class="entry-loader">
<div class="wrapper-loader">
<div v-if="uploadedSequence" class="loader-title">
<span class="title">{{ uploadedSequence.title }}</span>
<div class="sequence-button">
<Link
:text="$t('pages.upload.sequence_link')"
:disabled="!isLoaded"
:route="{ name: 'sequence', params: { id: uploadedSequence.id } }"
look="button button--blue-bleu"
/>
</div>
</div>
<p v-if="isLoaded" class="text-information">
{{ $t('pages.upload.sequence_loaded_information') }}
</p>
<p v-else class="text-information">
{{ $t('pages.upload.sequence_loading_information') }}
</p>
<div v-if="!isLoaded" class="loading-block">
<div class="loader">
<span class="loader-percentage">{{ loadPercentage }}</span>
<Loader look="md" :is-loaded="isLoaded" />
</div>
<div v-if="uploadedSequence" class="loader-information">
<div class="wrapper-picture-count">
<span class="picture-length">{{
uploadedSequence.pictures.length
}}</span>
<span> / </span>
<span>{{ picturesCount }}</span>
</div>
<span>{{ $t('pages.upload.images_count_text') }}</span>
</div>
</div>
<div v-else class="loaded-block">
<img src="@/assets/images/success.svg" alt="" />
<p>{{ $t('pages.upload.upload_done') }}</p>
</div>
</div>
<div
v-if="uploadedSequence && uploadedSequence.picturesOnError.length"
class="error-wrapper"
>
<div class="error-corpus">
<i class="bi bi-exclamation-triangle"></i>
<span class="error-text">{{
$t('pages.upload.pictures_error', {
count: uploadedSequence.picturesOnError.length
})
}}</span>
</div>
<Button
:text="$t('pages.upload.error_button')"
look="button button--red"
@trigger="$emit('triggerModal')"
/>
</div>
</div>
</template>
<script setup lang="ts">
import Loader from '@/components/Loader.vue'
import Link from '@/components/Link.vue'
import Button from '@/components/Button.vue'
import type { PropType } from 'vue'
import type { SequenceInterface } from '@/views/interfaces/UploadPicturesView'
defineProps({
loadPercentage: { type: String, default: '0%' },
isLoaded: { type: Boolean, default: false },
uploadedSequence: {
type: Object as PropType<SequenceInterface | null>,
default: null
},
picturesCount: { type: Number, default: null }
})
</script>
<style scoped lang="scss">
.entry-loader {
display: flex;
flex-direction: column;
justify-content: space-between;
height: 93%;
}
.wrapper-loader {
display: flex;
flex-direction: column;
align-items: center;
margin-top: toRem(3);
height: 100%;
}
.loader {
position: relative;
display: flex;
justify-content: center;
align-items: center;
}
.loader-percentage {
width: toRem(10);
position: absolute;
text-align: center;
@include text(xxl-regular);
color: var(--blue);
}
.loader-information {
margin-top: toRem(2);
display: flex;
align-items: center;
flex-direction: column;
}
.loader-title {
width: 100%;
@include text(m-regular);
color: var(--blue-dark);
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: toRem(1);
}
.sequence-button {
width: fit-content;
}
.text-information {
@include text(s-r-regular);
margin-bottom: toRem(4);
width: 100%;
}
.wrapper-picture-count {
@include text(xxl-regular);
}
.picture-length {
color: var(--blue);
font-weight: 860;
}
.error-wrapper {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
border-left: toRem(1.4) solid var(--red-pale);
background-color: var(--orange-pale);
padding: toRem(2);
border-radius: toRem(1.5);
}
.error-corpus {
color: var(--red-pale);
@include text(m-regular);
margin-bottom: toRem(1);
}
.error-text {
margin-left: toRem(0.5);
}
.loading-block,
.loaded-block {
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.loaded-block {
color: var(--green);
img {
margin-bottom: toRem(2);
}
}
@media (max-width: toRem(102.4)) {
.loader-title {
flex-direction: column;
align-items: flex-start;
}
.title {
margin-bottom: toRem(1.5);
}
}
</style>

13
src/composables/auth.ts
View File

@@ -3,15 +3,14 @@ import { onMounted, ref } from 'vue'
import type { AuthConfigInterface } from './interfaces/Auth'
export default function authConfig() {
const authConf = ref<AuthConfigInterface>()
const authConf = ref<AuthConfigInterface>({})
async function getConfig(): Promise<AuthConfigInterface> {
const { data } = await axios.get('api/configuration', {
withCredentials: false
})
return data
async function getConfig(): Promise<object> {
const { data } = await axios.get(
`${import.meta.env.VITE_API_URL}api/configuration`
)
return data.auth
}
onMounted(async () => (authConf.value = await getConfig()))
return { authConf }
}

12
src/composables/interfaces/Auth.ts
View File

@@ -1,7 +1,7 @@
export interface AuthConfigInterface {
license?: { id: string; url: string }
auth?: {
enabled?: boolean
user_profile?: { url?: string }
}
interface UserProfileInterface {
url?: string
}
export interface AuthConfigInterface {
enabled?: boolean
user_profile?: UserProfileInterface
}

183
src/locales/fr.json
View File

@@ -1,179 +1,52 @@
{
"general": {
"title": "Instance Panoramax",
"title": "Instance Panoramax IGN",
"meta": {
"title": "Instance Panoramax",
"title": "Instance Panoramax IGN",
"description": "Panoramax, l’alternative libre pour photo-cartographier les territoires"
},
"header": {
"login_text": "Connexion",
"register_text": "Inscription",
"contribute_text": "Pourquoi contribuer ?",
"my_account": "Mon compte",
"upload_text": "+ Partager des photos",
"sequences_text": "Mes photos",
"contribute_text": "Partager vos photos",
"contribute_text_responsive": "Verser",
"alt_logo": "Logo de l'instance",
"alt_photos": "Icone représentant des photos",
"alt_information": "Icone représentant un utilisateur",
"alt_settings": "Icone des paramètres",
"alt_logout": "Icone représentant un bouton de déconnexion",
"title": "Panoramax",
"beta_text": "Version beta",
"title": "Instance Panoramax IGN",
"logout_text": "Déconnexion",
"my_information_text": "Mes informations",
"my_settings_text": "Mes paramètres",
"login_text": "Connexion",
"burger_menu_aria_label_open": "Afficher le menu",
"burger_menu_aria_label_closed": "Masquer le menu"
},
"footer": {
"panoramax_site": "Découvrir Panoramax",
"information_gitlab": "Voir le code",
"gitlab_logo": "Logo Gitlab",
"ay11_text": "Accessibilité : non conforme"
},
"error_text": "Une erreur est survenue",
"success_text": "Mise à jour réussie"
"feature_not_available": "Fonctionnalité en cours de développement"
},
"pages": {
"home": {
"report_mail": "?subject=⚠️ Signalement sur l`image {picId}&body=Bonjour, %0D%0A%0D%0A Problème sur l`image (garder le type de problème signalé) : %0D%0A%0D%0A contenu inapproprié / absence de floutage sur un élément à anonymiser ou flouter pour des raisons de sécurité /surfloutage (floutage en trop) %0D%0A%0D%0A Lien vers la photo concernée : {link} %0D%0A%0D%0A Précision sur les éléments concernés (en particulier pour les problèmes de floutage - que faut-il flouter ou déflouter?) :",
"report_mail_subject": "⚠️ Signalement sur l'image {id}",
"report_mail_body": "Bonjour, %0D%0A%0D%0A Problème sur l'image (garder le type de problème signalé) : %0D%0A%0D%0A contenu inapproprié / absence de floutage sur un élément à anonymiser ou flouter pour des raisons de sécurité /surfloutage (floutage en trop) %0D%0A%0D%0A Lien vers la photo concernée : {link} %0D%0A%0D%0A Précision sur les éléments concernés (en particulier pour les problèmes de floutage - que faut-il flouter ou déflouter?) : ",
"report_button_text": "Signaler la photo"
},
"settings": {
"title": "Mes Tokens",
"setting_tooltip": "Afficher ou masquer le token"
},
"sequence": {
"sequence_published": "Publiée",
"sequence_waiting": "En cours de publication",
"sequence_hidden": "Masquée",
"hide_sequence_tooltip": "Masque la séquence sur la carte",
"delete_sequence_tooltip": "Supprime définitivement la séquence",
"hide_photo_tooltip": "Masque les photos sur la carte",
"delete_photo_tooltip": "Supprime définitivement les photos",
"confirm_pictures_dialog": "⚠️ Les photos sélectionnées vont être définitivement supprimées",
"confirm_sequence_dialog": "⚠️ La séquence va être définitivement supprimée",
"created": "Versement :",
"taken": "Prise de vue :",
"duration": "Durée :",
"duration_begin": "Début :",
"duration_end": "Fin :",
"camera": "Matériel :",
"button_delete": "Supprimer",
"button_disable": "Masquer",
"button_enable": "Afficher",
"picture_selected": "{count} photo sélectionnée| {count} photos sélectionnées",
"hours": "{count} heure| {count} heures",
"minutes": "{count} minute| {count} minutes",
"seconds": "{count} seconde| {count} secondes",
"select_text": "Tout sélectionner",
"unselect_text": "Tout désélectionner",
"select_shift_text": "Sélectionnez plusieurs photos avec shift",
"waiting_process": "Photo en cours de traitement",
"broken": "Traitement de la photo en erreur",
"no_image": "Aucune photo dans cette séquence"
},
"sequences": {
"title": "Mes séquences de photos",
"sequence_name": "Nom",
"sequence_photos": "Photos",
"sequence_date": "Prise de vue",
"sequence_creation": "Versement",
"sequence_status": "Statut",
"sequence_published": "Publiée",
"sequence_waiting": "En cours de publication",
"sequence_hidden": "Masquée",
"no_sequences_text": "Vous n'avez pas encore de photos publiées \uD83D\uDE22",
"button_upload": "Partager vos photos",
"sequence_deleted": "La séquence a bien été supprimée"
},
"share_pictures": {
"title": "Pourquoi contribuer à la base de photographies de Panoramax ?",
"description": "Contribuer à Panoramax, c'est participer au développement d'un géo-commun, une ressource numérique souveraine, libre et réutilisable. Chaque photo géolocalisée publiée sur Panoramax est utilisable par tous et pour des usages variés, par exemple par une collectivité territoriale qui a besoin d'observer l’état de la voirie ou par un opérateur de télécommunications pour préparer une intervention.\n\nChaque contributeur peut envoyer ses séquences d'images, les modifier et les consulter tout comme l'ensemble des vues - 360° ou non - versées par la communauté. Le floutage obligatoire des visages et plaques d'immatriculation est automatisé sur la plateforme.",
"alt_img_map": "Illustration d'une femme qui regarde une carte avec son smartphone geolocalisé",
"card_photo1": "Des lieux visibles depuis la voie publique",
"card_photo2": "Des photos publiées au format 360° ou non",
"card_photo3": "Des photos facilement réutilisables",
"card_photo4": "Une contribution en images facile et rapide",
"card_alt_photo1": "Image qui représente un immeuble",
"card_alt_photo2": "Image qui représente des photos 360 degrés",
"card_alt_photo3": "Image qui représente une carte avec un pointeur",
"card_alt_photo4": "Image qui représente un pointeur",
"card_description1": "Toutes les photos prises depuis la voie publique sont concernées, dès lors qu'elles sont géolocalisées et vues du sol.",
"card_description2": "Le format 360° n'est pas obligatoire : des photos prises via un smartphone suffisent, dates, lieux et format jpg sont les seuls pre-requis.",
"card_description3": "Toutes les photos facilement accessible et réutilisables sans compte : via le site web ou une API standard (format STAC).",
"card_description4": "Plusieurs outils sont mis à disposition pour faciliter les contributions dont une ligne de commande et une interface web.",
"upload_subtitle": "Chargez vos images simplement en ligne",
"upload_illustration_alt": "Illustration qui représente l'envoie de photo en ligne",
"upload_description": "L'application web de Panoramax vous permet de déposer toutes vos photos de terrain au format jpg d'un simple clic. Aucune notion de programmation n'est nécessaire. Pour les envois en grand nombre, il est toutefois conseillé de faire appel à l'outil en ligne de commande",
"upload_button": "+ Partager des images",
"command_line_subtitle": "L'outil en ligne de commande",
"comment_install": "Installer l’outil en ligne de commande geovisio",
"comment_upload": "Lancez la commande de versement d’images sur le dossier choisi",
"description_terminal": "<a href='https://gitlab.com/geovisio/cli' target='_blank' style='color:black'>L'outil en ligne de commande</a> vous permet de partager de grands volumes de photos. La procédure est simple et vous devez disposer <a target='_blank' href='https://www.python.org/downloads/' style='color:black'>de python (au moins la version 3.8)</a>.\n\nL’outil demandera vos informations de connexion avant l'import. Une fois les données chargées, un temps de traitement est nécessaire pour les rendre disponibles.",
"terminal_install": "pip install geovisio_cli",
"terminal_text": "geovisio upload --api-url {url} <DOSSIER_PHOTOS>",
"button_copy": "Copier",
"information_subtitle": "Ici, vos photos sont accessibles à tous : ",
"information_text1": "Automatiquement floutées dans le respect de la législation.",
"information_text2": "Les données déposées seront publiées sous {word}",
"information_text3": "Sous forme «brute» pour des réutilisations variées (ex: préparation des chantiers).",
"information_about_title": "Besoin de récupérer les données ?",
"information_about_description": "Une API est mise à disposition pour récupérer toutes les données. <a href='{docLink}' target='_blank' style='color:#0a1f69'>\nRetrouvez sa documentation ici</a>\nLes données sont aussi exposées sous forme <a href='{docTiles}' target='_blank' style='color:#0a1f69'>de tuiles vectorielles</a>",
"doc_subtitle": "Besoin d'aide pour contribuer à Panoramax ?",
"doc_description": "Nous mettons à disposition l’ensemble de la documentation relative à Panoramax et vous pouvez accéder aux tutoriels sur le forum des géo-communs.",
"doc_button": "Voir la documentation",
"doc_illustration_alt": "Illustration représentant un personnage avec un feuillet de documents"
"title": "Mes Tokens"
},
"upload": {
"title": "Contribuez à la base de photographies de Panoramax",
"description": "Pour le versement d'un grand volume de photographies, l'outil en ligne de commande est plus adapté.",
"know_more_button": "En savoir plus",
"input_label": "Glissez vos images ici ou cliquez sur ",
"import_word": "importer",
"import_type": "Format JPEG uniquement",
"subtitle_import": "Dépôt des images",
"text_import": "Déposez ici vos fichiers jpg. Chaque image ou série d’images constitue une “séquence”. Vous pourrez ensuite les retrouver dans la section « mes images » et choisir de les masquer, les afficher ou les supprimer.",
"subtitle_process": "Traitements de l'import",
"uploading_process": "Téléchargement en cours...",
"sequence_title": "Séquence du ",
"import": "Imports",
"upload_pending": "Transfert en cours...",
"images_count_text": "Images chargées",
"no_img_text": "aucune image chargée actuellement",
"upload_done": "Le chargement de la séquence est terminé",
"sequence_link": "Accéder à cette séquence",
"pictures_error": "{count} image n'a pas pu être chargée| {count} image n'ont pas pu être chargées",
"sequence_loading_information": "Une fois chargée, la séquence sera en traitement et accessible sur Panoramax dans les prochaines minutes.",
"sequence_loaded_information": "La séquence est chargée et est en cours de traitement. Elle sera accessible sur Panoramax dans quelques minutes.",
"leave_message": "⚠️ Attention, le téléchargement sera interrompu si vous quittez la page avant la fin.",
"error_button": "Afficher les erreurs",
"modal_error_title": "Liste des photos non chargés"
},
"ay11": {
"title": "Déclaration d’accessibilité",
"date": "Établie le 18 septembre 2023.",
"introduction": "IGN s’engage à rendre son service accessible, conformément à l’article 47 de la loi n° 2005-102 du 11 février 2005.\n Cette déclaration d’accessibilité s’applique à Panoramax Instance IGN : https://panoramax.ign.fr",
"subtitle_conformity": "État de conformité",
"conformity_text": "Panoramax Instance IGN est non conforme avec le ",
"conformity_text2": "Le site n’a encore pas été audité.",
"subtitle_conformity2": "Contenus non accessibles",
"subtitle_increase": "Amélioration et contact",
"increase_text": "Si vous n’arrivez pas à accéder à un contenu ou à un service, vous pouvez\n contacter le responsable de Panoramax Instance IGN pour être orienté vers une alternative accessible ou obtenir le contenu sous une autre forme.",
"phone": "Téléphone : +33 14 398 84 61",
"email_text": "E-mail :",
"email": "signalement.ign@panoramax.fr",
"address": "Adresse : IGN, Saint-Mandé",
"increase_info": "Nous essayons de répondre dans les 5 jours ouvrés.",
"subtitle_to_do": "Voie de recours",
"to_do_text": "Cette procédure est à utiliser dans le cas suivant : vous avez signalé au responsable du site internet un défaut d’accessibilité qui vous\n empêche d’accéder à un contenu ou à un des services du portail et vous n’avez pas obtenu de réponse satisfaisante. \n vous pouvez :",
"write_message": "Écrire un message au",
"defenseur_droits": "Défenseur des droits",
"contact": "Contacter",
"contact_text": "le délégué du Défenseur des droits dans votre région",
"send_letter": "Envoyer un courrier par la poste (gratuit, ne pas mettre de\n timbre):\n Défenseur des droits\n Libre réponse 71120 75342 Paris CEDEX 07",
"end": "Cette déclaration d’accessibilité a été créé le\n 18 septembre 2023 grâce au",
"generator_betagouv": "Générateur de Déclaration d’Accessibilité de BetaGouv"
"title": "Partagez vos photos",
"sub_title": "Un compte utilisateur est obligatoire pour partager des photos",
"photo_type1": "Des lieux visibles depuis la voie publique",
"photo_type2": "360° ou non",
"photo_type3": "Vues du sol",
"photo_type4": "Géolocalisées",
"description": "Ici, vos photos sont accessibles à tous :\n\n{check} automatiquement floutées dans le respect de <a href='https://panoramax.fr/foire-aux-questions' target='_blank' style='color:black'>la législation</a>\n{check} libres de droit, <a href='https://www.etalab.gouv.fr/licence-ouverte-open-licence/' target='_blank' style='color:black'>sous licence ouverte</a>\n{check} sous forme «brute» pour des réutilisations variées (ex: préparation des chantiers)\n\n",
"footer_block": "⚠️️️ Aujourd'hui, le versement de grands volumes d'images est possible via une ligne de commande. Bientôt, d'autres moyens de versement seront disponibles, notamment via une interface web.",
"button": "Accéder à l'outil",
"alt_img_upload": "Image qui représente plusieurs photos en cours de téléchargement",
"title_terminal": "Utilisez la ligne de commande",
"footer_description_terminal": "Les données déposées seront sous <a href='https://www.etalab.gouv.fr/licence-ouverte-open-licence/' target='_blank' style='color:#808080'>la licence ouverte</a>.",
"cli_title": "Vous voulez accéder à plus de documentation ?",
"user_account_button": "Créer un compte",
"description_terminal": "<a href='https://gitlab.com/geovisio/cli' target='_blank' style='color:black'>L'outil en ligne de commande</a> vous permet de partager de grands volumes de photos. La procédure est simple et vous devez disposer <a target='_blank' href='https://www.python.org/downloads/' style='color:black'>de python (au moins la version 3.8)</a>.\n\n1. Installer l’outil en ligne de commande geovisio\n2. Lancez la commande de versement d’images sur le dossier choisi. Après '--api-url', renseignez l'url de l'api de l'instance où partager les photos et le chemin vers votre dossier de photos sur votre machine. L’outil demandera vos informations de connexion avant l'import. Une fois les données chargées, un temps de traitement est nécessaire pour les rendre disponibles.",
"terminal_install": "pip install geovisio_cli",
"terminal_text": "geovisio upload --api-url https://panoramax.ign.fr <DOSSIER_PHOTOS>",
"button_copy": "Copier"
}
}
}

7
src/main.ts
View File

@@ -6,15 +6,13 @@ import axios from 'axios'
import VueAxios from 'vue-axios'
import { globalCookiesConfig } from 'vue3-cookies'
import { createMetaManager } from 'vue-meta'
import { pinia } from './store'
import fr from './locales/fr.json'
import './assets/main.scss'
import './assets/main.css'
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap/dist/js/bootstrap.js'
import 'bootstrap-icons/font/bootstrap-icons.css'
import 'geovisio/build/index.css'
axios.defaults.baseURL = import.meta.env.VITE_API_URL
axios.defaults.withCredentials = true
const i18n = createI18n({
locale: 'fr',
@@ -32,7 +30,6 @@ globalCookiesConfig({
const app = createApp(App)
app.use(pinia)
app.use(i18n)
app.use(router)
app.use(VueAxios, axios)

96
src/router/index.ts
View File

@@ -1,22 +1,13 @@
import { createRouter, createWebHistory } from 'vue-router'
import { useCookies } from 'vue3-cookies'
import type {
RouteRecordRaw,
NavigationGuardNext,
RouteLocationNormalized
} from 'vue-router'
import type { RouteRecordRaw } from 'vue-router'
import axios from 'axios'
import { getAuthRoute } from '@/utils/auth'
import HomeView from '../views/HomeView.vue'
import MyInformationView from '../views/MyInformationView.vue'
import MySettingsView from '../views/MySettingsView.vue'
import MySequencesView from '../views/MySequencesView.vue'
import MySequenceView from '../views/MySequenceView.vue'
import SharePicturesView from '../views/SharePicturesView.vue'
import UploadPicturesView from '../views/UploadPicturesView.vue'
import Ay11View from '../views/Ay11View.vue'
import UploadView from '../views/UploadView.vue'
const { cookies } = useCookies()
let routes: Array<RouteRecordRaw> = [
const routes: Array<RouteRecordRaw> = [
{
path: '/',
name: 'home',
@@ -33,78 +24,31 @@ let routes: Array<RouteRecordRaw> = [
component: MySettingsView
},
{
path: '/mes-sequences',
name: 'my-sequences',
component: MySequencesView
},
{ path: '/sequence/:id', name: 'sequence', component: MySequenceView },
{
path: '/pourquoi-contribuer',
name: 'why-contribute',
component: SharePicturesView
},
{
path: '/envoyer',
name: 'upload-pictures',
component: UploadPicturesView
path: '/partager-des-photos',
name: 'upload',
component: UploadView
}
]
if (window.location.href.includes('.ign.')) {
routes = [
...routes,
{
path: '/accessibilite',
name: 'ay11',
component: Ay11View
}
]
}
const router = createRouter({
history: createWebHistory(),
routes
})
router.beforeResolve(
async (
to: RouteLocationNormalized,
from: RouteLocationNormalized,
next: NavigationGuardNext
) => {
const siteLoggedRoutes =
to.name === 'my-settings' ||
to.name === 'my-sequences' ||
to.name === 'upload-pictures'
if (siteLoggedRoutes) {
if (!isSiteLogged()) goToLoginPage(to.path)
else return next()
router.beforeEach(async (to, from, next) => {
if (to.name === 'my-information' || to.name === 'my-settings') {
try {
const loginUrl = `${import.meta.env.VITE_API_URL}api/auth/login`
const isKeycloakLogout = await axios.get(loginUrl)
const isSiteLogin = !!cookies.get('user_id')
if (isKeycloakLogout || !isSiteLogin) {
const win: Window = window
win.location = `${loginUrl}?next_url=${from.path}`
} else next()
} catch (e) {
next()
}
if (to.name === 'my-information') {
try {
const keycloakLogout = await isKeycloakLogout()
if (keycloakLogout.status >= 300 || !isSiteLogged()) {
return goToLoginPage(to.path)
} else return next()
} catch (e) {
return goToLoginPage(to.path)
}
}
next()
}
)
function isSiteLogged(): boolean {
return !!cookies.get('user_id')
}
async function isKeycloakLogout(): Promise<{ status: number }> {
const loginUrl = `/api/users/me`
return await axios.get(loginUrl)
}
function goToLoginPage(path: string): void {
window.location.replace(getAuthRoute('auth/login', path))
}
} else next()
})
export default router

2
src/store/index.ts
View File

@@ -1,2 +0,0 @@
import { createPinia } from 'pinia'
export const pinia = createPinia()

17
src/store/sequence.ts
View File

@@ -1,17 +0,0 @@
import { defineStore } from 'pinia'
export const useSequenceStore = defineStore('sequence', {
state: () => ({
toastText: <string>'',
toastLook: <string>''
}),
actions: {
addToastText(text: string, look: string): void {
this.toastText = text
this.toastLook = look
setTimeout(() => {
this.toastText = ''
}, 3000)
}
}
})

11
src/tests/cypress/e2e/home.cy.ts Normal file
View File

@@ -0,0 +1,11 @@
describe('In the home page', () => {
it('click on the link in the header to go to the upload page', () => {
cy.visit('/')
cy.fixture('home').then((homeData) => {
cy.contains(homeData.textLinkUpload).click()
cy.url().should('include', '/partager-des-photos')
})
})
})
export {}

2
cypress/e2e/login.cy.ts → src/tests/cypress/e2e/login.cy.ts
View File

@@ -1,6 +1,6 @@
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.visit('https://geovisio-backend-dev.osc-fr1.scalingo.io/api/auth/login')
cy.get('#password').type('coucouc')
})
})

22
src/tests/cypress/e2e/upload.cy.ts Normal file
View File

@@ -0,0 +1,22 @@
describe('In the upload page', () => {
it('go to the login page', () => {
cy.visit('partager-des-photos')
cy.fixture('upload').then((uploadData) => {
cy.contains(uploadData.textButtonUpload).click()
})
})
it('go to the login page', () => {
cy.visit('partager-des-photos')
cy.fixture('upload').then((uploadData) => {
cy.contains(uploadData.textButtonUpload).click()
})
})
it('go to the cli page', () => {
cy.visit('partager-des-photos')
cy.fixture('upload').then((uploadData) => {
cy.contains(uploadData.textButtonCli).click()
})
})
})
export {}

5
src/tests/cypress/fixtures/home.json Normal file
View File

@@ -0,0 +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": "Partager vos photos"
}

4
src/tests/cypress/fixtures/upload.json Normal file
View File

@@ -0,0 +1,4 @@
{
"textButtonUpload": "Créer un compte",
"textButtonCli": "Accéder à l'outil"
}

0
cypress/support/commands.ts → src/tests/cypress/support/commands.ts
View File

0
cypress/support/e2e.ts → src/tests/cypress/support/e2e.ts
View File

2
src/tests/unit/components/BetaText.spec.js
View File

@@ -1,6 +1,6 @@
import { it, describe, expect } from 'vitest'
import { shallowMount } from '@vue/test-utils'
import BetaText from '../../../components/InstanceName.vue'
import BetaText from '../../../components/BetaText.vue'
import { createI18n } from 'vue-i18n'
import fr from '../../../locales/fr.json'

127
src/tests/unit/components/Button.spec.js
View File

@@ -1,127 +0,0 @@
import { test, describe, expect } from 'vitest'
import { shallowMount } from '@vue/test-utils'
import Button from '../../../components/Button.vue'
import i18n from '../config'
describe('Template', () => {
describe('Props', () => {
test('should have default props', () => {
const wrapper = shallowMount(Button, {
global: {
plugins: [i18n]
}
})
expect(wrapper.vm.icon).toBe(null)
expect(wrapper.vm.disabled).toBe(false)
expect(wrapper.vm.isLoading).toBe(false)
expect(wrapper.vm.text).toBe('')
expect(wrapper.vm.tooltip).toBe('')
expect(wrapper.vm.look).toBe('')
expect(wrapper.vm.type).toBe('button')
})
})
describe('When the component is disabled', () => {
test('should render the button with disabled class', () => {
const wrapper = shallowMount(Button, {
global: {
plugins: [i18n]
},
props: {
disabled: true
}
})
expect(wrapper.html()).contains('class="default disabled"')
})
})
describe('When the component is loading', () => {
test('should render the button with disabled class', () => {
const wrapper = shallowMount(Button, {
global: {
plugins: [i18n]
},
props: {
isLoading: true
}
})
expect(wrapper.html()).contains('class="default disabled"')
})
})
describe('When the component have an icon', () => {
test('should render the button the icon displayed', () => {
const wrapper = shallowMount(Button, {
global: {
plugins: [i18n]
},
props: {
icon: 'my-icon'
}
})
expect(wrapper.html()).contains('<i')
expect(wrapper.html()).contains('class="my-icon icon"')
})
})
describe('When the component have a type submit', () => {
test('should render the type to submit', () => {
const wrapper = shallowMount(Button, {
global: {
plugins: [i18n]
},
props: {
type: 'submit'
}
})
expect(wrapper.html()).contains('type="submit"')
})
})
describe('When the component have tooltip', () => {
test('should render the button with a tooltip', () => {
const wrapper = shallowMount(Button, {
global: {
plugins: [i18n]
},
props: {
tooltip: 'my tooltip'
}
})
expect(wrapper.html()).contains(
'class="tooltip-button">my tooltip</span>'
)
})
})
describe('When the component have a text', () => {
test('should render the button with a text', () => {
const wrapper = shallowMount(Button, {
global: {
plugins: [i18n]
},
props: {
text: 'My text'
}
})
expect(wrapper.html()).contains('class="text">My text</span>')
})
})
describe('When the component have specific look', () => {
test('should render the button with a specific class', () => {
const wrapper = shallowMount(Button, {
global: {
plugins: [i18n]
},
props: {
look: 'my--look'
}
})
expect(wrapper.html()).contains('class="my--look default"')
})
})
describe('When the button is trigger', () => {
test('should emit', async () => {
const wrapper = shallowMount(Button, {
global: {
plugins: [i18n]
}
})
await wrapper.trigger('click')
expect(wrapper.emitted()).toHaveProperty('trigger')
})
})
})

159
src/tests/unit/components/Header.spec.js
View File

@@ -1,21 +1,10 @@
import { vi, it, beforeEach, describe, expect } from 'vitest'
import { shallowMount, mount } from '@vue/test-utils'
import { shallowMount } from '@vue/test-utils'
import { createI18n } from 'vue-i18n'
import { createRouter, createWebHistory } from 'vue-router'
import { useCookies } from 'vue3-cookies'
import fr from '../../../locales/fr.json'
import Header from '../../../components/Header.vue'
vi.mock('vue-router')
vi.mock('vue3-cookies', () => {
const mockCookies = {
get: vi.fn()
}
return {
useCookies: () => ({
cookies: mockCookies
})
}
})
const i18n = createI18n({
locale: 'fr',
fallbackLocale: 'fr',
@@ -26,97 +15,86 @@ const i18n = createI18n({
}
})
const router = createRouter({
history: createWebHistory(),
routes: []
})
describe('Template', () => {
beforeEach(async () => {
const VueRouter = await import('vue-router')
VueRouter.useRoute.mockReturnValueOnce({
path: 'my-path'
})
})
describe('When the user is not logged', () => {
describe('When the user is in desktop', () => {
it('should render the component with the desktop entries', async () => {
import.meta.env.VITE_API_URL = 'api-url/'
const wrapper = mount(Header, {
global: {
plugins: [i18n, router],
mocks: {
$t: (msg) => msg
}
it('should render the component with good wording keys', async () => {
import.meta.env.VITE_API_URL = 'api-url/'
const wrapper = shallowMount(Header, {
global: {
plugins: [i18n],
mocks: {
$t: (msg) => msg
}
})
expect(wrapper.html()).contains('class="wrapper-logo desktop"')
expect(wrapper.html()).contains('logo.jpeg"')
expect(wrapper.html()).contains('class="wrapper-instance"')
expect(wrapper.html()).contains('general.header.title')
expect(wrapper.html()).contains(
'class="desktop" data-test="button-login-desktop"'
)
expect(wrapper.html()).contains('api-url/api/auth/login')
expect(wrapper.html()).contains('general.header.login_text')
expect(wrapper.html()).contains('general.header.register_text')
}
})
expect(wrapper.html()).contains('general.header.contribute_text')
expect(wrapper.html()).contains(
'general.header.contribute_text_responsive'
)
})
describe('When the user is in mobile', () => {
it('should render the component with the responsive entries', async () => {
import.meta.env.VITE_API_URL = 'api-url/'
const wrapper = mount(Header, {
global: {
plugins: [i18n, router],
mocks: {
$t: (msg) => msg
}
it('should render the component login link', async () => {
import.meta.env.VITE_API_URL = 'api-url/'
const wrapper = shallowMount(Header, {
global: {
plugins: [i18n],
mocks: {
$t: (msg) => msg
}
})
expect(wrapper.html()).contains('class="responsive entry-instance"')
expect(wrapper.html()).contains('general.header.title')
expect(wrapper.html()).contains('class="wrapper-logo responsive"')
expect(wrapper.html()).contains('logo.jpeg')
expect(wrapper.html()).contains(
'class="responsive" data-test="button-login-responsive"'
)
expect(wrapper.html()).contains('api-url/api/auth/login')
expect(wrapper.html()).contains('general.header.login_text')
expect(wrapper.html()).contains('general.header.register_text')
})
})
describe('When the user is in desktop OR in mobile', () => {
it('should render the component with the commons entries', async () => {
import.meta.env.VITE_API_URL = 'api-url/'
const wrapper = mount(Header, {
global: {
plugins: [i18n, router],
mocks: {
$t: (msg) => msg
}
}
})
expect(wrapper.html()).contains('general.header.contribute_text')
}
})
expect(wrapper.html()).contains('path="api-url/api/auth/login')
})
})
describe('When the user is logged', () => {
it('should render the component with good wording keys', async () => {
vi.spyOn(useCookies().cookies, 'get').mockReturnValue('user_id=id')
beforeEach(async () => {
Object.defineProperty(document, 'cookie', {
value: 'user_id=abc123'
})
vi.resetModules()
import.meta.env.VITE_API_URL = 'api-url/'
})
it('should render the component with good wording keys', async () => {
const wrapper = shallowMount(Header, {
props: {
authEnabled: true,
userProfileUrl: 'profil'
},
global: {
plugins: [i18n, router],
plugins: [i18n],
mocks: {
$t: (msg) => msg
}
}
})
expect(wrapper.html()).contains('<header-open')
expect(wrapper.html()).contains('general.header.sequences_text')
expect(wrapper.html()).contains('general.header.upload_text')
expect(wrapper.html()).contains('data-test="link-logged-upload"')
expect(wrapper.html()).contains('<account-button')
expect(wrapper.html()).contains('username="UI"')
expect(wrapper.html()).contains('general.header.contribute_text')
expect(wrapper.html()).contains(
'general.header.contribute_text_responsive'
)
expect(wrapper.html()).contains('general.header.my_information_text')
expect(wrapper.html()).contains('general.header.logout_text')
})
it('should render the component logout link', async () => {
const wrapper = shallowMount(Header, {
props: {
authEnabled: true,
userProfileUrl: 'profil'
},
global: {
plugins: [i18n],
mocks: {
$t: (msg) => msg
}
}
})
expect(wrapper.html()).contains('chevron bi bi-chevron-up')
expect(wrapper.html()).contains('auth/logout')
expect(wrapper.html()).contains('path="mes-informations"')
})
})
})
@@ -133,7 +111,7 @@ describe('Methods', () => {
it('Menu should be closed by default', () => {
wrapper = shallowMount(Header, {
global: {
plugins: [i18n, router],
plugins: [i18n],
mocks: {
$t: (msg) => msg
}
@@ -142,5 +120,20 @@ describe('Methods', () => {
expect(wrapper.vm.menuIsClosed).toBe(true)
})
it('Should be open and close by clicking', async () => {
wrapper = shallowMount(Header, {
global: {
plugins: [i18n],
mocks: {
$t: (msg) => msg
}
}
})
await wrapper.find('.menu-burger').trigger('click')
expect(wrapper.vm.menuIsClosed).toBe(false)
await wrapper.find('.menu-burger').trigger('click')
expect(wrapper.vm.menuIsClosed).toBe(true)
})
})
})

159
src/tests/unit/components/ImageItem.spec.js
View File

@@ -1,159 +0,0 @@
import { it, describe, expect } from 'vitest'
import { shallowMount } from '@vue/test-utils'
import ImageItem from '../../../components/ImageItem.vue'
describe('Template', () => {
describe('Props', () => {
it('should have default props', () => {
const wrapper = shallowMount(ImageItem, {
global: {
mocks: {
$t: (msg) => msg
}
}
})
expect(wrapper.vm.created).toBe(null)
expect(wrapper.vm.href).toBe(null)
expect(wrapper.vm.hrefHd).toBe(null)
expect(wrapper.vm.selected).toBe(false)
expect(wrapper.vm.selectedOnMap).toBe(false)
expect(wrapper.vm.status).toBe('')
})
})
describe('When the component have default props filled', () => {
it('should render the component with a href, a hrefHd and a date', () => {
const wrapper = shallowMount(ImageItem, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
created: '10 mars 2023',
href: 'my-url',
hrefHd: 'my-url-hd',
status: 'ready'
}
})
expect(wrapper.html()).contains('<img')
expect(wrapper.html()).contains('src="my-url"')
expect(wrapper.html()).contains('<link-stub')
expect(wrapper.html()).contains('10 mars 2023')
})
})
describe('When the component is selected', () => {
it('should render the component with the selected class', () => {
const wrapper = shallowMount(ImageItem, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
selected: true
}
})
expect(wrapper.html()).contains('class="selected button-image-item"')
})
})
describe('When the component is ready', () => {
it('should render the component with the status class', () => {
const wrapper = shallowMount(ImageItem, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
href: 'my-url',
status: 'ready'
}
})
expect(wrapper.html()).contains('src="my-url"')
expect(wrapper.html()).contains('class="ready"')
})
})
describe('When the component is waiting-for-process', () => {
it('should render the component with waiting-for-process classes and elements', () => {
const wrapper = shallowMount(ImageItem, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
status: 'waiting-for-process',
href: 'my-url'
}
})
expect(wrapper.html()).contains('class="waiting-for-process"')
expect(wrapper.html()).contains('pages.sequence.waiting_process')
expect(wrapper.html()).contains('class="bi bi-card-image icon-waiting"')
})
})
describe('When the component is selected on the map but not selected', () => {
it('should render the component with the map pointer', () => {
const wrapper = shallowMount(ImageItem, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
selectedOnMap: true,
selected: false
}
})
expect(wrapper.html()).contains('class="icon-img pointer-map"')
})
})
describe('When the component is selected but not selected on the map', () => {
it('should render the component with the check icon', () => {
const wrapper = shallowMount(ImageItem, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
selectedOnMap: false,
selected: true
}
})
expect(wrapper.html()).contains('class="bi bi-check-lg"')
expect(wrapper.html()).contains('class="icon-img button-check"')
})
})
describe('When the component is selected and selected on the map', () => {
it('should render the component with the check icon', () => {
const wrapper = shallowMount(ImageItem, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
selectedOnMap: true,
selected: true
}
})
expect(wrapper.html()).contains('class="icon-img button-check-pointer"')
expect(wrapper.html()).contains('class="bi bi-check-lg"')
})
})
describe('When the button is trigger', () => {
it('should emit', () => {
const wrapper = shallowMount(ImageItem, {
global: {
mocks: {
$t: (msg) => msg
}
}
})
wrapper.vm.$emit('trigger')
expect(wrapper.emitted().trigger).toBeTruthy()
})
})
})

99
src/tests/unit/components/InputCheckbox.spec.js
View File

@@ -1,99 +0,0 @@
import { it, describe, expect } from 'vitest'
import { shallowMount } from '@vue/test-utils'
import InputCheckbox from '../../../components/InputCheckbox.vue'
describe('Template', () => {
describe('Props', () => {
it('should have default props', () => {
const wrapper = shallowMount(InputCheckbox, {
global: {
mocks: {
$t: (msg) => msg
}
}
})
expect(wrapper.vm.name).toBe(null)
expect(wrapper.vm.label).toBe('')
expect(wrapper.vm.isChecked).toBe(false)
expect(wrapper.vm.isIndeterminate).toBe(false)
})
})
describe('When the component have a label', () => {
it('should render the component with a href, a hrefHd and a date', () => {
const wrapper = shallowMount(InputCheckbox, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
label: 'my label'
}
})
expect(wrapper.html()).contains('class="label"')
expect(wrapper.html()).contains('my label')
})
})
describe('When the component is checked', () => {
it('should render the component with the checked icon', () => {
const wrapper = shallowMount(InputCheckbox, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
isChecked: true,
isIndeterminate: false
}
})
expect(wrapper.html()).contains('class="icon bi bi-check-square"')
})
})
describe('When the component is not checked', () => {
it('should render the component with the not checked icon', () => {
const wrapper = shallowMount(InputCheckbox, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
isChecked: false,
isIndeterminate: false
}
})
expect(wrapper.html()).contains('class="icon bi bi-square"')
})
})
describe('When the component is not checked', () => {
it('should render the component with the not checked icon', () => {
const wrapper = shallowMount(InputCheckbox, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
isChecked: false,
isIndeterminate: true
}
})
expect(wrapper.html()).contains('class="icon bi bi-dash-square"')
})
})
describe('When the input is trigger', () => {
it('should emit', () => {
const wrapper = shallowMount(InputCheckbox, {
global: {
mocks: {
$t: (msg) => msg
}
}
})
wrapper.vm.$emit('trigger', true)
expect(wrapper.emitted().trigger).toBeTruthy()
expect(wrapper.emitted().trigger[0][0]).toEqual(true)
})
})
})

84
src/tests/unit/components/Link.spec.js
View File

@@ -1,23 +1,11 @@
import { test, describe, vi, expect } from 'vitest'
import { shallowMount } from '@vue/test-utils'
import { mount, shallowMount } from '@vue/test-utils'
import Link from '../../../components/Link.vue'
import { createI18n } from 'vue-i18n'
import { createRouter, createWebHistory } from 'vue-router'
import fr from '../../../locales/fr.json'
import { useI18n } from 'vue-i18n'
vi.mock('vue-i18n')
const i18n = createI18n({
locale: 'fr',
fallbackLocale: 'fr',
globalInjection: true,
legacy: false,
messages: {
fr
}
})
const router = createRouter({
history: createWebHistory(),
routes: []
useI18n.mockReturnValue({
t: (tKey) => tKey
})
const stubs = {
'router-link': {
@@ -25,17 +13,37 @@ const stubs = {
}
}
describe('Template', () => {
describe('Props', () => {
test('should have default props', () => {
const wrapper = shallowMount(Link, {
describe('Snapshot', () => {
test('Should match snapshot with external link', () => {
const wrapper = mount(Link, {
global: {
plugins: [i18n, router]
stubs
},
props: {
type: 'external',
text: 'My-text',
path: 'my-path',
target: '_blank'
}
})
expect(wrapper.element).toMatchSnapshot()
})
test('Should match snapshot with internal link', () => {
const wrapper = shallowMount(Link, {
props: {
text: 'My-text',
path: 'my-path'
}
})
expect(wrapper.element).toMatchSnapshot()
})
})
describe('Props', () => {
test('should have default props', () => {
const wrapper = shallowMount(Link)
expect(wrapper.vm.text).toBe(null)
expect(wrapper.vm.route).toStrictEqual({})
expect(wrapper.vm.pathExternal).toBe('')
expect(wrapper.vm.path).toBe('')
expect(wrapper.vm.look).toBe('')
expect(wrapper.vm.type).toBe(null)
expect(wrapper.vm.alt).toBe('')
@@ -49,8 +57,7 @@ describe('Template', () => {
test('should render the component as a <a>', () => {
const wrapper = shallowMount(Link, {
global: {
stubs,
plugins: [i18n]
stubs
},
props: {
type: 'external'
@@ -61,8 +68,7 @@ describe('Template', () => {
test('should render an icon inside the link', () => {
const wrapper = shallowMount(Link, {
global: {
stubs,
plugins: [i18n]
stubs
},
props: {
type: 'external',
@@ -74,8 +80,7 @@ describe('Template', () => {
test('should render the text inside the link', () => {
const wrapper = shallowMount(Link, {
global: {
stubs,
plugins: [i18n]
stubs
},
props: {
type: 'external',
@@ -87,8 +92,7 @@ describe('Template', () => {
test('should render an image inside the link', () => {
const wrapper = shallowMount(Link, {
global: {
stubs,
plugins: [i18n]
stubs
},
props: {
type: 'external',
@@ -105,8 +109,7 @@ describe('Template', () => {
test('should render the text inside the link', () => {
const wrapper = shallowMount(Link, {
global: {
stubs,
plugins: [i18n]
stubs
},
props: {
type: 'external',
@@ -119,18 +122,11 @@ describe('Template', () => {
describe('When the component is an internal link', () => {
test('should render the component as an internal link', () => {
const wrapper = shallowMount(Link, {
global: {
plugins: [i18n, router]
}
})
const wrapper = shallowMount(Link)
expect(wrapper.html()).contains('<router-link')
})
test('should render an icon inside the link', () => {
const wrapper = shallowMount(Link, {
global: {
plugins: [i18n]
},
props: {
type: 'internal',
icon: 'my-icon'
@@ -140,20 +136,14 @@ describe('Template', () => {
})
test('should render the text inside the link', () => {
const wrapper = shallowMount(Link, {
global: {
plugins: [i18n, router]
},
props: {
text: 'my-text'
}
})
expect(wrapper.html()).contains('my-text')
})
test('should render the disabled attribute', () => {
test('should render the text inside the link', () => {
const wrapper = shallowMount(Link, {
global: {
plugins: [i18n, router]
},
props: {
disabled: true
}

45
src/tests/unit/components/Loader.spec.js
View File

@@ -1,45 +0,0 @@
import { it, describe, expect } from 'vitest'
import { shallowMount } from '@vue/test-utils'
import Loader from '../../../components/Loader.vue'
import i18n from '../config'
describe('Template', () => {
describe('Props', () => {
it('should have default props', () => {
const wrapper = shallowMount(Loader, {
global: {
plugins: [i18n]
}
})
expect(wrapper.vm.text).toBe(null)
expect(wrapper.vm.look).toBe('sm')
expect(wrapper.vm.isLoaded).toBe(true)
})
})
describe('When the component is loading', () => {
it('should not have the loaded class', () => {
const wrapper = shallowMount(Loader, {
global: {
plugins: [i18n]
},
props: {
isLoaded: false
}
})
expect(wrapper.html()).contains('class="lds-ring sm"')
})
})
describe('When the component have a look', () => {
it('should have a look classe', () => {
const wrapper = shallowMount(Loader, {
global: {
plugins: [i18n]
},
props: {
look: 'md'
}
})
expect(wrapper.html()).contains('class="lds-ring md loaded"')
})
})
})

75
src/tests/unit/components/Pagination.spec.js
View File

@@ -1,75 +0,0 @@
import { it, describe, expect } from 'vitest'
import { shallowMount } from '@vue/test-utils'
import Pagination from '../../../components/Pagination.vue'
describe('Template', () => {
describe('Props', () => {
it('should have default props', () => {
const wrapper = shallowMount(Pagination, {
global: {
mocks: {
$t: (msg) => msg
}
}
})
expect(wrapper.vm.href).toBe(null)
expect(wrapper.vm.selfLink).toStrictEqual({})
expect(wrapper.vm.type).toBe('')
})
})
describe('When the component is the last or the first page', () => {
it('should render the component without border', () => {
const wrapper = shallowMount(Pagination, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
type: 'double-left'
}
})
expect(wrapper.html()).contains('class="wrapper-pagination no-border"')
})
})
describe('When the component is disabled', () => {
it('should render the component a disabled state', () => {
const href = 'my-url'
const wrapper = shallowMount(Pagination, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
type: 'double-left',
href,
selfLink: { href }
}
})
expect(wrapper.html()).contains('class="pagination-button disabled"')
})
})
describe('When the button is trigger', () => {
it('should emit', () => {
const href = 'my-url'
const wrapper = shallowMount(Pagination, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
type: 'left',
href,
selfLink: { href: 'self-link' }
}
})
wrapper.vm.$nextTick()
wrapper.vm.$emit('trigger', href)
expect(wrapper.emitted().trigger).toBeTruthy()
expect(wrapper.emitted().trigger[0][0]).toEqual(href)
})
})
})

19
src/tests/unit/components/Terminal.spec.js
View File

@@ -4,7 +4,7 @@ import { createI18n } from 'vue-i18n'
import Terminal from '../../../components/Terminal.vue'
import Button from '../../../components/Button.vue'
import fr from '../../../locales/fr.json'
import * as copyToClipboardModule from '../../../utils/copyToClipboard'
import { updateClipboard } from '../../../utils/copyToClipboard'
const i18n = createI18n({
locale: 'fr',
@@ -26,7 +26,7 @@ describe('Template', () => {
}
}
})
expect(wrapper.html()).contains('pages.share_pictures.button_copy')
expect(wrapper.html()).contains('pages.upload.button_copy')
})
it('should render the view with the button', () => {
const wrapper = shallowMount(Terminal, {
@@ -39,7 +39,7 @@ describe('Template', () => {
})
expect(wrapper.html()).contains('<button')
expect(wrapper.html()).contains('icon="bi bi-clipboard-plus"')
expect(wrapper.html()).contains('look="button--transparent"')
expect(wrapper.html()).contains('look="button--white"')
})
})
describe('Props', () => {
@@ -89,7 +89,7 @@ describe('Methods', () => {
vi.useFakeTimers()
})
afterEach(() => {
vi.useRealTimers()
vi.restoreAllMocks()
})
const wrapper = mount(Terminal, {
global: {
@@ -101,20 +101,15 @@ describe('Methods', () => {
}
}
})
const updateClipboardMock = vi.spyOn(
copyToClipboardModule,
'updateClipboard'
)
updateClipboardMock.mockReturnValue(true)
vi.mock('../../../utils/copyToClipboard')
updateClipboard.mockReturnValue(true)
const spy = vi.spyOn(wrapper.vm, 'copyText')
const buttonWrapper = wrapper.findComponent(Button)
await buttonWrapper.vm.$emit('trigger')
expect(spy).toHaveBeenCalled()
expect(updateClipboardMock).toHaveBeenCalled()
expect(updateClipboard).toHaveBeenCalled()
expect(wrapper.vm.uploadIsCopied).toBe(true)
})
})

68
src/tests/unit/components/Toast.spec.js
View File

@@ -1,68 +0,0 @@
import { it, describe, expect } from 'vitest'
import { shallowMount } from '@vue/test-utils'
import Toast from '../../../components/Toast.vue'
describe('Template', () => {
describe('Props', () => {
it('should have default props', () => {
const wrapper = shallowMount(Toast, {
global: {
mocks: {
$t: (msg) => msg
}
}
})
expect(wrapper.vm.text).toBe('')
expect(wrapper.vm.look).toStrictEqual('')
})
})
describe('When the component have look and text filled', () => {
it('should render the component with the error and the display class', () => {
const wrapper = shallowMount(Toast, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
text: 'my text error',
look: 'error'
}
})
expect(wrapper.html()).contains('class="toast-wrapper error display"')
expect(wrapper.html()).contains('class="bi bi-exclamation-triangle"')
expect(wrapper.html()).contains('my text error')
})
it('should render the component with the success and the display class', () => {
const wrapper = shallowMount(Toast, {
global: {
mocks: {
$t: (msg) => msg
}
},
props: {
text: 'my text success',
look: 'success'
}
})
expect(wrapper.html()).contains('class="toast-wrapper success display"')
expect(wrapper.html()).contains('class="bi bi-check-circle"')
expect(wrapper.html()).contains('my text success')
})
})
describe('When the button is trigger', () => {
it('should emit', () => {
const wrapper = shallowMount(Toast, {
global: {
mocks: {
$t: (msg) => msg
}
}
})
wrapper.vm.$emit('trigger')
expect(wrapper.emitted().trigger).toBeTruthy()
})
})
})

38
src/tests/unit/components/__snapshots__/Link.spec.js.snap Normal file
View File

@@ -0,0 +1,38 @@
// Vitest Snapshot v1
exports[`Template > Snapshot > Should match snapshot with external link 1`] = `
<a
class="default"
data-v-409c8661=""
href="my-path"
target="_blank"
title=""
>
<!--v-if-->
<!--v-if-->
<span
class="text"
data-v-409c8661=""
>
My-text
</span>
</a>
`;
exports[`Template > Snapshot > Should match snapshot with internal link 1`] = `
<router-link
class="default"
data-v-409c8661=""
title="My-text"
to="my-path"
>
<!--v-if-->
<!--v-if-->
<span
class="text"
data-v-409c8661=""
>
My-text
</span>
</router-link>
`;

Some files were not shown because too many files have changed in this diff Show More