Restructure Sass files and folders for proper application Sass development

UI/Templates/UIxPageFrame.wox

@@ -26,7 +26,7 @@
 	<link type="text/css" rel="stylesheet" rsrc:href="css/icons.css"/>
 	<link type="text/css" rel="stylesheet" rsrc:href="css/angular-material.css"/>
 	  <link type="text/css" rel="stylesheet" rsrc:href="css/themes/grey-theme.css"/>
-	  <link type="text/css" rel="stylesheet" rsrc:href="css/components.css"/>
+	  <link type="text/css" rel="stylesheet" rsrc:href="css/styles.css"/>
 	<var:if condition="hasPageSpecificCSS"
 	  ><link type="text/css" rel="stylesheet" var:href="pageCSSURL"
 	    /></var:if>

UI/WebServerResources/bower.json

@@ -11,6 +11,7 @@
     "angular-file-upload": "~1",
     "angular-material": "~0.7.0",
     "ng-tags-input": "~2",
+    "compass-mixins": "~0.12.3",
     "foundation": ">5.3",
     "ionic": "1.0.0-beta.14",
     "underscore": "~1"

UI/WebServerResources/scss/_shame.scss

@@ -0,0 +1,15 @@
+/**
+ *
+ * This is the shame file (http://csswizardry.com/2013/04/shame-css/)
+ * RULES
+ * 1. If it’s a hack, it goes in shame.css.
+ * 2. Document all hacks fully:
+ *    1. What part of the codebase does it relate to?
+ *    2. Why was this needed?
+ *    3. How does this fix it?
+ *    4. How might you fix it properly, given more time?
+ *    3. Do not blame the developer; if they explained why they had to do it
+ *       then their reasons are probably (hopefully) valid.
+ * 4. Try and clean shame.css up when you have some down time.
+ *    Even better, get a tech-debt story in which you can dedicate actual sprint time to it.
+*/

UI/WebServerResources/scss/core/variables.scss

@@ -1,3 +1,13 @@
+
+// todo : implement path variables for seamless imports
+// Ex. $css-path: '../css/
+// functions can provides aliases to
+
+// palettes import -
+// ------------------------------------------------------------------------------
+// fixme : consolidate all settings and imports in a decent 'settings' file
+@import '../themes/color-palette'; // fixme : clarify if it is deeded or assure by javascript
+
 // Font Variables
 $font-family: RobotoDraft, Roboto, 'Helvetica Neue', sans-serif !default;
 $font-family: Ubuntu, 'Helvetica Neue', sans-serif; //override

UI/WebServerResources/scss/styles.scss

@@ -10,16 +10,16 @@
 
 // Compass import - comment-out if needed
 // ------------------------------------------------------------------------------
-/@import '../bower_components/compass-mixins/lib/_compass.scss';
+@import '../bower_components/compass-mixins/lib/_compass.scss';
 
 // Browser reset - most effective for applications. Generated by Compass in a non-regular way
 // ------------------------------------------------------------------------------
-@import 'reset.css';
+@import 'core/reset';
 
 
 // Fonts
 // ------------------------------------------------------------------------------
-@import 'core/ubuntu'; // Actually this is a symLink to 'css/ubuntu.css'
+@import '../fonts/ubuntu'; // Actually this is a symLink to 'css/ubuntu.css'
 
 // CORE elements
 // ------------------------------------------------------------------------------
@@ -28,7 +28,6 @@
 /* Local overrides from angular-material src */
 // fixme : refactor all this to meet our practices
 // ------------------------------------------------------------------------------
-@import 'core/color-palette';
 @import 'core/mixins';
 @import 'core/structure';
 @import 'core/layout';
@@ -42,6 +41,9 @@
 // @import '../angular-material/src/core/style/color-palette.scss';
 
 // COMPONENTS
+// todo : configure manual and glob imports
+
+
 /* Angular-material components local overrides */
 @import 'components/list/list.scss';
 @import 'components/divider/divider.scss';

UI/WebServerResources/scss/views/_view.scss

@@ -0,0 +1 @@
+// for future use