scss: propose a configuration for the new steps module (#37812)

static/aiseaupresles/style.scss

@@ -172,6 +172,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/andenne/style.scss

@@ -175,9 +175,11 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';
+
 @import '../imio/form-buttons';
 @import '../imio/header';
 @import '../imio/menu';

static/anderlues/style.scss

@@ -168,11 +168,11 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';
 
-
 @import '../imio/form-buttons';
 @import '../imio/header';
 @import '../imio/menu';

static/ans/style.scss

@@ -55,6 +55,8 @@ $a_portal_agent_right: 6%;
 $a_portal_agent_border: None;
 /*end IMIO SHARE*/
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 
 @import '../imio/form-buttons';

static/arlon/style.scss

@@ -172,11 +172,11 @@ $title-padding: 1em 0em 1em 0.8em;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';
 
-
 @import '../imio/form-buttons';
 @import '../imio/header';
 @import '../imio/menu';

static/assesse/style.scss

@@ -168,11 +168,11 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';
 
-
 @import '../imio/form-buttons';
 @import '../imio/header';
 @import '../imio/menu';

static/ath/style.scss

@@ -172,11 +172,11 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';
 
-
 @import '../imio/form-buttons';
 @import '../imio/header';
 @import '../imio/menu';

static/beauraing/style.scss

@@ -172,11 +172,11 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';
 
-
 @import '../imio/form-buttons';
 @import '../imio/header';
 @import '../imio/menu';

static/beauvechain/style.scss

@@ -26,6 +26,8 @@ $a_portal_agent_right: 6%;
 $a_portal_agent_border: None;
 /*end IMIO SHARE*/
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 
 @import '../imio/form-buttons';

static/binche/style.scss

@@ -171,6 +171,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/boussu/style.scss

@@ -168,6 +168,7 @@ $title-padding: 1em 0em 1em 0.8em;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/brainelalleud/style.scss

@@ -172,6 +172,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/burdinne/style.scss

@@ -167,6 +167,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/chastre/style.scss

@@ -172,6 +172,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/chatelet/_custom.scss

@@ -18,14 +18,6 @@ a#publik-portal-agent {
     border:None
 }
 
-/*Current form's item in inherit color. NOT WHITE !*/
-div#steps ol li.current {
-    background: white none repeat scroll 0 0;
-    border: 0 none;
-    color: inherit;
-}
-/*End*/
-
 div#rub_service div.category ul > li > a, div#services > ul > li > ul > li > a, div#account-management ul > li > a, div.links-list ul > li > a, div.menucell ul > li > a, div.wcsformcell > li > a, div.categoriescell ul > li > a, div.wcsformsofcategorycell ul > li > a, div.wcscurrentdraftscell ul > li > a, div.wcscurrentformscell ul > li > a {
     border-bottom: None;
 }

static/chatelet/style.scss

@@ -59,6 +59,8 @@ $a_portal_agent_right: 6%;
 $a_portal_agent_border: None;
 /*end IMIO SHARE*/
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 
 @import '../imio/form-buttons';

static/chaumontgistoux/style.scss

@@ -170,6 +170,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/chimay/style.scss

@@ -172,6 +172,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/ciney/style.scss

@@ -172,6 +172,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/colfontaine/style.scss

@@ -167,6 +167,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/comineswarneton/style.scss

@@ -172,6 +172,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/courcelles/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/couvin/_custom.scss

@@ -1,13 +1,5 @@
 @charset "UTF-8";
 
-/*Current form's item in inherit color. NOT WHITE !*/
-div#steps ol li.current {
-    background: white none repeat scroll 0 0;
-    border: 0 none;
-    color: inherit;
-}
-/*End*/
-
 body {
     background-image: url("images/bg.png");
     background-repeat:no-repeat;

static/couvin/_responsive.scss

@@ -66,19 +66,11 @@ div#nav #nav-button.toggled + ul{
         a.remove-item{
            padding-left:30px;
         }
-         #steps .label {
-           display: none;
-        }
 
-        #page div#gauche,
-        #page div#step#steps {
+        #page div#gauche {
            width: 100%;
         }
 
-        #steps {
-          display: inline;
-        }
-
         #page div#gauche + div#rub_service {
            box-sizing: border-box;
            padding-left: 0;

static/couvin/style.scss

@@ -57,6 +57,8 @@ $a_portal_agent_right: 6%;
 $a_portal_agent_border: None;
 /*end IMIO SHARE*/
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 
 @import 'form-buttons';

static/dalhem/_custom.scss

@@ -1,13 +1,5 @@
 @charset "UTF-8";
 
-/*Current form's item in inherit color. NOT WHITE !*/
-div#steps ol li.current {
-    background: white none repeat scroll 0 0;
-    border: 0 none;
-    color: inherit;
-}
-/*End*/
-
 body {
     background-image: url("images/bg.png");
     background-repeat:no-repeat;

static/dalhem/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/demo/_custom.scss

@@ -180,25 +180,5 @@ div#tracking-code h3, div#rub_service h2 {
     div#nav {
         background: #FFF;
     }
-    //In forms
-    div#steps ol li {
-        display: block;
-        white-space: normal;
-        padding-left: 2em;
-    }
-    div#steps ol li span.marker {
-        display: inline-block;
-        width: 1em;
-        border: none;
-        margin-left: -1.5em;
-        margin-right: 0.2em;
-    }
-    div#steps ol li.current span.marker {
-        background-color: #d8297b;
-    }
-    div#steps ol li.current span.label {
-        font-weight: bold;
-        color: #d8297b;
-    }
 }
 

static/demo/style.scss

@@ -35,6 +35,8 @@ $a_portal_agent_right: 6%;
 $a_portal_agent_border: None;
 /*end IMIO SHARE*/
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';
 

static/dison/_custom.scss

@@ -1,13 +1,5 @@
 @charset "UTF-8";
 
-/*Current form's item in inherit color. NOT WHITE !*/
-div#steps ol li.current {
-    background: white none repeat scroll 0 0;
-    border: 0 none;
-    color: inherit;
-}
-/*End*/
-
 body {
     background-image: url("images/bg.png");
     background-color: $body-background-color;

static/dison/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/doische/style.scss

@@ -172,6 +172,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/ecaussinnes/style.scss

@@ -47,6 +47,8 @@ $title-color: #525252;
 $title-padding: 1em 0em 1em 0.8em;
 $title-weight: bold;
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';
 

static/eghezee/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/enghien/style.scss

@@ -169,6 +169,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/faimes/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/farciennes/style.scss

@@ -175,6 +175,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 

static/fernelmont/style.scss

@@ -172,6 +172,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/fleron/_custom.scss

@@ -31,14 +31,6 @@ form li:last-child {
     width: 98%;
 }
 
-/*Current selected page : good font color */
-div#steps ol li.current {
-    background: white none repeat scroll 0 0;
-    border: 0 none;
-    color: $primary-color;
-}
-
-
 a#publik-portal-agent {
     top: 30px;
     right: 6%;

static/fleron/style.scss

@@ -45,6 +45,7 @@ $basket-button-background-color-hover: $basket-button-text-color;
 $basket-button-text-color-hover: $basket-button-background-color;
 $delete-from-basket-color: $basket-button-background-color;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 

static/florenville/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/fontaineleveque/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/frasneslezanvaing/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/froidchapelle/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/gembloux/style.scss

@@ -182,6 +182,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-opensans';

static/gerpinnes/_custom.scss

@@ -1,13 +1,5 @@
 @charset "UTF-8";
 
-/*Current form's item in inherit color. NOT WHITE !*/
-div#steps ol li.current {
-    background: white none repeat scroll 0 0;
-    border: 0 none;
-    color: inherit;
-}
-/*End*/
-
 body {
     background-image: url("images/bg.png");
     background-repeat:no-repeat;

static/gerpinnes/style.scss

@@ -70,6 +70,8 @@ $a_portal_agent_right: 6%;
 $a_portal_agent_border: None;
 /*end IMIO SHARE*/
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 @import '../imio/form-buttons';
 @import '../imio/header';

static/habay/style.scss

@@ -171,6 +171,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/hamoir/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/hensies/style.scss

@@ -171,6 +171,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/huy/_custom.scss

@@ -1,13 +1,5 @@
 @charset "UTF-8";
 
-/*Current form's item in inherit color. NOT WHITE !*/
-div#steps ol li.current {
-    background: white none repeat scroll 0 0;
-    border: 0 none;
-    color: inherit;
-}
-/*End*/
-
 body {
     background-image: url("images/bg.png");
     background-repeat:no-repeat;

static/huy/_responsive.scss

@@ -66,19 +66,11 @@ div#nav #nav-button.toggled + ul{
         a.remove-item{
            padding-left:30px;
         }
-         #steps .label {
-           display: none;
-        }
 
-        #page div#gauche,
-        #page div#step#steps {
+        #page div#gauche{
            width: 100%;
         }
 
-        #steps {
-          display: inline;
-        }
-
         #page div#gauche + div#rub_service {
            box-sizing: border-box;
            padding-left: 0;

static/huy/style.scss

@@ -68,6 +68,8 @@ $a_portal_agent_border: None;
 /*EID mini logo with forms label*/
 $eid_margin_left:80%;
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 
 @import 'form-buttons';

static/iile/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/imio/_custom.scss

@@ -38,13 +38,6 @@ form li:last-child {
     width: 98%;
 }
 
-/*Current selected page : good font color */
-div#steps ol li.current {
-    background: white none repeat scroll 0 0;
-    border: 0 none;
-    color: #D8297B;
-}
-
 div.wcsformsofcategorycell div.description {
     display:none;
 }

static/imio/_responsive.scss

@@ -41,12 +41,6 @@ div#nav #nav-button.toggled + ul{
    .page-index #main-content > #content #columns .nuagedetag {
       display: none;
    }
-
-   div#steps ol li.current span.marker {
-      background: white;
-      color: $primary-color;
-      border-radius: 3px;
-    }
 }
 
 @media handheld, screen and (max-device-width: 768px), screen and (max-width: 768px) {
@@ -69,16 +63,9 @@ div#nav #nav-button.toggled + ul{
     a.remove-item {
         padding-left:30px;
     }
-    #steps .label {
-        display: none;
-    }
-    #page div#gauche,
-    #page div#step#steps {
+    #page div#gauche {
         width: 100%;
     }
-    #steps {
-        display: inline;
-    }
     #page div#gauche + div#rub_service {
         box-sizing: border-box;
         padding-left: 0;
@@ -104,11 +91,6 @@ div#nav #nav-button.toggled + ul{
     #profile dt {
         width:100%;
     }
-    div#steps ol li.current span.marker {
-        background: white;
-        color: $primary-color;
-        border-radius: 3px;
-    }
     div#header h1 {
         background-position: 0em;
     }
@@ -158,26 +140,6 @@ div#nav #nav-button.toggled + ul{
         top: -50px;
         right: 1em;
     }
-    //In forms
-    div#steps ol li {
-        display: block;
-        white-space: normal;
-        padding-left: 2em;
-    }
-    div#steps ol li span.marker {
-        display: inline-block;
-        width: 1em;
-        border: none;
-        margin-left: -1.5em;
-        margin-right: 0.2em;
-    }
-    div#steps ol li.current span.marker {
-        background-color: $primary-color;
-    }
-    div#steps ol li.current span.label {
-        font-weight: bold;
-        color: $primary-color;
-    }
     div#nav ul li a {
         color: $nav-menu-color;
     }

static/imio/_share.scss

@@ -77,13 +77,7 @@ form.quixote div.content > div.message {
         display:block;
     }
 }
-/*Current form's item in inherit color. NOT WHITE !*/
-div#steps ol li.current {
-    background: $form-current-navpage-background-color none repeat scroll 0 0;
-    border: 0 none;
-    color: $form-current-navpage-color;
-    font-weight: bold;
-}
+
 div#header-nav {
     display:none;
 }

static/imio/_steps-config.scss

@@ -0,0 +1,10 @@
+$wcs-steps-spacing: 0.7rem;
+$wcs-step-border-bottom: none;
+$wcs-step-marker-color: #fff;
+$wcs-step-marker-background: #ccc;
+$wcs-step-current-marker-color: #fff;
+$wcs-step-current-marker-background: $primary-color;
+$wcs-step-marker-background-type: gradient;
+$wcs-step-marker-type: tied;
+$wcs-step-marker-tie-color: #ccc;
+$wcs-step-marker-tie-width: 2px;

static/jalhay/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/jurbise/style.scss

@@ -172,6 +172,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/lalouviere/_responsive.scss

@@ -112,19 +112,11 @@ div#nav #nav-button.toggled + ul{
         a.remove-item{
            padding-left:30px;
         }
-         #steps .label {
-           display: none;
-        }
 
-        #page div#gauche,
-        #page div#step#steps {
+        #page div#gauche {
            width: 100%;
         }
 
-        #steps {
-          display: inline;
-        }
-
         #page div#gauche + div#rub_service {
            box-sizing: border-box;
            padding-left: 0;

static/lalouviere/style.scss

@@ -45,6 +45,8 @@ $nav-menu-color: $primary-color;
 /*TITLE VEO*/
 $title-weight: bold;
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 
 @import 'form-buttons.scss';

static/lasne/style.scss

@@ -169,6 +169,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/leglise/style.scss

@@ -55,6 +55,8 @@ $a_portal_agent_right: 6%;
 $a_portal_agent_border: None;
 /*end IMIO SHARE*/
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 
 @import '../imio/form-buttons';

static/lessines/style.scss

@@ -169,6 +169,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/letsgocity/style.scss

@@ -172,6 +172,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/liege-pwa-2019/_custom.scss

@@ -190,87 +190,6 @@ label[for="id_email"]::before{
     font-size: 80%;
 }
 
-div#steps {
-	position: relative;
-	ol {
-		&::after {
-			content: "";
-			position: absolute;
-			top: 0;
-			left: 20px;
-			width: 3px;
-			background: #cccccc;
-			bottom: 0;
-			@media screen and (max-width: $mobile-limit) {
-				content: none;
-			}
-		}
-		li {
-			position: relative;
-			z-index: 10;
-			color: #5A5A5A;
-			background: white;
-			margin-bottom: 1rem;
-			display: table;
-			width: 100%;
-			box-sizing: border-box;
-			border-radius: 0;
-			border: 1px solid #ccc;
-			@media screen and (max-width: $mobile-limit) {
-				display: none;
-				&.current {
-					display: table;
-				}
-			}
-			span {
-				display: table-cell;
-				vertical-align: middle;
-				&.marker {
-					letter-spacing: -2px;
-					border: 0;
-				}
-				&.total {
-					display: none;
-					@media screen and (max-width: $mobile-limit) {
-						display: table-cell;
-					}
-					&::before {
-						content: "/";
-					}
-				}
-				&.label {
-					width: 100%;
-					font-weight: normal;
-					padding: 0 0.5rem 0 1rem;
-				}
-			}
-			&.current {
-				background: $primary-color;
-				span.label {
-					font-weight: normal;
-					color: white;
-				}
-				span.marker,
-				span.total {
-					border-radius: 0;
-					background: $primary-color;
-					color: white;
-					@media screen and (max-width: $mobile-limit) {
-						padding: 0 9px;
-						&.marker {
-							padding-right: 0;
-						}
-						&.total {
-							padding-left: 0;
-							padding-top: 10px;
-						}
-					}
-				}
-			}
-		}
-	}
-}
-
 div#rub_service div.form-validation div.page {
     background: transparent;
     padding-left: 0;

static/liege-pwa-2019/_responsive.scss

@@ -44,15 +44,10 @@ div#nav #nav-button.toggled + ul{
 }
 
 @media handheld, screen and (max-device-width: 768px), screen and (max-width: 768px){
-        #page div#gauche, 
-        #page div#step#steps {
+        #page div#gauche {
            width: 100%;
         }
         
-        #steps {
-          display: inline;
-        }
-        
         #page div#gauche + div#rub_service {
            box-sizing: border-box;
            padding-left: 0;

static/liege-spirit/_custom.scss

@@ -274,26 +274,6 @@ label[for="id_email"]::before{
     font-size: 80%;
 }
 
-div#steps {
-    position: relative;
-}
-
-div#steps ol li {
-    color: #5A5A5A;
-    background-color: transparent;
-    margin-bottom: 0ex;
-    border-bottom-color: transparent;
-}
-
-/* Change step by step forms style*/
-div#steps ol li.current {
-    background: transparent;
-    color: $highlight-text-color;
-    span.label {
-        font-weight: normal;
-    }
-}
-
 div#rub_service div.form-validation div.page {
     background: transparent;
     padding-left: 0;
@@ -333,19 +313,6 @@ div#rub_service h2 {
     background: linear-gradient(to right, #F6F6F6, white);
 }
 
-div#steps {
-    border-radius: 10px 10px 0px 0px;
-    min-height: 400px;
-}
-
-div#steps li.current {
-    border-bottom:solid black 1px;
-}
-
-div#steps li.last {
-    border-bottom:none;
-}
-
 /* Remove border on fields validate form page */
 input[readonly], select[readonly], textarea[readonly] {
     border-width: 0;
@@ -358,22 +325,6 @@ label {
     margin-bottom: 0;
 }
 
-#steps li {
-    display: table;
-    box-sizing: border-box;
-}
-
-#steps li span{
-    display: table-cell;
-    vertical-align:middle;
-}
-
-div#steps ol li span.marker {
-    font-weight: bold;
-    padding-right: 0.5em;
-    padding-left: 0.3em;
-}
-
 /* profile page */
 .page-profil ul#id_title > li {
         list-style-type:none;

static/liege-spirit/_responsive.scss

@@ -72,19 +72,11 @@ div#nav #nav-button.toggled + ul{
         a.remove-item{
            padding-left:30px;
         }
-         #steps .label {
-           display: none;
-        }
 
-        #page div#gauche, 
-        #page div#step#steps {
+        #page div#gauche {
            width: 100%;
         }
         
-        #steps {
-          display: inline;
-        }
-        
         #page div#gauche + div#rub_service {
            box-sizing: border-box;
            padding-left: 0;

static/liege-spirit/_wcs.scss

@@ -1,56 +1 @@
-@charset "UTF-8";
-@media screen and (min-width: 800px) {
-    div#steps {
-	background: none;
-    }
-    div#steps ol li {
-	color: #333;
-	margin-bottom: 2em;
-	border-radius: 0;
-    }
-    div#steps ol li.step-before {
-   	background: #EEE;
-    }
-    div#steps ol li.current {
-        background: #E60376;
-	color: #FFF;
-    }
-    div#steps ol li.step-after {
-	border: 2px solid #ccc;
-	background: white;
-    }
-    div#steps ol li span {
-	display: table-cell;
-	text-align: left;
-	width: 100%;
-    }
-    div#steps ol li:not(.last)::after {
-        content: "";
-        border: 3px solid #ccc;
-        position: absolute;
-        height: 6ex;
-        left: 2em;
-	z-index: -1;
-    }
-    div#steps ol li.last::after {
-        display: none;
-    }
-}
-
-@media screen and (max-width: 800px) {
-    div#steps ol li {
-	margin-right: 1em;
-	color: #333;
-    }
-    div#steps ol li.step-after {
-        background: white;
-        border: 1px solid #ccc;
-    }
-    div#steps ol li:not(.last)::after {
-        content: "";
-        position: absolute;
-        border: 2px solid #ccc;
-        top: 1ex;
-        width: 1.5em;
-    }
-}
+@charset "UTF-8";

static/liege-spirit/style.scss

@@ -29,6 +29,8 @@ $a_portal_agent_right: 6%;
 $a_portal_agent_border: None;
 /*end IMIO SHARE*/
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 
 @import 'header.scss';

static/liege/_custom.scss

@@ -275,39 +275,6 @@ label[for="id_email"]::before{
     font-size: 80%;
 }
 
-div#steps {
-    position: relative;
-}
-
-div#steps ol li {
-    color: #5A5A5A;
-    background-color: transparent;
-    margin-bottom: 0ex;
-    border-bottom-color: transparent;
-    span.label::after {
-        content: "";
-        margin-top: 2ex;
-        display: block;
-        height: 1px;
-        background: #E2E2E2;
-        position: absolute;
-        left: 5%;
-        width: 90%;
-    }
-    &:last-child span.label::after {
-        content: none;
-    }
-}
-
-/* Change step by step forms style*/
-div#steps ol li.current {
-    background: transparent;
-    color: $highlight-text-color;
-    span.label {
-        font-weight: normal;
-    }
-}
-
 div#rub_service div.form-validation div.page {
     background: transparent;
     padding-left: 0;
@@ -347,20 +314,6 @@ div#rub_service h2 {
     background: linear-gradient(to right, #F6F6F6, white);
 }
 
-div#steps {
-    border-radius: 10px 10px 0px 0px;
-    background: linear-gradient(to bottom, #F6F6F6, #F6F6F6 30%, white);
-    min-height: 400px;
-}
-
-div#steps li.current {
-    border-bottom:solid black 1px;
-}
-
-div#steps li.last {
-    border-bottom:none;
-}
-
 /* Remove border on fields validate form page */
 input[readonly], select[readonly], textarea[readonly] {
     border-width: 0;
@@ -373,21 +326,6 @@ label {
     margin-bottom: 0;
 }
 
-#steps li {
-    display: table;
-    box-sizing: border-box;
-}
-
-#steps li span{
-    display: table-cell;
-    vertical-align:middle;
-}
-
-div#steps ol li span.marker {
-    font-weight: bold;
-    padding-right: 0.2em;
-}
-
 /* profile page */
 .page-profil ul#id_title > li {
         list-style-type:none;

static/liege/_responsive.scss

@@ -70,19 +70,11 @@ div#nav #nav-button.toggled + ul{
         a.remove-item{
            padding-left:30px;
         }
-         #steps .label {
-           display: none;
-        }
 
-        #page div#gauche, 
-        #page div#step#steps {
+        #page div#gauche {
            width: 100%;
         }
         
-        #steps {
-          display: inline;
-        }
-        
         #page div#gauche + div#rub_service {
            box-sizing: border-box;
            padding-left: 0;

static/lierneux/_custom.scss

@@ -1,13 +1,5 @@
 @charset "UTF-8";
 
-/*Current form's item in inherit color. NOT WHITE !*/
-div#steps ol li.current {
-    background: white none repeat scroll 0 0;
-    border: 0 none;
-    color: inherit;
-}
-/*End*/
-
 body {
     background-image: url("images/bg.png");
     background-repeat:no-repeat;

static/lierneux/style.scss

@@ -56,6 +56,8 @@ $a_portal_agent_right: 6%;
 $a_portal_agent_border: None;
 /*end IMIO SHARE*/
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 
 @import '../imio/form-buttons';

static/malmedy/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/marche-en-famenne/style.scss

@@ -174,6 +174,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/merbeslechateau/style.scss

@@ -170,6 +170,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/mons/style.scss

@@ -63,6 +63,8 @@ $a_portal_agent_border: None;
 $content-cell-border: None;
 /*end IMIO SHARE*/
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 
 @import '../imio/form-buttons';

static/montsaintguibert/style.scss

@@ -2,6 +2,8 @@
 
 @import 'vars';
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';
 

static/mouscron/_custom.scss

@@ -1,13 +1,5 @@
 @charset "UTF-8";
 
-/*Current form's item in inherit color. NOT WHITE !*/
-div#steps ol li.current {
-    background: white none repeat scroll 0 0;
-    border: 0 none;
-    color: inherit;
-}
-/*End*/
-
 body {
     background-image: url("images/bg.png");
     background-repeat:no-repeat;

static/mouscron/style.scss

@@ -61,6 +61,8 @@ $a_portal_agent_right: 6%;
 $a_portal_agent_border: None;
 /*end IMIO SHARE*/
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 
 @import 'form-buttons';

static/namur/style.scss

@@ -178,6 +178,7 @@ $title-padding: 1em 0em 1em 0.8em;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/olln/style.scss

@@ -174,6 +174,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/orpjauche/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/oupeye/_custom.scss

@@ -4,14 +4,6 @@ a {
    color:#205c90;
 }
 
-/*Current form's item in inherit color. NOT WHITE !*/
-div#steps ol li.current {
-    background: white none repeat scroll 0 0;
-    border: 0 none;
-    color: inherit;
-}
-/*End*/
-
 body {
     background-image: url("images/bg.png");
     background-repeat:no-repeat;

static/oupeye/style.scss

@@ -53,6 +53,8 @@ $href-color: $title-background;
 //$header-logo-text-padding: 120px 0px 0px 0px;
 //$header-logo-text-color:#ffffff;
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 
 @import '../imio/form-buttons';

static/perwez/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/quaregnon/style.scss

@@ -55,6 +55,8 @@ $a_portal_agent_right: 6%;
 $a_portal_agent_border: None;
 /*end IMIO SHARE*/
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 
 @import '../imio/form-buttons';

static/ramillies/style.scss

@@ -2,6 +2,8 @@
 
 @import 'vars';
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';
 

static/remicourt/style.scss

@@ -172,6 +172,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/rochefort_be/style.scss

@@ -2,6 +2,8 @@
 
 @import 'vars';
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';
 

static/saintnicolas/style.scss

@@ -168,6 +168,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/sambreville/style.scss

@@ -172,6 +172,7 @@ $title-padding: 0.7rem 1rem 0.7rem 0;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/seneffe/style.scss

@@ -167,6 +167,7 @@ $title-padding: 1em 0em 1em 0.8em;
 //$title-weight: normal; VEO
 $title-weight: bold;
 
+@import '../imio/steps-config';
 
 @import '../../publik-base-theme/static/includes/publik';
 @import '../../publik-base-theme/static/includes/font-din';

static/silly/style.scss

@@ -1,5 +1,6 @@
 @charset "UTF-8";
 
+$primary-color: #233E61;
 $width: 950px;
 $mobile-limit: 800px;
 $font-size: 13px !default;
@@ -32,6 +33,8 @@ $a_portal_agent_right: 6%;
 $a_portal_agent_border: None;
 /*end IMIO SHARE*/
 
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/publik';
 
 @import 'header';

static/site-liege/_vars.scss

@@ -1,4 +1,5 @@
 $width: 100%;
+$primary-color: #8D59A1;
 $mobile-limit: 800px;
 $body-background: white;
 $font-size: 15px;

static/site-liege/style.scss

@@ -1,6 +1,9 @@
 @charset "UTF-8";
 
 @import 'vars';
+
+@import '../imio/steps-config';
+
 @import '../../publik-base-theme/static/includes/utils';
 @import '../../publik-base-theme/static/includes/title';
 @import '../../publik-base-theme/static/includes/layout';

static/site-namur/_vars.scss

@@ -1,4 +1,5 @@
 $width: 100%;
+$primary-color: #8D59A1;
 $mobile-limit: 800px;
 $body-background: white;
 $font-size: 15px;