kube-rails 0.0.5 → 0.0.6

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,234 @@
1
+ @import "kube.css";
2
+ @import "mixins.less";
3
+
4
+ /* =Selection
5
+ -----------------------------------------------------------------------------*/
6
+ .selection(255,255,158);
7
+
8
+
9
+ /* =Layout
10
+ -----------------------------------------------------------------------------*/
11
+ body {
12
+ font-family: 'Lato', sans-serif;
13
+ border-top: 5px solid #222;
14
+ }
15
+ h1,
16
+ h2,
17
+ h3,
18
+ h4,
19
+ h5,
20
+ h6 {
21
+ font-family: 'Lato', sans-serif;
22
+ }
23
+ #page {
24
+ width: 82%;
25
+ padding: 0 10px 63px 10px;
26
+ margin: 16px auto 0 auto;
27
+ }
28
+ #path {
29
+ font-size: 12px;
30
+ color: #888;
31
+ }
32
+ #path span {
33
+ margin: 0 4px;
34
+ }
35
+ #path a {
36
+ color: #666;
37
+ background-color: #f2f2f2;
38
+ display: inline-block;
39
+ padding: 3px 10px 2px 10px;
40
+ border-radius: 15px;
41
+ text-transform: uppercase;
42
+ font-size: 10px;
43
+ font-weight: bold;
44
+ text-decoration: none;
45
+ }
46
+ #path a:hover {
47
+ background-color: #ef6465;
48
+ color: #fff;
49
+ }
50
+ #footer {
51
+ margin: 3em 0;
52
+ padding-bottom: 63px;
53
+ text-align: center;
54
+ }
55
+ #header {
56
+ padding: 88px 0 88px 0;
57
+ }
58
+ #header h1 {
59
+ text-align: center;
60
+ font-weight: normal;
61
+ margin: 0;
62
+ }
63
+ #preview li a {
64
+ padding-top: 9px;
65
+ padding-bottom: 8px;
66
+ }
67
+
68
+ /* =Demo
69
+ -----------------------------------------------------------------------------*/
70
+ .preview {
71
+ padding: 2em 2em 1.5em 2em;
72
+ border: 1px dashed #ddd;
73
+ margin-bottom: 1.5em;
74
+ }
75
+ .swatch {
76
+ display: inline-block;
77
+ border-radius: 3px;
78
+ width: 16px;
79
+ height: 16px;
80
+ line-height: 18px;
81
+ }
82
+ .box-demo {
83
+ padding: 5px 0;
84
+ }
85
+
86
+ h4.head-toc {
87
+ margin-top: 40px;
88
+ padding-top: 20px;
89
+ margin-bottom: 1em;
90
+ }
91
+ h4.head-toc-start {
92
+ margin-top: 0;
93
+ padding-top: 0;
94
+ }
95
+ #nav-toc {
96
+ background-color: #222;
97
+ padding: 1.5em 2em;
98
+ }
99
+ #nav-toc,
100
+ #nav-toc a {
101
+ color: #ccc;
102
+ }
103
+ #nav-toc a:hover {
104
+ color: #fff;
105
+ }
106
+ #nav-toc li {
107
+ border-top: 1px solid #333;
108
+ border-bottom-color: #000;
109
+ }
110
+ #nav-toc li:first-child {
111
+ border-top: none;
112
+ }
113
+ #nav-toc li:last-child {
114
+ border-bottom: none;
115
+ }
116
+
117
+ .page-break {
118
+ margin: 3em 0;
119
+ border-top: 2px dashed #eee;
120
+ }
121
+
122
+ .link-show-code {
123
+ background-color: #eee;
124
+ border-radius: 10px;
125
+ color: #555;
126
+ font-size: 10px;
127
+ display: inline-block;
128
+ line-height: 1;
129
+ padding: 5px 11px;
130
+ text-decoration: none;
131
+ }
132
+ .link-show-code-active {
133
+ background-color: #444;
134
+ color: #fff;
135
+ padding: 5px 14px;
136
+ }
137
+ .link-show-code:hover {
138
+ background-color: #ef6465;
139
+ color: #fff;
140
+ }
141
+
142
+
143
+ .bg-lightblue {background-color:#b0c4de}
144
+ .bg-blue {background-color:#7e9ec7}
145
+
146
+
147
+ .head1,
148
+ .head2,
149
+ .head3 {
150
+ font-weight: normal;
151
+ text-align: center;
152
+ }
153
+ .head1 {
154
+ padding: 3em 0 4em 0;
155
+ margin: 0;
156
+ }
157
+ .head2 {
158
+ margin: 2em 0 1.5em 0;
159
+ }
160
+ .head3 {
161
+ margin: 2em 0 1em 0;
162
+ }
163
+ .cut {
164
+ margin: 6em 0;
165
+ color: #aaa;
166
+ text-align: center;
167
+ }
168
+ .griddemo .units-row-end,
169
+ .griddemo .units-row {
170
+ background-color: #f0f0f0;
171
+ }
172
+ .griddemo .unit-100,
173
+ .griddemo .unit-80,
174
+ .griddemo .unit-75,
175
+ .griddemo .unit-70,
176
+ .griddemo .unit-66,
177
+ .griddemo .unit-60,
178
+ .griddemo .unit-50,
179
+ .griddemo .unit-40,
180
+ .griddemo .unit-33,
181
+ .griddemo .unit-30,
182
+ .griddemo .unit-25,
183
+ .griddemo .unit-20,
184
+ .griddemo .blocks-2 > li,
185
+ .griddemo .blocks-3 > li,
186
+ .griddemo .blocks-4 > li,
187
+ .griddemo .blocks-5 > li,
188
+ .griddemo .blocks-6 > li {
189
+ text-align: center;
190
+ font-size: 10px;
191
+ background-color: #7e9ec7;
192
+ padding: 15px 0;
193
+ color: rgba(255, 255, 255, 0.85);
194
+ line-height: 1;
195
+ }
196
+ .griddemo .unit-demo-zero {
197
+ padding: 0;
198
+ }
199
+ .griddemo .units-demo-light .unit-100,
200
+ .griddemo .units-demo-light .unit-80,
201
+ .griddemo .units-demo-light .unit-75,
202
+ .griddemo .units-demo-light .unit-70,
203
+ .griddemo .units-demo-light .unit-66,
204
+ .griddemo .units-demo-light .unit-60,
205
+ .griddemo .units-demo-light .unit-50,
206
+ .griddemo .units-demo-light .unit-40,
207
+ .griddemo .units-demo-light .unit-33,
208
+ .griddemo .units-demo-light .unit-30,
209
+ .griddemo .units-demo-light .unit-25,
210
+ .griddemo .units-demo-light .unit-20 {
211
+ background-color: #b0c4de;
212
+ }
213
+
214
+
215
+ /* =Tablet (Portrait)
216
+ -----------------------------------------------------------------------------*/
217
+ @media only screen and (min-width: 768px) and (max-width: 959px) {
218
+ #page { width: 768px; }
219
+ }
220
+
221
+
222
+ /* =Mobile (Portrait)
223
+ -----------------------------------------------------------------------------*/
224
+ @media only screen and (max-width: 767px) {
225
+ #page { width: 300px; }
226
+ }
227
+
228
+
229
+ /* =Mobile (Landscape)
230
+ -----------------------------------------------------------------------------*/
231
+ @media only screen and (min-width: 480px) and (max-width: 767px) {
232
+ #page { width: 420px; }
233
+ }
234
+
@@ -0,0 +1,34 @@
1
+ .message {
2
+ position: relative;
3
+ padding: 9px 13px;
4
+ border: 1px solid lighten(#f3c835, 15);
5
+ border-radius: 5px;
6
+ margin-bottom: @baseLine/@em;
7
+ color: darken(#f3c835, 25);
8
+ background-color: lighten(#f3c835, 36);
9
+ }
10
+ .message-error {
11
+ color: darken(#ef6465, 25);
12
+ border-color: lighten(#ef6465, 20);
13
+ background-color: lighten(#ef6465, 30);
14
+ }
15
+ .message-success {
16
+ color: darken(#90af45, 20);
17
+ border-color: lighten(#90af45, 30);
18
+ background-color: lighten(#90af45, 45);
19
+ }
20
+ .message-info {
21
+ color: darken(#1c7ab4, 15);
22
+ border-color: lighten(#1c7ab4, 42);
23
+ background-color: lighten(#1c7ab4, 52);
24
+ }
25
+ .message header {
26
+ font-weight: bold;
27
+ font-size: 1.2em;
28
+ }
29
+ .message .close {
30
+ cursor: pointer;
31
+ position: absolute;
32
+ right: 3px;
33
+ top: 6px;
34
+ }
@@ -9,12 +9,62 @@
9
9
  filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down
10
10
  }
11
11
 
12
+ .selection(@r, @g, @b) {
13
+ ::selection {
14
+ background: rgb(@r, @g, @b);
15
+ }
16
+ ::-moz-selection {
17
+ background: rgb(@r, @g, @b);
18
+ }
19
+ img::selection {
20
+ background: transparent;
21
+ }
22
+ img::-moz-selection {
23
+ background: transparent;
24
+ }
25
+ }
26
+
27
+ .box-sizing(@box-model) {
28
+ -webkit-box-sizing: @box-model;
29
+ -moz-box-sizing: @box-model;
30
+ box-sizing: @box-model;
31
+ }
32
+
33
+ .border-top-radius(@radius) {
34
+ border-top-right-radius: @radius;
35
+ border-top-left-radius: @radius;
36
+ }
37
+ .border-right-radius(@radius) {
38
+ border-bottom-right-radius: @radius;
39
+ border-top-right-radius: @radius;
40
+ }
41
+ .border-bottom-radius(@radius) {
42
+ border-bottom-right-radius: @radius;
43
+ border-bottom-left-radius: @radius;
44
+ }
45
+ .border-left-radius(@radius) {
46
+ border-bottom-left-radius: @radius;
47
+ border-top-left-radius: @radius;
48
+ }
49
+
50
+
12
51
  .transition(@transition) {
13
- -webkit-transition: @transition;
14
- -moz-transition: @transition;
15
- -ms-transition: @transition;
16
- -o-transition: @transition;
17
- transition: @transition;
52
+ -webkit-transition: @transition;
53
+ -moz-transition: @transition;
54
+ -o-transition: @transition;
55
+ transition: @transition;
56
+ }
57
+ .transition-delay(@transition-delay) {
58
+ -webkit-transition-delay: @transition-delay;
59
+ -moz-transition-delay: @transition-delay;
60
+ -o-transition-delay: @transition-delay;
61
+ transition-delay: @transition-delay;
62
+ }
63
+ .transition-duration(@transition-duration) {
64
+ -webkit-transition-duration: @transition-duration;
65
+ -moz-transition-duration: @transition-duration;
66
+ -o-transition-duration: @transition-duration;
67
+ transition-duration: @transition-duration;
18
68
  }
19
69
 
20
70
  .opacity(@opacity: 100) {
@@ -23,6 +73,13 @@
23
73
  opacity: @opacity / 100;
24
74
  }
25
75
 
76
+ .placeholder(@color: @input-color-placeholder) {
77
+ &:-moz-placeholder { color: @color; } // Firefox 4-18
78
+ &::-moz-placeholder { color: @color; } // Firefox 19+
79
+ &:-ms-input-placeholder { color: @color; } // Internet Explorer 10+
80
+ &::-webkit-input-placeholder { color: @color; padding: 2px; } // Safari and Chrome
81
+ }
82
+
26
83
  .clearfixing() {
27
84
  &:after {
28
85
  content: ".";
@@ -33,12 +90,29 @@
33
90
  }
34
91
  }
35
92
 
93
+ // Colors
94
+ @black-10: darken(#fff, 10%);
95
+ @black-20: darken(#fff, 20%);
96
+ @black-30: darken(#fff, 30%);
97
+ @black-40: darken(#fff, 40%);
98
+ @black-50: darken(#fff, 50%);
99
+ @black-60: darken(#fff, 60%);
100
+ @black-70: darken(#fff, 70%);
101
+ @black-80: darken(#fff, 80%);
102
+ @black-90: darken(#fff, 90%);
103
+
36
104
  // Retina
37
- .at2x(@path, @w: auto, @h: auto) {
105
+ .retina-image(@path, @w: auto, @h: auto) {
38
106
  background-image: url(@path);
39
107
  @at2x_path: ~`"@{path}".split('.').slice(0, "@{path}".split('.').length - 1).join(".") + "@2x" + "." + "@{path}".split('.')["@{path}".split('.').length - 1]`;
40
108
 
41
- @media all and (-webkit-min-device-pixel-ratio : 1.5) {
109
+ @media
110
+ only screen and (-webkit-min-device-pixel-ratio: 2),
111
+ only screen and ( min--moz-device-pixel-ratio: 2),
112
+ only screen and ( -o-min-device-pixel-ratio: 2/1),
113
+ only screen and ( min-device-pixel-ratio: 2),
114
+ only screen and ( min-resolution: 192dpi),
115
+ only screen and ( min-resolution: 2dppx) {
42
116
  background-image: url(@at2x_path);
43
117
  background-size: @w @h;
44
118
  }
@@ -27,7 +27,6 @@
27
27
  }
28
28
  .nav-h ul li a,
29
29
  .nav-g ul li a {
30
- color: @colorBlack;
31
30
  text-decoration: none;
32
31
  }
33
32
  .nav-h ul li a:hover,
@@ -68,7 +67,6 @@
68
67
  padding: 5px 0;
69
68
  }
70
69
  .nav-v ul li a {
71
- color: @colorBlack;
72
70
  text-decoration: none;
73
71
  }
74
72
  .nav-v ul li a:hover {
@@ -79,6 +77,62 @@
79
77
  color: @colorGrayLight;
80
78
  }
81
79
 
80
+ /* Stacked */
81
+ .nav-stacked ul {
82
+ border: 1px solid #eee;
83
+ border-bottom: 0;
84
+ }
85
+ .nav-stacked ul li a,
86
+ .nav-stacked ul li span {
87
+ padding: 5px 10px;
88
+ }
89
+ .nav-stacked ul li a:hover {
90
+ background-color: #f5f5f5;
91
+ }
92
+
93
+ /* Stats */
94
+ .nav-stats li {
95
+ position: relative;
96
+ }
97
+ .nav-stats li a,
98
+ .nav-stats li span {
99
+ padding-right: 50px;
100
+ }
101
+ .nav-stats .label,
102
+ .nav-stats .label-badge {
103
+ position: absolute;
104
+ top: 50%;
105
+ margin-top: -8px;
106
+ right: 0;
107
+ }
108
+ .nav-stats.nav-stacked .label,
109
+ .nav-stats.nav-stacked .label-badge {
110
+ right: 4px;
111
+ }
112
+ .nav-stats .label.label-data,
113
+ .nav-stacked .label-data {
114
+ margin-top: -6px;
115
+ right: 6px;
116
+ }
117
+
118
+ .nav-v h1,
119
+ .nav-v h2,
120
+ .nav-v h3,
121
+ .nav-v h4,
122
+ .nav-v h5,
123
+ .nav-v h6 {
124
+ margin-top: 1.5em;
125
+ margin-bottom: 3px;
126
+ }
127
+ .nav-v h1:first-child,
128
+ .nav-v h2:first-child,
129
+ .nav-v h3:first-child,
130
+ .nav-v h4:first-child,
131
+ .nav-v h5:first-child,
132
+ .nav-v h6:first-child {
133
+ margin-top: 0;
134
+ }
135
+
82
136
  /* Breadcrumbs */
83
137
  .breadcrumbs {
84
138
  margin-bottom: @baseLine/@em;
@@ -93,22 +147,26 @@
93
147
  }
94
148
  .breadcrumbs ul li {
95
149
  float: left;
96
- margin-right: .5em;
150
+ margin-right: 3px;
97
151
  }
98
152
  .breadcrumbs li + li:before {
99
153
  content: " > ";
100
- color: #999;
154
+ color: #aaa;
101
155
  font-size: 12px;
102
- margin-right: .5em;
156
+ margin: 0 3px;
157
+ position: relative;
158
+ top: -1px;
103
159
  }
104
160
  .breadcrumbs-sections li + li:before {
105
161
  content: " | ";
162
+ top: 0;
106
163
  }
107
164
  .breadcrumbs-path li + li:before {
108
165
  content: " / ";
166
+ top: 0;
109
167
  }
110
168
  .breadcrumbs ul li a {
111
- color: #666;
169
+ color: @colorBlack;
112
170
  text-decoration: none;
113
171
  }
114
172
  .breadcrumbs ul li a.active {
@@ -141,7 +199,7 @@
141
199
  padding: 8px 12px 9px 12px;
142
200
  }
143
201
  .nav-tabs ul li a {
144
- color: @colorGray;
202
+ color: @colorGrayLight;
145
203
  text-decoration: none;
146
204
  }
147
205
  .nav-tabs ul li a:focus,
@@ -164,6 +222,22 @@
164
222
  cursor: default;
165
223
  }
166
224
 
225
+ /* Vertical tabs */
226
+ .nav-tabs-v {
227
+ border: none;
228
+ border-right: 1px solid #e3e3e3;
229
+ }
230
+ .nav-tabs-v ul li {
231
+ float: none;
232
+ }
233
+ .nav-tabs-v ul li span {
234
+ margin-top: 0;
235
+ bottom: 0;
236
+ margin-right: -3px;
237
+ border: 1px solid #ddd;
238
+ border-right: 1px solid #fff;
239
+ }
240
+
167
241
  /* Pills */
168
242
  .nav-pills {
169
243
  margin-bottom: @baseLine/@em - .5em;
@@ -182,11 +256,12 @@
182
256
  .nav-pills ul li a,
183
257
  .nav-pills ul li span {
184
258
  display: block;
185
- padding: 6px 11px;
259
+ padding: 6px 15px;
186
260
  line-height: 1;
261
+ border-radius: 15px;
187
262
  }
188
263
  .nav-pills ul li a {
189
- color: @colorBlack;
264
+ color: @colorGray;
190
265
  text-decoration: none;
191
266
  background-color: #f3f4f5;
192
267
  }
@@ -197,7 +272,8 @@
197
272
  .nav-pills ul li .active,
198
273
  .nav-pills ul li .active:hover,
199
274
  .nav-pills ul li span {
200
- padding: 5px 10px;
275
+ color: @colorGray;
276
+ padding: 5px 14px;
201
277
  border: 1px solid #ddd;
202
278
  background: none;
203
279
  }
@@ -211,27 +287,52 @@
211
287
  -----------------------------------------------------------------------------*/
212
288
  .pagination {
213
289
  position: relative;
214
- left: -7px;
290
+ left: -9px;
215
291
  margin-left: 0;
216
292
  list-style: none;
217
293
  .clearfixing();
218
294
  }
219
295
  .pagination li {
220
296
  float: left;
221
- margin-right: .5em;
297
+ margin-right: 2px;
222
298
  }
223
299
  .pagination li a,
224
300
  .pagination li span {
225
301
  display: block;
226
- padding: 4px 7px;
302
+ padding: 7px 9px;
227
303
  line-height: 1;
304
+ border-radius: 2em;
228
305
  color: #000;
229
306
  text-decoration: none;
230
307
  }
231
- .pagination li span {
308
+ .pagination span {
232
309
  border: 1px solid #ddd;
233
310
  }
234
311
  .pagination li a:focus,
235
312
  .pagination li a:hover {
236
313
  text-decoration: underline;
314
+ background-color: #333;
315
+ color: @colorWhite;
316
+ }
317
+
318
+ .pagination li.pagination-older {
319
+ margin-left: 7px;
320
+ }
321
+ .pagination li.pagination-older a,
322
+ .pagination li.pagination-newest a,
323
+ .pagination li.pagination-older span,
324
+ .pagination li.pagination-newest span {
325
+ padding: 5px 15px;
326
+ border-radius: 2em;
327
+ border: 1px solid #ddd;
328
+ }
329
+ .pagination li.pagination-older span,
330
+ .pagination li.pagination-newest span {
331
+ border-color: #eee;
332
+ color: #999;
333
+ }
334
+ .pagination li.pagination-pull {
335
+ float: right;
336
+ margin-right: -7px;
337
+ margin-left: .5em;
237
338
  }