polar-express 0.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (60) hide show
  1. data/MIT-LICENSE +19 -0
  2. data/README.md +37 -0
  3. data/lib/generators/inuitcss/install/USAGE +9 -0
  4. data/lib/generators/inuitcss/install/install_generator.rb +9 -0
  5. data/lib/generators/inuitcss/install/templates/inuit.css.scss +99 -0
  6. data/lib/polar-express.rb +6 -0
  7. data/vendor/assets/stylesheets/CHANGELOG.md +26 -0
  8. data/vendor/assets/stylesheets/CONTRIBUTING.md +42 -0
  9. data/vendor/assets/stylesheets/LICENSE +13 -0
  10. data/vendor/assets/stylesheets/README.md +367 -0
  11. data/vendor/assets/stylesheets/_defaults.scss +225 -0
  12. data/vendor/assets/stylesheets/_inuit.scss +213 -0
  13. data/vendor/assets/stylesheets/base/_code.scss +63 -0
  14. data/vendor/assets/stylesheets/base/_forms.scss +174 -0
  15. data/vendor/assets/stylesheets/base/_headings.scss +60 -0
  16. data/vendor/assets/stylesheets/base/_images.scss +73 -0
  17. data/vendor/assets/stylesheets/base/_lists.scss +19 -0
  18. data/vendor/assets/stylesheets/base/_main.scss +8 -0
  19. data/vendor/assets/stylesheets/base/_paragraphs.scss +11 -0
  20. data/vendor/assets/stylesheets/base/_quotes.scss +96 -0
  21. data/vendor/assets/stylesheets/base/_smallprint.scss +13 -0
  22. data/vendor/assets/stylesheets/base/_tables.scss +163 -0
  23. data/vendor/assets/stylesheets/component.json +5 -0
  24. data/vendor/assets/stylesheets/generic/_brand.scss +18 -0
  25. data/vendor/assets/stylesheets/generic/_clearfix.scss +15 -0
  26. data/vendor/assets/stylesheets/generic/_debug.scss +168 -0
  27. data/vendor/assets/stylesheets/generic/_helper.scss +184 -0
  28. data/vendor/assets/stylesheets/generic/_mixins.scss +328 -0
  29. data/vendor/assets/stylesheets/generic/_normalize.scss +396 -0
  30. data/vendor/assets/stylesheets/generic/_pull.scss +147 -0
  31. data/vendor/assets/stylesheets/generic/_push.scss +147 -0
  32. data/vendor/assets/stylesheets/generic/_reset.scss +80 -0
  33. data/vendor/assets/stylesheets/generic/_shared.scss +61 -0
  34. data/vendor/assets/stylesheets/generic/_widths.scss +158 -0
  35. data/vendor/assets/stylesheets/objects/_arrows.scss +147 -0
  36. data/vendor/assets/stylesheets/objects/_beautons.scss +226 -0
  37. data/vendor/assets/stylesheets/objects/_block-list.scss +44 -0
  38. data/vendor/assets/stylesheets/objects/_breadcrumb.scss +63 -0
  39. data/vendor/assets/stylesheets/objects/_columns.scss +22 -0
  40. data/vendor/assets/stylesheets/objects/_flexbox.scss +55 -0
  41. data/vendor/assets/stylesheets/objects/_flyout.scss +63 -0
  42. data/vendor/assets/stylesheets/objects/_greybox.scss +58 -0
  43. data/vendor/assets/stylesheets/objects/_grids.scss +69 -0
  44. data/vendor/assets/stylesheets/objects/_icon-text.scss +40 -0
  45. data/vendor/assets/stylesheets/objects/_island.scss +38 -0
  46. data/vendor/assets/stylesheets/objects/_link-complex.scss +32 -0
  47. data/vendor/assets/stylesheets/objects/_lozenges.scss +46 -0
  48. data/vendor/assets/stylesheets/objects/_marginalia.scss +52 -0
  49. data/vendor/assets/stylesheets/objects/_matrix.scss +89 -0
  50. data/vendor/assets/stylesheets/objects/_media.scss +60 -0
  51. data/vendor/assets/stylesheets/objects/_nav.scss +155 -0
  52. data/vendor/assets/stylesheets/objects/_options.scss +45 -0
  53. data/vendor/assets/stylesheets/objects/_pagination.scss +50 -0
  54. data/vendor/assets/stylesheets/objects/_rules.scss +65 -0
  55. data/vendor/assets/stylesheets/objects/_split.scss +39 -0
  56. data/vendor/assets/stylesheets/objects/_sprite.scss +98 -0
  57. data/vendor/assets/stylesheets/objects/_stats.scss +52 -0
  58. data/vendor/assets/stylesheets/objects/_this-or-this.scss +38 -0
  59. data/vendor/assets/stylesheets/style.scss +26 -0
  60. metadata +122 -0
data/MIT-LICENSE ADDED
@@ -0,0 +1,19 @@
1
+ Copyright (c) 2013 Daniel Boggs
2
+
3
+ Permission is hereby granted, free of charge, to any person obtaining a copy
4
+ of this software and associated documentation files (the "Software"), to deal
5
+ in the Software without restriction, including without limitation the rights
6
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7
+ copies of the Software, and to permit persons to whom the Software is
8
+ furnished to do so, subject to the following conditions:
9
+
10
+ The above copyright notice and this permission notice shall be included in
11
+ all copies or substantial portions of the Software.
12
+
13
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
19
+ THE SOFTWARE.
data/README.md ADDED
@@ -0,0 +1,37 @@
1
+ #Polar Express
2
+
3
+ Polar Express is a Ruby gem that allows easy integration of the awesome [inuit.css](http://inuitcss.com/) framework into the Rails asset pipeline.
4
+
5
+ ##Installation
6
+
7
+ Add the following line to your `Gemfile` then run the `bundle` command.
8
+
9
+ ```
10
+ gem 'polar-express'
11
+ ```
12
+
13
+ To use the latest releae of the gem from github add the following line to your `Gemfile` instead of the line above and run the `bundle` command to install the gem.
14
+
15
+ ```
16
+ gem 'polar-express', :git => 'https://github.com/danielboggs/polar-express.git'
17
+ ```
18
+
19
+ Use the included generator to create the necessary assets.
20
+
21
+ ```
22
+ rails g inuitcss:install
23
+ ```
24
+
25
+ This creates a `/app/assets/stylesheets/inuit.css.scss` file in your application which abstracts inuit.css's styles.scss and _vars.scss files into your application so you can still use the framework's built in variables and customizations.
26
+
27
+ ##Additional Installation Notes
28
+
29
+ Once I have the gem installed and the assets generated I typically remove the `require_tree .` line from my `/app/assets/stylesheets/application.css` file and manually require the generated asset file with `*= require inuit.css.scss`. This allows the framework to totally handle the css of your project without rails automatically including anything that gets dropped into the stylesheets directory.
30
+
31
+ From here I typically create a `theme` folder in my stylesheets directory and add any custom/theme sass files there such as `_layout.scss`, `_header.scss` etc. then manually import them at the bottom of the `inuit.css.scss` file.
32
+
33
+ e.g.
34
+
35
+ ```
36
+ @import "theme/layout";
37
+ ```
@@ -0,0 +1,9 @@
1
+ Description:
2
+ Sets up inuit.css in your Rails project.
3
+
4
+ This generates the necessary files in the assets/stylesheets directory.
5
+
6
+ Examples:
7
+ `rails g inuitcss:install`
8
+
9
+ `rails g inuitcss:install --help`
@@ -0,0 +1,9 @@
1
+ module Inuitcss
2
+ class InstallGenerator < ::Rails::Generators::Base
3
+ source_root File.expand_path("../templates", __FILE__)
4
+ desc "This generator adds inuit.css to the Rails asset pipeline"
5
+ def install
6
+ copy_file "inuit.css.scss", "app/assets/stylesheets/inuit.css.scss"
7
+ end
8
+ end
9
+ end
@@ -0,0 +1,99 @@
1
+ /*------------------------------------*\
2
+ VARS.SCSS
3
+ \*------------------------------------*/
4
+ /**
5
+ * Any variables you find set in inuit.css’ `_vars.scss` that you do not wish to
6
+ * keep, simply redefine here. This means that if inuit.css, for example, sets
7
+ * your `$base-font-size` at 16px and you wish it to be 14px, simply redeclare
8
+ * that variable in this file. inuit.css ignores its own variables in favour of
9
+ * using your own, so you can completely modify how inuit.css works without ever
10
+ * having to alter the framework itself.
11
+ */
12
+
13
+
14
+
15
+
16
+
17
+ /*------------------------------------*\
18
+ $OBJECTS-AND-ABSTRACTIONS
19
+ \*------------------------------------*/
20
+ /**
21
+ * All of inuit.css’ objects and abstractions are initially turned off by
22
+ * default. This means that you start any project with as little as possible,
23
+ * and introducing objects and abstractions is as simple as switching the
24
+ * following variables to `true`.
25
+ */
26
+ $use-grids: false;
27
+ $use-flexbox: false;
28
+ $use-columns: false;
29
+ $use-nav: false;
30
+ $use-options: false;
31
+ $use-pagination: false;
32
+ $use-breadcrumb: false;
33
+ $use-media: false;
34
+ $use-marginalia: false;
35
+ $use-island: false;
36
+ $use-block-list: false;
37
+ $use-matrix: false;
38
+ $use-split: false;
39
+ $use-this-or-this: false;
40
+ $use-link-complex: false;
41
+ $use-flyout: false;
42
+ $use-arrows: false;
43
+ $use-sprite: false;
44
+ $use-icon-text: false;
45
+ $use-beautons: false;
46
+ $use-lozenges: false;
47
+ $use-rules: false;
48
+ $use-stats: false;
49
+ $use-greybox: false;
50
+
51
+
52
+
53
+
54
+
55
+ /*------------------------------------*\
56
+ $OVERRIDES
57
+ \*------------------------------------*/
58
+ /**
59
+ * Place any variables that should override inuit.css’ defaults here.
60
+ */
61
+
62
+
63
+
64
+
65
+
66
+ /*------------------------------------*\
67
+ $CUSTOM
68
+ \*------------------------------------*/
69
+ /**
70
+ * Place any of your own variables that sit on top of inuit.css here.
71
+ */
72
+
73
+
74
+
75
+
76
+
77
+ /*------------------------------------*\
78
+ $INUIT
79
+ \*------------------------------------*/
80
+ /**
81
+ * Imports the base inuit.css styles
82
+ */
83
+
84
+ @import "style";
85
+
86
+
87
+
88
+ /*------------------------------------*\
89
+ $THEME
90
+ \*------------------------------------*/
91
+ /**
92
+ * Place any of your own theme css file imports here.
93
+ * e.g.
94
+ * @import "theme/theme";
95
+ */
96
+
97
+
98
+
99
+
@@ -0,0 +1,6 @@
1
+ module Polarexpress
2
+ module Rails
3
+ class Engine < ::Rails::Engine
4
+ end
5
+ end
6
+ end
@@ -0,0 +1,26 @@
1
+ # Changelog
2
+
3
+ This changelog only exists as of v5.0 onward, for previous inuit.css versions’
4
+ history please browse the commit logs.
5
+
6
+ ## v5.0.0
7
+
8
+ This major version bump saw the introduction of the
9
+ [inuit.css web template](https://github.com/csswizardry/inuit.css-web-template),
10
+ a means of including inuit.css as a submodule through which you can easily pull
11
+ updates from GitHub whilst avoiding having to touch any library code.
12
+
13
+ * Use [beautons](https://github.com/csswizardry/beautons) for button styling
14
+ * Use [csswizardry-grids](https://github.com/csswizardry/csswizardry-grids) for
15
+ inuit.css’ built-in grid system.
16
+ * Removed [Batch](http://adamwhitcroft.com/batch/)
17
+ * Moved over to [HTML5 Boilerplate](http://html5boilerplate.com/) style helper
18
+ classes.
19
+ * Added a few more helper classes and mixins.
20
+ * Introduced switches to turn objects and abstractions on/off.
21
+
22
+ ## v5.1.1
23
+
24
+ * Convert special character to unicode.
25
+ * Fix/change the `headings` mixin.
26
+ * Fix some typos pertaining to the renaming of the spriting object.
@@ -0,0 +1,42 @@
1
+ # Contributing to inuit.css
2
+
3
+ So, you want to contribute to inuit.css? That’s awesome!
4
+
5
+ However, I do ask that you follow a few small rules…
6
+
7
+ ## Bugs and issues
8
+
9
+ If you believe you have a bug or issue that needs investigating:
10
+
11
+ * Search existing issues to avoid opening a duplicate.
12
+ * Please open an issue and be as descriptive as possible.
13
+ * If you can, accompany the report with a reduced test case via
14
+ [jsFiddle](http://jsfiddle.net/) or similar.
15
+
16
+ ## Pull requests
17
+
18
+ If submitting a pull request:
19
+
20
+ * Follow the predefined code style used in the framework (I’m afraid that means
21
+ no spaces before opening braces and after colons (I’m weird like that)).
22
+ * Read my [Git workflow for inuit.css](http://csswizardry.com/2012/12/my-git-workflow-for-inuit-css/)
23
+ and try and keep as close to that as possible.
24
+ * Carry out all your work in a topic branch with a suitable name, e.g.
25
+ `fix/grids`, `feature/new-object` etc.
26
+ * Commit sensibly and, if needs be, rebase your branch to tidy your commits up.
27
+ * Ensure inuit.css still compiles without error through both the standalone
28
+ library and the web template.
29
+ * Submit all pull requests against the `incoming` branch. Any pull requests
30
+ submitted against `master` **will** be declined.
31
+ * Advise on versioning if possible; if the changes require a version bump or
32
+ merely a patch bump, please let me know.
33
+
34
+ ## Feature requests
35
+
36
+ I am open to requests for adding new features, but please bear in mind:
37
+
38
+ * Make sure it fits in the with ideals and scope of the project; inuit.css has a
39
+ very specific purpose and all features need tp tie in with this.
40
+ * Have a go at adding the new functionality yourself and opening a pull request.
41
+ * **Discuss any features before attempting to develop them yourself;** I would
42
+ hate for anyone to spend a tonne of time on something that I end up rejecting.
@@ -0,0 +1,13 @@
1
+ Copyright 2012 Harry Roberts
2
+
3
+ Licensed under the Apache License, Version 2.0 (the "License");
4
+ you may not use this file except in compliance with the License.
5
+ You may obtain a copy of the License at
6
+
7
+ http://apache.org/licenses/LICENSE-2.0
8
+
9
+ Unless required by applicable law or agreed to in writing, software
10
+ distributed under the License is distributed on an "AS IS" BASIS,
11
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12
+ See the License for the specific language governing permissions and
13
+ limitations under the License.
@@ -0,0 +1,367 @@
1
+ ![inuit.css](http://inuitcss.com/img/content/logo.png)
2
+
3
+ # inuit.css – v5.0
4
+
5
+ inuit.css is a powerful little framework designed for _serious_ developers.
6
+
7
+ It is a Sass based, Object Oriented framework that is full of objects and
8
+ abstractions. inuit.css provides little-to-no design which means no undoing
9
+ things, no deleting CSS and no adhering to other peoples’ design decisions.
10
+
11
+ inuit.css is built on a [BEM](http://bem.info/)-style naming convention and
12
+ honed based on [work done by Nicolas Gallagher](https://gist.github.com/1309546).
13
+
14
+ inuit.css is ideally suited to designers who want to focus on the creative and
15
+ not code, and developers who understand the need for abstraction and an OO
16
+ approach.
17
+
18
+ inuit.css gives you design patterns, not design decisions. It features nestable,
19
+ fluid grids; a double-stranded heading hierarchy; sprites; buttons and a lot,
20
+ _lot_ more.
21
+
22
+
23
+ **Use inuit.css if:**
24
+
25
+ * You need a powerful library of objects and abstractions.
26
+ * You understand/appreciate the value of OO code and the need for scalability
27
+ and reuse.
28
+ * You are a confident/competent developer comfortable with OOCSS and Sass, as
29
+ well as familiarity with OO principles in general.
30
+
31
+ **Do not use inuit.css if:**
32
+
33
+ * You need a framework that supplies design (I’d recommend
34
+ [Bootstrap](http://twitter.github.com/bootstrap/) for that).
35
+
36
+ ## Browser support
37
+
38
+ inuit.css is a modern framework for modern browsers. It takes advantage of
39
+ [normalize.css](http://necolas.github.com/normalize.css/) and global
40
+ `box-sizing:border-box;` (optional). As such, inuit.css is intended for **IE8**
41
+ and above only. The last release to support IE7 was
42
+ [v4.1.5](https://github.com/csswizardry/inuit.css/archive/v4.1.5.zip).
43
+
44
+ ## The developer
45
+
46
+ There are a million-and-one different CSS frameworks out there so this rather
47
+ cringeworthy section is an attempt to validate inuit.css and give it some
48
+ credibility…
49
+
50
+ I am [Harry Roberts](http://hry.rbrts.me), I am a 22 year old developer and
51
+ front-end architect from the UK. I work as a Senior UI Developer for
52
+ [BSkyB](http://en.wikipedia.org/wiki/BSkyB) where it is my job to build scalable
53
+ front-ends, write internally used CSS frameworks and libraries, and to architect
54
+ CSS and front-end builds.
55
+
56
+ I [write](http://csswizardry.com), [tweet](http://twitter.com/csswizardry) and
57
+ [speak](http://speakerdeck.com/u/csswizardry/) about OOCSS, scalable CSS,
58
+ maintainability, working in large teams, CSS performance, CSS architecture and a
59
+ whole lot more.
60
+
61
+ inuit.css is the result of years of my specialism in CSS (as CSS is all I do).
62
+ It is a collection of design patterns, objects, and abstractions that have been
63
+ refined and bulletproofed over hours of development across an array of projects
64
+ of varying sizes. inuit.css is the result of hundreds of hours of work all
65
+ condensed into one powerful little framework.
66
+
67
+ ## Installation
68
+
69
+ **Requires Sass 3.2**
70
+
71
+ inuit.css v5.0+ is designed to be even more advanced than previous versions of
72
+ your favourite CSS framework! inuit.css’ core library is now intended to be used
73
+ as a submodule which means you can always get inuit.css’ latest updates without
74
+ ever having to touch a line of library code.
75
+
76
+ This works by having this, the inuit.css core library, and the
77
+ [inuit.css-web-template](https://github.com/csswizardry/inuit.css-web-template).
78
+ The web template is very un-opinionated and simply houses your site, however
79
+ you wish to build it. It has a `css/` directory which contains your
80
+ project-specific variables and any stylesheets that extend inuit.css, as well as
81
+ housing inuit.css as an updatable submodule. Any of inuit.css’ default settings
82
+ can be simply overridden from the web template which means you no longer have to
83
+ edit a single line of the framework (which in turn means that incorporating
84
+ inuit.css updates is as simple as a `$ git pull`).
85
+
86
+ ### Install via command line (recommended)
87
+
88
+ The command line install of inuit.css is _incredibly_ simple:
89
+
90
+ $ git clone --recursive git@github.com:csswizardry/inuit.css-web-template.git your-project-folder
91
+ $ cd your-project-folder
92
+ $ ./go
93
+
94
+ What we are doing here is cloning an instance of the inuit.css-web-template and
95
+ its submodules (that’s what the `--recursive` does) into a directory which you
96
+ specify. Next we `cd` into that directory and run [our `go` script](https://github.com/csswizardry/inuit.css-web-template/blob/master/go).
97
+ This script (courtesy of [Nick Payne](http://twitter.com/makeusabrew)) simply
98
+ removes the web template’s Git instance and replaces it with a fresh one for
99
+ your project, whilst also maintaining your inuit.css submodule.
100
+
101
+ ### Install via zip
102
+
103
+ Though not tested, using inuit.css from its GitHub zip _should_ be fairly
104
+ simple. Using inuit.css from zipped source does mean that you can’t update
105
+ inuit.css as a submodule, but you may well be able to drop fresh zip files into
106
+ the `css/inuit.css/` directory provided you don’t edit any library code.
107
+
108
+ Firstly you need to download [the web template](https://github.com/csswizardry/inuit.css-web-template)
109
+ zip and unpack it to a location of your choosing. Next you need to download the
110
+ inuit.css core zip and unpack that into `css/inuit.css/` in your new project.
111
+
112
+ ## Getting started
113
+
114
+ Once you have your project set up, you should be looking at a directory
115
+ structure a little like this:
116
+
117
+ your-project-folder/
118
+ css/
119
+ inuit.css/
120
+ _vars.scss
121
+ style.scss
122
+ watch
123
+ index.html
124
+
125
+ Your CSS directory holds everything you need to get building:
126
+
127
+ * Everything in `css/inuit.css/` is library code which **should not** be edited.
128
+ If you `cd` into here you should see that this submodule will initially be on
129
+ `(no branch)`, this is because the submodule points at a specific commit and
130
+ not a branch. You can treat this directory like any other Git project which
131
+ means you can `$ git checkout master` to get your submodule on the most
132
+ up-to-date stable version of inuit.css. To grab any new changes simply run
133
+ `$ git pull` on the `master` branch.
134
+ * `_vars.scss` contains any project variables you need, as well as any overrides
135
+ you wish to make to the inuit.css library. It also houses feature switches to
136
+ turn inuit.css’ objects and abstractions on and off as you need them.
137
+ * `style.scss` is your master Sass stylesheet which will concatenate any other
138
+ stylesheets from inuit.css and your extensions when it is compiled.
139
+ * `watch` is a handy little script which makes it easier for you to watch your
140
+ Sass from the command line; instead of the `$ sass --watch ...` command, you
141
+ now need only type `$ ./watch` and the script will do the rest. Running this
142
+ will compile your project into `style[.min].css`.
143
+
144
+ ## How inuit.css works
145
+
146
+ inuit.css works in ‘layers’, not dissimilar to [SMACSS](http://smacss.com/). The
147
+ principle of inuit.css’ architecture is levels of extension; each layer of code
148
+ extends the layer below.
149
+
150
+ We start in `inuit.css/generic/`, with our most generic, low-level styling,
151
+ things like a clearfix, [normalize.css](http://necolas.github.com/normalize.css/),
152
+ our reset and any shared styling like margins (for vertical rythmn).
153
+
154
+ On top of that we lay our base styles, found in `inuit.css/base/`; these are
155
+ things like unclassed headings, what our basic forms look like, how simple
156
+ tables appear. These are all design-free HTML elements that you can extend with
157
+ your own styles later on.
158
+
159
+ Next up, in `inuit.css/objects/`, we have our objects and abstractions; these
160
+ are all scaffolding type constructs that hold no styling, but do heavy lifting.
161
+ In here we have things like
162
+ [the media object](http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/),
163
+ [the nav abstraction](http://csswizardry.com/2011/09/the-nav-abstraction/) and
164
+ other unstyled objects that you can use to construct design patterns _without_
165
+ design (that bit is left up to you).
166
+
167
+ Finally we have our helper classes (though these live back in the `inuit.css/generic/`
168
+ directory); these are things like margin helper classes, width classes and other
169
+ ‘style trumps’ which need to take precedence over any things that have gone
170
+ before them. These classes are used to modify your objects and abstractions on a
171
+ case-by-case basis.
172
+
173
+ ## Overriding inuit.css’ defaults
174
+
175
+ inuit.css has a file called `_defaults.scss` which contains all the Sass
176
+ variables required for the library to compile without failing. These variables
177
+ are preset because Sass will error without them, however they are **not** set in
178
+ stone, and you are encouranged to override and experiment with them.
179
+
180
+ It is tempting to modify their vaules in the inuit.css submodule but this is
181
+ **not** the correct method for modifying inuit.css, and in doing so you will
182
+ prevent yourself from being able to update inuit.css’ core library. The correct
183
+ proceedure is to redefine that variable in `_vars.scss` found in the inuit.css
184
+ web template. Let’s take an example…
185
+
186
+ In inuit.css’ `_defaults.scss` we find the following:
187
+
188
+ $h1-size: 36px!default; // .alpha
189
+ $h2-size: 30px!default; // .beta
190
+ $h3-size: 24px!default; // .gamma
191
+ $h4-size: 20px!default; // .delta
192
+ $h5-size: 16px!default; // .epsilon
193
+ $h6-size: 14px!default; // .zeta
194
+
195
+ Let’s say we want our `h1`s to be `48px` and not `36px`; instead of modifying
196
+ the value of `$h1-size` here, pop open your `_vars.scss` file and add this in
197
+ the overrides section:
198
+
199
+ /*------------------------------------*\
200
+ $OVERRIDES
201
+ \*------------------------------------*/
202
+ /**
203
+ * Place any variables that should override inuit.css’ defaults here.
204
+ */
205
+ $h1-size:48px;
206
+
207
+ Now when you compile your CSS, inuit.css will know to ignore its preset value
208
+ (that is what `!default` is for) in favour of your own. By doing things this way
209
+ you can change the values that inuit.css uses without having to modify inuit.css
210
+ itself, thus leaving it free to be updated.
211
+
212
+ In this file you will also see your feature switches needed to turn objects and
213
+ abstractions on and off. Feature switches are only preset for objects and
214
+ abstractions; you will **not** initially find switches for things like
215
+ `$debug-mode` in here, but they can be turned on and off by adding an override
216
+ as outlined above, e.g.:
217
+
218
+ /*------------------------------------*\
219
+ $OVERRIDES
220
+ \*------------------------------------*/
221
+ /**
222
+ * Place any variables that should override inuit.css’ defaults here.
223
+ */
224
+ $h1-size:48px;
225
+ $push:true;
226
+ $palm-push:true;
227
+
228
+ This file can also house any custom variables that you wish to use in extending
229
+ inuit.css, as covered in the next section.
230
+
231
+ ## Extending inuit.css
232
+
233
+ inuit.css is, by design, a very design-free framework. This means that the
234
+ style and design of your site is left entirely up to you (as it should be).
235
+ Because inuit.css gives you lots of customisable foundations, you need to add
236
+ the final layer: UI.
237
+
238
+ How you go about this step is largely left up to you, but it is common practice
239
+ to create another directory in `css/` called `ui/`, leaving you with:
240
+
241
+ your-project-folder/
242
+ css/
243
+ inuit.css/
244
+ ui/
245
+ _vars.scss
246
+ style.scss
247
+ watch
248
+ index.html
249
+
250
+ In here you can place your own Sass files which hold your UI’s CSS, for example:
251
+
252
+ ui/
253
+ _contact-form.scss
254
+ _footer.scss
255
+ _pricing-table.scss
256
+
257
+ You then include these from `style.scss`, like so:
258
+
259
+ /**
260
+ * She’s all yours, cap’n... Begin importing your stuff here.
261
+ */
262
+ //@import "ui/example";
263
+ @import "ui/footer";
264
+ @import "ui/contact-form";
265
+ @import "ui/pricing-table";
266
+
267
+ Now, when you run `$ ./watch`, `style.scss` will be calling:
268
+
269
+ 1. Your variables
270
+ 2. The inuit.css core library (as outlined above)
271
+ 3. Your custom/UI CSS
272
+
273
+ …and building a concatenated stylesheet out of it all. Neat, huh?!
274
+
275
+ ## Footprint
276
+
277
+ Out of the box, inuit.css is very small, however it is **imperative** that you
278
+ only ever deploy a minified version of your compiled stylesheet to your live
279
+ environment. inuit.css compiles stright to minified output by default, but you
280
+ can change this in `watch` if you have a build process in place.
281
+
282
+ It is also **highly** recommended that you enable gzip compression on any text
283
+ assets being served from your site; doing so will further reduce the footprint
284
+ of inuit.css and greatly help your site’s performance.
285
+
286
+ ## Documentation
287
+
288
+ There are no official docs for inuit.css because the code _is_ the
289
+ documentation. Everything is heavily commented with example HTML. If you
290
+ struggle with anything please tweet at [@inuitcss](http://twitter.com/inuitcss)
291
+ and/or [open an issue](https://github.com/csswizardry/inuit.css/issues) and I’ll
292
+ try help out and use your feedback to improve the documentation.
293
+
294
+ It is strongly encouraged that you thoroughly read the source of inuit.css’
295
+ files, particularly `_inuit.scss`.
296
+
297
+ ### Demos
298
+
299
+ Although there are no docs as such, there is [a dedicated inuit.css jsFiddle
300
+ account](http://jsfiddle.net/user/inuitcss/fiddles/) which houses plenty of
301
+ demos of various aspects of the framework.
302
+
303
+ ### Development
304
+
305
+ You can keep up-to-date with upcoming features, suggestions and fixes by looking
306
+ at the [inuit.css Trello board](https://trello.com/board/inuit-css/50a16487543dea585502f3d2).
307
+
308
+ ## Looking for a little LESS?
309
+
310
+ [Peter Wilson](http://twitter.com/pwcc) is maintaining a LESS port of inuit.css:
311
+ check [the GitHub repo](https://github.com/peterwilsoncc/inuit.css).
312
+
313
+ ## Using Compass?
314
+
315
+ [Stephen Way](http://github.com/stephenway) is maintaining a Compass port of
316
+ inuit.css: check [the GitHub repo](https://github.com/stephenway/compass-inuit).
317
+
318
+ ## Test-drive
319
+
320
+ If you would like to try inuit.css out before you download anything there is a
321
+ compiled version [on jsFiddle](http://jsfiddle.net/inuitcss/a6yS3/) that you
322
+ are encouraged to fork and play with. Refer back to
323
+ [the source here on GitHub](https://github.com/csswizardry/inuit.css/blob/master/inuit.css/_inuit.scss)
324
+ for documentation.
325
+
326
+ ## As used by
327
+
328
+ * [BSkyB](http://en.wikipedia.org/wiki/BSkyB)
329
+ * [pr.ofile.me](http://pr.ofile.me)
330
+ * [Lukas Bestle](http://lu-x.me)
331
+ * [Matthew Tyas](http://matthewtyas.com/)
332
+
333
+ ### Using inuit.css?
334
+
335
+ If you use inuit.css on a live project then [tweet at me](http://twitter.com/inuitcss)
336
+ and I’ll send you some inuit.css stickers!
337
+
338
+ ## Support inuit.css
339
+
340
+ If you use and/or like inuit.css, perhaps you might consider [supporting it
341
+ through Gumroad](http://gum.co/nOoht).
342
+
343
+ ## Credits
344
+
345
+ inuit.css, although produced and maintained by one developer, could not have
346
+ been possible without inspiration and work from an array of other people.
347
+
348
+ * **[Nicole Sullivan](https://twitter.com/stubbornella)** for her work on OOCSS
349
+ * **[Jonathan Snook](https://twitter.com/snookca)** for his work on SMACSS
350
+ * **[Nicolas Gallagher](https://twitter.com/necolas)** for his work on numerous
351
+ CSS things
352
+ * **[Bryan James](https://twitter.com/WengersToyBus)** for the inuit.css logo
353
+ * **[Nick Payne](https://twitter.com/makeusabrew)** for helping with v5.0’s
354
+ submodule architecture.
355
+
356
+ And probably more…
357
+
358
+ ## License
359
+
360
+ Copyright 2013 Harry Roberts
361
+
362
+ Licensed under the Apache License, Version 2.0.
363
+
364
+ ---
365
+
366
+ **inuit.css is the most powerful little framework out there, and it’s ready to
367
+ go!**