kube-rails 0.0.4 → 0.0.5

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,5 +1,5 @@
1
1
  module Kube
2
2
  module Rails
3
- VERSION = "0.0.4"
3
+ VERSION = "0.0.5"
4
4
  end
5
5
  end
@@ -1,12 +1,9 @@
1
1
  /*
2
2
  Kube Professional CSS-framework
3
-
3
+
4
4
  Copyright (c) 2012, Imperavi Inc.
5
5
 
6
6
  http://imperavi.com/kube/
7
-
8
- License: free
9
-
10
7
  */
11
8
 
12
9
  /* =Base, reset, normalize
@@ -97,7 +94,7 @@ h6 {
97
94
  outline: 0;
98
95
  font-size: 100%;
99
96
  vertical-align: baseline;
100
- background: transparent;
97
+ background: transparent;
101
98
  font-style: normal;
102
99
  }
103
100
  /* Structure tags */
@@ -141,19 +138,19 @@ q:after {
141
138
  }
142
139
  /* Table reset */
143
140
  table {
144
- border-collapse: collapse;
141
+ border-collapse: collapse;
145
142
  border-spacing: 0;
146
143
  }
147
- caption,
148
- th,
144
+ caption,
145
+ th,
149
146
  td {
150
147
  text-align: left;
151
148
  vertical-align: top;
152
149
  font-weight: normal;
153
150
  }
154
- thead th,
151
+ thead th,
155
152
  thead td {
156
- font-weight: bold;
153
+ font-weight: bold;
157
154
  vertical-align: bottom;
158
155
  }
159
156
  /* Image inside */
@@ -161,9 +158,9 @@ a img, th img, td img {
161
158
  vertical-align: top;
162
159
  }
163
160
  /* Webkit browsers reset margin */
164
- button,
165
- input,
166
- select,
161
+ button,
162
+ input,
163
+ select,
167
164
  textarea {
168
165
  margin: 0;
169
166
  }
@@ -172,11 +169,12 @@ textarea {
172
169
  }
173
170
  /* Normalize buttons in IE */
174
171
  button {
175
- width: auto; overflow: visible;
172
+ width: auto;
173
+ overflow: visible;
176
174
  }
177
175
  /* Hand cursor on clickable controls */
178
- input[type=button],
179
- input[type=submit],
176
+ input[type=button],
177
+ input[type=submit],
180
178
  button {
181
179
  cursor: pointer;
182
180
  }
@@ -188,9 +186,9 @@ input[type="checkbox"]
188
186
  }
189
187
  /* Horizontal rule reset */
190
188
  hr {
191
- display: block;
192
- height: 1px;
193
- border: 0;
189
+ display: block;
190
+ height: 1px;
191
+ border: 0;
194
192
  border-top: 1px solid #ddd;
195
193
  }
196
194
  /* Clearfix */
@@ -1,88 +1,67 @@
1
+
1
2
  .btn {
2
- position: relative;
3
- cursor: pointer;
4
- outline: none;
5
- display: inline-block;
6
- text-align: center;
7
3
  text-decoration: none;
8
- font-family: Arial, Helvetica, sans-serif;
9
- line-height: 1;
10
- font-size: 13px;
11
- font-weight: normal;
12
- padding: 6px 16px;
13
- border-radius: 4px;
14
-
15
- .gradient(#fff, #e1e1e1);
16
- border: 1px solid #dadada;
17
- border-left: 1px solid #d2d2d2;
18
- border-right: 1px solid #d2d2d2;
19
- border-bottom-color: #a9a9a9;
20
- box-shadow: 0 1px 0 rgba(0, 0, 0, .15), inset 0 1px 1px 0 rgba(255, 255, 255, 0.6);
21
- text-shadow: 0 1px 0px rgba(255, 255, 255, 1);
22
- }
23
- .btn, .btn:hover {
24
4
  color: #000;
5
+ 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;
9
+ font-weight: 500;
10
+ 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 );
25
19
  }
26
20
  .btn:hover {
27
- filter: none;
28
- background: none;
29
- background: #eee;
30
- text-shadow: 0 1px 0px rgba(255, 255, 255, .8);
31
- text-decoration: none;
32
- box-shadow: 0 1px 0 rgba(0, 0, 0, .15);
33
- }
34
-
35
-
36
- /* Active */
37
- .btn-big.btn-active, .btn-big.btn-active:hover {
38
- padding: 11px 25px;
39
- }
40
- .btn-active, .btn-active:hover {
41
- box-shadow: 0 2px 4px rgba(0, 0, 0, .4) inset;
42
- color: #555;
43
- border: none;
44
- background: none;
45
- filter: none;
46
- background-color: #ddd;
47
- text-shadow: 0 1px 0px rgba(255, 255, 255, .8);
48
- padding: 7px 17px 8px 17px;
21
+ background: #fff;
22
+ border: 1px solid #ddd;
49
23
  }
50
-
51
-
52
- /* Small */
53
24
  .btn-small {
54
- padding: 4px 12px;
55
- font-size: 11px;
56
- }
57
- .btn-small.btn-active {
58
- padding: 5px 12px;
25
+ font-size: .7em;
59
26
  }
60
-
61
- /* Big */
62
27
  .btn-big {
63
- padding: 10px 24px;
64
- font-size: 20px;
28
+ font-size: 1.2em;
65
29
  }
66
-
67
-
68
- /* Square */
69
- .btn-square {
70
- -moz-border-radius: 0;
71
- -webkit-border-radius: 0;
72
- border-radius: 0;
73
- }
74
-
75
- /* Round */
76
30
  .btn-round {
77
- border-radius: 15px;
78
- border-radius: 0 \0; /* ie9 hack */
31
+ border-radius: 20px;
79
32
  }
80
-
81
- /* Full */
82
33
  .btn-full {
83
34
  width: 100%;
84
35
  }
36
+ .btn-active,
37
+ .btn-active:hover,
38
+ .btn.disabled,
39
+ .btn[disabled]
40
+ .btn-disabled,
41
+ .btn-disabled:hover {
42
+ background: #e3e3e3;
43
+ border: 1px solid #ccc;
44
+ text-shadow: 0 1px 1px #fff;
45
+ }
46
+ .btn-active,
47
+ .btn-active:hover {
48
+ color: #666;
49
+ }
50
+ .btn.disabled,
51
+ .btn[disabled]
52
+ .btn-disabled,
53
+ .btn-disabled:hover {
54
+ color: #999;
55
+ }
85
56
 
57
+ .btn:focus .halflings,
58
+ .btn:hover .halflings {
59
+ color: @colorGrayDark;
60
+ }
61
+
62
+ .btn-active .halflings {
63
+ color: #555;
64
+ }
86
65
 
87
66
  /* Group */
88
67
  .btn-group {
@@ -91,23 +70,26 @@
91
70
  .clearfixing();
92
71
  vertical-align: bottom;
93
72
  }
94
- .btn-group > .btn, .btn-group > input {
73
+ .btn-group > .btn,
74
+ .btn-group > input {
95
75
  float: left;
96
76
  -moz-border-radius: 0;
97
77
  -webkit-border-radius: 0;
98
78
  border-radius: 0;
99
- margin-left: -1px;
79
+ margin-left: -1px;
100
80
  }
101
81
  .btn-group > .btn:first-child {
102
- border-radius: 4px 0 0 4px;
82
+ border-radius: 4px 0 0 4px;
103
83
  }
104
84
  .btn-group > .btn:last-child {
105
85
  border-radius: 0 4px 4px 0;
106
86
  }
107
- .btn-group > .btn.btn-round:first-child, .btn-group > .input-search:first-child {
108
- border-radius: 15px 0 0 15px;
87
+ .btn-group > .btn.btn-round:first-child,
88
+ .btn-group > .input-search:first-child {
89
+ border-radius: 15px 0 0 15px;
109
90
  }
110
- .btn-group > .btn.btn-round:last-child, .btn-group > .input-search:last-child {
91
+ .btn-group > .btn.btn-round:last-child,
92
+ .btn-group > .input-search:last-child {
111
93
  border-radius: 0 15px 15px 0;
112
94
  }
113
95
 
@@ -118,20 +100,6 @@
118
100
  border-radius: 0 4px 4px 0;
119
101
  }
120
102
 
121
-
122
- /* Disabled */
123
- .btn.disabled,
124
- .btn[disabled] {
125
- border: none;
126
- filter: none;
127
- background: none;
128
- background-color: #e9e9e9;
129
- opacity: 0.6;
130
- cursor: default;
131
- box-shadow: 0 1px 0 rgba(0, 0, 0, .6);
132
- }
133
-
134
-
135
103
  /* FF fix */
136
104
  @-moz-document url-prefix("http://") {
137
105
  input[type=submit].btn::-moz-focus-inner, button.btn::-moz-focus-inner { border: 0; padding: 0; }
@@ -0,0 +1,8 @@
1
+ .com { color: #888; }
2
+ .lit { color: #195f91; }
3
+ .pun, .opn, .clo { color: #93a1a1; }
4
+ .fun { color: #005cb9; }
5
+ .str, .atv { color: #8A6343; }
6
+ .kwd, .linenums, .tag { color: #000; }
7
+ .typ, .atn, .dec, .var { color: #666; }
8
+ .pln { color: #5890AD; }
@@ -5,14 +5,14 @@
5
5
  margin-bottom: 2px;
6
6
  }
7
7
  .descr {
8
- color: @colorGrayLight;
9
- font-size: @smallFontSize;
8
+ color: @colorGrayLight;
9
+ font-size: @smallFontSize;
10
10
  line-height: @baseLine/@em;
11
11
  }
12
12
  div.descr {
13
13
  margin: 4px 0;
14
14
  }
15
- .columnar div.descr {
15
+ .columnar div.descr {
16
16
  margin-bottom: 10px;
17
17
  }
18
18
  .forms ul {
@@ -34,13 +34,13 @@ fieldset.liner {
34
34
  fieldset.liner legend {
35
35
  padding: 0;
36
36
  width: 100%;
37
- padding-bottom: 12px;
37
+ padding-bottom: 12px;
38
38
  }
39
39
  fieldset.liner legend span {
40
40
  padding: 0;
41
41
  padding-bottom: 8px;
42
42
  border-bottom: 1px solid #eee;
43
- display: block;
43
+ display: block;
44
44
  }
45
45
  /* multicolumn */
46
46
  .forms ul.multicolumn {
@@ -61,7 +61,7 @@ fieldset.liner legend span {
61
61
  }
62
62
  .forms ul.multicolumn li.width-33 {
63
63
  width: 31%;
64
- margin-right: 2%;
64
+ margin-right: 2%;
65
65
  }
66
66
  /* columnar */
67
67
  .forms.columnar legend {
@@ -73,7 +73,8 @@ fieldset.liner legend span {
73
73
  text-align: right;
74
74
  margin-right: @columnarMargin;
75
75
  }
76
- .forms.columnar .push, .forms.columnar div.descr {
76
+ .forms.columnar .push,
77
+ .forms.columnar div.descr {
77
78
  margin-left: @columnarWidth + @columnarMargin;
78
79
  }
79
80
  .forms.columnar li fieldset label {
@@ -140,7 +141,9 @@ input[type="checkbox"] {
140
141
 
141
142
  input[type="text"],
142
143
  input[type="password"],
143
- input[type="email"],
144
+ input[type="email"],
145
+ input[type="url"],
146
+ input[type="phone"],
144
147
  textarea {
145
148
  position: relative;
146
149
  z-index: 2;
@@ -151,51 +154,61 @@ textarea {
151
154
  padding: 1px 2px;
152
155
  background-color: white;
153
156
  color: #333;
154
- font-size: 13px;
157
+ font-size: .95em;
155
158
  line-height: 1;
156
159
  border-radius: 1px;
157
- box-shadow: 0 1px 2px rgba(0, 0, 0, .2) inset;
158
- .transition(border .3s ease-in);
160
+ box-shadow: 0 1px 2px rgba(0, 0, 0, .1) inset;
161
+ .transition(border ease .5s);
159
162
  }
160
163
  textarea {
161
164
  line-height: 1.4em;
162
165
  }
163
166
 
164
167
  /* Errors and Success */
165
- .error,
166
- .success {
167
- margin-left: 5px;
168
- font-weight: normal;
169
- font-size: @smallFontSize;
170
- }
171
- input.input-error, textarea.input-error, select.input-error, .input-error {
168
+ .error,
169
+ .success {
170
+ margin-left: 5px;
171
+ font-weight: normal;
172
+ font-size: @smallFontSize;
173
+ }
174
+ input.input-error,
175
+ textarea.input-error,
176
+ select.input-error,
177
+ .input-error {
172
178
  border-color: #da3e5a;
173
- box-shadow: 0 0 0 2px rgba(218, 62, 90, .3),0 1px 2px rgba(0, 0, 0, .2) inset;
174
-
179
+ box-shadow: 0 0 0 2px rgba(218, 62, 90, .3),0 1px 2px rgba(0, 0, 0, .2) inset;
175
180
  }
176
- input.input-success, textarea.input-success, select.input-success, .input-success {
181
+ input.input-success,
182
+ textarea.input-success,
183
+ select.input-success,
184
+ .input-success {
177
185
  border-color: #18a011 ;
178
- box-shadow: 0 0 0 2px rgba(24, 160, 17, .3),0 1px 2px rgba(0, 0, 0, .2) inset;
186
+ box-shadow: 0 0 0 2px rgba(24, 160, 17, .3),0 1px 2px rgba(0, 0, 0, .2) inset;
179
187
  }
180
- input.input-gray, textarea.input-gray, select.input-gray, .input-gray {
188
+ input.input-gray,
189
+ textarea.input-gray,
190
+ select.input-gray,
191
+ .input-gray {
181
192
  border-color: #ccc;
182
- box-shadow: 0 0 0 2px rgba(204, 204, 204, .3),0 1px 2px rgba(0, 0, 0, .2) inset;
193
+ box-shadow: 0 0 0 2px rgba(204, 204, 204, .3),0 1px 2px rgba(0, 0, 0, .2) inset;
183
194
  }
184
195
 
185
- input:focus, textarea:focus {
196
+ input:focus,
197
+ textarea:focus {
186
198
  outline: none;
187
199
  border-color: #5ca9e4;
188
- box-shadow: 0 0 0 2px rgba(70, 161, 231, .3), 0 1px 2px rgba(0, 0, 0, .2) inset;
189
-
190
-
200
+ box-shadow: 0 0 0 2px rgba(70, 161, 231, .3), 0 1px 2px rgba(0, 0, 0, .2) inset;
191
201
  }
192
- input.input-search, input[type="search"] {
202
+
203
+ input.input-search,
204
+ input[type="search"] {
193
205
  padding-right: 10px;
194
206
  padding-left: 10px;
195
207
  margin-bottom: 0;
196
208
  border-radius: 15px;
197
209
  }
198
- .input-append, .input-prepend {
210
+ .input-append,
211
+ .input-prepend {
199
212
  display: inline-block;
200
213
  background-color: #eee;
201
214
  height: 23px;
@@ -203,7 +216,7 @@ input.input-search, input[type="search"] {
203
216
  margin: 0;
204
217
  padding: 1px 8px;
205
218
  color: #333;
206
- font-size: 14px;
219
+ font-size: 1em;
207
220
  line-height: 23px;
208
221
  }
209
222
  .input-prepend {
@@ -216,4 +229,19 @@ input.input-search, input[type="search"] {
216
229
  margin-left: -1px;
217
230
  }
218
231
 
219
-
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
+ }
@@ -7,14 +7,12 @@
7
7
  .image-right {
8
8
  float: right;
9
9
  margin: 0 0 @floatingMargin @floatingMargin;
10
- }
11
- .image-left img, .image-right img {
10
+ }
11
+ .image-left img,
12
+ .image-right img {
12
13
  position: relative;
13
14
  top: .4em;
14
15
  }
15
- p.lead {
16
- font-size: @bigFontSize;
17
- }
18
16
  .supersmall {
19
17
  font-size: @superSmallFontSize;
20
18
  }
@@ -22,11 +20,11 @@ p.lead {
22
20
  font-size: @smallFontSize;
23
21
  }
24
22
  .big {
25
- font-size: @bigFontSize;
23
+ font-size: @bigFontSize;
26
24
  }
27
25
  input.big {
28
- padding: 2px 0;
29
- font-size: @bigFontSize;
26
+ padding: 2px 0;
27
+ font-size: @bigFontSize;
30
28
  }
31
29
  .text-centered {
32
30
  text-align: center;
@@ -43,6 +41,9 @@ input.big {
43
41
  .last {
44
42
  margin-right: 0 !important;
45
43
  }
44
+ .pause {
45
+ margin-bottom: 0.75em !important;
46
+ }
46
47
  .end {
47
48
  margin-bottom: 0 !important;
48
49
  }
@@ -68,22 +69,22 @@ input.big {
68
69
 
69
70
  /* Width */
70
71
  .width-33 {
71
- width: 33%;
72
+ width: 33%;
72
73
  }
73
74
  .width-50 {
74
- width: 50%;
75
+ width: 50%;
75
76
  }
76
77
  .width-100 {
77
- width: 100%;
78
+ width: 100%;
78
79
  }
79
80
  input.width-100 {
80
- width: 98.6%;
81
+ width: 98.6%;
81
82
  }
82
83
  textarea.width-100 {
83
- width: 99.4%;
84
+ width: 99.4%;
84
85
  }
85
86
  select.width-100 {
86
- width: 99.4%;
87
+ width: 99.4%;
87
88
  }
88
89
 
89
90
  /* Colors */
@@ -102,18 +103,26 @@ select.width-100 {
102
103
  .white {
103
104
  color: @colorWhite;
104
105
  }
105
- .red, .error {
106
+ .red,
107
+ .error {
106
108
  color: @colorRed;
107
109
  }
108
- .green, .success {
110
+ .green,
111
+ .success {
109
112
  color: @colorGreen;
110
113
  }
111
114
 
112
115
  /* Link Colors Hover */
116
+ a.white:focus,
113
117
  a.white:hover {
114
- color: darken(@colorWhite, 15%);
115
- color: rgba(255, 255, 255, .8);
116
- }
117
- a.green:hover, a.red:hover, a.error:hover {
118
+ color: darken(@colorWhite, 25%);
119
+ color: rgba(255, 255, 255, .6);
120
+ }
121
+ a.green:focus,
122
+ a.green:hover,
123
+ a.red:focus,
124
+ a.red:hover,
125
+ a.error:focus,
126
+ a.error:hover {
118
127
  color: @colorBlack;
119
128
  }
@@ -7,7 +7,8 @@
7
7
  .container.row {
8
8
  margin-bottom: 0;
9
9
  }
10
- .container:after, .row:after {
10
+ .container:after,
11
+ .row:after {
11
12
  content: ".";
12
13
  display: block;
13
14
  height: 0;
@@ -15,40 +16,40 @@
15
16
  visibility: hidden;
16
17
  }
17
18
 
18
- .half,
19
- .third,
20
- .quarter,
21
- .fifth,
22
- .sixth,
23
- .twothird,
24
- .twofifth,
25
- .threefifth,
26
- .fourfifth,
19
+ .half,
20
+ .third,
21
+ .quarter,
22
+ .fifth,
23
+ .sixth,
24
+ .twothird,
25
+ .twofifth,
26
+ .threefifth,
27
+ .fourfifth,
27
28
  .fivesixth,
28
29
  .threequarter {
29
30
  margin-left: @gridGutterWidth/(@gridWidth/100)*1%;
30
31
  float: left;
31
32
  min-height: 1px;
32
33
  }
33
- .half:first-child,
34
- .third:first-child,
35
- .quarter:first-child,
36
- .fifth:first-child,
37
- .sixth:first-child,
38
- .twothird:first-child,
39
- .twofifth:first-child,
40
- .threefifth:first-child,
41
- .fourfifth:first-child,
34
+ .half:first-child,
35
+ .third:first-child,
36
+ .quarter:first-child,
37
+ .fifth:first-child,
38
+ .sixth:first-child,
39
+ .twothird:first-child,
40
+ .twofifth:first-child,
41
+ .threefifth:first-child,
42
+ .fourfifth:first-child,
42
43
  .fivesixth:first-child,
43
44
  .threequarter:first-child {
44
- margin-left: 0;
45
+ margin-left: 0;
45
46
  }
46
47
 
47
48
  .sixth { .column(6); }
48
- .fifth { .column(5); }
49
- .quarter { .column(4); }
50
- .third { .column(3); }
51
- .half { .column(2); }
49
+ .fifth { .column(5); }
50
+ .quarter { .column(4); }
51
+ .third { .column(3); }
52
+ .half { .column(2); }
52
53
 
53
54
  .threequarter { .columns(3, 4); }
54
55
  .twothird { .columns(2, 3); }
@@ -65,7 +66,7 @@
65
66
  .push-twothird,
66
67
  .push-fifth,
67
68
  .push-twofifth,
68
- .push-threefifth,
69
+ .push-threefifth,
69
70
  .push-fourfifth,
70
71
  .push-sixth,
71
72
  .push-fivesixth {
@@ -87,19 +88,19 @@
87
88
  .push-fivesixth { .columns-push(5, 6); }
88
89
 
89
90
 
90
- .split .half,
91
- .split .third,
92
- .split .quarter,
93
- .split .fifth,
94
- .split .sixth,
95
- .split .twothird,
96
- .split .twofifth,
97
- .split .threefifth,
98
- .split .fourfifth,
91
+ .split .half,
92
+ .split .third,
93
+ .split .quarter,
94
+ .split .fifth,
95
+ .split .sixth,
96
+ .split .twothird,
97
+ .split .twofifth,
98
+ .split .threefifth,
99
+ .split .fourfifth,
99
100
  .split .fivesixth,
100
101
  .split .threequarter {
101
- margin-left: 0;
102
-
102
+ margin-left: 0;
103
+
103
104
  }
104
105
 
105
106
  .split .half { width: 50%; }
@@ -143,7 +144,7 @@
143
144
  float: right;
144
145
  }
145
146
 
146
- .row .centered {
147
- float: none;
148
- margin: 0 auto;
147
+ .row .centered {
148
+ float: none;
149
+ margin: 0 auto;
149
150
  }