mice 0.0.8 → 0.0.9

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.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 393ef895d95278ed2a12369c04fa9539e682d3c2
4
- data.tar.gz: a1cf22f2d911f22dd6c970d249710d1fa3b8fd91
3
+ metadata.gz: 7ca63b778e879946a7233a1e40a1d30eefd2f020
4
+ data.tar.gz: ecbe1d827a7b17dba2ea20389ce9489eab42aabb
5
5
  SHA512:
6
- metadata.gz: a0dfebe4c8eb53ebd62a1152bdccfa52210f25da9884c2831d0b607be367dcfefb91b5397a1d54520aa7381c41beae94f77b4622e7702892e4c1c4e7c655c579
7
- data.tar.gz: af279a7940d6c27f8dfc4a157daee876db595b56045a5c18d4b970508a65f4afcd67fd4c6982459d93dd00181fcba1981fc2ccf26f25f575c4b7433b4162fc0d
6
+ metadata.gz: 9fa6ea270e73df6a1e4bc9e5ebefec36ef8ffe551876e2ac943cbfccd2662f49641d85c370a7555a57c1d67ec9a9ce44c72879e859c8e6bd469eaf615a8edc20
7
+ data.tar.gz: 0b01ff1bf97b5f172b84f929cf17dcfb557d874c2ea4b7a23e8f6c15ce9d000e2e854aa61f523a4f42d2323c5f3a21c823d805f5f313534020bb07592216df3b
data/Gemfile.lock CHANGED
@@ -1,7 +1,7 @@
1
1
  PATH
2
2
  remote: .
3
3
  specs:
4
- mice (0.0.8)
4
+ mice (0.0.9)
5
5
 
6
6
  GEM
7
7
  remote: https://rubygems.org/
data/lib/mice/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module Mice
2
- VERSION = "0.0.8"
2
+ VERSION = "0.0.9"
3
3
  end
@@ -36,18 +36,70 @@
36
36
  }
37
37
  }
38
38
 
39
+
40
+ // Form control sizing
41
+ //
42
+ // Relative text size, padding, and border-radii changes for form controls. For
43
+ // horizontal sizing, wrap controls in the predefined grid classes. `<select>`
44
+ // element gets special love because it's special, and that's a fact!
45
+ // [converter] $parent hack
46
+ @mixin input-size($parent, $input-height, $padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
47
+ // #{$parent} {
48
+ // height: $input-height;
49
+ // padding: $padding-vertical $padding-horizontal;
50
+ // font-size: $font-size;
51
+ // line-height: $line-height;
52
+ // border-radius: $border-radius;
53
+ // }
54
+
55
+ // select#{$parent} {
56
+ // height: $input-height;
57
+ // line-height: $input-height;
58
+ // }
59
+
60
+ // textarea#{$parent},
61
+ // select[multiple]#{$parent} {
62
+ // height: auto;
63
+ // }
64
+ }
65
+
66
+
39
67
  // Button sizes
40
- @mixin button-size($padding-vertical, $padding-horizontal, $font-size, $line-height) {
68
+ // -------------------------
69
+ @mixin button-size($padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
41
70
  padding: $padding-vertical $padding-horizontal;
42
71
  font-size: $font-size;
43
72
  line-height: $line-height;
73
+ border-radius: $border-radius;
74
+ }
75
+
76
+ // Single side border-radius
77
+ // -------------------------
78
+ @mixin border-top-radius($radius) {
79
+ border-top-right-radius: $radius;
80
+ border-top-left-radius: $radius;
81
+ }
82
+ @mixin border-right-radius($radius) {
83
+ border-bottom-right-radius: $radius;
84
+ border-top-right-radius: $radius;
85
+ }
86
+ @mixin border-bottom-radius($radius) {
87
+ border-bottom-right-radius: $radius;
88
+ border-bottom-left-radius: $radius;
89
+ }
90
+ @mixin border-left-radius($radius) {
91
+ border-bottom-left-radius: $radius;
92
+ border-top-left-radius: $radius;
44
93
  }
45
94
 
46
95
 
47
96
  // Base styles
48
97
  // -------------------------
49
98
 
50
- button, .button{
99
+ input[type="button"],
100
+ input[type="submit"],
101
+ button,
102
+ .button{
51
103
  display: inline-block;
52
104
  margin-bottom: 0;
53
105
  font-weight: $button-font-weight;
@@ -62,15 +114,16 @@ button, .button{
62
114
 
63
115
  position: relative;
64
116
 
65
- @include box-shadow(0 -2px 0 rgba(0, 0, 0, 0.15) inset);
117
+ @include box-shadow(0 1px 0 rgba(0, 0, 0, 0.05));
66
118
 
67
- @include button-size($padding-base-vertical, $padding-base-horizontal, $font-size-base, $line-height-base);
119
+ @include button-size($padding-base-vertical, $padding-base-horizontal, $font-size-base, $line-height-base, $border-radius);
68
120
  @include user-select(none);
69
121
 
70
122
  &:hover,
71
123
  &:focus {
72
124
  color: $button-default-color;
73
125
  text-decoration: none;
126
+ // @include box-shadow(0 1px 0 rgba(0, 0, 0, 0.1));
74
127
  }
75
128
 
76
129
  // &:active,
@@ -84,13 +137,9 @@ button, .button{
84
137
  pointer-events: none; // Future-proof disabling of clicks
85
138
  @include opacity(.65);
86
139
  }
87
- }
88
140
 
89
-
90
- // Button Styles
91
- // -------------------------
92
-
93
- button, .button{
141
+ border-width: 1px;
142
+ border-style: solid;
94
143
  @include button-variant($button-default-color, $button-default-background, $button-default-border);
95
144
  &.primary{ @include button-variant($button-primary-color, $button-primary-background, $button-primary-border); }
96
145
  &.success{ @include button-variant($button-success-color, $button-success-background, $button-success-border); }
@@ -102,17 +151,21 @@ button, .button{
102
151
 
103
152
  // Button Sizing
104
153
  // -------------------------
105
-
106
- button, .button{
107
- &.mini {@include button-size($padding-mini-vertical, $padding-mini-horizontal, $font-size-mini, $line-height-mini);}
108
- &.small {@include button-size($padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small);}
109
- &.large {@include button-size($padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large);}
154
+ input[type="button"],
155
+ input[type="submit"],
156
+ button,
157
+ .button{
158
+ &.mini {@include button-size($padding-mini-vertical, $padding-mini-horizontal, $font-size-mini, $line-height-mini, $border-radius);}
159
+ &.small {@include button-size($padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius);}
160
+ &.large {@include button-size($padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $border-radius);}
110
161
  }
111
162
 
112
163
  // Block Button
113
164
  // -------------------------
114
-
115
- button, .button{
165
+ input[type="button"],
166
+ input[type="submit"],
167
+ button,
168
+ .button{
116
169
  &.block{
117
170
  display: block;
118
171
  width: 100%;
@@ -129,25 +182,36 @@ button, .button{
129
182
  @include clearfix();
130
183
  display: inline-block;
131
184
  vertical-align: middle;
185
+ position: relative;
132
186
 
133
- button, .button{
187
+ input[type="button"],
188
+ input[type="submit"],
189
+ button,
190
+ .button{
134
191
  float: left;
135
192
 
136
- &:after{
137
- display: block;
138
- content: " ";
139
- position: absolute;
140
- top: 0;
141
- right: -0.5px;
142
- width: 1px;
143
- height: 100%;
144
- z-index: 1;
145
- border-right: 1px solid rgba(0, 0, 0, 0.15);
193
+ &:first-child{
194
+ &:not(:last-child) {
195
+ @include border-right-radius(0);
196
+ }
146
197
  }
147
198
 
148
199
  &:last-child{
149
- &:after{ display: none; }
200
+ &:not(:first-child) {
201
+ margin-left: -1px;
202
+ @include border-left-radius(0);
203
+ }
204
+ }
205
+
206
+ &:not(:first-child):not(:last-child) {
207
+ margin-left: -1px;
208
+ border-radius: 0;
209
+ }
210
+
211
+ &:hover{
212
+ z-index: 2;
150
213
  }
214
+
151
215
  }
152
216
  }
153
217
 
@@ -157,14 +221,37 @@ button, .button{
157
221
  @include clearfix();
158
222
  display: inline-block;
159
223
 
160
- button, .button{
224
+ input[type="button"],
225
+ input[type="submit"],
226
+ button,
227
+ .button{
161
228
  display: block;
162
229
  float: none;
163
230
  width: 100%;
164
231
 
165
- @include box-shadow(0 -1px 0 rgba(0, 0, 0, 0.15) inset);
166
232
 
167
- &:after{ display: none; }
233
+ &:first-child{
234
+ &:not(:last-child) {
235
+ @include border-top-radius($border-radius);
236
+ @include border-bottom-radius(0);
237
+ }
238
+ }
239
+
240
+ &:last-child{
241
+ &:not(:first-child) {
242
+ @include border-top-radius(0);
243
+ @include border-bottom-radius($border-radius);
244
+ @include box-shadow(0 -1px 0 rgba(0, 0, 0, 0.15) inset);
245
+ margin-left: 0;
246
+ margin-top: -1px;
247
+ }
248
+ }
249
+
250
+ &:not(:first-child):not(:last-child) {
251
+ margin-left: 0;
252
+ margin-top: -1px;
253
+ }
254
+
168
255
  }
169
256
  }
170
257
 
@@ -179,18 +266,143 @@ button, .button{
179
266
 
180
267
  &:before, &:after{ display: none; }
181
268
 
182
- > .buttons, .button{
269
+ > .buttons,
270
+ .button{
183
271
  float: none;
184
272
  display: table-cell;
185
273
  width: 1%;
186
274
  position: relative;
187
275
  }
188
- > .buttons button{
189
- width: 100%;
190
- border-right: 1px solid rgba(0, 0, 0, 0.15);
276
+
277
+ .button:first-child{
278
+ &:not(:last-child) {
279
+ border-right-width: 0;
280
+ &:after{
281
+ display: block;
282
+ content: ' ';
283
+ position: absolute;
284
+ top: 0;
285
+ right: -1px;
286
+ width: 1px;
287
+ height: 100%;
288
+ z-index: 1;
289
+ border-right: 1px solid rgba(0, 0, 0, 0.15);
290
+ }
291
+ &:hover{
292
+ border-right-width: 1px;
293
+ &:after{ display: none;}
294
+ }
295
+ }
191
296
  }
192
- > .buttons:last-child button{
193
- border-right: none;
297
+
298
+ .button:not(:first-child):not(:last-child) {
299
+ border-left-width: 0;
300
+ border-right-width: 0;
301
+ &:after{
302
+ display: block;
303
+ content: ' ';
304
+ position: absolute;
305
+ top: 0;
306
+ right: -1px;
307
+ width: 1px;
308
+ height: 100%;
309
+ z-index: 1;
310
+ border-right: 1px solid rgba(0, 0, 0, 0.15);
311
+ }
312
+ &:hover{
313
+ border-left-width: 1px;
314
+ border-right-width: 1px;
315
+ &:after{ display: none;}
316
+ }
317
+ }
318
+
319
+ .button:last-child{
320
+ &:not(:first-child) {
321
+ border-left-width: 0;
322
+ &:hover{
323
+ border-left-width: 1px;
324
+ }
325
+ }
326
+ }
327
+
328
+
329
+ > .buttons {
330
+ input[type="button"],
331
+ input[type="submit"],
332
+ button{
333
+ width: 100%;
334
+ // border-right: 1px solid rgba(0, 0, 0, 0.15);
335
+ border-left-width: 0;
336
+ border-right-width: 0;
337
+ }
338
+
339
+ &:first-child:not(:last-child){
340
+ input[type="button"],
341
+ input[type="submit"],
342
+ button{
343
+ @include border-right-radius(0);
344
+ border-left-width: 1px;
345
+
346
+ &:after{
347
+ display: block;
348
+ content: ' ';
349
+ position: absolute;
350
+ top: 0;
351
+ right: -1px;
352
+ width: 1px;
353
+ height: 100%;
354
+ z-index: 1;
355
+ border-right: 1px solid rgba(0, 0, 0, 0.15);
356
+ }
357
+
358
+ &:hover{
359
+ border-right-width: 1px;
360
+ &:after{ display: none;}
361
+ }
362
+
363
+ }
364
+ }
365
+
366
+ &:not(:first-child):not(:last-child){
367
+ > input[type="button"],
368
+ > input[type="submit"],
369
+ > button{
370
+ @include border-left-radius(0);
371
+ @include border-right-radius(0);
372
+
373
+ &:after{
374
+ display: block;
375
+ content: ' ';
376
+ position: absolute;
377
+ top: 0;
378
+ right: -1px;
379
+ width: 1px;
380
+ height: 100%;
381
+ z-index: 1;
382
+ border-right: 1px solid rgba(0, 0, 0, 0.15);
383
+ }
384
+
385
+ &:hover{
386
+ border-left-width: 1px;
387
+ border-right-width: 1px;
388
+ &:after{ display: none;}
389
+ }
390
+
391
+ }
392
+ }
393
+
394
+ &:last-child:not(:first-child){
395
+ input[type="button"],
396
+ input[type="submit"],
397
+ button{
398
+ @include border-left-radius(0);
399
+ border-right-width: 1px;
400
+
401
+ &:hover{
402
+ border-left-width: 1px;
403
+ }
404
+ }
405
+ }
194
406
  }
195
407
 
196
408
  }
@@ -0,0 +1,144 @@
1
+ // Forms
2
+ // --------------------------------------------------
3
+
4
+ // Button variants
5
+ // -------------------------
6
+ @mixin input-variant($color, $background, $border) {
7
+ color: $color;
8
+ background-color: $background;
9
+ border-color: $border;
10
+
11
+ &:hover{ border-color: darken($border, 10%); }
12
+
13
+ &:active,
14
+ &.active{ border-color: darken($border, 15%); }
15
+
16
+ &.disabled,
17
+ &[disabled] {
18
+ &,
19
+ &:hover,
20
+ &:active,
21
+ &.active {
22
+ border-color: $border;
23
+ cursor: not-allowed;
24
+ @include opacity(.55);
25
+ }
26
+ }
27
+ }
28
+
29
+
30
+ // Input sizing
31
+ // -------------------------
32
+ @mixin input-size($input-height, $padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
33
+ height: $input-height;
34
+ padding: $padding-vertical $padding-horizontal;
35
+ font-size: $font-size;
36
+ line-height: $line-height;
37
+ border-radius: $border-radius;
38
+ }
39
+
40
+
41
+ // Base styles
42
+ // -------------------------
43
+
44
+ input[type="text"],
45
+ input[type="password"],
46
+ input[type="email"],
47
+ textarea,
48
+ select{
49
+ padding: 5px;
50
+ position: relative;
51
+ box-shadow: inset 0 1px #F5F5F5;
52
+
53
+ display: inline-block;
54
+ height: 30px;
55
+ margin-bottom: 0;
56
+ font-weight: $button-font-weight;
57
+ text-align: left;
58
+
59
+ border: 1px solid #CCC;
60
+ border-radius: $border-radius;
61
+ white-space: nowrap;
62
+ outline: none;
63
+
64
+ background-color: transparent;
65
+
66
+ padding: 6px;
67
+ font-size: 14px;
68
+ line-height: $line-height-base;
69
+
70
+ &.disabled,
71
+ &[disabled] {
72
+ cursor: not-allowed;
73
+ pointer-events: none;
74
+ @include opacity(.65);
75
+ @include user-select(none);
76
+ }
77
+ }
78
+
79
+
80
+ // Input Styles
81
+ // -------------------------
82
+
83
+ input[type="text"],
84
+ input[type="password"],
85
+ input[type="email"],
86
+ textarea{
87
+ @include input-variant($input-default-color, $input-default-background, $input-default-border);
88
+ &.primary{@include input-variant($input-primary-color, $input-primary-background, $input-primary-border);}
89
+ &.success{@include input-variant($input-success-color, $input-success-background, $input-success-border);}
90
+ &.info {@include input-variant($input-info-color, $input-info-background, $input-info-border );}
91
+ &.warning{@include input-variant($input-warning-color, $input-warning-background, $input-warning-border);}
92
+ &.danger {@include input-variant($input-danger-color, $input-danger-background, $input-danger-border );}
93
+
94
+ &.fluid{
95
+ width: 100%;
96
+ }
97
+ }
98
+
99
+
100
+ // Input Sizing
101
+ // -------------------------
102
+ input[type="text"],
103
+ input[type="password"],
104
+ input[type="email"]{
105
+ &.small {@include input-size($input-height-small, $padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius-small);}
106
+ &.large {@include input-size($input-height-large, $padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $border-radius-large);}
107
+ }
108
+
109
+
110
+ textarea{
111
+ line-height: 20px;
112
+ height: 120px;
113
+ resize: vertical;
114
+
115
+ display: block;
116
+ height: auto;
117
+ margin-bottom: 10px;
118
+ padding: 6px 6px;
119
+ font-size: 14px;
120
+ line-height: 1.42857143;
121
+ color: #555;
122
+ background-color: #FFF;
123
+ background-image: none;
124
+ border: 1px solid #CCC;
125
+
126
+ transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
127
+
128
+ outline: none;
129
+ }
130
+
131
+ label{
132
+ display: inline-block;
133
+ margin-bottom: 2px;
134
+ }
135
+
136
+ .field{
137
+ margin-bottom: 10px;
138
+ label{
139
+ display: inline-block;
140
+ }
141
+ input{
142
+ width: 100%;
143
+ }
144
+ }
@@ -0,0 +1,38 @@
1
+ // Media objects
2
+ // Source: http://stubbornella.org/content/?p=497
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Common styles
7
+ // -------------------------
8
+ .media{
9
+ margin-top: 15px;
10
+
11
+ @include clearfix();
12
+
13
+ &:first-child{
14
+ margin-top: 0;
15
+ }
16
+
17
+ > .cover {
18
+ display: block;
19
+ float: left;
20
+ margin-right: 10px;
21
+
22
+ &.ext {
23
+ float: right;
24
+ margin-left: 10px;
25
+ margin-right: 0;
26
+ }
27
+ }
28
+
29
+ .desc {
30
+ overflow: hidden;
31
+ zoom: 1;
32
+ }
33
+
34
+ .heading {
35
+ margin: 0 0 5px;
36
+ }
37
+
38
+ }
@@ -57,4 +57,95 @@
57
57
  @mixin box-shadow($shadow...) {
58
58
  -webkit-box-shadow: $shadow; // iOS <4.3 & Android <4.1
59
59
  box-shadow: $shadow;
60
- }
60
+ }
61
+
62
+
63
+ // Gradients
64
+ @mixin linear-gradient($color-from, $color-to) {
65
+ background-color: $color-from; // Old browsers
66
+ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,$color-from), color-stop(100%,$color-to)); // Chrome, Safari4+
67
+ background-image: -webkit-linear-gradient(top, $color-from 0%, $color-to 100%); // Chrome10+, Safari5.1+
68
+ background-image: -moz-linear-gradient(top, $color-from 0%, $color-to 100%); // FF3.6+
69
+ background-image: -ms-linear-gradient(top, $color-from 0%, $color-to 100%); // IE10+
70
+ background-image: -o-linear-gradient(top, $color-from 0%, $color-to 100%); // Opera 11.10+
71
+ background-image: linear-gradient(to bottom, $color-from 0%, $color-to 100%); // W3C
72
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#{$color-from}', endColorstr='#{$color-to}', GradientType=0 ); // IE6-9
73
+ }
74
+ @mixin directional-gradient($color-from, $color-to, $deg: 45deg) {
75
+ background-color: $color-from; // Old browsers
76
+ background-image: -webkit-gradient(linear, left bottom, right top, color-stop(0%,$color-from), color-stop(100%,$color-to)); // Chrome, Safari4+
77
+ background-image: -webkit-linear-gradient(45deg, $color-from 0%, $color-to 100%); // Chrome10+, Safari5.1+
78
+ background-image: -moz-linear-gradient(45deg, $color-from 0%, $color-to 100%); // FF3.6+
79
+ background-image: -ms-linear-gradient(45deg, $color-from 0%, $color-to 100%); // IE10+
80
+ background-image: -o-linear-gradient(45deg, $color-from 0%, $color-to 100%); // Opera 11.10+
81
+ background-image: linear-gradient(45deg, $color-from 0%, $color-to 100%); // W3C
82
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#{$color-from}', endColorstr='#{$color-to}', GradientType=1 ); // IE6-9
83
+ }
84
+
85
+
86
+ // Transforms
87
+ // --------------------------------------------------
88
+ @mixin transform($transform...) {
89
+ -webkit-transform: $transform;
90
+ -ms-transform: $transform;
91
+ transform: $transform;
92
+ }
93
+
94
+
95
+ // Transitions
96
+ // --------------------------------------------------
97
+ @mixin transition($transition...) {
98
+ -webkit-transition: $transition;
99
+ -moz-transition: $transition;
100
+ transition: $transition;
101
+ }
102
+ @mixin transition-property($property...) {
103
+ -webkit-transition-property: $property;
104
+ -moz-transition-property: $property;
105
+ transition-property: $property;
106
+ }
107
+ @mixin transition-duration($duration...) {
108
+ -webkit-transition-duration: $duration;
109
+ -moz-transition-duration: $duration;
110
+ transition-duration: $duration;
111
+ }
112
+ @mixin transition-timing-function($function...) {
113
+ -webkit-transition-timing-function: $function;
114
+ -moz-transition-timing-function: $function;
115
+ transition-timing-function: $function;
116
+ }
117
+
118
+
119
+ // Animations
120
+ // --------------------------------------------------
121
+ @mixin animation-name($name) {
122
+ -webkit-animation-name: $name;
123
+ -moz-animation-name: $name;
124
+ animation-name: $name;
125
+ }
126
+ @mixin animation-duration($duration) {
127
+ -webkit-animation-duration: $duration;
128
+ -moz-animation-duration: $duration;
129
+ animation-duration: $duration;
130
+ }
131
+ @mixin animation-direction($direction) {
132
+ -webkit-animation-direction: $direction;
133
+ -moz-animation-direction: $direction;
134
+ animation-direction: $direction;
135
+ }
136
+
137
+
138
+ // Misc
139
+ // --------------------------------------------------
140
+ @mixin hairline($type, $color, $offset) {
141
+ @if $type == single {
142
+ background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#{$color}' x='0' y='0' width='100%' height='0.5'/></svg>");
143
+ background-position: $offset 100%;
144
+
145
+ } @else if $type == double {
146
+ background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#{$color}' x='0' y='0' width='100%' height='0.5'/></svg>"),
147
+ url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#{$color}' x='0' y='0' width='100%' height='0.5'/></svg>");
148
+ background-position: $offset 100%, $offset 0;
149
+ }
150
+ background-repeat: no-repeat;
151
+ }
@@ -92,4 +92,12 @@ img {
92
92
  -webkit-animation-delay: 0s;
93
93
  animation-delay: 0s;
94
94
  }
95
+ }
96
+
97
+ hr {
98
+ margin: 20px 0;
99
+ border: 0;
100
+ border-top: 1px solid #EEE;
101
+ -moz-box-sizing: content-box;
102
+ box-sizing: content-box;
95
103
  }
@@ -12,13 +12,13 @@ h1, h2, h3, h4, h5, h6{
12
12
  line-height: $heading-line-height;
13
13
  color: $heading-color;
14
14
 
15
- // margin-top: ($line-height-computed / 2);
16
- // margin-bottom: ($line-height-computed / 2);
15
+ margin-top: ($line-height-computed / 2);
16
+ margin-bottom: ($line-height-computed / 2);
17
17
 
18
18
  small{
19
19
  font-weight: normal;
20
20
  line-height: 1;
21
- // color: $heading-small-color;
21
+ color: $heading-small-color;
22
22
  }
23
23
 
24
24
  &.title{
@@ -11,11 +11,11 @@ $gray: #666 !default;
11
11
  $gray-light: #999 !default;
12
12
  $gray-lighter: #eee !default;
13
13
 
14
- $brand-primary: #428bca !default; //#0083FF
15
- $brand-success: #81C735 !default; //#00A94B #00A85D #5cb85c
14
+ $brand-primary: #428bca !default;
15
+ $brand-success: #81C735 !default;
16
16
  $brand-info: #5bc0de !default;
17
- $brand-warning: #f0ad4e !default; //#FFAB00
18
- $brand-danger: #d9534f !default; //#FF0006
17
+ $brand-warning: #f0ad4e !default;
18
+ $brand-danger: #d9534f !default;
19
19
 
20
20
  $background-color: #fff !default;
21
21
 
@@ -25,16 +25,16 @@ $link-color: $brand-primary !default;
25
25
 
26
26
  $link-hover-color: darken($link-color, 15%) !default;
27
27
 
28
+ $border-radius: 2px !default;
29
+ $border-radius-small: $border-radius !default;
30
+ $border-radius-large: $border-radius !default;
28
31
 
29
32
  // Font family, size
30
33
  // -------------------------
31
34
 
32
35
  $font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif !default;
33
-
34
36
  $font-family-serif: Georgia, "Times New Roman", Times, serif !default;
35
-
36
37
  $font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace !default;
37
-
38
38
  $font-family-base: $font-family-sans-serif !default;
39
39
 
40
40
  $font-size-base: 14px !default;
@@ -62,15 +62,15 @@ $line-height-computed: floor(($font-size-base * $line-height-base)) !default;
62
62
  $padding-base-vertical: 6px !default;
63
63
  $padding-base-horizontal: 12px !default;
64
64
 
65
- $padding-large-vertical: 10px !default;
66
- $padding-large-horizontal: 16px !default;
67
-
68
65
  $padding-small-vertical: 5px !default;
69
- $padding-small-horizontal: 10px !default;
70
- $padding-mini-horizontal: $padding-small-horizontal;
66
+ $padding-small-horizontal: 5px !default;
67
+
68
+ $padding-large-vertical: 8px !default;
69
+ $padding-large-horizontal: 8px !default;
71
70
 
72
71
  $padding-mini-vertical: 1px !default;
73
72
  $padding-mini-horizontal: 5px !default;
73
+ // $padding-mini-horizontal: $padding-small-horizontal;
74
74
 
75
75
  $line-height-large: 1.33 !default;
76
76
  $line-height-small: 1.5 !default;
@@ -86,25 +86,49 @@ $caret-width-base: 4px !default;
86
86
  //** Carets increase slightly in size for larger components.
87
87
  $caret-width-large: 5px !default;
88
88
 
89
+ // Border color
90
+ // -------------------------
91
+
92
+ $border-default-border-color: #CCC !default;
93
+ $border-primary-border-color: $brand-primary !default;
94
+ $border-success-border-color: $brand-success !default;
95
+ $border-info-border-color: $brand-info !default;
96
+ $border-warning-border-color: $brand-warning !default;
97
+ $border-danger-border-color: $brand-danger !default;
89
98
 
90
99
  // Heading
91
100
  // -------------------------
92
101
 
93
- $heading-font-family: inherit !default;
94
- $heading-font-weight: 500 !default;
95
- $heading-line-height: 1.1 !default;
96
- $heading-color: inherit !default;
102
+ $heading-font-family: inherit !default;
103
+ $heading-font-weight: 500 !default;
104
+ $heading-line-height: 1.1 !default;
105
+ $heading-color: inherit !default;
106
+
107
+
108
+ //== Type
109
+ // -------------------------
110
+ $text-muted: $gray-light !default;
111
+ $abbr-border-color: $gray-light !default;
112
+ $heading-small-color: $gray-light !default;
113
+ $blockquote-small-color: $gray-light !default;
114
+ $blockquote-font-size: ($font-size-base * 1.25) !default;
115
+ $blockquote-border-color: $gray-lighter !default;
116
+ $page-header-border-color: $gray-lighter !default;
117
+
118
+
119
+
120
+ //== Forms
121
+ // -------------------------
97
122
 
98
123
 
99
124
  //== Buttons
100
- //
101
- //## For each of Bootstrap's buttons, define text, background and border color.
125
+ // -------------------------
102
126
 
103
127
  $button-font-weight: normal !default;
104
128
 
105
129
  $button-default-color: #666 !default;
106
- $button-default-background: #EBEBEB !default;
107
- $button-default-border: darken($button-default-background, 5%) !default;
130
+ $button-default-background: #FFF !default;
131
+ $button-default-border: #D9D9D9 !default; //darken($button-default-background, 5%)
108
132
 
109
133
  $button-primary-color: #fff !default;
110
134
  $button-primary-background: $brand-primary !default;
@@ -127,6 +151,39 @@ $button-danger-background: $brand-danger !default;
127
151
  $button-danger-border: darken($button-danger-background, 5%) !default;
128
152
 
129
153
 
154
+ //== Input
155
+ // -------------------------
156
+ $input-default-color: $gray !default;
157
+ $input-default-background: #FFF !default;
158
+ $input-default-border: $border-default-border-color !default;
159
+
160
+ $input-primary-color: $input-default-color !default;
161
+ $input-primary-background: $input-default-background !default;
162
+ $input-primary-border: $border-primary-border-color !default;
163
+
164
+ $input-success-color: $input-default-color !default;
165
+ $input-success-background: $input-default-background !default;
166
+ $input-success-border: $border-success-border-color !default;
167
+
168
+ $input-info-color: $input-default-color !default;
169
+ $input-info-background: $input-default-background !default;
170
+ $input-info-border: $border-info-border-color !default;
171
+
172
+ $input-warning-color: $input-default-color !default;
173
+ $input-warning-background: $input-default-background !default;
174
+ $input-warning-border: $border-warning-border-color !default;
175
+
176
+ $input-danger-color: $input-default-color !default;
177
+ $input-danger-background: $input-default-background !default;
178
+ $input-danger-border: $border-danger-border-color !default;
179
+
180
+ $input-height-base: ($line-height-computed + ($padding-base-vertical * 2) + 2) !default;
181
+ $input-height-small: (floor($font-size-small * $line-height-small) + ($padding-small-vertical * 2) + 2) !default;
182
+ $input-height-large: (ceil($font-size-large * $line-height-large) + ($padding-large-vertical * 2) + 2) !default;
183
+
184
+ $line-height-small: 1.33 !default;
185
+ $line-height-large: 1.5 !default;
186
+
130
187
  //== Tables
131
188
  //
132
189
  //## Customizes the `table` component with basic values, each used across all table variations.
@@ -19,4 +19,8 @@
19
19
  @import "mice/tables";
20
20
 
21
21
  // Components
22
- @import "mice/components";
22
+ @import "mice/components";
23
+ @import "mice/media";
24
+
25
+ // Form
26
+ @import "mice/forms";
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: mice
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.8
4
+ version: 0.0.9
5
5
  platform: ruby
6
6
  authors:
7
7
  - miclle
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2014-04-20 00:00:00.000000000 Z
11
+ date: 2014-04-29 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: bundler
@@ -55,8 +55,10 @@ files:
55
55
  - vendor/assets/stylesheets/mice.scss
56
56
  - vendor/assets/stylesheets/mice/_buttons.scss
57
57
  - vendor/assets/stylesheets/mice/_components.scss
58
+ - vendor/assets/stylesheets/mice/_forms.scss
58
59
  - vendor/assets/stylesheets/mice/_grid.scss
59
60
  - vendor/assets/stylesheets/mice/_icons.scss
61
+ - vendor/assets/stylesheets/mice/_media.scss
60
62
  - vendor/assets/stylesheets/mice/_menu.scss
61
63
  - vendor/assets/stylesheets/mice/_mixins.scss
62
64
  - vendor/assets/stylesheets/mice/_normalize.scss