kube-rails 0.3.1 → 0.4.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,45 @@
1
+ /* =Pagination
2
+ -----------------------------------------------------------------------------*/
3
+ .pagination {
4
+ list-style: none;
5
+ margin: 0;
6
+ margin-left: 2px;
7
+ margin-bottom: @base-line;
8
+ font-size: @font-size-tools;
9
+ .clearfix;
10
+ & li {
11
+ float: left;
12
+ }
13
+ & a,
14
+ & span {
15
+ padding: 4px 8px;
16
+ line-height: @base-line;
17
+ margin-right: 2px;
18
+ border-radius: 2px;
19
+ color: #000;
20
+ text-decoration: none;
21
+ }
22
+ & span,
23
+ & a.active,
24
+ & a.active:hover {
25
+ color: rgba(0, 0, 0, .6);
26
+ background-color: rgba(0, 0, 0, .1);
27
+ cursor: text;
28
+ }
29
+ & a:focus,
30
+ & a:hover {
31
+ .transition();
32
+ text-decoration: none;
33
+ background-color: rgba(0, 0, 0, .1);
34
+ color: rgba(0, 0, 0, .6);
35
+ }
36
+ &.centered {
37
+
38
+ & li {
39
+ float: none;
40
+ display: inline-block;
41
+ }
42
+ text-align: center;
43
+ }
44
+
45
+ }
@@ -0,0 +1,158 @@
1
+ @import "mixins.less";
2
+
3
+ /* =Reset
4
+ -----------------------------------------------------------------------------*/
5
+ html {
6
+ box-sizing: border-box;
7
+ }
8
+ *,
9
+ *:before,
10
+ *:after {
11
+ box-sizing: inherit;
12
+ }
13
+ img {
14
+ box-sizing: content-box;
15
+ }
16
+ * {
17
+ margin: 0;
18
+ padding: 0;
19
+ border: 0;
20
+ outline: 0;
21
+ font-size: 100%;
22
+ vertical-align: baseline;
23
+ background: transparent;
24
+ }
25
+ a:active,
26
+ a:hover {
27
+ outline: 0;
28
+ }
29
+ audio:not([controls]) {
30
+ display: none;
31
+ height: 0;
32
+ }
33
+
34
+ // To prevent some browsers from inserting quotes on q and p
35
+ blockquote,
36
+ q {
37
+ quotes: none;
38
+ }
39
+ blockquote p:before,
40
+ blockquote p:after,
41
+ q:before,
42
+ q:after {
43
+ content: '';
44
+ content: none;
45
+ }
46
+
47
+ // Table reset
48
+ table {
49
+ border-collapse: collapse;
50
+ border-spacing: 0;
51
+ }
52
+ caption,
53
+ th,
54
+ td {
55
+ text-align: left;
56
+ vertical-align: top;
57
+ }
58
+ thead th,
59
+ thead td {
60
+ font-weight: bold;
61
+ vertical-align: bottom;
62
+ }
63
+
64
+ // Image inside
65
+ a img,
66
+ th img,
67
+ td img {
68
+ vertical-align: top;
69
+ }
70
+
71
+ button,
72
+ input,
73
+ select,
74
+ textarea {
75
+ margin: 0;
76
+ }
77
+ textarea {
78
+ overflow: auto;
79
+ vertical-align: top;
80
+ resize: vertical;
81
+ }
82
+
83
+ // Normalize buttons in IE
84
+ button {
85
+ width: auto;
86
+ overflow: visible;
87
+ }
88
+
89
+ // Hand cursor on clickable controls
90
+ input[type="reset"],
91
+ input[type="submit"],
92
+ input[type="file"],
93
+ input[type="radio"],
94
+ input[type="checkbox"],
95
+ select,
96
+ button {
97
+ cursor: pointer;
98
+ }
99
+
100
+ button:active,
101
+ button:focus {
102
+ outline: none;
103
+ }
104
+ input::-moz-focus-inner,
105
+ button::-moz-focus-inner {
106
+ border: 0;
107
+ padding: 0;
108
+ }
109
+
110
+ // Trick with vertical align for radio and checkbox
111
+ input[type="radio"],
112
+ input[type="checkbox"] {
113
+ font-size: 110%;
114
+ position: relative;
115
+ margin-right: 3px;
116
+ padding: 0;
117
+ }
118
+
119
+ // Normalize search fields
120
+ input[type="search"] {
121
+ -webkit-appearance: textfield;
122
+ }
123
+ input[type="search"]::-webkit-search-decoration,
124
+ input[type="search"]::-webkit-search-cancel-button {
125
+ -webkit-appearance: none;
126
+ }
127
+
128
+ // Normalize horizontal line
129
+ hr {
130
+ display: block;
131
+ box-sizing: content-box;
132
+ height: 1px;
133
+ border: 0;
134
+ border-top: 1px solid rgba(0, 0, 0, .1);
135
+ }
136
+
137
+ // Responsive media
138
+ img,
139
+ video,
140
+ audio,
141
+ embed,
142
+ object {
143
+ max-width: 100%;
144
+ }
145
+ img,
146
+ video,
147
+ embed,
148
+ object {
149
+ height: auto;
150
+ }
151
+ embed,
152
+ object {
153
+ height: 100%;
154
+ }
155
+ img {
156
+ vertical-align: middle;
157
+ -ms-interpolation-mode: bicubic;
158
+ }
@@ -1,43 +1,131 @@
1
1
  /* =Tables
2
2
  -----------------------------------------------------------------------------*/
3
- table.table-bordered td,
4
- table.table-bordered th {
5
- border: 1px solid #ddd;
6
- }
7
- table.table-simple td,
8
- table.table-simple th {
9
- border: none;
10
- padding-left: 0;
11
- }
12
- table.table-flat td,
13
- table.table-flat th {
14
- border: none;
15
- padding: 0;
3
+ table {
4
+ max-width: 100%;
5
+ width: 100%;
6
+ empty-cells: show;
7
+
8
+ caption {
9
+ text-transform: uppercase;
10
+ padding: 0;
11
+ color: #000;
12
+ font-size: 11px;
13
+ font-weight: bold;
14
+ }
15
+
16
+ th,
17
+ td {
18
+ font-size: @font-size-table;
19
+ border-bottom: 1px solid rgba(0, 0, 0, .04);
20
+ padding: 16px;
21
+ padding-bottom: 15px;
22
+ &:first-child {
23
+ padding-left: 0;
24
+ }
25
+ &:last-child {
26
+ padding-right: 0;
27
+ }
28
+ }
29
+
30
+ tfoot th,
31
+ tfoot td {
32
+ color: rgba(0, 0, 0, .5);
33
+ }
16
34
  }
17
- table.table-striped tbody tr:nth-child(odd) td {
18
- background-color: #f8f8f8;
35
+
36
+ table.table-bordered {
37
+
38
+ margin-top: -1px;
39
+
40
+ & td,
41
+ & th {
42
+ border: 1px solid rgba(0, 0, 0, .03);
43
+ }
44
+ & caption {
45
+ padding-left: 16px;
46
+ }
19
47
  }
20
- table.table-hovered tbody tr:hover td {
21
- background-color: #f4f4f4;
48
+ table.table-bordered,
49
+ table.table-stripped {
50
+ & td,
51
+ & th {
52
+ &:first-child {
53
+ padding-left: 16px;
54
+ }
55
+ &:last-child {
56
+ padding-right: 16px;
57
+ }
58
+ }
22
59
  }
23
-
24
- /* Responsive Tables */
25
- .table-container {
26
- width: 100%;
27
- overflow: auto;
28
- margin-bottom: @baseLineInEms;
29
- & table {
30
- margin-bottom: 0;
60
+ table.table-simple {
61
+ & td,
62
+ & th,
63
+ & caption {
64
+ border: none;
65
+ padding-left: 0;
31
66
  }
32
- &::-webkit-scrollbar {
33
- -webkit-appearance: none;
34
- width: 14px;
35
- height: 14px;
67
+ & td,
68
+ & th {
69
+ padding-bottom: 16px;
70
+ }
71
+ }
72
+ table.table-flat {
73
+ & td,
74
+ & th,
75
+ & caption {
76
+ border: none;
77
+ padding: 0;
36
78
  }
37
- &::-webkit-scrollbar-thumb {
38
- border-radius: 8px;
39
- border: 3px solid #fff;
40
- background-color: rgba(0, 0, 0, .3);
79
+ }
80
+ table.table-stroked {
81
+ & td,
82
+ & th {
83
+ border-bottom: 1px solid rgba(0, 0, 0, .03);
41
84
  }
42
85
  }
86
+ table.table-stripped tbody tr:nth-child(odd) td {
87
+ background: @color-table-stripped;
88
+ }
89
+
90
+ @media (max-width: @breakpoint-small) {
91
+
92
+ table.table-responsive {
93
+
94
+ border: 0;
95
+
96
+ & thead {
97
+ display: none;
98
+ }
99
+ & tr {
100
+ display: block;
101
+ border-bottom: 2px solid rgba(0, 0, 0, .1);
102
+ }
103
+
104
+ & td,
105
+ & td:last-child,
106
+ & td:first-child {
107
+ display: block;
108
+ text-align: right;
109
+ padding: 10px;
110
+ }
111
+
112
+ &.table-flat td {
113
+ padding: 0;
114
+ }
115
+
116
+ &.table-bordered td:last-child,
117
+ & td:last-child {
118
+ border-bottom: 0;
119
+ }
120
+
121
+ & td:before {
122
+ content: attr(data-label);
123
+ float: left;
124
+ text-transform: uppercase;
125
+ font-size: @font-size-small;
126
+ font-weight: bold;
127
+ line-height: 2;
128
+ }
129
+ }
43
130
 
131
+ }
@@ -1,19 +1,29 @@
1
1
  /* =Typography
2
2
  -----------------------------------------------------------------------------*/
3
+ html {
4
+ font-size: 62.5%;
5
+ }
3
6
  body {
4
- background: @backgroundBody;
5
- color: @colorBody;
6
- font-size: @baseFontSize + 0px;
7
- line-height: @baseLineInEms;
8
- font-family: @baseFontFamily;
7
+ font-family: @font-family-base;
8
+ font-size: @font-size / 10 + 0em;
9
+ line-height: @base-line;
10
+ background: @background-body;
11
+ color: @color-body;
9
12
  }
13
+
14
+ /* =Links
15
+ -----------------------------------------------------------------------------*/
10
16
  a {
11
- color: @colorLink;
12
- &:focus,
17
+ color: @color-link;
13
18
  &:hover {
14
- color: @colorLinkHover;
19
+ .transition;
20
+ color: @color-link-hover;
15
21
  }
16
22
  }
23
+
24
+
25
+ /* =Headings
26
+ -----------------------------------------------------------------------------*/
17
27
  .title,
18
28
  h1,
19
29
  h2,
@@ -21,101 +31,87 @@ h3,
21
31
  h4,
22
32
  h5,
23
33
  h6 {
24
- font-family: @headingsFontFamily;
25
34
  font-weight: bold;
26
- color: @colorHeadings;
35
+ color: @color-headings;
27
36
  text-rendering: optimizeLegibility;
28
37
  }
38
+ .title,
39
+ h1 {
40
+ margin-bottom: @margin-half;
41
+ }
42
+ h2,
43
+ h3,
44
+ h4,
45
+ h5,
46
+ h6 {
47
+ margin-bottom: 8px;
48
+ }
49
+ .title,
50
+ h1,
51
+ h2,
52
+ h3,
53
+ h4 {
54
+ margin-left: -1px;
55
+ }
56
+ .title {
57
+ font-size: @font-size-title;
58
+ line-height: 56px;
59
+ }
29
60
  h1 {
30
- font-size: @h1FontSize;
31
- line-height: 1.111em;
32
- margin-bottom: .25em;
61
+ font-size: @font-size-h1;
62
+ line-height: 32px;
33
63
  }
34
64
  h2 {
35
- font-size: @h2FontSize;
36
- line-height: 1.111em;
37
- margin-bottom: .5em;
65
+ font-size: @font-size-h2;
66
+ line-height: 32px;
38
67
  }
39
68
  h3 {
40
- font-size: @h3FontSize;
41
- line-height: 1.333em;
42
- margin-bottom: .5em;
69
+ font-size: @font-size-h3;
70
+ line-height: @base-line;
43
71
  }
44
72
  h4 {
45
- font-size: @h4FontSize;
46
- line-height: 1.5em;
47
- margin-bottom: .333em;
73
+ font-size: @font-size-h4;
74
+ line-height: @base-line;
48
75
  }
49
76
  h5 {
50
- font-size: @h5FontSize;
51
- line-height: @baseLineInEms;
52
- margin-bottom: .25em;
77
+ font-size: @font-size-h5;
78
+ line-height: @base-line;
53
79
  }
54
80
  h6 {
55
- font-size: @h6FontSize;
81
+ font-size: @font-size-h6;
82
+ line-height: @base-line;
56
83
  text-transform: uppercase;
57
- line-height: @baseLineInEms;
58
- margin-bottom: .25em;
59
- }
60
-
61
- /* =Subheading
62
- -----------------------------------------------------------------------------*/
63
- hgroup h1:first-child,
64
- hgroup h2:first-child,
65
- hgroup h3:first-child,
66
- hgroup h4:first-child,
67
- hgroup h5:first-child, {
68
- margin-bottom: 0;
69
- }
70
- h1.subheading,
71
- h2.subheading,
72
- h3.subheading,
73
- h4.subheading,
74
- h5.subheading {
75
- font-weight: 300;
76
- }
77
- h1.subheading {
78
- font-size: @h1SubheadingFontSize;
79
- }
80
- h2.subheading {
81
- font-size: @h2SubheadingFontSize;
82
- }
83
- h3.subheading {
84
- font-size: @h3SubheadingFontSize;
85
- }
86
- h4.subheading {
87
- font-size: @h4SubheadingFontSize;
88
- }
89
- h5.subheading {
90
- font-size: @h5SubheadingFontSize;
91
- }
92
-
93
- /* =Lead
94
- -----------------------------------------------------------------------------*/
95
- .lead {
96
- font-size: @leadFontSize;
97
- font-weight: 300;
98
- line-height: 1.4em;
99
- margin-bottom: .75em;
100
84
  }
101
85
  p,
102
86
  ul,
103
87
  ol,
104
88
  dl,
105
- dd,
106
- dt,
107
89
  blockquote,
108
- td,
109
- th {
110
- line-height: @baseLineInEms;
90
+ hr,
91
+ pre,
92
+ table,
93
+ form,
94
+ figure,
95
+ address {
96
+ + h1,
97
+ + h2,
98
+ + h3,
99
+ + h4,
100
+ + h5,
101
+ + h6 {
102
+ margin-top: @base-line;
103
+ }
111
104
  }
105
+
106
+ /* =Line height and margin
107
+ -----------------------------------------------------------------------------*/
112
108
  ul,
113
109
  ol,
114
110
  ul ul,
115
111
  ol ol,
116
112
  ul ol,
117
113
  ol ul {
118
- margin: 0 0 0 @baseLineInEms;
114
+ margin: 0 0 0 @base-line;
119
115
  }
120
116
  ol ol li {
121
117
  list-style-type: lower-alpha;
@@ -131,48 +127,69 @@ blockquote,
131
127
  hr,
132
128
  pre,
133
129
  table,
134
- form,
135
130
  fieldset,
136
131
  figure,
137
- address {
138
- margin-bottom: @baseLineInEms;
132
+ address,
133
+ output {
134
+ margin-bottom: @margin-half;
135
+ }
136
+
137
+ /* =Lead
138
+ -----------------------------------------------------------------------------*/
139
+ .lead {
140
+ font-size: @font-size-big;
141
+ line-height: @base-line-big;
139
142
  }
143
+
144
+
145
+ /* =Quote
146
+ -----------------------------------------------------------------------------*/
147
+ blockquote {
148
+ font-style: italic;
149
+ font-size: @font-size-big;
150
+ line-height: @base-line-big;
151
+ padding-left: @base-line;
152
+ border-left: 1px solid rgba(0, 0, 0, .2);
153
+ & cite {
154
+ font-size: @font-size-small;
155
+ font-weight: normal;
156
+ line-height: @base-line-small;
157
+ }
158
+ }
159
+
160
+
161
+ /* =Address
162
+ -----------------------------------------------------------------------------*/
140
163
  address {
141
164
  font-style: normal;
142
165
  }
166
+
167
+ /* =Definition list
168
+ -----------------------------------------------------------------------------*/
143
169
  dl dt {
144
- font-weight: 500;
170
+ font-weight: bold;
145
171
  }
146
172
  dd {
147
- margin-left: 1em;
173
+ margin-left: @base-line;
148
174
  }
149
- blockquote {
150
- font-size: @quoteFontSize;
151
- font-style: italic;
152
- position: relative;
153
- padding-left: @baseLineInEms;
154
- margin-left: 0;
155
- border-left: 2px solid #dbdada;
156
- & p {
157
- margin-bottom: .5em;
158
- }
159
- }
160
- blockquote small,
175
+
176
+ /* =Text-level
177
+ -----------------------------------------------------------------------------*/
161
178
  cite {
162
- color: #777;
179
+ color: rgba(0, 0, 0, .5);
163
180
  font-style: italic;
164
181
  }
165
- small,
166
- blockquote cite {
167
- font-size: @smallFontSize;
168
- line-height: 1;
182
+ small {
183
+ font-size: @font-size-small;
184
+ line-height: @base-line-small;
169
185
  }
186
+ s,
170
187
  del {
171
188
  text-decoration: line-through;
172
189
  }
173
190
  abbr[title],
174
191
  dfn[title] {
175
- border-bottom: 1px dotted #000;
192
+ border-bottom: 1px dotted @color-dfn-border;
176
193
  cursor: help;
177
194
  }
178
195
  strong,
@@ -185,140 +202,91 @@ i {
185
202
  }
186
203
  sub,
187
204
  sup {
188
- font-size: @superSmallFontSize;
205
+ font-size: @font-size-smaller;
189
206
  line-height: 0;
190
207
  position: relative;
208
+ margin-left: .2rem;
191
209
  }
192
210
  sup {
193
- top: -0.5em;
211
+ top: -.4rem;
194
212
  }
195
213
  sub {
196
- bottom: -0.25em;
214
+ bottom: -.2rem;
197
215
  }
198
216
  figcaption {
199
- font-size: @smallFontSize;
217
+ margin: .3rem 0;
218
+ font-size: @font-size-small;
200
219
  font-style: italic;
201
220
  }
202
221
  ins,
222
+ u {
223
+ text-decoration: underline;
224
+ }
203
225
  mark {
204
- background-color: @colorYellow;
205
- color: @colorBlack;
226
+ background-color: @color-mark-background;
227
+ color: @color-mark;
206
228
  text-decoration: none;
207
229
  }
230
+ time {
231
+ font-size: @font-size-smaller;
232
+ }
233
+
234
+ /* =Code
235
+ -----------------------------------------------------------------------------*/
208
236
  pre,
209
237
  code,
210
238
  kbd,
211
- samp {
239
+ samp,
240
+ var,
241
+ output {
212
242
  font-size: 90%;
213
- font-family: @codeFontFamily;
243
+ font-style: normal;
244
+ font-family: @font-family-code;
214
245
  }
215
246
  pre {
216
247
  font-size: 90%;
217
- line-height: 1.45em;
218
- color: @colorBody;
219
- background: #f6f6f6;
220
- padding: @baseLineInEms;
248
+ line-height: @base-line;
249
+ color: rgba(0, 0, 0, .9);
221
250
  overflow: auto;
222
- }
223
- code {
224
- padding: 3px 3px 1px 3px;
251
+ background: @color-pre-background;
252
+ padding: @base-line;
253
+ word-wrap: normal;
254
+ }
255
+ td pre {
256
+ white-space: pre-wrap;
257
+ white-space: -moz-pre-wrap;
258
+ white-space: -pre-wrap;
259
+ white-space: -o-pre-wrap;
260
+ word-wrap: break-word;
261
+ }
262
+ mark,
263
+ code,
264
+ samp,
265
+ kbd {
266
+ padding: .2rem .4rem;
225
267
  display: inline-block;
226
268
  line-height: 1;
227
- background: #f6f6f6;
228
- border: 1px solid #ddd;
269
+ border-radius: @global-radius;
270
+ }
271
+ code {
272
+ background: @color-code-background;
229
273
  }
230
274
  pre code {
231
275
  font-size: 100%;
232
276
  border: none;
233
277
  padding: 0;
234
278
  background: none;
235
- line-height: @baseLineInEms;
279
+ line-height: @base-line;
236
280
  }
237
- kbd {
238
- padding: 2px 6px 1px 6px;
239
- line-height: 1;
240
- display: inline-block;
241
- border-radius: .3em;
242
- box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2), 0 0 0 1px white inset;
243
- background-color: #fafafa;
244
- border: 1px solid #ccc;
245
- color: @colorBody;
246
- font-weight: normal;
247
- white-space: nowrap;
281
+ var {
282
+ color: rgba(0, 0, 0, .5);
248
283
  }
249
- button:active,
250
- button:focus {
251
- outline: none;
252
- }
253
- input[type="text"],
254
- input[type="password"],
255
- input[type="email"],
256
- input[type="url"],
257
- input[type="phone"],
258
- input[type="tel"],
259
- input[type="number"],
260
- input[type="datetime"],
261
- input[type="date"],
262
- input[type="search"],
263
- input[type="datetime-local"],
264
- textarea,
265
- select[multiple="multiple"] {
266
- font-family: @controlsFontFamily;
267
- line-height: 1;
268
- font-size: @baseFontSize + 0px;
269
- border-radius: 0;
270
- background: #fff;
271
- box-shadow: none;
272
- border: 1px solid #bbbcc0;
273
- outline: none;
274
- padding: 7px 5px;
275
- position: relative;
276
- z-index: 2;
277
- -webkit-appearance: none;
278
- }
279
- input[type="text"],
280
- input[type="password"],
281
- input[type="email"],
282
- input[type="url"],
283
- input[type="phone"],
284
- input[type="tel"],
285
- input[type="number"],
286
- input[type="datetime"],
287
- input[type="date"],
288
- input[type="search"],
289
- input[type="datetime-local"] {
290
- height: 2.3em;
291
- }
292
- input[type="range"] {
293
- position: relative;
294
- top: 3px;
295
- }
296
- select[multiple="multiple"],
297
- textarea {
298
- line-height: 1.35em;
299
- }
300
- fieldset {
301
- padding: @baseLineInEms;
302
- margin-bottom: @baseLineInEms;
303
- border: 1px solid #dbdada;
304
- }
305
- legend {
306
- font-weight: bold;
307
- padding: 0 1em;
308
- margin-left: -1em;
309
- }
310
- tfoot th,
311
- tfoot td {
312
- background-color: #f4f4f4;
313
- }
314
- th,
315
- td {
316
- border-bottom: 1px solid #eee;
317
- padding: 8px 10px;
284
+ samp {
285
+ background: @color-samp-background;
286
+ color: @color-samp;
318
287
  }
319
- table caption {
320
- text-transform: uppercase;
321
- padding: 0 1em;
322
- color: #777;
323
- font-size: @smallFontSize;
288
+ kbd {
289
+ background: @color-kbd-background;
290
+ color: @color-kbd;
291
+ white-space: nowrap;
324
292
  }