Multiple languages ​​for the narrative web and optional other additions (#1051)

* Navweb: multi-language configuration.
* Navweb: multi-language exec, navigation menu, css
* Navweb: make css responsive for multi-language
* Language menu must work with a non english lang
* Avoid to copy common files for each language
* Use cms and archive in multi-languages
* Add the default index.
* Some cleanup.
* Images: performances improvement with image_size

Need to use the magic library (python-magic, python3-magic, ...)
If this library don't exist on the system, continue to use the Gdk method.

- force archive if we use CMS
- remove some unused code
- some strings are not translatable
- stay on the same page when you change language
- add image in the ancestor tree for all levels and not for the first 5

performances:
- copy images and thumbs only for the first language
* Some minor corrections and performances test
* Update comments for methods and functions
* Narweb: add show tags option
* Try to translate tags and suppress the colon (:)
* Narweb: integrate of webcal for multilang use
For each lang, we use the related calendar if it exists
* Death string only translated for the locale lang
* set correct url for extrapage.
* Add optional toggle for html sections
* show birth and death date if close option selected
* No background in references section with Mainz css
* Remove photo from list incompatible with multilang
* Add the first photo to the place page marker
* Add associated persons.
* Solves 'undefined' in map popup.
* Calendar: Set the background for the current day
* Thumbnail align problem with long description.
* Set the contact page date to the note date
* Add a scroll to top button.
* Increase the nb of generations since we can scroll
* Difficult to see the "go to top" icon.
* Better management for the toggle switch

data/css/Web_Basic-Blue.css

@@ -254,6 +254,7 @@ p#user_header {
 div#nav, #subnavigation {
     border: solid 1px #EEE; /* needed by IE7 */
     background-color: #13A926;
+    position: relative;
 }
 #subnavigation ul {
     overflow: hidden;
@@ -291,6 +292,33 @@ div#nav ul li.CurrentSection a {
 #nav ul li.CurrentSection a:hover {
     background-color: #903;
 }
+div#nav li.lang {
+    font-size: 12px;
+    font-weight: bold;
+    padding-top: .5em;
+}
+div#nav li.lang:hover > ul {
+    visibility: visible;
+    opacity: 1;
+}
+div#nav ul.lang {
+    position: absolute;
+    visibility: hidden;
+    opacity: 0;
+    z-index: 999;
+    background-color: #EEE;
+    border-bottom: solid 1px #999;
+    padding: 2px 1px;
+    top: -1em;
+}
+div#nav ul.lang:hover {
+    float: initial;
+}
+div#nav ul.lang li {
+    float: none;
+    font-size: larger;
+    padding: 0px;
+}
 
 /* Webcal
 ----------------------------------------------------- */
@@ -470,6 +498,21 @@ div#nav::after {
     .content {
         padding: 0em 0.5em;
     }
+    .lang {
+        position: relative;
+    }
+    .lang > .lang {
+        top: 0;
+        left: 100%;
+        margin-top: -6px;
+        margin-left: -1px;
+        -webkit-border-radius: 0 6px 6px 6px;
+        -moz-border-radius: 0 6px 6px 6px;
+        border-radius: 0 6px 6px 6px;
+    }
+    .lang:hover > .lang {
+        display: block;
+    }
 }
 
 /* Main Table
@@ -652,6 +695,10 @@ div#RelationshipList, div#RelationshipDetail {
 div#RelationshipDetail div#FamilyDetail table.infolist tbody tr td {
     border: none;
 }
+div.content table.tags {
+    text-align: left;
+    width: auto;
+}
 
 /* Places
 =================================================----- */
@@ -1393,7 +1440,8 @@ div.Residence table.infolist tr td {
 #indivgallery .thumbnail {
     margin: 0;
     float: left;
-    width: 130px;
+    width: 160px;
+    height: 220px;
     text-align: center;
     background-color: white;
 }
@@ -1835,3 +1883,43 @@ body#fullyearlinked #YearGlance tbody td:hover .date {
     border-radius: 45px;
     border: 5px solid;
 }
+h4 button.icon {
+    width: 0.9em;
+    border: 0px solid;
+    padding: 0;
+    opacity: 1;
+    transform: rotate(90deg);
+    transition: transform 200ms ease-out 0s;
+    background: transparent;
+}
+h4 button.icon-close {
+    transform: rotate(90deg);
+    transition: transform 0.2s linear;
+}
+h4 button.icon-open {
+    transform: rotate(180deg);
+    transition: transform 0.2s linear;
+}
+svg {
+  fill: #13A926;
+}
+/* Go to the top of the page */
+#gototop {
+  display: none;
+  position: fixed;
+  bottom: 10px;
+  right: 20px;
+  z-index: 999;
+  border: none;
+  background-color: transparent;
+  color: black;
+  cursor: pointer;
+  border-radius: 4px;
+  width: 40px;
+  height: 40px;
+  padding: 0px;
+}
+
+#gototop:hover {
+  background-color: #BCEAF6;
+}