sled 4.5.5

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 (63) hide show
  1. data/LICENSE +13 -0
  2. data/README.md +24 -0
  3. data/lib/generators/inuit/install/USAGE +9 -0
  4. data/lib/generators/inuit/install/install_generator.rb +10 -0
  5. data/lib/generators/inuit/install/templates/inuit_and_override.css.scss +3 -0
  6. data/lib/sled.rb +8 -0
  7. data/lib/sled/version.rb +3 -0
  8. data/vendor/assets/stylesheets/_vars.scss +124 -0
  9. data/vendor/assets/stylesheets/assets/batch/batch.eot +0 -0
  10. data/vendor/assets/stylesheets/assets/batch/batch.svg +360 -0
  11. data/vendor/assets/stylesheets/assets/batch/batch.ttf +0 -0
  12. data/vendor/assets/stylesheets/assets/batch/batch.woff +0 -0
  13. data/vendor/assets/stylesheets/assets/batch/batch_webfont_reference.pdf +0 -0
  14. data/vendor/assets/stylesheets/inuit.css/_inuit.scss +210 -0
  15. data/vendor/assets/stylesheets/inuit.css/base/_code.scss +63 -0
  16. data/vendor/assets/stylesheets/inuit.css/base/_forms.scss +174 -0
  17. data/vendor/assets/stylesheets/inuit.css/base/_headings.scss +60 -0
  18. data/vendor/assets/stylesheets/inuit.css/base/_images.scss +67 -0
  19. data/vendor/assets/stylesheets/inuit.css/base/_links.scss +37 -0
  20. data/vendor/assets/stylesheets/inuit.css/base/_lists.scss +19 -0
  21. data/vendor/assets/stylesheets/inuit.css/base/_main.scss +8 -0
  22. data/vendor/assets/stylesheets/inuit.css/base/_paragraphs.scss +11 -0
  23. data/vendor/assets/stylesheets/inuit.css/base/_quotes.scss +96 -0
  24. data/vendor/assets/stylesheets/inuit.css/base/_smallprint.scss +13 -0
  25. data/vendor/assets/stylesheets/inuit.css/base/_tables.scss +163 -0
  26. data/vendor/assets/stylesheets/inuit.css/generic/_brand.scss +18 -0
  27. data/vendor/assets/stylesheets/inuit.css/generic/_clearfix.scss +15 -0
  28. data/vendor/assets/stylesheets/inuit.css/generic/_debug.scss +168 -0
  29. data/vendor/assets/stylesheets/inuit.css/generic/_helper.scss +112 -0
  30. data/vendor/assets/stylesheets/inuit.css/generic/_mixins.scss +299 -0
  31. data/vendor/assets/stylesheets/inuit.css/generic/_normalize.scss +396 -0
  32. data/vendor/assets/stylesheets/inuit.css/generic/_pull.scss +123 -0
  33. data/vendor/assets/stylesheets/inuit.css/generic/_push.scss +123 -0
  34. data/vendor/assets/stylesheets/inuit.css/generic/_reset.scss +80 -0
  35. data/vendor/assets/stylesheets/inuit.css/generic/_shared.scss +61 -0
  36. data/vendor/assets/stylesheets/inuit.css/generic/_widths.scss +154 -0
  37. data/vendor/assets/stylesheets/inuit.css/objects/_arrows.scss +143 -0
  38. data/vendor/assets/stylesheets/inuit.css/objects/_batch.scss +15 -0
  39. data/vendor/assets/stylesheets/inuit.css/objects/_block-list.scss +40 -0
  40. data/vendor/assets/stylesheets/inuit.css/objects/_breadcrumb.scss +59 -0
  41. data/vendor/assets/stylesheets/inuit.css/objects/_buttons.scss +44 -0
  42. data/vendor/assets/stylesheets/inuit.css/objects/_columns.scss +18 -0
  43. data/vendor/assets/stylesheets/inuit.css/objects/_flexbox.scss +51 -0
  44. data/vendor/assets/stylesheets/inuit.css/objects/_flyout.scss +59 -0
  45. data/vendor/assets/stylesheets/inuit.css/objects/_greybox.scss +54 -0
  46. data/vendor/assets/stylesheets/inuit.css/objects/_grids.scss +99 -0
  47. data/vendor/assets/stylesheets/inuit.css/objects/_icon-text.scss +36 -0
  48. data/vendor/assets/stylesheets/inuit.css/objects/_island.scss +34 -0
  49. data/vendor/assets/stylesheets/inuit.css/objects/_link-complex.scss +28 -0
  50. data/vendor/assets/stylesheets/inuit.css/objects/_lozenges.scss +42 -0
  51. data/vendor/assets/stylesheets/inuit.css/objects/_marginalia.scss +48 -0
  52. data/vendor/assets/stylesheets/inuit.css/objects/_matrix.scss +98 -0
  53. data/vendor/assets/stylesheets/inuit.css/objects/_media.scss +56 -0
  54. data/vendor/assets/stylesheets/inuit.css/objects/_nav.scss +151 -0
  55. data/vendor/assets/stylesheets/inuit.css/objects/_options.scss +41 -0
  56. data/vendor/assets/stylesheets/inuit.css/objects/_pagination.scss +46 -0
  57. data/vendor/assets/stylesheets/inuit.css/objects/_rules.scss +61 -0
  58. data/vendor/assets/stylesheets/inuit.css/objects/_split.scss +35 -0
  59. data/vendor/assets/stylesheets/inuit.css/objects/_sprite.scss +92 -0
  60. data/vendor/assets/stylesheets/inuit.css/objects/_stats.scss +48 -0
  61. data/vendor/assets/stylesheets/inuit.css/objects/_this-or-this.scss +34 -0
  62. data/vendor/assets/stylesheets/style.scss +23 -0
  63. metadata +126 -0
@@ -0,0 +1,15 @@
1
+ /*------------------------------------*\
2
+ $BATCH
3
+ \*------------------------------------*/
4
+ @if $batch == true{
5
+ @font-face{
6
+ font-family:Batch;
7
+ src:url('assets/batch/batch.eot');
8
+ src:url('assets/batch/batch.eot?#iefix') format('embedded-opentype'),
9
+ url('assets/batch/batch.woff') format('woff'),
10
+ url('assets/batch/batch.ttf') format('truetype'),
11
+ url('assets/batch/batch.svg#batchregular') format('svg');
12
+ font-weight:normal;
13
+ font-style:normal;
14
+ }
15
+ }
@@ -0,0 +1,40 @@
1
+ /*------------------------------------*\
2
+ $BLOCK-LIST
3
+ \*------------------------------------*/
4
+ /**
5
+ * Create big blocky lists of content, e.g.:
6
+ *
7
+ <ul class=block-list>
8
+ <li>Foo</li>
9
+ <li>Bar</li>
10
+ <li>Baz</li>
11
+ <li><a href=# class=block-list__link>Foo Bar Baz</a></li>
12
+ </ul>
13
+ *
14
+ * Extend this object in your theme stylesheet.
15
+ *
16
+ * Demo: jsfiddle.net/inuitcss/hR57q
17
+ *
18
+ */
19
+ .block-list{
20
+
21
+ &,
22
+ > li{
23
+ border:0 solid #ccc; /* Override this color in your theme stylesheet */
24
+ }
25
+ }
26
+ .block-list{
27
+ list-style:none;
28
+ margin-left:0;
29
+ border-top-width:1px;
30
+
31
+ > li{
32
+ border-bottom-width:1px;
33
+ padding:$half-spacing-unit;
34
+ }
35
+ }
36
+ .block-list__link{
37
+ display:block;
38
+ padding:$half-spacing-unit;
39
+ margin:-$half-spacing-unit;
40
+ }
@@ -0,0 +1,59 @@
1
+ /*------------------------------------*\
2
+ $BREADCRUMB
3
+ \*------------------------------------*/
4
+ /**
5
+ * Simple breadcrumb styling to apply to (ordered) lists. Extends `.nav`, e.g.:
6
+ *
7
+ <ol class="nav breadcrumb">
8
+ <li><a href=#>Home</a></li>
9
+ <li><a href=#>About</a></li>
10
+ <li><a href=#>The Board</a></li>
11
+ <li class=current><a href=#>Directors</a></li>
12
+ </ol>
13
+ *
14
+ * Demo: jsfiddle.net/inuitcss/rkAY9
15
+ *
16
+ */
17
+ .breadcrumb > li + li:before{
18
+ content:"» ";
19
+ }
20
+
21
+
22
+ /**
23
+ * For denoting a path-like structure, GitHub style, e.g.:
24
+ *
25
+ <ol class="nav breadcrumb--path">
26
+ <li class=breadcrumb__root><a href=#>inuit.css</a></li>
27
+ <li><a href=#>inuit.css</a></li>
28
+ <li><a href=#>partials</a></li>
29
+ <li class=current><a href=#>objects</a></li>
30
+ </ol>
31
+ *
32
+ */
33
+ .breadcrumb--path > li + li:before{
34
+ content:"/ ";
35
+ }
36
+
37
+
38
+ /**
39
+ * Assign a delimiter on the fly through a data attribute, e.g.:
40
+ *
41
+ <ol class="nav breadcrumb">
42
+ <li><a href=#>Home</a></li>
43
+ <li data-breadcrumb="|"><a href=#>About</a></li>
44
+ <li data-breadcrumb="|"><a href=#>The Board</a></li>
45
+ <li data-breadcrumb="|" class=current><a href=#>Directors</a></li>
46
+ </ol>
47
+ *
48
+ */
49
+ .breadcrumb > li + li[data-breadcrumb]:before{
50
+ content:attr(data-breadcrumb)" ";
51
+ }
52
+
53
+
54
+ /**
55
+ * Denote the root of the tree.
56
+ */
57
+ .breadcrumb__root{
58
+ font-weight:bold;
59
+ }
@@ -0,0 +1,44 @@
1
+ /*------------------------------------*\
2
+ $BUTTONS
3
+ \*------------------------------------*/
4
+ /**
5
+ * Basic button structural styling. Extend in your theme stylesheet.
6
+ *
7
+ * Demo: jsfiddle.net/inuitcss/RqHcp
8
+ *
9
+ */
10
+ .btn{
11
+ font:inherit;
12
+ cursor:pointer;
13
+ border:none;
14
+ display:inline-block;
15
+ margin: 0;
16
+ line-height:1;
17
+ /**
18
+ * Set padding in ems so we can change the size of a button by merely
19
+ * altering its `font-size`.
20
+ */
21
+ padding:0.5em;
22
+ }
23
+ .btn,
24
+ .btn:hover{
25
+ text-decoration:none;
26
+ }
27
+
28
+ /**
29
+ * Basic button modifiers
30
+ */
31
+ .btn--sml { font-size: .75em; }
32
+ .btn--lrg { font-size:1.50em; }
33
+
34
+ .btn--full{
35
+ display:block;
36
+ text-align:center;
37
+ /**
38
+ * The following is so that `.btn-full` works properly on `input`s as well
39
+ * as `a`s.
40
+ */
41
+ padding-right:0;
42
+ padding-left: 0;
43
+ width:100%;
44
+ }
@@ -0,0 +1,18 @@
1
+ /*------------------------------------*\
2
+ $COLUMNS
3
+ \*------------------------------------*/
4
+ /**
5
+ * Here we can set elements in columns of text using CSS3, e.g.:
6
+ *
7
+ <p class=text-cols--2>
8
+ *
9
+ * Demo: jsfiddle.net/inuitcss/E26Yd
10
+ *
11
+ */
12
+ %text-cols{
13
+ @include vendor(column-gap, $base-spacing-unit);
14
+ }
15
+ .text-cols--2 { @extend %text-cols; @include vendor(column-count, 2); }
16
+ .text-cols--3 { @extend %text-cols; @include vendor(column-count, 3); }
17
+ .text-cols--4 { @extend %text-cols; @include vendor(column-count, 4); }
18
+ .text-cols--5 { @extend %text-cols; @include vendor(column-count, 5); }
@@ -0,0 +1,51 @@
1
+ /*------------------------------------*\
2
+ $FLEXBOX
3
+ \*------------------------------------*/
4
+ /**
5
+ * Until we can utilise flexbox natively we can kinda, sorta, attempt to emulate
6
+ * it, in a way... e.g.:
7
+ *
8
+ <header class=flexbox>
9
+
10
+ <div class=flexbox__item>
11
+ <b>Welcome to</b>
12
+ </div>
13
+
14
+ <div class=flexbox__item>
15
+ <img src="//csswizardry.com/inuitcss/img/logo.jpg" alt="inuit.css">
16
+ </div>
17
+
18
+ </header>
19
+ *
20
+ * We can also combine our grid system classes with `.flexbox__item` classes,
21
+ * e.g.:
22
+ *
23
+ <div class=flexbox>
24
+ <div class="flexbox__item one-quarter">
25
+ </div>
26
+ <div class="flexbox__item three-quarters">
27
+ </div>
28
+ </div>
29
+ *
30
+ * It’s pretty poorly named I’m afraid, but it works…
31
+ *
32
+ * Demo: jsfiddle.net/inuitcss/ufUh2
33
+ *
34
+ */
35
+ .flexbox{
36
+ display:table;
37
+ width:100%;
38
+ }
39
+
40
+ /**
41
+ * Nasty hack to circumvent Modernizr conflicts.
42
+ */
43
+ html.flexbox{
44
+ display:block;
45
+ width:auto;
46
+ }
47
+
48
+ .flexbox__item{
49
+ display:table-cell;
50
+ vertical-align:middle;
51
+ }
@@ -0,0 +1,59 @@
1
+ /*------------------------------------*\
2
+ $FLYOUT
3
+ \*------------------------------------*/
4
+ /**
5
+ * Flyouts are pieces of content that fly out of a parent when said parent is
6
+ * hovered. They typically appear bottom-left of the parent.
7
+ *
8
+ <div class=flyout>
9
+ Foo
10
+ <div class=flyout__content>
11
+ <h1>Lorem</h1>
12
+ <p>Ipsum</p>
13
+ </div>
14
+ </div>
15
+ *
16
+ * Extend these objects in your theme stylesheet.
17
+ *
18
+ * Demo: jsfiddle.net/inuitcss/B52HG
19
+ *
20
+ */
21
+ .flyout,
22
+ .flyout--alt{
23
+ position:relative;
24
+ overflow:hidden;
25
+ }
26
+ .flyout__content{
27
+ /**
28
+ * Position the flyouts off-screen. This is typically better than
29
+ * `display:none;`.
30
+ */
31
+ position:absolute;
32
+ top:100%;
33
+ left:-99999px;
34
+ }
35
+
36
+ /**
37
+ * Bring the flyouts into view when you hover their parents.
38
+ * Two different types of flyout; ‘regular’ (`.flyout`) and ‘alternative’
39
+ * (`.flyout--alt`).
40
+ */
41
+ .flyout:hover,
42
+ .flyout--alt:hover{
43
+ overflow:visible;
44
+ }
45
+
46
+ /**
47
+ * Regular flyouts sit all the way from the top, flush left.
48
+ */
49
+ .flyout:hover > .flyout__content{
50
+ left:0;
51
+ }
52
+
53
+ /**
54
+ * Alternative flyouts sit all the way from the left, flush top.
55
+ */
56
+ .flyout--alt:hover > .flyout__content{
57
+ top:0;
58
+ left:100%;
59
+ }
@@ -0,0 +1,54 @@
1
+ /*------------------------------------*\
2
+ $GREYBOX
3
+ \*------------------------------------*/
4
+ /**
5
+ * Quickly throw together greybox wireframes. Use in conjunction with other
6
+ * inuit.css objects to create simple greybox prototypes, e.g.:
7
+ *
8
+ <div class="island greybox greybox--medium">Header</div>
9
+
10
+ <ul class="nav nav--fit nav--block greybox">
11
+ <li><a href=#>Home</a></li>
12
+ <li><a href=#>About</a></li>
13
+ <li><a href=#>Portfolio</a></li>
14
+ <li><a href=#>Contact</a></li>
15
+ </ul>
16
+ *
17
+ * The beauty of combining the greyboxing with inuit.css objects is that any
18
+ * prototyping can quickly be converted into/used as production code.
19
+ *
20
+ * For a more complete prototyping framework, consider Adam Whitcroft’s Proto:
21
+ * adamwhitcroft.com/proto
22
+ *
23
+ * Demo: jsfiddle.net/inuitcss/qCXfh/
24
+ *
25
+ */
26
+ .greybox,
27
+ .graybox{
28
+ @include font-size(12px);
29
+ font-family:sans-serif;
30
+ text-align:center;
31
+ background-color:rgba(0,0,0,0.2);
32
+ color:#fff;
33
+ }
34
+ .greybox a,
35
+ .graybox a{
36
+ color:#fff;
37
+ text-decoration:underline;
38
+ }
39
+
40
+
41
+ /**
42
+ * All greyboxes will occupy 100% of their parent’s width, but to alter their
43
+ * heights we apply incrementally larger line-heights:
44
+ */
45
+ .greybox--small,
46
+ .graybox--small { line-height: 2 * $base-line-height; }
47
+ .greybox--medium,
48
+ .graybox--medium { line-height: 4 * $base-line-height; }
49
+ .greybox--large,
50
+ .graybox--large { line-height: 8 * $base-line-height; }
51
+ .greybox--huge,
52
+ .graybox--huge { line-height:16 * $base-line-height; }
53
+ .greybox--gigantic,
54
+ .graybox--gigantic { line-height:32 * $base-line-height; }
@@ -0,0 +1,99 @@
1
+ /*------------------------------------*\
2
+ $GRIDS
3
+ \*------------------------------------*/
4
+ /**
5
+ * Fluid and nestable grid system, e.g.:
6
+ *
7
+ <div class=gw>
8
+
9
+ <div class="g one-third">
10
+ <p>One third grid</p>
11
+ </div>
12
+
13
+ <div class="g two-thirds">
14
+ <p>Two thirds grid</p>
15
+ </div>
16
+
17
+ <div class="g one-half">
18
+ <p>One half grid</p>
19
+ </div>
20
+
21
+ <div class="g one-quarter">
22
+ <p>One quarter grid</p>
23
+ </div>
24
+
25
+ <div class="g one-quarter">
26
+ <p>One quarter grid</p>
27
+ </div>
28
+
29
+ </div>
30
+ *
31
+ * Demo: jsfiddle.net/inuitcss/CLYUC
32
+ *
33
+ */
34
+
35
+
36
+ /**
37
+ * Grid wrapper
38
+ *
39
+ * Shorthand and verbose
40
+ */
41
+ .gw,
42
+ .grid-wrapper{
43
+ /**
44
+ * Negative margin to negate the padding on the first grid child.
45
+ */
46
+ margin-left:-$base-spacing-unit;
47
+ /**
48
+ * The following declarations allow us to use the `.gw` class on lists.
49
+ */
50
+ list-style:none;
51
+ margin-bottom:0;
52
+ @extend .cf;
53
+ }
54
+
55
+
56
+ /**
57
+ * Reverse grid order
58
+ *
59
+ <div class="gw gw--rev">
60
+
61
+ <div class="g one-third">
62
+ <p>Appears on the right</p>
63
+ </div>
64
+
65
+ <div class="g two-thirds">
66
+ <p>Appears on the left</p>
67
+ </div>
68
+
69
+ </div>
70
+ *
71
+ */
72
+ .gw--rev > .g,
73
+ .grid-wrapper--rev > .grid{
74
+ float:right;
75
+ }
76
+
77
+
78
+ /**
79
+ * Very infrequently occuring grid wrappers as children of grid wrappers.
80
+ */
81
+ .gw > .gw,
82
+ .grid-wrapper > .grid-wrapper{
83
+ margin-left:0;
84
+ }
85
+
86
+
87
+ /**
88
+ * Grid
89
+ *
90
+ * Shorthand and verbose
91
+ */
92
+ .g,
93
+ .grid{
94
+ float:left;
95
+ padding-left:$base-spacing-unit;
96
+ @if $global-border-box == false{
97
+ @include vendor(box-sizing, border-box);
98
+ }
99
+ }