stipe 0.0.2.6 → 0.0.2.7
Sign up to get free protection for your applications and to get access to all the features.
- data/readme.md +5 -1
- data/stylesheets/stipe/_forms.scss +2 -0
- data/stylesheets/stipe/buttons/_extends.scss +2 -2
- data/stylesheets/stipe/buttons/lib/_cupid-green.scss +10 -1
- data/stylesheets/stipe/buttons/lib/_minimal.scss +9 -0
- data/stylesheets/stipe/forms/_extends.scss +8 -1
- data/stylesheets/stipe/stipe/_mixins.scss +26 -3
- data/stylesheets/stipe/toadstool/_buttons.scss +3 -3
- metadata +1 -2
- data/stylesheets/stipe/forms/_default.scss +0 -11
data/readme.md
CHANGED
@@ -13,7 +13,11 @@ Stipe is a Compass Extension, so Compass is set as a depdency. You will need to
|
|
13
13
|
|
14
14
|
# Stipe Changelog
|
15
15
|
|
16
|
+
## 0.0.2.7
|
17
|
+
* Sass and UI work related to default form views
|
18
|
+
|
16
19
|
## 0.0.2.6
|
17
20
|
* Created color views in Toadstool
|
18
21
|
* Created remaining semantic color variables silent classes
|
19
|
-
* Updated Toadstool `_design / _ui_manifest.scss`
|
22
|
+
* Updated Toadstool `_design / _ui_manifest.scss`
|
23
|
+
|
@@ -19,6 +19,8 @@ $error_text: $alpha_color !default;
|
|
19
19
|
$form_field_fail: $alpha_color !default;
|
20
20
|
$form_field_text_fail: $alpha_color !default;
|
21
21
|
$instructional_text: $charlie_gray !default;
|
22
|
+
$placeholder_text: $hotel_gray !default;
|
23
|
+
$form_label_color: $alpha_gray !default;
|
22
24
|
|
23
25
|
@import "forms/mixins";
|
24
26
|
@import "forms/extends";
|
@@ -2,12 +2,12 @@
|
|
2
2
|
// ---------------------------------------------------------
|
3
3
|
|
4
4
|
%stipe_buttons {
|
5
|
-
@extend %
|
5
|
+
@extend %cupid-green;
|
6
6
|
margin-right: em(10);
|
7
7
|
&:last-child {
|
8
8
|
margin: 0;
|
9
9
|
}
|
10
10
|
&:nth-child(n+2) {
|
11
|
-
@extend %
|
11
|
+
@extend %minimal;
|
12
12
|
}
|
13
13
|
}
|
@@ -10,7 +10,7 @@ $cupid_inset_box_shadow_active: #548c29 !default;
|
|
10
10
|
$cupid_text_color: #fff !default;
|
11
11
|
$cupid_text_weight: bold !default;
|
12
12
|
$cupid_font_family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif !default;
|
13
|
-
$cupid_font_size:
|
13
|
+
$cupid_font_size: 1.3em !default;
|
14
14
|
$cupid_padding: em(7) 0 em(8) 0 !default;
|
15
15
|
$cupid_text_shadow_color: #4c9021 !default;
|
16
16
|
$cupid_width: em(150) !default;
|
@@ -29,6 +29,10 @@ $cupid_width: em(150) !default;
|
|
29
29
|
text-align: center;
|
30
30
|
text-shadow: 0 -1px 0 $cupid_text_shadow_color;
|
31
31
|
width: $cupid_width;
|
32
|
+
@media #{$mobile} {
|
33
|
+
width: 100%;
|
34
|
+
line-height: 1.3em;
|
35
|
+
}
|
32
36
|
&:hover {
|
33
37
|
@include linear_gradient_w3c ($cupid_background_hover, #{$cupid_gradient_hover});
|
34
38
|
@include box_shadow(inset 0 1px 0 0, $cupid_inset_box_shadow_hover);
|
@@ -40,6 +44,11 @@ $cupid_width: em(150) !default;
|
|
40
44
|
border-color: darken(nth($cupid_border_color, 4), 5);
|
41
45
|
@include box_shadow(inset 0 0 8px 4px, $cupid_inset_box_shadow_active);
|
42
46
|
}
|
47
|
+
&[disabled] {
|
48
|
+
background: transparentize($cupid_background, 0.5);
|
49
|
+
border-color: transparentize($cupid_background, 0.5);
|
50
|
+
color: transparentize($cupid_text_color, 0.5);
|
51
|
+
}
|
43
52
|
}
|
44
53
|
|
45
54
|
|
@@ -23,6 +23,10 @@ $minimal_width: em(150) !default;
|
|
23
23
|
text-align: center;
|
24
24
|
text-shadow: $minimal_text_shadow;
|
25
25
|
width: $minimal_width;
|
26
|
+
@media #{$mobile} {
|
27
|
+
width: 100%;
|
28
|
+
line-height: 1.3em;
|
29
|
+
}
|
26
30
|
&:hover {
|
27
31
|
background: darken($minimal_background, 5);
|
28
32
|
@include box_shadow(inset 0 0 1px 1px, darken($minimal_inset_shadow_color, 5));
|
@@ -33,4 +37,9 @@ $minimal_width: em(150) !default;
|
|
33
37
|
background: darken($minimal_background, 8);
|
34
38
|
@include box_shadow(inset 0 0 1px 1px, darken($minimal_inset_shadow_color, 5));
|
35
39
|
}
|
40
|
+
&[disabled] {
|
41
|
+
background: transparentize($minimal_background, 0.5);
|
42
|
+
border-color: transparentize($minimal_background, 0.5);
|
43
|
+
color: transparentize($minimal_font_color, 0.5);
|
44
|
+
}
|
36
45
|
}
|
@@ -5,7 +5,7 @@
|
|
5
5
|
background: $form_field_background_color;
|
6
6
|
@include medium();
|
7
7
|
height: #{32 / $em}em;
|
8
|
-
@include grid(12,
|
8
|
+
@include grid(12.25, alphaomega, $grid_padding_l:6, $grid_padding_r:6);
|
9
9
|
@include placeholder ($delta_gray);
|
10
10
|
|
11
11
|
@include field_focus;
|
@@ -13,6 +13,13 @@
|
|
13
13
|
+ .horizontal_selectors {
|
14
14
|
margin-top: -0.5em;
|
15
15
|
}
|
16
|
+
|
17
|
+
@include input_placeholder(transparent);
|
18
|
+
|
19
|
+
@media #{$tablet_portrait} {
|
20
|
+
-webkit-appearance: none; // this is to remove the default inner shadow
|
21
|
+
@include input_placeholder($placeholder_text);
|
22
|
+
}
|
16
23
|
}
|
17
24
|
|
18
25
|
// disabled input fields
|
@@ -8,9 +8,13 @@
|
|
8
8
|
|
9
9
|
// required default value to for vendor prefix support
|
10
10
|
// -----------------------------------------------------
|
11
|
-
$prefix_defaults: -moz- -webkit- -o- -ms- '';
|
12
|
-
$webkit_support: -webkit- '';
|
13
|
-
$
|
11
|
+
$prefix_defaults: -moz- -webkit- -o- -ms- '' !default;
|
12
|
+
$webkit_support: -webkit- '' !default;
|
13
|
+
$moz_support: -moz- !default;
|
14
|
+
$ms_support: -ms- !default;
|
15
|
+
$moz_webkit_support: -moz- -webkit- '' !default;
|
16
|
+
$moz_ms_support: -moz- -ms- '' !default;
|
17
|
+
$webkit_ms_support: -webkit- -ms- !default;
|
14
18
|
|
15
19
|
|
16
20
|
|
@@ -63,6 +67,25 @@ $inset_shadow: #{$ih-shadow / $em}em #{$iv-shadow / $em}em #{$iblur / $em}em;
|
|
63
67
|
|
64
68
|
|
65
69
|
|
70
|
+
/////// input_placeholder arguments /////////
|
71
|
+
// --------------------------------------
|
72
|
+
@mixin input_placeholder ($placeholder_color, $placeholder_prefix: $moz_support, $input-placeholder_prefix: $webkit_ms_support) {
|
73
|
+
@each $prefix in $input-placeholder_prefix {
|
74
|
+
&::#{$prefix}input-placeholder {
|
75
|
+
color: $placeholder_color;
|
76
|
+
}
|
77
|
+
}
|
78
|
+
@each $prefix in $placeholder_prefix {
|
79
|
+
&:#{$prefix}placeholder {
|
80
|
+
color: $placeholder_color;
|
81
|
+
}
|
82
|
+
}
|
83
|
+
}
|
84
|
+
/////// input_placeholder arguments /////////
|
85
|
+
|
86
|
+
|
87
|
+
|
88
|
+
|
66
89
|
/////////// image with gradient background ////////////
|
67
90
|
// ------------------------------------------------- //
|
68
91
|
|
@@ -1,6 +1,5 @@
|
|
1
1
|
[class*="toadstool"] {
|
2
|
-
.nav_toggle {
|
3
|
-
//@include linear_gradient_w3c (#7d7e7d, #{#7d7e7d 0%, #0e0e0e 100%});
|
2
|
+
.nav_toggle {
|
4
3
|
@include linear_gradient_w3c ($alpha_gray, #{$delta_gray 0%, $alpha_gray 100%});
|
5
4
|
&:hover {
|
6
5
|
@include linear_gradient_w3c ($alpha_gray, #{$alpha_gray 0%, $delta_gray 100%});
|
@@ -12,10 +11,11 @@
|
|
12
11
|
border-color: $alpha_gray;
|
13
12
|
float: right;
|
14
13
|
display: none;
|
14
|
+
color: $white;
|
15
15
|
@media #{$mobile} {
|
16
16
|
display: block;
|
17
17
|
width: auto;
|
18
|
-
padding:
|
18
|
+
padding: rem(15) rem(10) rem(10) rem(10);
|
19
19
|
font-weight: normal;
|
20
20
|
span {
|
21
21
|
&:after {
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: stipe
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0.2.
|
4
|
+
version: 0.0.2.7
|
5
5
|
prerelease:
|
6
6
|
platform: ruby
|
7
7
|
authors:
|
@@ -104,7 +104,6 @@ files:
|
|
104
104
|
- stylesheets/stipe/color/_extends.scss
|
105
105
|
- stylesheets/stipe/_typography.scss
|
106
106
|
- stylesheets/stipe/forms/_mixins.scss
|
107
|
-
- stylesheets/stipe/forms/_default.scss
|
108
107
|
- stylesheets/stipe/forms/_extends.scss
|
109
108
|
- stylesheets/stipe/doc-src/grids.md
|
110
109
|
- stylesheets/stipe/stipe/_mixins.scss
|