[WIP] Allow external usage of individual components.

TODO.rst

@@ -0,0 +1,6 @@
+
+- glyphs: use svg instead of relying on font.
+- should select2.css be imported? 
+
+
+

_common.scss

@@ -0,0 +1,60 @@
+@charset "UTF-8";
+
+// Assets
+@import "libraries/fontello/css/fontello";
+
+@import "assets/animations";
+@import "assets/glyphs";
+@import "assets/colours";
+@import "assets/symbols";
+@import "assets/mixins";
+
+// Parameters
+
+$body-font-family: "Source Sans Pro", sans-serif !default;
+
+$break-small: 768px !default;
+$break-large: 1280px !default;
+$pat-tail-white: 15px !default;
+$border-radii: 10px !default;
+
+// Menu list
+
+$menu-list-top-bottom-padding: 2px !default;
+
+// Buttons
+
+$button-border: none !default;
+$button-border-radius: $border-radii !default;
+$button-background-image: none !default;
+$button-font-weight: bold !default;
+$button-text-colour: white !default;
+$button-text-colour-hover: white !default;
+$button-text-colour-subdued: rgba(0, 0, 0, 0.6) !default;
+$button-text-colour-subdued-hover: rgba(0, 0, 0, 1) !default;
+$button-background-colour-subdued: rgba(0, 0, 0, 0.15) !default;
+$button-background-colour: $colour-accent !default;
+
+$button-height: 35px !default;
+$button-font-size: 1em !default;
+$button-paddings: 0 1em !default;
+
+$button-small-height: 20px !default;
+$button-small-font-size: 0.8em !default;
+$button-small-paddings: 0 0.8em !default;
+
+$canvas-toolbar-button-height: $button-height !default;
+
+$grid-gutter: "1em" !default;
+
+$default-screen-padding: 40px !default;
+$default-screen-padding-small: 15px !default;
+
+$tooltip-border-radii: $border-radii !default;
+$tooltip-padding: 18px !default;
+$default-box-shadow: 0 0 3px rgba(0, 0, 0, 0.25) !default;
+$default-box-shadow-hover: 0 0 15px rgba(0, 0, 0, 0.2) !default;
+$default-box-shadow-active: inset 0 0 10px rgba(0, 0, 0, 0.4) !default;
+$default-focus-marking: 0 0 2px rgba(0, 0, 0, 0.5) !default;
+$form-fields-border-radius: $border-radii !default;
+$form-input-field-line-height: inherit !default;

_patterns.scss

@@ -1,62 +1,6 @@
 @charset "UTF-8";
 
-// Assets
-
-@import "assets/animations";
-@import "assets/glyphs";
-@import "assets/colours";
-@import "assets/symbols";
-@import "assets/mixins";
-
-// Parameters
-
-$body-font-family: 'Source Sans Pro', sans-serif !default;
-
-$break-small: 768px !default;
-$break-large: 1280px !default;
-$pat-tail-white: 15px !default;
-
-// Menu list
-
-$menu-list-top-bottom-padding: 2px !default;
-
-// Buttons
-
-$button-border: none !default;
-$button-border-radius: $border-radii !default;
-$button-background-image: none !default;
-$button-font-weight: bold !default;
-$button-text-colour: white !default;
-$button-text-colour-hover: white !default;
-$button-text-colour-subdued: rgba(0,0,0,0.6) !default;
-$button-text-colour-subdued-hover: rgba(0,0,0,1) !default;
-$button-background-colour-subdued: rgba(0, 0, 0, 0.15) !default;
-$button-background-colour: $colour-accent !default;
-
-$button-height: 35px !default;
-$button-font-size: 1em !default;
-$button-paddings: 0 1em !default;
-
-$button-small-height: 20px !default;
-$button-small-font-size: 0.8em !default;
-$button-small-paddings: 0 0.8em !default;
-
-$canvas-toolbar-button-height: $button-height !default;
-
-$grid-gutter: '1em' !default;
-
-$default-screen-padding: 40px !default;
-$default-screen-padding-small: 15px !default;
-
-$border-radii: 10px !default;
-$tooltip-border-radii: $border-radii !default;
-$tooltip-padding: 18px !default;
-$default-box-shadow: 0 0 3px rgba(0, 0, 0, 0.25) !default;
-$default-box-shadow-hover: 0 0 15px rgba(0,0,0,0.2) !default;
-$default-box-shadow-active: inset 0 0 10px rgba(0,0,0,0.4) !default;
-$default-focus-marking: 0 0 2px rgba(0,0,0,0.5) !default;
-$form-fields-border-radius: $border-radii !default;
-$form-input-field-line-height: inherit !default;
+@import "common";
 
 // Libraries
 

components/_auto-scale.scss

@@ -1,13 +1,9 @@
 .pat-auto-scale {	
-	-moz-transform-origin: left top;
-	-webkit-transform-origin: left top;
 	transform-origin: left top;
 	opacity: 0;
-	-moz-transition: opacity 0.2s;
-	-webkit-transition: opacity 0.2s;
 	transition: opacity 0.2s;
 }
 
 .pat-auto-scale.scaled {
 	opacity: 1;
-}
+}

components/_auto-suggest.scss

@@ -1,4 +1,5 @@
 @charset "UTF-8";
+@import "../common";
 
 $glyph-remove-tag: $glyph-remove;
 $colour-auto-suggest-pills: $colour-accent !default;
@@ -24,11 +25,6 @@ $colour-auto-suggest-pills: $colour-accent !default;
   font-weight: normal;
 }
 
-.lt-ie10 .select2-container {
-  width: 100% !important;
-  height: auto !important;
-}
-
 .select2-container, .select2-drop {
   @include box-sizing();
 }
@@ -103,7 +99,7 @@ $colour-auto-suggest-pills: $colour-accent !default;
       font-size: 1px;
       text-decoration: none;
       border: 0;
-      background: url('select2.png') right top no-repeat;
+      //background: url('select2.png') right top no-repeat;
       cursor: pointer;
       outline: 0;
     }
@@ -722,4 +718,4 @@ disabled look for disabled choices in the results dropdown
   .select2-search input {
     background-position: 100% -21px !important;
   }
-}
+}

components/_bumper.scss

@@ -1,5 +1,6 @@
 @charset "UTF-8";
+@import "../assets/mixins";
 
 .pat-bumper {
   @include bumper();
-}
+}

components/_checklist.scss

@@ -1,4 +1,5 @@
 @charset "UTF-8";
+@import "../common";
 
 @mixin checkbox() {
 	padding-left: 1.5em;
@@ -144,4 +145,4 @@ label.pat-checklist {
             }
         }
     }
-}
+}

libraries/fontello/LICENSE.txt

@@ -0,0 +1,84 @@
+Font license info
+
+
+## Entypo
+
+   Copyright (C) 2012 by Daniel Bruce
+
+   Author:    Daniel Bruce
+   License:   SIL (http://scripts.sil.org/OFL)
+   Homepage:  http://www.entypo.com
+
+
+## Font Awesome
+
+   Copyright (C) 2016 by Dave Gandy
+
+   Author:    Dave Gandy
+   License:   SIL ()
+   Homepage:  http://fortawesome.github.com/Font-Awesome/
+
+
+## Web Symbols
+
+   Copyright (c) 2011 by Just Be Nice studio. All rights reserved.
+
+   Author:    Just Be Nice studio
+   License:   SIL (http://scripts.sil.org/OFL)
+   Homepage:  http://www.justbenicestudio.com/
+
+
+## Typicons
+
+   (c) Stephen Hutchings 2012
+
+   Author:    Stephen Hutchings
+   License:   SIL (http://scripts.sil.org/OFL)
+   Homepage:  http://typicons.com/
+
+
+## Elusive
+
+   Copyright (C) 2013 by Aristeides Stathopoulos
+
+   Author:    Aristeides Stathopoulos
+   License:   SIL (http://scripts.sil.org/OFL)
+   Homepage:  http://aristeides.com/
+
+
+## Iconic
+
+   Copyright (C) 2012 by P.J. Onori
+
+   Author:    P.J. Onori
+   License:   SIL (http://scripts.sil.org/OFL)
+   Homepage:  http://somerandomdude.com/work/iconic/
+
+
+## Modern Pictograms
+
+   Copyright (c) 2012 by John Caserta. All rights reserved.
+
+   Author:    John Caserta
+   License:   SIL (http://scripts.sil.org/OFL)
+   Homepage:  http://thedesignoffice.org/project/modern-pictograms/
+
+
+## Maki
+
+   Copyright (C) Mapbox, LCC
+
+   Author:    Mapbox
+   License:   BSD (https://github.com/mapbox/maki/blob/gh-pages/LICENSE.txt)
+   Homepage:  http://mapbox.com/maki/
+
+
+## Fontelico
+
+   Copyright (C) 2012 by Fontello project
+
+   Author:    Crowdsourced, for Fontello project
+   License:   SIL (http://scripts.sil.org/OFL)
+   Homepage:  http://fontello.com
+
+

libraries/fontello/README.txt

@@ -0,0 +1,75 @@
+This webfont is generated by http://fontello.com open source project.
+
+
+================================================================================
+Please, note, that you should obey original font licenses, used to make this
+webfont pack. Details available in LICENSE.txt file.
+
+- Usually, it's enough to publish content of LICENSE.txt file somewhere on your
+  site in "About" section.
+
+- If your project is open-source, usually, it will be ok to make LICENSE.txt
+  file publicly available in your repository.
+
+- Fonts, used in Fontello, don't require a clickable link on your site.
+  But any kind of additional authors crediting is welcome.
+================================================================================
+
+
+Comments on archive content
+---------------------------
+
+- /font/* - fonts in different formats
+
+- /css/*  - different kinds of css, for all situations. Should be ok with 
+  twitter bootstrap. Also, you can skip <i> style and assign icon classes
+  directly to text elements, if you don't mind about IE7.
+
+- demo.html - demo file, to show your webfont content
+
+- LICENSE.txt - license info about source fonts, used to build your one.
+
+- config.json - keeps your settings. You can import it back into fontello
+  anytime, to continue your work
+
+
+Why so many CSS files ?
+-----------------------
+
+Because we like to fit all your needs :)
+
+- basic file, <your_font_name>.css - is usually enough, it contains @font-face
+  and character code definitions
+
+- *-ie7.css - if you need IE7 support, but still don't wish to put char codes
+  directly into html
+
+- *-codes.css and *-ie7-codes.css - if you like to use your own @font-face
+  rules, but still wish to benefit from css generation. That can be very
+  convenient for automated asset build systems. When you need to update font -
+  no need to manually edit files, just override old version with archive
+  content. See fontello source code for examples.
+
+- *-embedded.css - basic css file, but with embedded WOFF font, to avoid
+  CORS issues in Firefox and IE9+, when fonts are hosted on the separate domain.
+  We strongly recommend to resolve this issue by `Access-Control-Allow-Origin`
+  server headers. But if you ok with dirty hack - this file is for you. Note,
+  that data url moved to separate @font-face to avoid problems with <IE9, when
+  string is too long.
+
+- animate.css - use it to get ideas about spinner rotation animation.
+
+
+Attention for server setup
+--------------------------
+
+You MUST setup server to reply with proper `mime-types` for font files -
+otherwise some browsers will fail to show fonts.
+
+Usually, `apache` already has necessary settings, but `nginx` and other
+webservers should be tuned. Here is list of mime types for our file extensions:
+
+- `application/vnd.ms-fontobject` - eot
+- `application/x-font-woff` - woff
+- `application/x-font-ttf` - ttf
+- `image/svg+xml` - svg