kube-rails 0.0.5 → 0.0.6

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 (27) hide show
  1. data/Rakefile +0 -1
  2. data/lib/kube/rails/version.rb +1 -1
  3. data/vendor/kube/blocks.less +26 -19
  4. data/vendor/kube/buttons.less +118 -26
  5. data/vendor/kube/colors.less +52 -0
  6. data/vendor/kube/forms.less +127 -119
  7. data/vendor/kube/grid.less +212 -129
  8. data/vendor/kube/helpers.less +90 -0
  9. data/vendor/kube/images.less +24 -0
  10. data/vendor/kube/kube.less +21 -8
  11. data/vendor/kube/labels.less +62 -7
  12. data/vendor/kube/lists.less +29 -0
  13. data/vendor/kube/master.less +234 -0
  14. data/vendor/kube/messages.less +34 -0
  15. data/vendor/kube/mixins.less +81 -7
  16. data/vendor/kube/navs.less +115 -14
  17. data/vendor/kube/reset.less +215 -0
  18. data/vendor/kube/responsive-blocks.less +42 -0
  19. data/vendor/kube/responsive-forms.less +23 -0
  20. data/vendor/kube/responsive-grid.less +80 -0
  21. data/vendor/kube/responsive-media.less +31 -0
  22. data/vendor/kube/responsive-navs.less +50 -0
  23. data/vendor/kube/responsive-utils.less +22 -0
  24. data/vendor/kube/tables.less +48 -27
  25. data/vendor/kube/typo.less +17 -20
  26. data/vendor/kube/variables.less +18 -18
  27. metadata +15 -2
data/Rakefile CHANGED
@@ -7,7 +7,6 @@ task :bundle do
7
7
  sh 'bundle install'
8
8
  sh 'gem build *.gemspec'
9
9
  sh 'gem install *.gem'
10
- sh 'rm *.gem'
11
10
  end
12
11
 
13
12
  task(:default).clear
data/lib/kube/rails/version.rb CHANGED
@@ -1,5 +1,5 @@
1
1
  module Kube
2
2
  module Rails
3
- VERSION = "0.0.5"
3
+ VERSION = '0.0.6'
4
4
  end
5
5
  end
data/vendor/kube/blocks.less CHANGED
@@ -1,27 +1,34 @@
1
1
  /* =Blocks
2
2
  -----------------------------------------------------------------------------*/
3
- .block-two,
4
- .block-three,
5
- .block-four,
6
- .block-five,
7
- .block-six {
3
+ .blocks-2,
4
+ .blocks-3,
5
+ .blocks-4,
6
+ .blocks-5,
7
+ .blocks-6 {
8
+ padding-left: 0;
8
9
  list-style: none;
9
10
  margin-left: -@gridGutterWidth/(@gridWidth/100)*1%;
10
- margin-bottom: 0;
11
+ .box-sizing(border-box);
11
12
  .clearfixing;
12
13
  }
13
- .block-two > li,
14
- .block-three > li,
15
- .block-four > li,
16
- .block-five > li,
17
- .block-six > li {
18
- height: auto;
19
- float: left;
14
+ .blocks-2 > li,
15
+ .blocks-3 > li,
16
+ .blocks-4 > li,
17
+ .blocks-5 > li,
18
+ .blocks-6 > li {
19
+ height: auto;
20
+ float: left;
20
21
  margin-bottom: @baseLine/@em;
21
- margin-left: @gridGutterWidth/(@gridWidth/100)*1%;
22
+ margin-left: @gridGutterWidth/(@gridWidth/100)*1%;
23
+ .box-sizing(border-box);
24
+ }
25
+
26
+ .blocks-2 > li { .block(2); }
27
+ .blocks-3 > li { .block(3); }
28
+ .blocks-4 > li { .block(4); }
29
+ .blocks-5 > li { .block(5); }
30
+ .blocks-6 > li { .block(6); }
31
+
32
+ .block-first {
33
+ clear: both;
22
34
  }
23
- .block-two > li { .block(2); }
24
- .block-three > li { .block(3); }
25
- .block-four > li { .block(4); }
26
- .block-five > li { .block(5); }
27
- .block-six > li { .block(6); }
data/vendor/kube/buttons.less CHANGED
@@ -1,46 +1,118 @@
1
-
2
1
  .btn {
3
2
  text-decoration: none;
4
3
  color: #000;
5
4
  border-radius: 2px;
6
- font-family: 'Helvetica Neue', 'Source Sans Pro', Helvetica, Arial, sans-serif;
7
- border: 1px solid #ccc;
8
- padding: .5em 1.05em;
5
+ font-family: @buttonFontFamily;
6
+ border: 1px solid darken(#fff, 20);
7
+ border-bottom-color: darken(#fff, 30);
8
+ line-height: 1;
9
+ padding: .7em 1.1em .6em 1.1em;
9
10
  font-weight: 500;
10
11
  font-size: .85em;
11
- background: #f3f2f2;
12
- background: -moz-linear-gradient(top, #ffffff 0%, #f3f2f2 100%);
13
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f3f2f2));
14
- background: -webkit-linear-gradient(top, #ffffff 0%,#f3f2f2 100%);
15
- background: -o-linear-gradient(top, #ffffff 0%,#f3f2f2 100%);
16
- background: -ms-linear-gradient(top, #ffffff 0%,#f3f2f2 100%);
17
- background: linear-gradient(to bottom, #ffffff 0%,#f3f2f2 100%);
18
- filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f3f2f2',GradientType=0 );
19
- }
20
- .btn:hover {
21
- background: #fff;
22
- border: 1px solid #ddd;
12
+ .gradient(darken(#fff, 1), darken(#fff, 12));
13
+ text-shadow: 0 1px 0 rgba(255, 255, 255, 1);
14
+ box-shadow: none;
15
+ &:hover {
16
+ color: #000;
17
+ background: darken(#fff, 12);
18
+ }
19
+ }
20
+ .btn-black {
21
+ border-color: #000;
22
+ .gradient(lighten(#000, 30), #000);
23
+ }
24
+ .btn-red {
25
+ border-color: darken(#ef6465, 25);
26
+ border-bottom-color: darken(#ef6465, 35);
27
+ .gradient(#ef6465, darken(#ef6465, 20));
28
+ }
29
+ .btn-orange {
30
+ border-color: darken(#f48a30, 15);
31
+ border-bottom-color: darken(#f48a30, 25);
32
+ .gradient(#f48a30, darken(#f48a30, 10));
33
+ }
34
+ .btn-green {
35
+ border-color: darken(#90af45, 18);
36
+ border-bottom-color: darken(#90af45, 28);
37
+ .gradient(#90af45, darken(#90af45, 15));
38
+ }
39
+ .btn-blue {
40
+ border-color: darken(#1c7ab4, 17);
41
+ border-bottom-color: darken(#1c7ab4, 27);
42
+ .gradient(#1c7ab4, darken(#1c7ab4, 10));
43
+ }
44
+ .btn-yellow {
45
+ border-color: darken(#f3c835, 20);
46
+ border-bottom-color: darken(#f3c835, 30);
47
+ .gradient(#f3c835, darken(#f3c835, 15));
48
+ }
49
+ .btn-black {
50
+ text-shadow: 0 -1px 0 rgba(0, 0, 0, 1);
51
+ }
52
+ .btn-red,
53
+ .btn-orange,
54
+ .btn-green,
55
+ .btn-blue,
56
+ .btn-yellow {
57
+ text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.24);
58
+ }
59
+ .btn-black,
60
+ .btn-red,
61
+ .btn-orange,
62
+ .btn-green,
63
+ .btn-blue,
64
+ .btn-yellow {
65
+ color: #fff;
66
+ }
67
+ .btn-black:hover,
68
+ .btn-red:hover,
69
+ .btn-orange:hover,
70
+ .btn-green:hover,
71
+ .btn-blue:hover,
72
+ .btn-yellow:hover {
73
+ color: rgba(255, 255, 255, .8);
74
+ }
75
+ .btn-black:hover {
76
+ background: #000;
77
+ }
78
+ .btn-red:hover {
79
+ background: darken(#ef6465, 20);
80
+ }
81
+ .btn-orange:hover {
82
+ background: darken(#f48a30, 10);
83
+ }
84
+ .btn-green:hover {
85
+ background: darken(#90af45, 15);
86
+ }
87
+ .btn-blue:hover {
88
+ background: darken(#1c7ab4, 10);
89
+ }
90
+ .btn-yellow:hover {
91
+ background: darken(#f3c835, 15);
23
92
  }
93
+
24
94
  .btn-small {
25
95
  font-size: .7em;
26
96
  }
27
97
  .btn-big {
28
98
  font-size: 1.2em;
99
+ line-height: @baseLine / @em;
100
+ padding-left: 1.5em;
101
+ padding-right: 1.5em;
29
102
  }
30
103
  .btn-round {
31
104
  border-radius: 20px;
32
105
  }
33
- .btn-full {
34
- width: 100%;
35
- }
106
+
36
107
  .btn-active,
37
108
  .btn-active:hover,
38
109
  .btn.disabled,
39
- .btn[disabled]
110
+ .btn[disabled],
40
111
  .btn-disabled,
41
112
  .btn-disabled:hover {
42
- background: #e3e3e3;
43
- border: 1px solid #ccc;
113
+ .opacity(100);
114
+ background: darken(#fff, 18);
115
+ border: 1px solid darken(#fff, 30);
44
116
  text-shadow: 0 1px 1px #fff;
45
117
  }
46
118
  .btn-active,
@@ -48,7 +120,7 @@
48
120
  color: #666;
49
121
  }
50
122
  .btn.disabled,
51
- .btn[disabled]
123
+ .btn[disabled],
52
124
  .btn-disabled,
53
125
  .btn-disabled:hover {
54
126
  color: #999;
@@ -58,26 +130,41 @@
58
130
  .btn:hover .halflings {
59
131
  color: @colorGrayDark;
60
132
  }
133
+ .btn-black:hover .halflings,
134
+ .btn-red:hover .halflings,
135
+ .btn-orange:hover .halflings,
136
+ .btn-green:hover .halflings,
137
+ .btn-blue:hover .halflings,
138
+ .btn-yellow:hover .halflings {
139
+ color: rgba(255, 255, 255, .8);
140
+ }
141
+ .btn-disabled:hover .halflings {
142
+ color: #999;
143
+ }
61
144
 
62
145
  .btn-active .halflings {
63
146
  color: #555;
64
147
  }
65
148
 
66
149
  /* Group */
150
+ .btn-single,
67
151
  .btn-group {
68
152
  display: inline-block;
69
153
  margin-right: 2px;
70
154
  .clearfixing();
71
155
  vertical-align: bottom;
72
156
  }
157
+ .btn-single > .btn,
158
+ .btn-single > input,
73
159
  .btn-group > .btn,
74
160
  .btn-group > input {
75
161
  float: left;
76
- -moz-border-radius: 0;
77
- -webkit-border-radius: 0;
78
162
  border-radius: 0;
79
163
  margin-left: -1px;
80
164
  }
165
+ .btn-single > .btn {
166
+ border-radius: 4px;
167
+ }
81
168
  .btn-group > .btn:first-child {
82
169
  border-radius: 4px 0 0 4px;
83
170
  }
@@ -92,10 +179,15 @@
92
179
  .btn-group > .input-search:last-child {
93
180
  border-radius: 0 15px 15px 0;
94
181
  }
95
-
182
+ .btn-append,
183
+ .btn-group .btn {
184
+ padding: .7em 1.1em .6em 1.1em;
185
+ }
96
186
 
97
187
  /* Append */
98
188
  .btn-append {
189
+ position: relative;
190
+ top: -1px;
99
191
  margin-left: -2px;
100
192
  border-radius: 0 4px 4px 0;
101
193
  }
data/vendor/kube/colors.less ADDED
@@ -0,0 +1,52 @@
1
+ /* =Colors
2
+ -----------------------------------------------------------------------------*/
3
+ .color-black {
4
+ color: @colorBlack;
5
+ }
6
+ .color-gray-dark {
7
+ color: @colorGrayDark;
8
+ }
9
+ .color-gray {
10
+ color: @colorGray;
11
+ }
12
+ .color-gray-light {
13
+ color: @colorGrayLight;
14
+ }
15
+ .color-white {
16
+ color: @colorWhite;
17
+ }
18
+ .color-red,
19
+ .error {
20
+ color: @colorRed;
21
+ }
22
+ .color-green,
23
+ .success {
24
+ color: @colorGreen;
25
+ }
26
+ .color-orange {
27
+ color: @colorOrange;
28
+ }
29
+ .color-green {
30
+ color: @colorGreen;
31
+ }
32
+ .color-blue {
33
+ color: @colorBlue;
34
+ }
35
+ .color-yellow {
36
+ color: @colorYellow;
37
+ }
38
+
39
+ /* Link Colors Hover */
40
+ a.color-white:focus,
41
+ a.color-white:hover {
42
+ color: darken(@colorWhite, 25%);
43
+ color: rgba(255, 255, 255, .6);
44
+ }
45
+ a.color-green:focus,
46
+ a.color-green:hover,
47
+ a.color-red:focus,
48
+ a.color-red:hover,
49
+ a.color-error:focus,
50
+ a.color-error:hover {
51
+ color: @colorBlack;
52
+ }
data/vendor/kube/forms.less CHANGED
@@ -1,138 +1,148 @@
1
1
  /* =Forms
2
2
  -----------------------------------------------------------------------------*/
3
+ @fieldsBottom: 1.65em;
4
+
3
5
  .forms label {
4
6
  display: block;
5
- margin-bottom: 2px;
6
- }
7
- .descr {
8
- color: @colorGrayLight;
9
- font-size: @smallFontSize;
10
- line-height: @baseLine/@em;
7
+ margin-bottom: @fieldsBottom;
8
+ }
9
+ .forms input[type="text"],
10
+ .forms input[type="password"],
11
+ .forms input[type="email"],
12
+ .forms input[type="url"],
13
+ .forms input[type="phone"],
14
+ .forms input[type="tel"],
15
+ .forms input[type="number"],
16
+ .forms input[type="datetime"],
17
+ .forms input[type="date"],
18
+ .forms input[type="search"],
19
+ .forms input[type="range"],
20
+ .forms input[type="file"],
21
+ .forms input[type="datetime-local"],
22
+ .forms textarea,
23
+ .forms select,
24
+ .forms button {
25
+ display: block;
11
26
  }
12
- div.descr {
13
- margin: 4px 0;
27
+ .forms-inline input[type="text"],
28
+ .forms-inline input[type="password"],
29
+ .forms-inline input[type="email"],
30
+ .forms-inline input[type="url"],
31
+ .forms-inline input[type="phone"],
32
+ .forms-inline input[type="tel"],
33
+ .forms-inline input[type="number"],
34
+ .forms-inline input[type="datetime"],
35
+ .forms-inline input[type="date"],
36
+ .forms-inline input[type="search"],
37
+ .forms-inline input[type="range"],
38
+ .forms-inline input[type="file"],
39
+ .forms-inline input[type="datetime-local"],
40
+ .forms-inline textarea,
41
+ .forms-inline select,
42
+ .forms-inline button,
43
+ .forms-inline-list input[type="text"],
44
+ .forms-inline-list input[type="password"],
45
+ .forms-inline-list input[type="email"],
46
+ .forms-inline-list input[type="url"],
47
+ .forms-inline-list input[type="phone"],
48
+ .forms-inline-list input[type="tel"],
49
+ .forms-inline-list input[type="number"],
50
+ .forms-inline-list input[type="datetime"],
51
+ .forms-inline-list input[type="date"],
52
+ .forms-inline-list input[type="search"],
53
+ .forms-inline-list input[type="range"],
54
+ .forms-inline-list input[type="file"],
55
+ .forms-inline-list input[type="datetime-local"],
56
+ .forms-inline-list textarea,
57
+ .forms-inline-list select,
58
+ .forms-inline-list button {
59
+ display: inline-block;
14
60
  }
15
- .columnar div.descr {
16
- margin-bottom: 10px;
61
+ .forms-list,
62
+ .forms-inline-list {
63
+ margin: 0;
64
+ padding: 0;
65
+ margin-bottom: @fieldsBottom;
66
+ list-style: none;
17
67
  }
18
- .forms ul {
19
- list-style: none;
20
- margin: 0;
68
+ .forms-list label,
69
+ .forms-inline-list li,
70
+ .forms-inline-list li label {
71
+ display: inline-block;
72
+ margin-bottom: 0;
21
73
  }
22
- .forms ul li {
23
- margin-bottom: 10px;
74
+ .forms-inline-list li label {
75
+ margin-right: @fieldsBottom;
24
76
  }
25
- .forms.columnar ul li {
26
- margin-bottom: 15px;
77
+ .forms-list li {
78
+ margin-bottom: 6px;
27
79
  }
28
-
29
- /* liner fieldset */
30
- fieldset.liner {
31
- border: none;
32
- padding: 0;
80
+ .forms-desc {
81
+ margin-top: 4px;
82
+ color: @colorGrayLight;
83
+ font-size: @smallFontSize;
84
+ line-height: 1.4em;
33
85
  }
34
- fieldset.liner legend {
35
- padding: 0;
36
- width: 100%;
37
- padding-bottom: 12px;
86
+ .forms fieldset {
87
+ padding-bottom: .5em;
88
+ border-radius: .5em;
38
89
  }
39
- fieldset.liner legend span {
90
+ fieldset.forms-row {
40
91
  padding: 0;
41
- padding-bottom: 8px;
42
- border-bottom: 1px solid #eee;
43
- display: block;
44
- }
45
- /* multicolumn */
46
- .forms ul.multicolumn {
47
- .clearfixing();
48
- }
49
- .forms ul.multicolumn li {
50
- float: left;
51
- margin-right: 12px;
52
- margin-bottom: 0;
53
- line-height: 1.8em;
54
- }
55
- .forms ul.multicolumn li label {
92
+ border: none;
56
93
  margin-bottom: 0;
57
94
  }
58
- .forms ul.multicolumn li.width-50 {
59
- width: 48%;
60
- margin-right: 2%;
95
+ .forms-columnar {
96
+ .clearfixing();
61
97
  }
62
- .forms ul.multicolumn li.width-33 {
63
- width: 31%;
64
- margin-right: 2%;
98
+ .forms-columnar input[type="range"],
99
+ .forms-columnar input[type="file"],
100
+ .forms-columnar select[multiple="multiple"] {
101
+ display: inline-block;
65
102
  }
66
- /* columnar */
67
- .forms.columnar legend {
68
- margin-bottom: 1em;
103
+ .forms-columnar p {
104
+ position: relative;
105
+ padding-left: @columnarWidth + @columnarMargin;
69
106
  }
70
- .forms.columnar label {
107
+ .forms-columnar label {
71
108
  float: left;
72
109
  width: @columnarWidth;
73
110
  text-align: right;
74
- margin-right: @columnarMargin;
111
+ top: 0;
112
+ left: 0;
113
+ position: absolute;
75
114
  }
76
- .forms.columnar .push,
77
- .forms.columnar div.descr {
115
+ .forms-columnar .forms-list,
116
+ .forms-columnar .forms-inline-list {
78
117
  margin-left: @columnarWidth + @columnarMargin;
79
118
  }
80
- .forms.columnar li fieldset label {
119
+ .forms-columnar .forms-list label,
120
+ .forms-columnar .forms-inline-list label {
121
+ position: static;
81
122
  float: none;
82
123
  width: auto;
83
124
  text-align: left;
84
125
  margin-right: 0;
85
126
  }
86
- .forms.columnar li fieldset {
87
- border: none;
88
- padding: 0;
89
- margin: 0;
90
- padding-left: @columnarWidth + @columnarMargin;
91
- position: relative;
92
- }
93
- .forms.columnar li fieldset section {
94
- padding: 0;
95
- position: absolute;
96
- width: @columnarWidth;
97
- text-align: right;
98
- left: 0;
99
- top: 0;
127
+ .forms-columnar .forms-inline-list label {
128
+ margin-right: @fieldsBottom;
100
129
  }
101
- .forms.columnar li fieldset section label {
102
- float: none;
103
- width: auto;
104
- margin-right: 0;
105
- text-align: right;
106
- }
107
- .forms.columnar li fieldset div.descr {
108
- margin-left: 0;
130
+ .forms-push {
131
+ position: relative;
132
+ padding-left: @columnarWidth + @columnarMargin;
109
133
  }
110
-
111
-
112
- /* section */
113
- .forms li.form-section {
134
+ .forms-section {
114
135
  font-weight: bold;
115
136
  border-bottom: 1px solid #eee;
116
- padding: 1.5em 0 .7em 0;
117
- font-size: 1.1em;
118
- margin-bottom: 1.5em;
137
+ padding: 0 0 10px 0;
138
+ margin-bottom: 1em;
139
+ line-height: 1;
119
140
  }
120
- .columnar li.form-section {
141
+ .forms-columnar .forms-section {
121
142
  padding-left: @columnarWidth + @columnarMargin;
122
143
  }
123
144
 
124
145
 
125
- /* tableforms */
126
- table.tableforms td {
127
- font-size: 90%;
128
- padding: 1px 10px 3px 0 !important;
129
- border: none;
130
- }
131
- table.tableforms tr.labels td {
132
- padding-top: .8em !important;
133
- font-weight: bold;
134
- }
135
-
136
146
  input[type="radio"],
137
147
  input[type="checkbox"] {
138
148
  position: relative;
@@ -144,25 +154,38 @@ input[type="password"],
144
154
  input[type="email"],
145
155
  input[type="url"],
146
156
  input[type="phone"],
147
- textarea {
157
+ input[type="tel"],
158
+ input[type="number"],
159
+ input[type="datetime"],
160
+ input[type="date"],
161
+ input[type="search"],
162
+ input[type="datetime-local"],
163
+ textarea,
164
+ select[multiple="multiple"] {
148
165
  position: relative;
149
166
  z-index: 2;
150
167
  font-family: @inputFontFamily;
151
- height: 23px;
152
168
  border: 1px solid #ccc;
153
169
  margin: 0;
154
- padding: 1px 2px;
170
+ padding: 3px 2px;
155
171
  background-color: white;
156
- color: #333;
157
- font-size: .95em;
172
+ color: @colorBody;
173
+ font-size: 1em;
158
174
  line-height: 1;
159
175
  border-radius: 1px;
160
176
  box-shadow: 0 1px 2px rgba(0, 0, 0, .1) inset;
161
177
  .transition(border ease .5s);
162
178
  }
179
+ input[type="range"] {
180
+ position: relative;
181
+ top: 3px;
182
+ }
163
183
  textarea {
164
184
  line-height: 1.4em;
165
185
  }
186
+ select {
187
+ margin-bottom: 0 !important;
188
+ }
166
189
 
167
190
  /* Errors and Success */
168
191
  .error,
@@ -222,26 +245,11 @@ input[type="search"] {
222
245
  .input-prepend {
223
246
  margin-right: -1px;
224
247
  }
225
-
226
248
  .input-append {
227
249
  position: relative;
228
250
  z-index: 1;
229
251
  margin-left: -1px;
230
252
  }
231
253
 
232
- /* Placeholders */
233
- ::-webkit-input-placeholder {
234
- color: @colorGrayLight;
235
- padding: 1px 2px;
236
- }
237
- /* FF19+ */
238
- ::-moz-placeholder {
239
- color: @colorGrayLight;
240
- }
241
- input:-moz-placeholder,
242
- textarea:-moz-placeholder {
243
- color: @colorGrayLight;
244
- }
245
- :-ms-input-placeholder {
246
- color: @colorGrayLight;
247
- }
254
+ /* Placeholder */
255
+ .placeholder(@colorGrayLight);