From 3de72438cc1ee51f33c556f89945c00ed8ccc24c Mon Sep 17 00:00:00 2001
From: ncastejon <castejon.nicolas@gmail.com>
Date: Thu, 23 Jan 2020 17:04:43 +0100
Subject: [PATCH] Improve a little the style.
---
...ture.PNG => web-app-project-structure.png} | Bin
docs/components/custom-apps/web-app.md | 36 +++++++++---------
docs/extra.css | 9 +++++
mkdocs.yml | 2 +
4 files changed, 29 insertions(+), 18 deletions(-)
rename docs/assets/{web-app-project-structure.PNG => web-app-project-structure.png} (100%)
create mode 100644 docs/extra.css
diff --git a/docs/assets/web-app-project-structure.PNG b/docs/assets/web-app-project-structure.png
similarity index 100%
rename from docs/assets/web-app-project-structure.PNG
rename to docs/assets/web-app-project-structure.png
diff --git a/docs/components/custom-apps/web-app.md b/docs/components/custom-apps/web-app.md
index af51dd7..0b7814a 100644
--- a/docs/components/custom-apps/web-app.md
+++ b/docs/components/custom-apps/web-app.md
@@ -123,6 +123,24 @@ To do so, a `variables.scss` file that contains our project variables, overrides
* interactions
* detail of a data on map feature click
+For each geographical dataset it's possible to display the data on a map. Here is what have been done to make this happen.
+
+Mapbox GL JS
+
+On the client side, the library [Mapbox GL JS](https://github.com/mapbox/mapbox-gl-js) is used. This is a very interesting tool improving quickly. The only drawback using it with Angular is that we cannot always use its last version. Indeed as we are using Typescript, we need to wait until the @types are updated.
+
+### Styling
+
+Mapbox use the [Mapbox style specification](https://docs.mapbox.com/mapbox-gl-js/style-spec/) to define the visual appearance of a map.
+In our project we have created different styles depending on how we want to display the map. For example when we display the aerial layer, we don't necessary want the names of, say the roads and the river, to have the same color than when we display the vectorial layer.
+So when we change these layers, we load the appropriate style.
+
+### How is the data fetched ?
+
+Initially we were using Web Feature Service (WFS) and Web Map Service protocols to get the data (geojson or images). But for WFS we realized that when our needs became more complex and precise, this could sometimes be not so easy (filters are not the most funny thing to do).
+So we used...Elasticsearch. It is super fast and even have geographical research. We fetch the data from ES, format it into a `.geojson` and voilà ! This will also allow us in the future to have more advanced features on the map (like filters).
+
+
#### Fullscreen
#### Toggle Map/data
@@ -148,24 +166,6 @@ Here are the features existing on the portal:
Of course there is a plenty of room for improvements for these features (and for new ones). ES is very powerful but also very complex to master. It's in a constant improvement.
-## Map features
-
-For each geographical dataset it's possible to display the data on a map. Here is what have been done to make this happen.
-
-### Mapbox GL JS
-
-On the client side, the library [Mapbox GL JS](https://github.com/mapbox/mapbox-gl-js) is used. This is a very interesting tool improving quickly. The only drawback using it with Angular is that we cannot always use its last version. Indeed as we are using Typescript, we need to wait until the @types are updated.
-
-### Styling
-
-Mapbox use the [Mapbox style specification](https://docs.mapbox.com/mapbox-gl-js/style-spec/) to define the visual appearance of a map.
-In our project we have created different styles depending on how we want to display the map. For example when we display the aerial layer, we don't necessary want the names of, say the roads and the river, to have the same color than when we display the vectorial layer.
-So when we change these layers, we load the appropriate style.
-
-### How is the data fetched ?
-
-Initially we were using Web Feature Service (WFS) and Web Map Service protocols to get the data (geojson or images). But for WFS we realized that when our needs became more complex and precise, this could sometimes be not so easy (filters are not the most funny thing to do).
-So we used...Elasticsearch. It is super fast and even have geographical research. We fetch the data from ES, format it into a `.geojson` and voilà ! This will also allow us in the future to have more advanced features on the map (like filters).
## API & Downloads feature
diff --git a/docs/extra.css b/docs/extra.css
new file mode 100644
index 0000000..27e17f3
--- /dev/null
+++ b/docs/extra.css
@@ -0,0 +1,9 @@
+body {
+ background: #f2f2f2;
+}
+
+.md-content {
+ background: white;
+ border: 1px solid #dcd9d9;
+ margin-bottom: 2rem;
+}
\ No newline at end of file
diff --git a/mkdocs.yml b/mkdocs.yml
index 236d07f..8d34cd1 100644
--- a/mkdocs.yml
+++ b/mkdocs.yml
@@ -17,6 +17,8 @@ theme:
feature:
tabs: false
+extra_css: [extra.css]
+
markdown_extensions:
- plantuml_markdown:
server: http://www.plantuml.com/plantuml
--
GitLab