Fix breakpoints in scss and js (in await for a more elegant solution)

UI/WebServerResources/scss/core/typography/typography.scss

@@ -130,7 +130,7 @@
 }
 
 // Google's Material design specs are in 'sp' or 'dp' which are not css units
-// 'dp' is 'density independant pexels' and 'sp' is 'scale-independent pixels'
+// 'dp' is 'density independant pixels' and 'sp' is 'scale-independent pixels'
 // (same as dp, but will be scaled by the user's font size preference)
 // Android gives a 160dpi  base value to 'sp' and 'dp', but Google's examples seems to use 'sp' as 'px'
 // We define a scaling factor in case we need to adjust

UI/WebServerResources/scss/core/variables.scss

@@ -17,9 +17,6 @@ $primary-color: sg-color($sogoBlue, 300) !default;
 //$foreground-primary-color: rgba($foreground-base-color, 0.73) !default;
 $foreground-primary-color: rgba($primary-color, 0.87);//override
 
-$bottombar-color: #212121;
-
-
 
 // Layout and grid
 // ------------------------------
@@ -56,6 +53,11 @@ $layout-breakpoint-sm:     600px !default;
 $layout-breakpoint-md:     960px !default;
 $layout-breakpoint-lg:     1200px !default;
 
+// Redefinitions
+// $layout-breakpoint-sm:     360px;
+$layout-breakpoint-md:     1025px;
+$layout-breakpoint-lg:     1280px;
+
 // App bar variables
 $app-bar-height: $sg-md-grid-pitch;