polar-express 0.0.2

Sign up to get free protection for your applications and to get access to all the features.
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
@@ -0,0 +1,80 @@
1
+ /*------------------------------------*\
2
+ $RESET
3
+ \*------------------------------------*/
4
+ /**
5
+ * A more considered reset; more of a restart...
6
+ * As per: csswizardry.com/2011/10/reset-restarted
7
+ */
8
+
9
+ @if $global-border-box == true{
10
+ /**
11
+ * Let’s make the box model all nice, shall we...?
12
+ */
13
+ *{
14
+ &,
15
+ &:before,
16
+ &:after{
17
+ @include vendor(box-sizing, border-box);
18
+ }
19
+ }
20
+ }
21
+
22
+ /**
23
+ * The usual...
24
+ */
25
+ h1,h2,h3,h4,h5,h6,
26
+ p,blockquote,pre,
27
+ dl,dd,ol,ul,
28
+ form,fieldset,legend,
29
+ table,th,td,caption,
30
+ hr{
31
+ margin:0;
32
+ padding:0;
33
+ }
34
+
35
+ /**
36
+ * Give a help cursor to elements that give extra info on `:hover`.
37
+ */
38
+ abbr[title],dfn[title]{
39
+ cursor:help;
40
+ }
41
+
42
+ /**
43
+ * Remove underlines from potentially troublesome elements.
44
+ */
45
+ u,ins{
46
+ text-decoration:none;
47
+ }
48
+
49
+ /**
50
+ * Apply faux underline via `border-bottom`.
51
+ */
52
+ ins{
53
+ border-bottom:1px solid;
54
+ }
55
+
56
+ /**
57
+ * So that `alt` text is visually offset if images don’t load.
58
+ */
59
+ img{
60
+ font-style:italic;
61
+ }
62
+
63
+ /**
64
+ * Give form elements some cursor interactions...
65
+ */
66
+ label,
67
+ input,
68
+ textarea,
69
+ button,
70
+ select,
71
+ option{
72
+ cursor:pointer;
73
+ }
74
+ .text-input:active,
75
+ .text-input:focus,
76
+ textarea:active,
77
+ textarea:focus{
78
+ cursor:text;
79
+ outline:none;
80
+ }
@@ -0,0 +1,61 @@
1
+ /*------------------------------------*\
2
+ $SHARED
3
+ \*------------------------------------*/
4
+ /**
5
+ * Where `margin-bottom` is concerned, this value will be the same as the
6
+ * base line-height. This allows us to keep a consistent vertical rhythm.
7
+ * As per: csswizardry.com/2012/06/single-direction-margin-declarations
8
+ */
9
+ /**
10
+ * Base elements
11
+ */
12
+ h1,h2,h3,h4,h5,h6,hgroup,
13
+ ul,ol,dl,
14
+ blockquote,p,address,
15
+ table,
16
+ fieldset,figure,
17
+ pre,
18
+ /**
19
+ * Objects and abstractions
20
+ */
21
+ %sass-margin-bottom,
22
+ .media,
23
+ .island,
24
+ .islet{
25
+ margin-bottom:$base-spacing-unit;
26
+ margin-bottom:($base-spacing-unit / $base-font-size)*1rem;
27
+
28
+ .islet &{
29
+ margin-bottom:$base-spacing-unit / 2;
30
+ margin-bottom:(($base-spacing-unit / $base-font-size) / 2)*1rem;
31
+ }
32
+ }
33
+
34
+
35
+ /**
36
+ * Doubled up `margin-bottom` helper class.
37
+ */
38
+ .landmark{
39
+ margin-bottom:2 * $base-spacing-unit;
40
+ margin-bottom:(2 * $base-spacing-unit / $base-font-size)*1rem;
41
+ }
42
+
43
+
44
+ /**
45
+ * `hr` elements only take up a few pixels, so we need to give them special
46
+ * treatment regarding vertical rhythm.
47
+ */
48
+ hr{
49
+ margin-bottom:$base-spacing-unit - 2px;
50
+ margin-bottom:(($base-spacing-unit - 2px) / $base-font-size)*1rem;
51
+ }
52
+
53
+
54
+ /**
55
+ * Where `margin-left` is concerned we want to try and indent certain elements
56
+ * by a consistent amount. Define that amount once, here.
57
+ */
58
+ ul,ol,dd{
59
+ margin-left:2 * $base-spacing-unit;
60
+ margin-left:(2 * $base-spacing-unit / $base-font-size)*1rem;
61
+ }
@@ -0,0 +1,158 @@
1
+ /*------------------------------------*\
2
+ $WIDTHS
3
+ \*------------------------------------*/
4
+ /**
5
+ * Sizes in human readable format. These are used in conjunction with other
6
+ * objects and abstractions found in inuit.css, most commonly the grid system
7
+ * and faux flexbox.
8
+ *
9
+ * We have a mixin to generate our widths and their breakpoint-specific
10
+ * variations.
11
+ */
12
+
13
+ @mixin grid-setup($namespace: "") {
14
+ /**
15
+ * Whole
16
+ */
17
+ .#{$namespace}one-whole { width:100%; }
18
+
19
+
20
+ /**
21
+ * Halves
22
+ */
23
+ .#{$namespace}one-half { width:50%; }
24
+
25
+
26
+ /**
27
+ * Thirds
28
+ */
29
+ .#{$namespace}one-third { width:33.333%; }
30
+ .#{$namespace}two-thirds { width:66.666%; }
31
+
32
+
33
+ /**
34
+ * Quarters
35
+ */
36
+ .#{$namespace}one-quarter { width:25%; }
37
+ .#{$namespace}two-quarters { @extend .#{$namespace}one-half; }
38
+ .#{$namespace}three-quarters { width:75%; }
39
+
40
+
41
+ /**
42
+ * Fifths
43
+ */
44
+ .#{$namespace}one-fifth { width:20%; }
45
+ .#{$namespace}two-fifths { width:40%; }
46
+ .#{$namespace}three-fifths { width:60%; }
47
+ .#{$namespace}four-fifths { width:80%; }
48
+
49
+
50
+ /**
51
+ * Sixths
52
+ */
53
+ .#{$namespace}one-sixth { width:16.666%; }
54
+ .#{$namespace}two-sixths { @extend .#{$namespace}one-third; }
55
+ .#{$namespace}three-sixths { @extend .#{$namespace}one-half; }
56
+ .#{$namespace}four-sixths { @extend .#{$namespace}two-thirds; }
57
+ .#{$namespace}five-sixths { width:83.333%; }
58
+
59
+
60
+ /**
61
+ * Eighths
62
+ */
63
+ .#{$namespace}one-eighth { width:12.5%; }
64
+ .#{$namespace}two-eighths { @extend .#{$namespace}one-quarter; }
65
+ .#{$namespace}three-eighths { width:37.5%; }
66
+ .#{$namespace}four-eighths { @extend .#{$namespace}one-half; }
67
+ .#{$namespace}five-eighths { width:62.5%; }
68
+ .#{$namespace}six-eighths { @extend .#{$namespace}three-quarters; }
69
+ .#{$namespace}seven-eighths { width:87.5%; }
70
+
71
+
72
+ /**
73
+ * Tenths
74
+ */
75
+ .#{$namespace}one-tenth { width:10%; }
76
+ .#{$namespace}two-tenths { @extend .#{$namespace}one-fifth; }
77
+ .#{$namespace}three-tenths { width:30%; }
78
+ .#{$namespace}four-tenths { @extend .#{$namespace}two-fifths; }
79
+ .#{$namespace}five-tenths { @extend .#{$namespace}one-half; }
80
+ .#{$namespace}six-tenths { @extend .#{$namespace}three-fifths; }
81
+ .#{$namespace}seven-tenths { width:70%; }
82
+ .#{$namespace}eight-tenths { @extend .#{$namespace}four-fifths; }
83
+ .#{$namespace}nine-tenths { width:90%; }
84
+
85
+
86
+ /**
87
+ * Twelfths
88
+ */
89
+ .#{$namespace}one-twelfth { width:8.333%; }
90
+ .#{$namespace}two-twelfths { @extend .#{$namespace}one-sixth; }
91
+ .#{$namespace}three-twelfths { @extend .#{$namespace}one-quarter; }
92
+ .#{$namespace}four-twelfths { @extend .#{$namespace}one-third; }
93
+ .#{$namespace}five-twelfths { width:41.666% }
94
+ .#{$namespace}six-twelfths { @extend .#{$namespace}one-half; }
95
+ .#{$namespace}seven-twelfths { width:58.333%; }
96
+ .#{$namespace}eight-twelfths { @extend .#{$namespace}two-thirds; }
97
+ .#{$namespace}nine-twelfths { @extend .#{$namespace}three-quarters; }
98
+ .#{$namespace}ten-twelfths { @extend .#{$namespace}five-sixths; }
99
+ .#{$namespace}eleven-twelfths { width:91.666%; }
100
+ }
101
+
102
+ @include grid-setup();
103
+
104
+
105
+
106
+ /**
107
+ * If you have set `$responsive` to ‘true’ in `_vars.scss` then you now have
108
+ * access to these classes. You can define at which breakpoint you’d like an
109
+ * element to be a certain size, e.g.:
110
+ *
111
+ * `<div class="g one-quarter lap-one-half palm-one-whole"> ... </div>`
112
+ *
113
+ * This would create a `div` that, at ‘desktop’ sizes, takes up a quarter of the
114
+ * horizontal space, a half of that space at ‘tablet’ sizes, and goes full width
115
+ * at ‘mobile’ sizes.
116
+ *
117
+ * Demo: jsfiddle.net/inuitcss/WS4Ge
118
+ *
119
+ */
120
+
121
+ @if $responsive == true{
122
+
123
+ @include media-query(palm){
124
+ @include grid-setup("palm-");
125
+ }
126
+
127
+ @include media-query(lap){
128
+ @include grid-setup("lap-");
129
+ }
130
+
131
+ @include media-query(lap-and-up){
132
+ @include grid-setup("lap-and-up-");
133
+ }
134
+
135
+ @include media-query(portable){
136
+ @include grid-setup("portable-");
137
+ }
138
+
139
+ @include media-query(desk){
140
+ @include grid-setup("desk-");
141
+ }
142
+
143
+
144
+ /**
145
+ * If you have set the additional `$responsive-extra` variable to ‘true’ in
146
+ * `_vars.scss` then you now have access to the following class available to
147
+ * accomodate much larger screen resolutions.
148
+ */
149
+
150
+ @if $responsive-extra == true{
151
+
152
+ @include media-query(desk-wide){
153
+ @include grid-setup("desk-wide-");
154
+ }
155
+
156
+ }
157
+
158
+ } /* endif */
@@ -0,0 +1,147 @@
1
+ @if $use-arrows == true{
2
+
3
+ /*------------------------------------*\
4
+ $ARROWS
5
+ \*------------------------------------*/
6
+ /**
7
+ * It is a common design treatment to give an element a triangular points-out
8
+ * arrow, we typically build these with CSS. These following classes allow us to
9
+ * generate these arbitrarily with a mixin, `@arrow()`.
10
+ */
11
+
12
+ $arrow-size: $half-spacing-unit!default;
13
+ $arrow-border: 1!default;
14
+ $border: $arrow-size;
15
+ $arrow: $arrow-size - $arrow-border;
16
+
17
+ /**
18
+ * Forms the basis for any/all CSS arrows.
19
+ */
20
+ %arrow{
21
+ position:relative;
22
+
23
+ &:before,
24
+ &:after{
25
+ content:"";
26
+ position:absolute;
27
+ border-collapse:separate;
28
+ }
29
+ &:before{
30
+ border:$border solid transparent;
31
+ }
32
+ &:after{
33
+ border:$arrow solid transparent;
34
+ }
35
+ }
36
+
37
+
38
+ /**
39
+ * Define individual edges so we can combine what we need, when we need.
40
+ */
41
+ %arrow--top{
42
+ @extend %arrow;
43
+
44
+ &:before,
45
+ &:after{
46
+ bottom:100%;
47
+ }
48
+ }
49
+
50
+ %arrow--upper{
51
+ @extend %arrow;
52
+
53
+ &:before{
54
+ top:$arrow;
55
+ }
56
+ &:after{
57
+ top:$border;
58
+ }
59
+ }
60
+
61
+ %arrow--middle{
62
+ @extend %arrow;
63
+
64
+ &:before,
65
+ &:after{
66
+ top:50%;
67
+ margin-top:-$border;
68
+ }
69
+ &:after{
70
+ margin-top:-$arrow;
71
+ }
72
+ }
73
+
74
+ %arrow--lower{
75
+ @extend %arrow;
76
+
77
+ &:before{
78
+ bottom:$arrow;
79
+ }
80
+ &:after{
81
+ bottom:$border;
82
+ }
83
+ }
84
+
85
+ %arrow--bottom{
86
+ @extend %arrow;
87
+
88
+ &:before,
89
+ &:after{
90
+ top:100%;
91
+ }
92
+ }
93
+
94
+ %arrow--near{
95
+ @extend %arrow;
96
+
97
+ &:before,
98
+ &:after{
99
+ right:100%;
100
+ }
101
+ }
102
+
103
+ %arrow--left{
104
+ @extend %arrow;
105
+
106
+ &:before{
107
+ left:$arrow;
108
+ }
109
+ &:after{
110
+ left:$border;
111
+ }
112
+ }
113
+
114
+ %arrow--center{
115
+ @extend %arrow;
116
+
117
+ &:before,
118
+ &:after{
119
+ left:50%;
120
+ margin-left:-$border;
121
+ }
122
+ &:after{
123
+ margin-left:-$arrow;
124
+ }
125
+ }
126
+
127
+ %arrow--right{
128
+ @extend %arrow;
129
+
130
+ &:before{
131
+ right:$arrow;
132
+ }
133
+ &:after{
134
+ right:$border;
135
+ }
136
+ }
137
+
138
+ %arrow--far{
139
+ @extend %arrow;
140
+
141
+ &:before,
142
+ &:after{
143
+ left:100%;
144
+ }
145
+ }
146
+
147
+ }//endif
@@ -0,0 +1,226 @@
1
+ @if $use-beautons == true{
2
+
3
+ /*------------------------------------*\
4
+ $BEAUTONS.CSS
5
+ \*------------------------------------*/
6
+ /**
7
+ * beautons is a beautifully simple button toolkit.
8
+ *
9
+ * LICENSE
10
+ *
11
+ * Copyright 2013 Harry Roberts
12
+ *
13
+ * Licensed under the Apache License, Version 2.0 (the "License");
14
+ * you may not use this file except in compliance with the License.
15
+ * You may obtain a copy of the License at
16
+ *
17
+ * http://apache.org/licenses/LICENSE-2.0
18
+ *
19
+ * Unless required by applicable law or agreed to in writing, software
20
+ * distributed under the License is distributed on an "AS IS" BASIS,
21
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
22
+ * See the License for the specific language governing permissions and
23
+ * limitations under the License.
24
+ *
25
+ */
26
+
27
+
28
+ /*!*
29
+ *
30
+ * @csswizardry -- csswizardry.com/beautons
31
+ *
32
+ */
33
+
34
+
35
+
36
+
37
+
38
+ /*------------------------------------*\
39
+ $BASE
40
+ \*------------------------------------*/
41
+ /**
42
+ * Base button styles.
43
+ *
44
+ * 1. Allow us to better style box model properties.
45
+ * 2. Line different sized buttons up a little nicer.
46
+ * 3. Stop buttons wrapping and looking broken.
47
+ * 4. Make buttons inherit font styles.
48
+ * 5. Force all elements using beautons to appear clickable.
49
+ * 6. Normalise box model styles.
50
+ * 7. If the button’s text is 1em, and the button is (3 * font-size) tall, then
51
+ * there is 1em of space above and below that text. We therefore apply 1em
52
+ * of space to the left and right, as padding, to keep consistent spacing.
53
+ * 8. Basic cosmetics for default buttons. Change or override at will.
54
+ * 9. Don’t allow buttons to have underlines; it kinda ruins the illusion.
55
+ */
56
+ .btn{
57
+ display:inline-block; /* [1] */
58
+ vertical-align:middle; /* [2] */
59
+ white-space:nowrap; /* [3] */
60
+ font-family:inherit; /* [4] */
61
+ font-size:100%; /* [4] */
62
+ cursor:pointer; /* [5] */
63
+ border:none; /* [6] */
64
+ margin:0; /* [6] */
65
+ padding-top: 0; /* [6] */
66
+ padding-bottom:0; /* [6] */
67
+ line-height:3; /* [7] */
68
+ padding-right:1em; /* [7] */
69
+ padding-left: 1em; /* [7] */
70
+ border-radius:$brand-round; /* [8] */
71
+ }
72
+
73
+ .btn{
74
+
75
+ &,
76
+ &:hover{
77
+ text-decoration:none; /* [9] */
78
+ }
79
+
80
+ &:active,
81
+ &:focus{
82
+ outline:none;
83
+ }
84
+ }
85
+
86
+
87
+
88
+
89
+
90
+ /*------------------------------------*\
91
+ $SIZES
92
+ \*------------------------------------*/
93
+ /**
94
+ * Button size modifiers.
95
+ *
96
+ * These all follow the same sizing rules as above; text is 1em, space around it
97
+ * remains uniform.
98
+ */
99
+ .btn--small{
100
+ padding-right:0.5em;
101
+ padding-left: 0.5em;
102
+ line-height:2;
103
+ }
104
+
105
+ .btn--large{
106
+ padding-right:1.5em;
107
+ padding-left: 1.5em;
108
+ line-height:4;
109
+ }
110
+
111
+ .btn--huge{
112
+ padding-right:2em;
113
+ padding-left: 2em;
114
+ line-height:5;
115
+ }
116
+
117
+ /**
118
+ * These buttons will fill the entirety of their container.
119
+ *
120
+ * 1. Remove padding so that widths and paddings don’t conflict.
121
+ */
122
+ .btn--full{
123
+ width:100%;
124
+ padding-right:0; /* [1] */
125
+ padding-left: 0; /* [1] */
126
+ text-align:center;
127
+ }
128
+
129
+
130
+
131
+
132
+
133
+ /*------------------------------------*\
134
+ $FONT-SIZES
135
+ \*------------------------------------*/
136
+ /**
137
+ * Button font-size modifiers.
138
+ */
139
+ .btn--alpha{
140
+ font-size:3rem;
141
+ }
142
+
143
+ .btn--beta{
144
+ font-size:2rem;
145
+ }
146
+
147
+ .btn--gamma{
148
+ font-size:1rem;
149
+ }
150
+
151
+ /**
152
+ * Make the button inherit sizing from its parent.
153
+ */
154
+ .btn--natural{
155
+ vertical-align:baseline;
156
+ font-size:inherit;
157
+ line-height:inherit;
158
+ padding-right:0.5em;
159
+ padding-left: 0.5em;
160
+ }
161
+
162
+
163
+
164
+
165
+
166
+ /*------------------------------------*\
167
+ $FUNCTIONS
168
+ \*------------------------------------*/
169
+ /**
170
+ * Button function modifiers.
171
+ */
172
+ .btn--primary{}
173
+ .btn--secondary{}
174
+ .btn--tertiary{}
175
+
176
+ /**
177
+ * Positive actions; e.g. sign in, purchase, submit, etc.
178
+ */
179
+ .btn--positive{
180
+ background-color:#4A993E;
181
+ color:#fff;
182
+ }
183
+
184
+ /**
185
+ * Negative actions; e.g. close account, delete photo, remove friend, etc.
186
+ */
187
+ .btn--negative{
188
+ background-color:#b33630;
189
+ color:#fff;
190
+ }
191
+
192
+ /**
193
+ * Inactive, disabled buttons.
194
+ *
195
+ * 1. Make the button look like normal text when hovered.
196
+ */
197
+ .btn--inactive,
198
+ .btn--inactive:hover,
199
+ .btn--inactive:active,
200
+ .btn--inactive:focus{
201
+ background-color:#ddd;
202
+ color:#777;
203
+ cursor:text; /* [1] */
204
+ }
205
+
206
+
207
+
208
+
209
+
210
+ /*------------------------------------*\
211
+ $STYLES
212
+ \*------------------------------------*/
213
+ /**
214
+ * Button style modifiers.
215
+ *
216
+ * 1. Use an overly-large number to ensure completely rounded, pill-like ends.
217
+ */
218
+ .btn--soft{
219
+ border-radius:200px; /* [1] */
220
+ }
221
+
222
+ .btn--hard{
223
+ border-radius:0;
224
+ }
225
+
226
+ }//endif
@@ -0,0 +1,44 @@
1
+ @if $use-block-list == true or $use-matrix == true{
2
+
3
+ /*------------------------------------*\
4
+ $BLOCK-LIST
5
+ \*------------------------------------*/
6
+ /**
7
+ * Create big blocky lists of content, e.g.:
8
+ *
9
+ <ul class=block-list>
10
+ <li>Foo</li>
11
+ <li>Bar</li>
12
+ <li>Baz</li>
13
+ <li><a href=# class=block-list__link>Foo Bar Baz</a></li>
14
+ </ul>
15
+ *
16
+ * Extend this object in your theme stylesheet.
17
+ *
18
+ * Demo: jsfiddle.net/inuitcss/hR57q
19
+ *
20
+ */
21
+ .block-list{
22
+
23
+ &,
24
+ > li{
25
+ border:0 solid $base-ui-color;
26
+ }
27
+ }
28
+ .block-list{
29
+ list-style:none;
30
+ margin-left:0;
31
+ border-top-width:1px;
32
+
33
+ > li{
34
+ border-bottom-width:1px;
35
+ padding:$half-spacing-unit;
36
+ }
37
+ }
38
+ .block-list__link{
39
+ display:block;
40
+ padding:$half-spacing-unit;
41
+ margin:-$half-spacing-unit;
42
+ }
43
+
44
+ }//endif