twitter-bootstrap-rails 1.3.1 → 1.4.0

Sign up to get free protection for your applications and to get access to all the features.

Potentially problematic release.


This version of twitter-bootstrap-rails might be problematic. Click here for more details.

@@ -1,171 +1,224 @@
1
- /*
2
- * Tables.less
3
- * Tables for, you guessed it, tabular data
4
- * ---------------------------------------- */
5
-
6
-
7
- // BASELINE STYLES
8
- // ---------------
9
-
10
- table {
11
- width: 100%;
12
- margin-bottom: @baseline;
13
- padding: 0;
14
- border-collapse: separate; // Done so we can round those corners!
15
- *border-collapse: collapse; /* IE7, collapse table to remove spacing */
16
- font-size: @basefont;
17
- border: 1px solid #ddd;
18
- .border-radius(4px);
19
- th, td {
20
- padding: 10px 10px 9px;
21
- line-height: @baseline;
22
- text-align: left;
23
- }
24
- th {
25
- padding-top: 9px;
26
- font-weight: bold;
27
- vertical-align: middle;
28
- border-bottom: 1px solid #ddd;
29
- }
30
- td {
31
- vertical-align: top;
32
- }
33
- th + th,
34
- td + td {
35
- border-left: 1px solid #ddd;
36
- }
37
- tr + tr td {
38
- border-top: 1px solid #ddd;
39
- }
40
- tbody tr:first-child td:first-child {
41
- .border-radius(4px 0 0 0);
42
- }
43
- tbody tr:first-child td:last-child {
44
- .border-radius(0 4px 0 0);
45
- }
46
- tbody tr:last-child td:first-child {
47
- .border-radius(0 0 0 4px);
48
- }
49
- tbody tr:last-child td:last-child {
50
- .border-radius(0 0 4px 0);
51
- }
52
- }
53
-
54
-
55
- // ZEBRA-STRIPING
56
- // --------------
57
-
58
- // Default zebra-stripe styles (alternating gray and transparent backgrounds)
59
- .zebra-striped {
60
- tbody {
61
- tr:nth-child(odd) td {
62
- background-color: #f9f9f9;
63
- }
64
- tr:hover td {
65
- background-color: #f5f5f5;
66
- }
67
- }
68
- }
69
-
70
- table {
71
- // Tablesorting styles w/ jQuery plugin
72
- .header {
73
- cursor: pointer;
74
- &:after {
75
- content: "";
76
- float: right;
77
- margin-top: 7px;
78
- border-width: 0 4px 4px;
79
- border-style: solid;
80
- border-color: #000 transparent;
81
- visibility: hidden;
82
- }
83
- }
84
- // Style the sorted column headers (THs)
85
- .headerSortUp,
86
- .headerSortDown {
87
- background-color: rgba(141,192,219,.25);
88
- text-shadow: 0 1px 1px rgba(255,255,255,.75);
89
- }
90
- // Style the ascending (reverse alphabetical) column header
91
- .header:hover {
92
- &:after {
93
- visibility:visible;
94
- }
95
- }
96
- // Style the descending (alphabetical) column header
97
- .headerSortDown,
98
- .headerSortDown:hover {
99
- &:after {
100
- visibility:visible;
101
- .opacity(60);
102
- }
103
- }
104
- // Style the ascending (reverse alphabetical) column header
105
- .headerSortUp {
106
- &:after {
107
- border-bottom: none;
108
- border-left: 4px solid transparent;
109
- border-right: 4px solid transparent;
110
- border-top: 4px solid #000;
111
- visibility:visible;
112
- .box-shadow(none); //can't add boxshadow to downward facing arrow :(
113
- .opacity(60);
114
- }
115
- }
116
- // Blue Table Headings
117
- .blue {
118
- color: @blue;
119
- border-bottom-color: @blue;
120
- }
121
- .headerSortUp.blue,
122
- .headerSortDown.blue {
123
- background-color: lighten(@blue, 40%);
124
- }
125
- // Green Table Headings
126
- .green {
127
- color: @green;
128
- border-bottom-color: @green;
129
- }
130
- .headerSortUp.green,
131
- .headerSortDown.green {
132
- background-color: lighten(@green, 40%);
133
- }
134
- // Red Table Headings
135
- .red {
136
- color: @red;
137
- border-bottom-color: @red;
138
- }
139
- .headerSortUp.red,
140
- .headerSortDown.red {
141
- background-color: lighten(@red, 50%);
142
- }
143
- // Yellow Table Headings
144
- .yellow {
145
- color: @yellow;
146
- border-bottom-color: @yellow;
147
- }
148
- .headerSortUp.yellow,
149
- .headerSortDown.yellow {
150
- background-color: lighten(@yellow, 40%);
151
- }
152
- // Orange Table Headings
153
- .orange {
154
- color: @orange;
155
- border-bottom-color: @orange;
156
- }
157
- .headerSortUp.orange,
158
- .headerSortDown.orange {
159
- background-color: lighten(@orange, 40%);
160
- }
161
- // Purple Table Headings
162
- .purple {
163
- color: @purple;
164
- border-bottom-color: @purple;
165
- }
166
- .headerSortUp.purple,
167
- .headerSortDown.purple {
168
- background-color: lighten(@purple, 40%);
169
- }
170
- }
171
-
1
+ /*
2
+ * Tables.less
3
+ * Tables for, you guessed it, tabular data
4
+ * ---------------------------------------- */
5
+
6
+
7
+ // BASELINE STYLES
8
+ // ---------------
9
+
10
+ table {
11
+ width: 100%;
12
+ margin-bottom: @baseline;
13
+ padding: 0;
14
+ font-size: @basefont;
15
+ border-collapse: collapse;
16
+ th,
17
+ td {
18
+ padding: 10px 10px 9px;
19
+ line-height: @baseline;
20
+ text-align: left;
21
+ }
22
+ th {
23
+ padding-top: 9px;
24
+ font-weight: bold;
25
+ vertical-align: middle;
26
+ }
27
+ td {
28
+ vertical-align: top;
29
+ border-top: 1px solid #ddd;
30
+ }
31
+ // When scoped to row, fix th in tbody
32
+ tbody th {
33
+ border-top: 1px solid #ddd;
34
+ vertical-align: top;
35
+ }
36
+ }
37
+
38
+
39
+ // CONDENSED VERSION
40
+ // -----------------
41
+ .condensed-table {
42
+ th,
43
+ td {
44
+ padding: 5px 5px 4px;
45
+ }
46
+ }
47
+
48
+
49
+ // BORDERED VERSION
50
+ // ----------------
51
+
52
+ .bordered-table {
53
+ border: 1px solid #ddd;
54
+ border-collapse: separate; // Done so we can round those corners!
55
+ *border-collapse: collapse; /* IE7, collapse table to remove spacing */
56
+ .border-radius(4px);
57
+ th + th,
58
+ td + td,
59
+ th + td {
60
+ border-left: 1px solid #ddd;
61
+ }
62
+ thead tr:first-child th:first-child,
63
+ tbody tr:first-child td:first-child {
64
+ .border-radius(4px 0 0 0);
65
+ }
66
+ thead tr:first-child th:last-child,
67
+ tbody tr:first-child td:last-child {
68
+ .border-radius(0 4px 0 0);
69
+ }
70
+ tbody tr:last-child td:first-child {
71
+ .border-radius(0 0 0 4px);
72
+ }
73
+ tbody tr:last-child td:last-child {
74
+ .border-radius(0 0 4px 0);
75
+ }
76
+ }
77
+
78
+
79
+ // TABLE CELL SIZES
80
+ // ----------------
81
+
82
+ // This is a duplication of the main grid .columns() mixin, but subtracts 20px to account for input padding and border
83
+ .tableColumns(@columnSpan: 1) {
84
+ width: ((@gridColumnWidth - 20) * @columnSpan) + ((@gridColumnWidth - 20) * (@columnSpan - 1));
85
+ }
86
+ table {
87
+ // Default columns
88
+ .span1 { .tableColumns(1); }
89
+ .span2 { .tableColumns(2); }
90
+ .span3 { .tableColumns(3); }
91
+ .span4 { .tableColumns(4); }
92
+ .span5 { .tableColumns(5); }
93
+ .span6 { .tableColumns(6); }
94
+ .span7 { .tableColumns(7); }
95
+ .span8 { .tableColumns(8); }
96
+ .span9 { .tableColumns(9); }
97
+ .span10 { .tableColumns(10); }
98
+ .span11 { .tableColumns(11); }
99
+ .span12 { .tableColumns(12); }
100
+ .span13 { .tableColumns(13); }
101
+ .span14 { .tableColumns(14); }
102
+ .span15 { .tableColumns(15); }
103
+ .span16 { .tableColumns(16); }
104
+ }
105
+
106
+
107
+ // ZEBRA-STRIPING
108
+ // --------------
109
+
110
+ // Default zebra-stripe styles (alternating gray and transparent backgrounds)
111
+ .zebra-striped {
112
+ tbody {
113
+ tr:nth-child(odd) td,
114
+ tr:nth-child(odd) th {
115
+ background-color: #f9f9f9;
116
+ }
117
+ tr:hover td,
118
+ tr:hover th {
119
+ background-color: #f5f5f5;
120
+ }
121
+ }
122
+ }
123
+
124
+ table {
125
+ // Tablesorting styles w/ jQuery plugin
126
+ .header {
127
+ cursor: pointer;
128
+ &:after {
129
+ content: "";
130
+ float: right;
131
+ margin-top: 7px;
132
+ border-width: 0 4px 4px;
133
+ border-style: solid;
134
+ border-color: #000 transparent;
135
+ visibility: hidden;
136
+ }
137
+ }
138
+ // Style the sorted column headers (THs)
139
+ .headerSortUp,
140
+ .headerSortDown {
141
+ background-color: rgba(141,192,219,.25);
142
+ text-shadow: 0 1px 1px rgba(255,255,255,.75);
143
+ }
144
+ // Style the ascending (reverse alphabetical) column header
145
+ .header:hover {
146
+ &:after {
147
+ visibility:visible;
148
+ }
149
+ }
150
+ // Style the descending (alphabetical) column header
151
+ .headerSortDown,
152
+ .headerSortDown:hover {
153
+ &:after {
154
+ visibility:visible;
155
+ .opacity(60);
156
+ }
157
+ }
158
+ // Style the ascending (reverse alphabetical) column header
159
+ .headerSortUp {
160
+ &:after {
161
+ border-bottom: none;
162
+ border-left: 4px solid transparent;
163
+ border-right: 4px solid transparent;
164
+ border-top: 4px solid #000;
165
+ visibility:visible;
166
+ .box-shadow(none); //can't add boxshadow to downward facing arrow :(
167
+ .opacity(60);
168
+ }
169
+ }
170
+ // Blue Table Headings
171
+ .blue {
172
+ color: @blue;
173
+ border-bottom-color: @blue;
174
+ }
175
+ .headerSortUp.blue,
176
+ .headerSortDown.blue {
177
+ background-color: lighten(@blue, 40%);
178
+ }
179
+ // Green Table Headings
180
+ .green {
181
+ color: @green;
182
+ border-bottom-color: @green;
183
+ }
184
+ .headerSortUp.green,
185
+ .headerSortDown.green {
186
+ background-color: lighten(@green, 40%);
187
+ }
188
+ // Red Table Headings
189
+ .red {
190
+ color: @red;
191
+ border-bottom-color: @red;
192
+ }
193
+ .headerSortUp.red,
194
+ .headerSortDown.red {
195
+ background-color: lighten(@red, 50%);
196
+ }
197
+ // Yellow Table Headings
198
+ .yellow {
199
+ color: @yellow;
200
+ border-bottom-color: @yellow;
201
+ }
202
+ .headerSortUp.yellow,
203
+ .headerSortDown.yellow {
204
+ background-color: lighten(@yellow, 40%);
205
+ }
206
+ // Orange Table Headings
207
+ .orange {
208
+ color: @orange;
209
+ border-bottom-color: @orange;
210
+ }
211
+ .headerSortUp.orange,
212
+ .headerSortDown.orange {
213
+ background-color: lighten(@orange, 40%);
214
+ }
215
+ // Purple Table Headings
216
+ .purple {
217
+ color: @purple;
218
+ border-bottom-color: @purple;
219
+ }
220
+ .headerSortUp.purple,
221
+ .headerSortDown.purple {
222
+ background-color: lighten(@purple, 40%);
223
+ }
224
+ }
@@ -1,188 +1,187 @@
1
- /* Typography.less
2
- * Headings, body text, lists, code, and more for a versatile and durable typography system
3
- * ---------------------------------------------------------------------------------------- */
4
-
5
-
6
- // BODY TEXT
7
- // ---------
8
-
9
- p {
10
- #font > .shorthand(normal,@basefont,@baseline);
11
- margin-bottom: @baseline / 2;
12
- small {
13
- font-size: @basefont - 2;
14
- color: @grayLight;
15
- }
16
- }
17
-
18
-
19
- // HEADINGS
20
- // --------
21
-
22
- h1, h2, h3, h4, h5, h6 {
23
- font-weight: bold;
24
- color: @grayDark;
25
- small {
26
- color: @grayLight;
27
- }
28
- }
29
- h1 {
30
- margin-bottom: @baseline;
31
- font-size: 30px;
32
- line-height: @baseline * 2;
33
- small {
34
- font-size: 18px;
35
- }
36
- }
37
- h2 {
38
- font-size: 24px;
39
- line-height: @baseline * 2;
40
- small {
41
- font-size: 14px;
42
- }
43
- }
44
- h3, h4, h5, h6 {
45
- line-height: @baseline * 2;
46
- }
47
- h3 {
48
- font-size: 18px;
49
- small {
50
- font-size: 14px;
51
- }
52
- }
53
- h4 {
54
- font-size: 16px;
55
- small {
56
- font-size: 12px;
57
- }
58
- }
59
- h5 {
60
- font-size: 14px;
61
- }
62
- h6 {
63
- font-size: 13px;
64
- color: @grayLight;
65
- text-transform: uppercase;
66
- }
67
-
68
-
69
- // COLORS
70
- // ------
71
-
72
- // Unordered and Ordered lists
73
- ul, ol {
74
- margin: 0 0 @baseline 25px;
75
- }
76
- ul ul,
77
- ul ol,
78
- ol ol,
79
- ol ul {
80
- margin-bottom: 0;
81
- }
82
- ul {
83
- list-style: disc;
84
- }
85
- ol {
86
- list-style: decimal;
87
- }
88
- li {
89
- line-height: @baseline;
90
- color: @gray;
91
- }
92
- ul.unstyled {
93
- list-style: none;
94
- margin-left: 0;
95
- }
96
-
97
- // Description Lists
98
- dl {
99
- margin-bottom: @baseline;
100
- dt, dd {
101
- line-height: @baseline;
102
- }
103
- dt {
104
- font-weight: bold;
105
- }
106
- dd {
107
- margin-left: @baseline / 2;
108
- }
109
- }
110
-
111
- // MISC
112
- // ----
113
-
114
- // Horizontal rules
115
- hr {
116
- margin: 20px 0 19px;
117
- border: 0;
118
- border-bottom: 1px solid #eee;
119
- }
120
-
121
- // Emphasis
122
- strong {
123
- font-style: inherit;
124
- font-weight: bold;
125
- }
126
- em {
127
- font-style: italic;
128
- font-weight: inherit;
129
- line-height: inherit;
130
- }
131
- .muted {
132
- color: @grayLight;
133
- }
134
-
135
- // Blockquotes
136
- blockquote {
137
- margin-bottom: @baseline;
138
- border-left: 5px solid #eee;
139
- padding-left: 15px;
140
- p {
141
- #font > .shorthand(300,14px,@baseline);
142
- margin-bottom: 0;
143
- }
144
- small {
145
- display: block;
146
- #font > .shorthand(300,12px,@baseline);
147
- color: @grayLight;
148
- &:before {
149
- content: '\2014 \00A0';
150
- }
151
- }
152
- }
153
-
154
- // Addresses
155
- address {
156
- display: block;
157
- line-height: @baseline;
158
- margin-bottom: @baseline;
159
- }
160
-
161
- // Inline and block code styles
162
- code, pre {
163
- padding: 0 3px 2px;
164
- font-family: Monaco, Andale Mono, Courier New, monospace;
165
- font-size: 12px;
166
- .border-radius(3px);
167
- }
168
- code {
169
- background-color: lighten(@orange, 40%);
170
- color: rgba(0,0,0,.75);
171
- padding: 1px 3px;
172
- }
173
- pre {
174
- background-color: #f5f5f5;
175
- display: block;
176
- padding: (@baseline - 1) / 2;
177
- margin: 0 0 @baseline;
178
- line-height: @baseline;
179
- font-size: 12px;
180
- border: 1px solid #ccc;
181
- border: 1px solid rgba(0,0,0,.15);
182
- .border-radius(3px);
183
- white-space: pre;
184
- white-space: pre-wrap;
185
- word-wrap: break-word;
186
-
187
- }
188
-
1
+ /* Typography.less
2
+ * Headings, body text, lists, code, and more for a versatile and durable typography system
3
+ * ---------------------------------------------------------------------------------------- */
4
+
5
+
6
+ // BODY TEXT
7
+ // ---------
8
+
9
+ p {
10
+ #font > .shorthand(normal,@basefont,@baseline);
11
+ margin-bottom: @baseline / 2;
12
+ small {
13
+ font-size: @basefont - 2;
14
+ color: @grayLight;
15
+ }
16
+ }
17
+
18
+
19
+ // HEADINGS
20
+ // --------
21
+
22
+ h1, h2, h3, h4, h5, h6 {
23
+ font-weight: bold;
24
+ color: @grayDark;
25
+ small {
26
+ color: @grayLight;
27
+ }
28
+ }
29
+ h1 {
30
+ margin-bottom: @baseline;
31
+ font-size: 30px;
32
+ line-height: @baseline * 2;
33
+ small {
34
+ font-size: 18px;
35
+ }
36
+ }
37
+ h2 {
38
+ font-size: 24px;
39
+ line-height: @baseline * 2;
40
+ small {
41
+ font-size: 14px;
42
+ }
43
+ }
44
+ h3, h4, h5, h6 {
45
+ line-height: @baseline * 2;
46
+ }
47
+ h3 {
48
+ font-size: 18px;
49
+ small {
50
+ font-size: 14px;
51
+ }
52
+ }
53
+ h4 {
54
+ font-size: 16px;
55
+ small {
56
+ font-size: 12px;
57
+ }
58
+ }
59
+ h5 {
60
+ font-size: 14px;
61
+ }
62
+ h6 {
63
+ font-size: 13px;
64
+ color: @grayLight;
65
+ text-transform: uppercase;
66
+ }
67
+
68
+
69
+ // COLORS
70
+ // ------
71
+
72
+ // Unordered and Ordered lists
73
+ ul, ol {
74
+ margin: 0 0 @baseline 25px;
75
+ }
76
+ ul ul,
77
+ ul ol,
78
+ ol ol,
79
+ ol ul {
80
+ margin-bottom: 0;
81
+ }
82
+ ul {
83
+ list-style: disc;
84
+ }
85
+ ol {
86
+ list-style: decimal;
87
+ }
88
+ li {
89
+ line-height: @baseline;
90
+ color: @gray;
91
+ }
92
+ ul.unstyled {
93
+ list-style: none;
94
+ margin-left: 0;
95
+ }
96
+
97
+ // Description Lists
98
+ dl {
99
+ margin-bottom: @baseline;
100
+ dt, dd {
101
+ line-height: @baseline;
102
+ }
103
+ dt {
104
+ font-weight: bold;
105
+ }
106
+ dd {
107
+ margin-left: @baseline / 2;
108
+ }
109
+ }
110
+
111
+ // MISC
112
+ // ----
113
+
114
+ // Horizontal rules
115
+ hr {
116
+ margin: 20px 0 19px;
117
+ border: 0;
118
+ border-bottom: 1px solid #eee;
119
+ }
120
+
121
+ // Emphasis
122
+ strong {
123
+ font-style: inherit;
124
+ font-weight: bold;
125
+ }
126
+ em {
127
+ font-style: italic;
128
+ font-weight: inherit;
129
+ line-height: inherit;
130
+ }
131
+ .muted {
132
+ color: @grayLight;
133
+ }
134
+
135
+ // Blockquotes
136
+ blockquote {
137
+ margin-bottom: @baseline;
138
+ border-left: 5px solid #eee;
139
+ padding-left: 15px;
140
+ p {
141
+ #font > .shorthand(300,14px,@baseline);
142
+ margin-bottom: 0;
143
+ }
144
+ small {
145
+ display: block;
146
+ #font > .shorthand(300,12px,@baseline);
147
+ color: @grayLight;
148
+ &:before {
149
+ content: '\2014 \00A0';
150
+ }
151
+ }
152
+ }
153
+
154
+ // Addresses
155
+ address {
156
+ display: block;
157
+ line-height: @baseline;
158
+ margin-bottom: @baseline;
159
+ }
160
+
161
+ // Inline and block code styles
162
+ code, pre {
163
+ padding: 0 3px 2px;
164
+ font-family: Monaco, Andale Mono, Courier New, monospace;
165
+ font-size: 12px;
166
+ .border-radius(3px);
167
+ }
168
+ code {
169
+ background-color: lighten(@orange, 40%);
170
+ color: rgba(0,0,0,.75);
171
+ padding: 1px 3px;
172
+ }
173
+ pre {
174
+ background-color: #f5f5f5;
175
+ display: block;
176
+ padding: (@baseline - 1) / 2;
177
+ margin: 0 0 @baseline;
178
+ line-height: @baseline;
179
+ font-size: 12px;
180
+ border: 1px solid #ccc;
181
+ border: 1px solid rgba(0,0,0,.15);
182
+ .border-radius(3px);
183
+ white-space: pre;
184
+ white-space: pre-wrap;
185
+ word-wrap: break-word;
186
+
187
+ }