mindy 0.1.2.1 → 0.1.3

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,453 +0,0 @@
1
- @import "compass/css3";
2
-
3
- $buttonGroupMarginLeft: 15px;
4
-
5
- $base-color: #f6f6f6;
6
- $background-color: #fff;
7
- $shadow-color: #f6f6f6;
8
-
9
- $buttonBorderRadius: 2px;
10
-
11
- // button
12
- @mixin button($button: true) {
13
- @include border-radius($buttonBorderRadius);
14
- border: 1px solid #000;
15
- display: inline-block;
16
- padding: 6px 14px 4px 14px;
17
-
18
- @if $button == true {
19
- line-height: 18px;
20
- } @else {
21
- line-height: 17px;
22
- }
23
-
24
- @include generateMainButton($base-color, $background-color);
25
-
26
- text-align: center;
27
- text-decoration: none;
28
- outline: 0;
29
- overflow: visible;
30
- margin: 0;
31
- vertical-align: top;
32
- *padding-top: 2px;
33
- *padding-bottom: 0;
34
-
35
- font-family: inherit;
36
- font-size: inherit;
37
-
38
- &::-moz-focus-inner {
39
- padding: 0;
40
- border: 0;
41
- }
42
-
43
- &:hover {
44
- text-decoration: none;
45
- }
46
-
47
- //&.checked {
48
- // color: #333;
49
- // text-shadow: none;
50
- // border: 1px solid #ccc;
51
- //}
52
-
53
- &.pill {
54
- @include border-radius(20px);
55
- }
56
-
57
- &.sm {
58
- font-size: 11px;
59
- }
60
-
61
- &[disabled], &.disabled {
62
- color: #B8B8B8;
63
- border: 1px solid rgba(0, 0, 0, 0.05);
64
- background-color: #fff;
65
- cursor: default;
66
-
67
- &:hover, &:active {
68
- color: #b8b8b8;
69
- text-shadow: none;
70
- background-color: #fff;
71
- border: 1px solid rgba(0, 0, 0, 0.05);
72
- @include single-box-shadow(none);
73
- }
74
- }
75
-
76
- &.disabled2 {
77
- color: #b8b8b8;
78
- cursor: default;
79
- border: 1px solid #dcdcdc;
80
-
81
- &:hover {
82
- border: 1px solid #dcdcdc;
83
- @include single-box-shadow(none);
84
- }
85
- }
86
-
87
- & [class^="icon-"], & [class*=" icon-"] {
88
- height: 18px;
89
- }
90
-
91
- &.mini {
92
- height: 14px;
93
- font-size: 11px;
94
- font-weight: bold;
95
- line-height: 13px;
96
- padding: 4px 10px;
97
-
98
- & [class^="icon-"], & [class*=" icon-"] {
99
- height: 14px;
100
- }
101
- }
102
-
103
- &.dropdown-toggle {
104
- min-width: 5px;
105
- //height: 12px;
106
- //padding: 8px;
107
- }
108
-
109
- .caret {
110
- margin-left: 0;
111
- margin-top: 6px;
112
- }
113
-
114
- &:hover .caret {
115
- opacity: 1;
116
- }
117
-
118
- .no-text {
119
- min-width: 14px;
120
- }
121
-
122
- .xs-no-text {
123
- height: 9px;
124
- width: 18px;
125
- font-size: 10px;
126
- font-weight: bold;
127
- line-height: 10px;
128
- padding: 4px 2px;
129
- min-width: 5px;
130
- @include border-radius($buttonBorderRadius);
131
- }
132
- }
133
-
134
- @mixin generateMainButton($base-color, $background-color)
135
- {
136
- $button-dark-color: shade($base-color, 15%);
137
-
138
- $button-border-color: shade($base-color, 10%);
139
- $button-dark-border-color: shade($base-color, 16%);
140
- $button-light-border-color: lighten($base-color, 8%);
141
-
142
- $button-light-color: desaturate(tint($shadow-color, 60%), 5%);
143
-
144
- $text-color: saturate(shade($base-color, 60%), 5%);
145
- $light-text-shadow: desaturate(tint($base-color, 25%), 5%);
146
- $dark-text-shadow: saturate(shade($base-color, 20%), 5%);
147
-
148
- background-color: $base-color;
149
- border-color: $button-border-color;
150
- border-bottom-color: $button-dark-border-color;
151
- color: $text-color;
152
-
153
- //@include text-shadow(#fff 0 1px 0);
154
- @include background-image(linear-gradient(color-stops($button-light-color, $base-color)));
155
- //@include box-shadow($button-shadow-color 0 -1px 1px 0 inset, $button-highlight-color 0 1px 3px 0 inset);
156
- //@include text-shadow($light-text-shadow 0 1px 0);
157
- @include text-shadow(#fff 0 1px 0);
158
-
159
- $button-highlight-color: transparentize(desaturate(tint(desaturate(tint($shadow-color, 60%), 5%), 15%), 5%), 0%);
160
- $button-shadow-color: saturate(shade($shadow-color, 2%), 5%);
161
- $dark-background-color: shade(#fff, 15%);
162
- @include box-shadow(#fff 0 2px 1px 0 inset);
163
-
164
- &:hover {
165
- @include transition();
166
- @include transition-duration(0.2s);
167
- background-color: tint($base-color, 5%);
168
- @include background-image(linear-gradient(color-stops(lighten(tint($button-light-color, 3%), 1%), tint($base-color, 3%))));
169
- @include box-shadow(
170
- $dark-background-color 0 1px 1px 0,
171
- tint($button-shadow-color, 1%) 0 -2px 2px 0 inset,
172
- tint($button-highlight-color, 3%) 0 2px 3px 0 inset
173
- );
174
- }
175
-
176
- &:active, &.active, &.checked {
177
- @include transition();
178
- @include transition-duration(0.5s);
179
- background-color: $base-color;
180
- border-top-color: $button-dark-border-color;
181
- border-bottom-color: $button-border-color;
182
-
183
- @include background-image(linear-gradient(color-stops($button-light-color, $base-color)));
184
- @include box-shadow(shade($shadow-color, 10%) 0 1px 8px 0 inset);
185
- }
186
- }
187
-
188
- @mixin generateButton($base-color,$textColor)
189
- {
190
- $background-color: darken($base-color, 20%);
191
-
192
- $button-dark-color: shade($base-color, 15%);
193
- $button-light-color: desaturate(tint($base-color, 12%), 5%);
194
-
195
- $button-border-color: shade($base-color, 10%);
196
- $button-dark-border-color: shade($base-color, 16%);
197
- $button-light-border-color: lighten($base-color, 8%);
198
-
199
- $button-highlight-color: transparentize(desaturate(tint($button-light-color, 15%), 5%), 0%);
200
- $button-shadow-color: saturate(shade($base-color, 2%), 5%);
201
-
202
- $text-color: saturate(shade($base-color, 20%), 5%);
203
- $light-text-shadow: desaturate(tint($base-color, 25%), 5%);
204
- $dark-text-shadow: saturate(shade($base-color, 20%), 5%);
205
-
206
- $dark-background-color: shade($background-color, 35%);
207
-
208
- background-color: $base-color;
209
- border-color: $button-border-color;
210
- border-bottom-color: $button-dark-border-color;
211
- color: $textColor;
212
-
213
- @include box-shadow($button-shadow-color 0 -1px 1px 0 inset, $button-highlight-color 0 1px 3px 0 inset);
214
- @include background-image(linear-gradient(color-stops($button-light-color, $base-color)));
215
- @include text-shadow($dark-text-shadow 0 1px 0);
216
-
217
- &:hover {
218
- @include transition();
219
- @include transition-duration(0.2s);
220
- background: tint($base-color, 5%);
221
- //color: #f6f6f6;
222
-
223
- @include background-image(linear-gradient(color-stops(lighten(tint($button-light-color, 3%), 1%), tint($base-color, 3%))));
224
- @include box-shadow(
225
- lighten($dark-background-color,15%) 0 1px 1px 0,
226
- tint($button-shadow-color, 1%) 0 -2px 2px 0 inset,
227
- tint($button-highlight-color, 3%) 0 2px 3px 0 inset
228
- );
229
- //@include text-shadow($dark-text-shadow 0 -1px 0);
230
- }
231
-
232
- &:active, &.active, &.checked {
233
- @include transition();
234
- @include transition-duration(0.5s);
235
- background: ($base-color);
236
- border-top-color: $button-dark-border-color;
237
- border-bottom-color: $button-border-color;
238
-
239
- @include background-image(linear-gradient(color-stops($button-light-color, $base-color)));
240
- @include box-shadow(shade($base-color, 10%) 0 1px 8px 0 inset);
241
- }
242
- }
243
-
244
- /* -------------------------------------------------------- BUTTON CONTAINER */
245
- /* For mixing buttons and button groups, e.g., in a navigation bar */
246
- .button-container {
247
- &.open {
248
- *z-index: 1000;
249
-
250
- .dropdown-menu {
251
- display: block;
252
- margin-top: 1px;
253
- }
254
-
255
- .dropdown-toggle {
256
- background-image: none;
257
- @include single-box-shadow(0, 1px, 6px, rgba(0, 0, 0, 0.15), inset);
258
- }
259
- }
260
-
261
- .button, .button-group {
262
- vertical-align: top;
263
- }
264
- }
265
-
266
- .button + .button,
267
- .button + .button-group,
268
- .button-group + .button,
269
- .button-group + .button-group {
270
- margin-left: $buttonGroupMarginLeft;
271
- }
272
-
273
- .button-group {
274
- position: relative;
275
- display: inline-block;
276
- list-style: none;
277
- padding: 0;
278
- margin: 0;
279
-
280
- /* IE hacks */
281
- zoom: 1;
282
- *display: inline;
283
-
284
- .button {
285
- position: relative;
286
- float: left;
287
- margin-left: -1px;
288
- }
289
-
290
- .button, .button + .button {
291
- @include border-radius(0);
292
-
293
- &:first-child, &.dropdown-toggle {
294
- margin-left: 0;
295
- @include border-radius($buttonBorderRadius 0 0 $buttonBorderRadius);
296
- }
297
-
298
- &:last-child, &.dropdown-toggle {
299
- @include border-radius(0 $buttonBorderRadius $buttonBorderRadius 0);
300
- }
301
- }
302
- }
303
-
304
- .dropdown {
305
- position: relative;
306
- }
307
- .dropdown-toggle {
308
- *margin-bottom: -3px;
309
- }
310
- .dropdown-toggle:active, .open .dropdown-toggle {
311
- outline: 0;
312
- }
313
- .caret {
314
- display: inline-block;
315
- width: 0;
316
- height: 0;
317
- text-indent: -99999px;
318
- *text-indent: 0;
319
- vertical-align: top;
320
- border-left: 4px solid transparent;
321
- border-right: 4px solid transparent;
322
- border-top: 4px solid black;
323
- opacity: 0.5;
324
- filter: alpha(opacity=50);
325
- content: "\2193";
326
- }
327
- .dropdown .caret {
328
- margin-top: 8px;
329
- margin-left: 2px;
330
- }
331
- .dropdown:hover .caret, .open.dropdown .caret {
332
- opacity: 1;
333
- filter: alpha(opacity=100);
334
- }
335
- .dropdown-menu {
336
- position: absolute;
337
- top: 100%;
338
- left: 0;
339
- z-index: 1000;
340
- float: left;
341
- display: none;
342
- min-width: 245px;
343
- max-width: 245px;
344
- padding: 0;
345
- margin: 2px 0 0 0;
346
- list-style: none;
347
- background-color: #fff;
348
- border: 1px solid rgba(0, 0, 0, 0.2);
349
- @include box-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
350
-
351
- &.bottom {
352
- top: auto;
353
- bottom: 100%;
354
- margin-bottom: 2px;
355
- }
356
-
357
- &.right {
358
- right: 0;
359
- top: 100%;
360
- left: auto;
361
- }
362
-
363
- &.left {
364
-
365
- }
366
-
367
- .divider {
368
- border-top: 1px solid #ebebeb;
369
- margin-top: 9px;
370
- margin-bottom: 10px;
371
- padding: 0;
372
- cursor: default;
373
- /* height: 1px;
374
- margin: 5px 1px;
375
- overflow: hidden;
376
- background-color: #e5e5e5;
377
- border-bottom: 1px solid white;
378
-
379
- // IE7 needs a set width since we gave a height. Restricting just
380
- // to IE7 to keep the 1px left/right space in other browsers.
381
- // It is unclear where IE is getting the extra space that we need
382
- // to negative-margin away, but so it goes.
383
- *width: 100%;
384
- *margin: -5px 0 5px;*/
385
-
386
- }
387
- }
388
-
389
- .dropdown-menu a {
390
- position: relative;
391
- padding: 6px 0 6px 30px;
392
- color: #333;
393
- text-decoration: none;
394
- display: block;
395
- clear: both;
396
- font-weight: normal;
397
- line-height: 18px;
398
- white-space: nowrap;
399
-
400
- [class^="icon-"] {
401
- position: absolute;
402
- left: 7px;
403
- top: 6px;
404
- }
405
- }
406
-
407
- .dropdown-menu li > a:hover, .dropdown-menu .active > a, .dropdown-menu .active > a:hover {
408
- text-decoration: none;
409
- background-color: #eee;
410
- }
411
-
412
- .dropdown {
413
- &.open {
414
- *z-index: 1000;
415
-
416
- .dropdown-toggle {
417
- //@TODO: ruby pre && compass pre required !optional refactor me
418
- //@extend .button.checked;
419
-
420
- //color: #08c;
421
- //background: #ccc;
422
- //background: rgba(0, 0, 0, 0.3);
423
- }
424
-
425
- .dropdown-menu {
426
- display: block;
427
- }
428
- }
429
- }
430
-
431
- /* -------------------------------------------------------- BUTTON CONTAINER */
432
- /* For mixing buttons and button groups, e.g., in a navigation bar */
433
- .button-container .button, .button-container .button-group {
434
- vertical-align: top;
435
- }
436
- .button-group{
437
- .open {
438
- *z-index: 1000;
439
-
440
- .dropdown-menu {
441
- display: block;
442
- margin-top: 1px;
443
- }
444
-
445
- .dropdown-toggle {
446
- background-image: none;
447
- @include box-shadow(0 1px 6px rgba(0, 0, 0, 0.15) inset);
448
- //-webkit-box-shadow: inset 0 1px 6px rgba(0, 0, 0, 0.15);
449
- //-moz-box-shadow: inset 0 1px 6px rgba(0, 0, 0, 0.15);
450
- //box-shadow: inset 0 1px 6px rgba(0, 0, 0, 0.15);
451
- }
452
- }
453
- }