Update CSS following user feedback

See @fodevaux's
https://talk.incommon.cc/t/cartographie-wallonie-demain-cet-automne/302/13

1 files changed, 49 insertions, 17 deletions

diff --git a/assets/css/style.css b/assets/css/style.css
index aadc2f8..60bc3e3 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -1,8 +1,8 @@
 @charset 'UTF-8';
 @import 'normalize.css';
 @import 'main.css';
-@import 'MarkerCluster.css'
-@import 'MarkerCluster.Default.css'
+@import 'MarkerCluster.css';
+@import 'MarkerCluster.Default.css';
 
 
 :root {
@@ -54,26 +54,58 @@ body > aside > nav > ul h3 {
     position: relative;
     max-width: 100%;
 }
-body > aside > nav > ul h3 span {
-    position: relative;
-    border: 0.4rem solid #0009;
-    border-style: solid; /* Chrome up to 61 #5 */
-    display: inline-block;
-    float: right;
-    width: 0.5rem;
-    height: 0.5rem;
-    top: 0.4rem;
-    border-radius: 50%;
-
+body > aside > nav > ul span {
+  position: relative;
+  border: 0.05rem solid #0009;
+  border-style: solid; /* Chrome up to 61 #5 */
+  display: inline-block;
+  float: left;
+  width: 0.6rem;
+  height: 0.8rem;
+  top: 0.5rem;
+  margin-right: 0.5rem;
+}
+body > aside nav h3::after {
+  position: relative;
+  content: '\25bc';
+  float: right;
+  font-size: 10pt;
+  top: 0.5rem;
 }
 body > aside > nav > ul h3 span.selected {
     border-color: #fff0;
     background-color: #0009;
 }
 body > aside > nav > ul > li ul { display: none; }
-body > aside > nav > ul > li.active ul { display: block; }
-
-body > aside > nav > ul > li.active li.active { text-align: right; }
+body > aside > nav > ul > li.active ul {
+  display: block;
+  margin-left: 1.5rem;
+}
+
+body > aside > nav > ul > li.active > ul > li::before {
+  content: '';
+  position: relative;
+  border: 0.05rem solid #0009;
+  border-style: solid; /* Chrome up to 61 #5 */
+  display: inline-block;
+  float: left;
+  width: 0.6rem;
+  height: 0.8rem;
+  margin-right: 0.5rem;
+}
+
+body > aside > nav > ul > li.active > ul > li.active::before {
+  content: '';
+  position: relative;
+  background-color: #0009;
+  border: 0.05rem solid #0009;
+  border-style: solid; /* Chrome up to 61 #5 */
+  display: inline-block;
+  float: left;
+  width: 0.6rem;
+  height: 0.8rem;
+  margin-right: 0.5rem;
+}
 
 li.on-map { font-weight: bold; }
 
@@ -96,7 +128,7 @@ li.on-map { font-weight: bold; }
  * Wallonie#Demain
  **/
 #map {
-    background: url(/assets/svg/wallonie-demain-logo.svg) center center/50% no-repeat fixed, #800000; 
+    background: url(/assets/svg/wallonie-demain-logo.svg) center center/50% no-repeat fixed, #800000;
     background: #800000;
     color: #000000;
 }