Merge pull request #5423 from camptocamp/sass-vars

Fix scss instructions order
camptocamp · Jan 17, 2020 · fbb91ab · fbb91ab
2 parents fed6b16 + 0995227
commit fbb91ab
Show file tree

Hide file tree

Showing 15 changed files with 57 additions and 50 deletions.
diff --git a/buildtools/webpack.commons.js b/buildtools/webpack.commons.js
@@ -152,17 +152,22 @@ module.exports = function(config) {
           '/apps/mobile/sass/vars_mobile.scss',
           '/apps/mobile_alt/sass/vars_mobile_alt.scss',
           '/apps/oeedit/sass/vars_oeedit.scss',
-          // project sass vars files
-          '/apps/sass/var',
-          '/controllers/',
-          '/vars.scss',
-          '/vars_only.scss',
-          '/common_dependencies.scss',
+          // GeoMapFish project sass vars files
+          '/apps/sass/vars_',
+          '/controllers/vars_',
+          // For the tests
+          'sass/vars.scss',
         ], config.last_scss || [
           // project and ngeo default apps other sass files
           '/apps/',
+          '/controllers/',
         ]));
-        //console.log(files);
+        console.log();
+        console.log("SCSS files order:");
+        for (const file of files) {
+          console.log(file);
+        }
+        console.log();
         return files;
       }
     }),

diff --git a/contribs/gmf/apps/desktop/Controller.js b/contribs/gmf/apps/desktop/Controller.js
@@ -6,7 +6,6 @@
  */
 
 import './sass/desktop.scss';
-import 'gmf/controllers/desktop.scss';
 import './sass/vars_desktop.scss';
 
 import angular from 'angular';

diff --git a/contribs/gmf/apps/desktop_alt/Controller.js b/contribs/gmf/apps/desktop_alt/Controller.js
@@ -6,7 +6,6 @@
  */
 
 import './sass/desktop_alt.scss';
-import 'gmf/controllers/desktop.scss';
 import './sass/vars_desktop_alt.scss';
 
 import angular from 'angular';

diff --git a/contribs/gmf/apps/iframe_api/Controller.js b/contribs/gmf/apps/iframe_api/Controller.js
@@ -6,6 +6,8 @@
  */
 
 import 'gmf/controllers/iframe_api.scss';
+import 'gmf/controllers/vars_desktop.scss';
+
 import angular from 'angular';
 import gmfControllersAbstractAPIController, {AbstractAPIController}
   from 'gmf/controllers/AbstractAPIController.js';

diff --git a/contribs/gmf/apps/mobile/Controller.js b/contribs/gmf/apps/mobile/Controller.js
@@ -6,7 +6,6 @@
  */
 
 import './sass/vars_mobile.scss';
-import 'gmf/controllers/mobile.scss';
 import './sass/mobile.scss';
 
 import angular from 'angular';

diff --git a/contribs/gmf/apps/mobile_alt/Controller.js b/contribs/gmf/apps/mobile_alt/Controller.js
@@ -6,7 +6,6 @@
  */
 
 import './sass/vars_mobile_alt.scss';
-import 'gmf/controllers/mobile.scss';
 import './sass/mobile_alt.scss';
 
 import angular from 'angular';

diff --git a/contribs/gmf/apps/oeedit/Controller.js b/contribs/gmf/apps/oeedit/Controller.js
@@ -6,7 +6,6 @@
  */
 
 import './sass/vars_oeedit.scss';
-import 'gmf/controllers/desktop.scss';
 import './sass/oeedit.scss';
 
 import angular from 'angular';

diff --git a/contribs/gmf/src/controllers/AbstractDesktopController.js b/contribs/gmf/src/controllers/AbstractDesktopController.js
@@ -22,6 +22,9 @@ import olStyleStroke from 'ol/style/Stroke.js';
 import olStyleStyle from 'ol/style/Style.js';
 import olStyleText from 'ol/style/Text.js';
 
+import 'gmf/controllers/vars_desktop.scss';
+import 'gmf/controllers/desktop.scss';
+
 /**
  * Desktop application abstract controller.
  *

diff --git a/contribs/gmf/src/controllers/AbstractMobileController.js b/contribs/gmf/src/controllers/AbstractMobileController.js
@@ -16,6 +16,9 @@ import olStyleRegularShape from 'ol/style/RegularShape.js';
 import olStyleStroke from 'ol/style/Stroke.js';
 import olStyleStyle from 'ol/style/Style.js';
 
+import 'gmf/controllers/vars_mobile.scss';
+import 'gmf/controllers/mobile.scss';
+
 /**
  * Mobile application abstract controller.
  *

diff --git a/contribs/gmf/src/controllers/desktop.scss b/contribs/gmf/src/controllers/desktop.scss
@@ -2,12 +2,6 @@
  * Entry point for all styles required for the desktop application.
  */
 
-@import '~gmf/sass/vars_only.scss';
-
-@import "~bootstrap/scss/_functions.scss";
-@import "~bootstrap/scss/_variables.scss";
-@import "~@fortawesome/fontawesome-free/scss/_variables.scss";
-
 @import '~gmf/sass/font.scss';
 @import '~gmf/sass/base.scss';
 @import '~gmf/sass/map.scss';
@@ -21,22 +15,6 @@
 @import '~gmf/layertree/desktop.scss';
 
 
-$map-tools-size: 1.9rem !default;
-$left-panel-width: 20rem !default;
-$right-panel-width: 17.5rem !default;
-$streeview-width: 25rem !default;
-$topbar-height: 2.8rem !default;
-$search-width: 8 * $map-tools-size !default;
-$theme-selector-columns: 2 !default;
-$theme-selector-column-width: $left-panel-width / 4 * 3 !default;
-$theme-selector-height: 1.5 * $left-panel-width !default;
-
-$padding-base-vertical: $half-app-margin !default;
-$padding-base-horizontal: $app-margin !default;
-$form-group-margin-bottom: $app-margin !default;
-$search-results-max-height: calc(100vh - #{$topbar-height} + #{$map-tools-size} + (2 * #{$app-margin})) !default;
-
-
 html, body {
   position: relative;
   height: 100%;
@@ -599,7 +577,6 @@ gmf-featurestyle {
  * Notifications
  */
 .ngeo-notification {
-  $notification-width: 12.5rem !default;
   left: 50%;
   margin: 0 0 0 calc(-#{$notification-width} / 2);
   position: absolute;

diff --git a/contribs/gmf/src/controllers/mobile-nav.scss b/contribs/gmf/src/controllers/mobile-nav.scss
@@ -2,11 +2,6 @@
  * Styles for mobile navigation menus (side menus).
  */
 
-$duration: 0.3s;
-$nav-bar-height: $map-tools-size + $app-margin;
-$nav-back-width: 1.5 * $map-tools-size;
-$menu-item-height: $nav-bar-height;
-$back-color: darken($nav-bg, $standard-variation);
 
 main {
   position: fixed;

diff --git a/contribs/gmf/src/controllers/mobile.scss b/contribs/gmf/src/controllers/mobile.scss
@@ -2,14 +2,7 @@
  * Entry point for all styles required for the mobile application.
  */
 
-$map-tools-size: 2.50rem !default;
-$border-color: black !default;
-
-@import '~gmf/sass/vars_only.scss';
-
-@import "~bootstrap/scss/_functions.scss";
-@import "~bootstrap/scss/_variables.scss";
-@import "~@fortawesome/fontawesome-free/scss/_variables.scss";
+@import '~gmf/controllers/vars_mobile.scss';
 
 @import '~gmf/sass/font.scss';
 @import '~gmf/sass/base.scss';
@@ -138,7 +131,6 @@ button[ngeo-geolocation] {
 }
 
 .ngeo-notification {
-  $notification-width: 12.5rem !default;
   left: 50%;
   margin: 0 0 0 calc(-#{$notification-width} / 2);
   position: absolute;

diff --git a/contribs/gmf/src/controllers/vars_desktop.scss b/contribs/gmf/src/controllers/vars_desktop.scss
@@ -0,0 +1,20 @@
+$map-tools-size: 1.9rem !default;
+$left-panel-width: 20rem !default;
+$right-panel-width: 17.5rem !default;
+$streeview-width: 25rem !default;
+$topbar-height: 2.8rem !default;
+$search-width: 8 * $map-tools-size !default;
+$theme-selector-columns: 2 !default;
+$theme-selector-column-width: $left-panel-width / 4 * 3 !default;
+$theme-selector-height: 1.5 * $left-panel-width !default;
+
+$app-margin: 0.62rem !default;
+$half-app-margin: 0.32rem !default;
+$padding-base-vertical: $half-app-margin !default;
+$padding-base-horizontal: $app-margin !default;
+$form-group-margin-bottom: $app-margin !default;
+$search-results-max-height: calc(100vh - #{$topbar-height} + #{$map-tools-size} + (2 * #{$app-margin})) !default;
+
+$notification-width: 12.5rem !default;
+
+@import '~gmf/sass/vars.scss';
diff --git a/contribs/gmf/src/controllers/vars_mobile.scss b/contribs/gmf/src/controllers/vars_mobile.scss
@@ -0,0 +1,16 @@
+$map-tools-size: 2.50rem !default;
+$border-color: black !default;
+
+$notification-width: 12.5rem !default;
+
+/* nav */
+$duration: 0.3s;
+$app-margin: 0.62rem !default;
+$nav-bar-height: $map-tools-size + $app-margin !default;
+$nav-back-width: 1.5 * $map-tools-size !default;
+$menu-item-height: $nav-bar-height !default;
+$nav-bg: white !default;
+$standard-variation: 15% !default;
+$back-color: darken($nav-bg, $standard-variation) !default;
+
+@import '~gmf/sass/vars.scss';
diff --git a/src/sass/font.scss b/src/sass/font.scss
@@ -1,4 +1,3 @@
-$fa-font-path: "~@fortawesome/fontawesome-free/webfonts" !default;
 @import "~@fortawesome/fontawesome-free/scss/fontawesome.scss";
 @import "~@fortawesome/fontawesome-free/scss/regular.scss";
 @import "~@fortawesome/fontawesome-free/scss/solid.scss";