diff --git a/css/style.css b/css/style.css index f6e8b4e..807c0f6 100644 --- a/css/style.css +++ b/css/style.css @@ -5,21 +5,52 @@ #map { height: 100vh; z-index: 0;} -/* The actual timeline (the vertical ruler) */ -.timeline { - position: relative; - max-width: 1200px; - margin: 0 auto; - } - /* The actual timeline (the vertical ruler) */ - .timeline::after { +.timeline { + margin: 0 auto; + max-width: 750px; + padding: 0px; + font-family: "Fira Sans", sans-serif; +} +::before, ::after { + box-sizing: inherit; +} + +.timeline ul{ + list-style: none; + position: relative; + display: flex; + flex-direction: column; + margin: 0; +} + + +.timeline ul::before{ + content: ''; position: absolute; - width: 6px; - background-color: white; top: 0; - bottom: 0; - left: 50%; - margin-left: -3px; - } \ No newline at end of file + left: 0px; + width: 0px; + height: 100%; + border: 1px solid #EDEDED; + +} + +.timeline li{ + padding-left: 1rem; + position: relative; + margin: 2rem 0; + } + +.timeline li::before { + content: ''; + position: absolute; + background-color: hsl(171, 100%, 41%); + left: calc(-1rem/2.2); + top: calc(0.2rem); + width: 1rem; + height: 1rem; + border-radius: 50%; + } + diff --git a/riot/modaleEcole.riot b/riot/modaleEcole.riot index d85765d..eabf83c 100644 --- a/riot/modaleEcole.riot +++ b/riot/modaleEcole.riot @@ -55,6 +55,7 @@

Vitesse de remplissage

+