ui : templating and config update

src/config.integration.pug

@@ -0,0 +1,4 @@
+- var sdn = process.env.SDN || 'staging-app.happy-dev.fr'
+- var cdn = process.env.CDN || 'staging-app.happy-dev.fr'
+- var xmpp = 'https://jabber.happy-dev.fr/http-bind/'
+- var client_id = 833925

src/config.local.pug

@@ -0,0 +1,4 @@
+- var sdn = process.env.SDN || 'http://127.0.0.1:8000'
+- var cdn = process.env.CDN || 'staging-app.happy-dev.fr'
+- var xmpp = 'https://jabber.happy-dev.fr/http-bind/'
+- var client_id = 863031

src/config.sample.pug

@@ -1,4 +1,4 @@
 - var sdn = process.env.SDN || 'http://127.0.0.1:8000'
 - var cdn = process.env.CDN || 'https://cdn.happy-dev.fr'
 - var xmpp = 'https://jabber.happy-dev.fr/http-bind/'
-- var client_id = '863031'
+- var client_id = '833925'

src/index.pug

@@ -8,8 +8,8 @@ html(lang="en")
     meta(http-equiv="X-UA-Compatible", content="ie=edge")
     link(rel="icon" type="image/png" href="/images/logo.png")
     include dependencies.pug
-  div.layer
-    body
+  body
+    div.layer
       header#header
         include header.pug
       #subContainer

src/menu.pug

@@ -18,19 +18,21 @@ nav#navbar
         div.menu-label Projects
         div.menu-icon.icon-folder-alt
       sib-route(hidden,name='project', id-prefix=`${sdn}/projects/`)
-      sib-display(
-        data-src=`${sdn}/projects/`,
-        data-fields='name',
-        next='project'
-      )
+      div.sub-menu
+        sib-display(
+          data-src=`${sdn}/projects/`,
+          data-fields='name',
+          next='project'
+        )
     div
       div.menu
         div.menu-notification
         div.menu-label Groups
         div.menu-icon.icon-bubbles
       sib-route(hidden, name='group', id-prefix=`${sdn}/channels/`)
-      sib-display(
-        data-src=`${sdn}/channels/`,
-        data-fields='name',
-        next='group'
-      )
+      div.sub-menu
+        sib-display(
+          data-src=`${sdn}/channels/`,
+          data-fields='name',
+          next='group'
+        )

src/styles/menu.scss

@@ -28,7 +28,7 @@
   #navbar {
     //transform: translateX(-120%);
     transition: flex-basis 0.5s ease-in-out;
-    flex-basis: 0px;
+    flex-basis: 0;
     //position: absolute;
     //top: auto;
     //display: none;
@@ -40,6 +40,13 @@ sib-router {
   display: flex;
   flex-direction: column;
 
+  .sub-menu {
+    padding-left: 2em;
+    div{
+        padding-bottom: 1em;
+    }
+  }
+
   .menu {
     display: flex;
     flex-direction: row-reverse;
@@ -61,7 +68,8 @@ sib-router {
         color: $color-yellow-light;
         // transform: perspective(1000px) translateZ(1px) scale(0.8);
       }
-      .menu-notification>div{
+
+      .menu-notification > div {
         background-color: $color-purple-dark;
         color: $color-yellow-light;
       }
@@ -69,7 +77,7 @@ sib-router {
 
     .menu-icon {
       //flex-basis: 2em;
-      width :4em;
+      width: 4em;
       flex-shrink: 0;
       flex-grow: 0;
       justify-content: center;
@@ -77,7 +85,6 @@ sib-router {
       display: flex;
       flex-direction: column;
 
-
       &:before {
         width: 1.9em;
         height: 1.9em;
@@ -110,8 +117,9 @@ sib-router {
       flex-direction: column;
       justify-content: center;
       align-items: center;
-      >div{
-        color : $color-black;
+
+      > div {
+        color: $color-black;
         display: flex;
         justify-content: center;
         align-items: center;