less-rails-bootstrap 1.4.3 → 2.0.0
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.
- data/CHANGELOG.md +5 -0
- data/lib/less/rails/bootstrap/version.rb +1 -1
- data/test/cases/usage_css_spec.rb +2 -9
- data/test/cases/usage_js_spec.rb +5 -7
- data/vendor/assets/javascripts/twitter/bootstrap.js +12 -8
- data/vendor/assets/javascripts/twitter/bootstrap/alert.js +91 -0
- data/vendor/assets/javascripts/twitter/bootstrap/button.js +98 -0
- data/vendor/assets/javascripts/twitter/bootstrap/carousel.js +154 -0
- data/vendor/assets/javascripts/twitter/bootstrap/collapse.js +136 -0
- data/vendor/assets/javascripts/twitter/bootstrap/dropdown.js +58 -21
- data/vendor/assets/javascripts/twitter/bootstrap/modal.js +63 -114
- data/vendor/assets/javascripts/twitter/bootstrap/popover.js +39 -30
- data/vendor/assets/javascripts/twitter/bootstrap/scrollspy.js +62 -44
- data/vendor/assets/javascripts/twitter/bootstrap/tab.js +130 -0
- data/vendor/assets/javascripts/twitter/bootstrap/tooltip.js +270 -0
- data/vendor/assets/javascripts/twitter/bootstrap/transition.js +51 -0
- data/vendor/assets/javascripts/twitter/bootstrap/typeahead.js +271 -0
- data/vendor/frameworks/twitter/bootstrap/accordion.less +28 -0
- data/vendor/frameworks/twitter/bootstrap/alerts.less +70 -0
- data/vendor/frameworks/twitter/bootstrap/bootstrap.less +41 -5
- data/vendor/frameworks/twitter/bootstrap/breadcrumbs.less +22 -0
- data/vendor/frameworks/twitter/bootstrap/button-groups.less +147 -0
- data/vendor/frameworks/twitter/bootstrap/buttons.less +165 -0
- data/vendor/frameworks/twitter/bootstrap/carousel.less +121 -0
- data/vendor/frameworks/twitter/bootstrap/close.less +18 -0
- data/vendor/frameworks/twitter/bootstrap/code.less +44 -0
- data/vendor/frameworks/twitter/bootstrap/component-animations.less +18 -0
- data/vendor/frameworks/twitter/bootstrap/dropdowns.less +131 -0
- data/vendor/frameworks/twitter/bootstrap/forms.less +336 -300
- data/vendor/frameworks/twitter/bootstrap/grid.less +8 -0
- data/vendor/frameworks/twitter/bootstrap/hero-unit.less +20 -0
- data/vendor/frameworks/twitter/bootstrap/labels.less +16 -0
- data/vendor/frameworks/twitter/bootstrap/layouts.less +17 -0
- data/vendor/frameworks/twitter/bootstrap/mixins.less +391 -76
- data/vendor/frameworks/twitter/bootstrap/modals.less +72 -0
- data/vendor/frameworks/twitter/bootstrap/navbar.less +292 -0
- data/vendor/frameworks/twitter/bootstrap/navs.less +343 -0
- data/vendor/frameworks/twitter/bootstrap/pager.less +30 -0
- data/vendor/frameworks/twitter/bootstrap/pagination.less +55 -0
- data/vendor/frameworks/twitter/bootstrap/patterns.less +5 -1052
- data/vendor/frameworks/twitter/bootstrap/popovers.less +49 -0
- data/vendor/frameworks/twitter/bootstrap/print.less +18 -0
- data/vendor/frameworks/twitter/bootstrap/progress-bars.less +95 -0
- data/vendor/frameworks/twitter/bootstrap/reset.less +37 -52
- data/vendor/frameworks/twitter/bootstrap/responsive.less +323 -0
- data/vendor/frameworks/twitter/bootstrap/scaffolding.less +13 -121
- data/vendor/frameworks/twitter/bootstrap/sprites.less +156 -0
- data/vendor/frameworks/twitter/bootstrap/tables.less +75 -160
- data/vendor/frameworks/twitter/bootstrap/thumbnails.less +35 -0
- data/vendor/frameworks/twitter/bootstrap/tooltip.less +35 -0
- data/vendor/frameworks/twitter/bootstrap/type.less +100 -70
- data/vendor/frameworks/twitter/bootstrap/utilities.less +23 -0
- data/vendor/frameworks/twitter/bootstrap/variables.less +94 -55
- data/vendor/frameworks/twitter/bootstrap/wells.less +17 -0
- metadata +44 -11
- data/vendor/assets/javascripts/twitter/bootstrap/alerts.js +0 -113
- data/vendor/assets/javascripts/twitter/bootstrap/buttons.js +0 -62
- data/vendor/assets/javascripts/twitter/bootstrap/tabs.js +0 -80
- data/vendor/assets/javascripts/twitter/bootstrap/twipsy.js +0 -310
@@ -1,137 +1,29 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
* ------------------------------------------------------------------------------------------- */
|
1
|
+
// Scaffolding
|
2
|
+
// Basic and global styles for generating a grid system, structural layout, and page templates
|
3
|
+
// -------------------------------------------------------------------------------------------
|
5
4
|
|
6
5
|
|
7
6
|
// STRUCTURAL LAYOUT
|
8
7
|
// -----------------
|
9
8
|
|
10
9
|
body {
|
11
|
-
background-color: @white;
|
12
10
|
margin: 0;
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
.container {
|
19
|
-
.fixed-container();
|
20
|
-
}
|
21
|
-
|
22
|
-
// Fluid layouts (left aligned, with sidebar, min- & max-width content)
|
23
|
-
.container-fluid {
|
24
|
-
position: relative;
|
25
|
-
min-width: 940px;
|
26
|
-
padding-left: 20px;
|
27
|
-
padding-right: 20px;
|
28
|
-
.clearfix();
|
29
|
-
> .sidebar {
|
30
|
-
position: absolute;
|
31
|
-
top: 0;
|
32
|
-
left: 20px;
|
33
|
-
width: 220px;
|
34
|
-
}
|
35
|
-
// TODO in v2: rename this and .popover .content to be more specific
|
36
|
-
> .content {
|
37
|
-
margin-left: 240px;
|
38
|
-
}
|
11
|
+
font-family: @baseFontFamily;
|
12
|
+
font-size: @baseFontSize;
|
13
|
+
line-height: @baseLineHeight;
|
14
|
+
color: @textColor;
|
15
|
+
background-color: @white;
|
39
16
|
}
|
40
17
|
|
41
18
|
|
42
|
-
//
|
43
|
-
//
|
19
|
+
// LINKS
|
20
|
+
// -----
|
44
21
|
|
45
|
-
// Links
|
46
22
|
a {
|
47
23
|
color: @linkColor;
|
48
24
|
text-decoration: none;
|
49
|
-
line-height: inherit;
|
50
|
-
font-weight: inherit;
|
51
|
-
&:hover {
|
52
|
-
color: @linkColorHover;
|
53
|
-
text-decoration: underline;
|
54
|
-
}
|
55
|
-
}
|
56
|
-
|
57
|
-
// Quick floats
|
58
|
-
.pull-right {
|
59
|
-
float: right;
|
60
|
-
}
|
61
|
-
.pull-left {
|
62
|
-
float: left;
|
63
|
-
}
|
64
|
-
|
65
|
-
// Toggling content
|
66
|
-
.hide {
|
67
|
-
display: none;
|
68
25
|
}
|
69
|
-
|
70
|
-
|
26
|
+
a:hover {
|
27
|
+
color: @linkColorHover;
|
28
|
+
text-decoration: underline;
|
71
29
|
}
|
72
|
-
|
73
|
-
|
74
|
-
// GRID SYSTEM
|
75
|
-
// -----------
|
76
|
-
// To customize the grid system, bring up the variables.less file and change the column count, size, and gutter there
|
77
|
-
|
78
|
-
.row {
|
79
|
-
.clearfix();
|
80
|
-
margin-left: -@gridGutterWidth;
|
81
|
-
}
|
82
|
-
|
83
|
-
// Find all .span# classes within .row and give them the necessary properties for grid columns (supported by all browsers back to IE7)
|
84
|
-
// Credit to @dhg for the idea
|
85
|
-
.row > [class*="span"] {
|
86
|
-
.gridColumn();
|
87
|
-
}
|
88
|
-
|
89
|
-
// Default columns
|
90
|
-
.span1 { .columns(1); }
|
91
|
-
.span2 { .columns(2); }
|
92
|
-
.span3 { .columns(3); }
|
93
|
-
.span4 { .columns(4); }
|
94
|
-
.span5 { .columns(5); }
|
95
|
-
.span6 { .columns(6); }
|
96
|
-
.span7 { .columns(7); }
|
97
|
-
.span8 { .columns(8); }
|
98
|
-
.span9 { .columns(9); }
|
99
|
-
.span10 { .columns(10); }
|
100
|
-
.span11 { .columns(11); }
|
101
|
-
.span12 { .columns(12); }
|
102
|
-
.span13 { .columns(13); }
|
103
|
-
.span14 { .columns(14); }
|
104
|
-
.span15 { .columns(15); }
|
105
|
-
.span16 { .columns(16); }
|
106
|
-
|
107
|
-
// For optional 24-column grid
|
108
|
-
.span17 { .columns(17); }
|
109
|
-
.span18 { .columns(18); }
|
110
|
-
.span19 { .columns(19); }
|
111
|
-
.span20 { .columns(20); }
|
112
|
-
.span21 { .columns(21); }
|
113
|
-
.span22 { .columns(22); }
|
114
|
-
.span23 { .columns(23); }
|
115
|
-
.span24 { .columns(24); }
|
116
|
-
|
117
|
-
// Offset column options
|
118
|
-
.row {
|
119
|
-
> .offset1 { .offset(1); }
|
120
|
-
> .offset2 { .offset(2); }
|
121
|
-
> .offset3 { .offset(3); }
|
122
|
-
> .offset4 { .offset(4); }
|
123
|
-
> .offset5 { .offset(5); }
|
124
|
-
> .offset6 { .offset(6); }
|
125
|
-
> .offset7 { .offset(7); }
|
126
|
-
> .offset8 { .offset(8); }
|
127
|
-
> .offset9 { .offset(9); }
|
128
|
-
> .offset10 { .offset(10); }
|
129
|
-
> .offset11 { .offset(11); }
|
130
|
-
> .offset12 { .offset(12); }
|
131
|
-
}
|
132
|
-
|
133
|
-
// Unique column sizes for 16-column grid
|
134
|
-
.span-one-third { width: 300px; }
|
135
|
-
.span-two-thirds { width: 620px; }
|
136
|
-
.offset-one-third { margin-left: 340px; }
|
137
|
-
.offset-two-thirds { margin-left: 660px; }
|
@@ -0,0 +1,156 @@
|
|
1
|
+
// SPRITES
|
2
|
+
// Glyphs and icons for buttons, nav, and more
|
3
|
+
// -------------------------------------------
|
4
|
+
|
5
|
+
|
6
|
+
// ICONS
|
7
|
+
// -----
|
8
|
+
|
9
|
+
// All icons receive the styles of the <i> tag with a base class
|
10
|
+
// of .i and are then given a unique class to add width, height,
|
11
|
+
// and background-position. Your resulting HTML will look like
|
12
|
+
// <i class="i icon-inbox"></i>.
|
13
|
+
|
14
|
+
// For the white version of the icons, just add the .icon-white class:
|
15
|
+
// <i class="i icon-inbox icon-white"></i>
|
16
|
+
|
17
|
+
[class^="icon-"] {
|
18
|
+
display: inline-block;
|
19
|
+
width: 14px;
|
20
|
+
height: 14px;
|
21
|
+
vertical-align: text-top;
|
22
|
+
background-image: url(../img/glyphicons-halflings.png);
|
23
|
+
background-position: 14px 14px;
|
24
|
+
background-repeat: no-repeat;
|
25
|
+
|
26
|
+
.ie7-restore-right-whitespace();
|
27
|
+
}
|
28
|
+
.icon-white {
|
29
|
+
background-image: url(../img/glyphicons-halflings-white.png);
|
30
|
+
}
|
31
|
+
|
32
|
+
.icon-glass { background-position: 0 0; }
|
33
|
+
.icon-music { background-position: -24px 0; }
|
34
|
+
.icon-search { background-position: -48px 0; }
|
35
|
+
.icon-envelope { background-position: -72px 0; }
|
36
|
+
.icon-heart { background-position: -96px 0; }
|
37
|
+
.icon-star { background-position: -120px 0; }
|
38
|
+
.icon-star-empty { background-position: -144px 0; }
|
39
|
+
.icon-user { background-position: -168px 0; }
|
40
|
+
.icon-film { background-position: -192px 0; }
|
41
|
+
.icon-th-large { background-position: -216px 0; }
|
42
|
+
.icon-th { background-position: -240px 0; }
|
43
|
+
.icon-th-list { background-position: -264px 0; }
|
44
|
+
.icon-ok { background-position: -288px 0; }
|
45
|
+
.icon-remove { background-position: -312px 0; }
|
46
|
+
.icon-zoom-in { background-position: -336px 0; }
|
47
|
+
.icon-zoom-out { background-position: -360px 0; }
|
48
|
+
.icon-off { background-position: -384px 0; }
|
49
|
+
.icon-signal { background-position: -408px 0; }
|
50
|
+
.icon-cog { background-position: -432px 0; }
|
51
|
+
.icon-trash { background-position: -456px 0; }
|
52
|
+
|
53
|
+
.icon-home { background-position: 0 -24px; }
|
54
|
+
.icon-file { background-position: -24px -24px; }
|
55
|
+
.icon-time { background-position: -48px -24px; }
|
56
|
+
.icon-road { background-position: -72px -24px; }
|
57
|
+
.icon-download-alt { background-position: -96px -24px; }
|
58
|
+
.icon-download { background-position: -120px -24px; }
|
59
|
+
.icon-upload { background-position: -144px -24px; }
|
60
|
+
.icon-inbox { background-position: -168px -24px; }
|
61
|
+
.icon-play-circle { background-position: -192px -24px; }
|
62
|
+
.icon-repeat { background-position: -216px -24px; }
|
63
|
+
.icon-refresh { background-position: -240px -24px; }
|
64
|
+
.icon-list-alt { background-position: -264px -24px; }
|
65
|
+
.icon-lock { background-position: -287px -24px; } // 1px off
|
66
|
+
.icon-flag { background-position: -312px -24px; }
|
67
|
+
.icon-headphones { background-position: -336px -24px; }
|
68
|
+
.icon-volume-off { background-position: -360px -24px; }
|
69
|
+
.icon-volume-down { background-position: -384px -24px; }
|
70
|
+
.icon-volume-up { background-position: -408px -24px; }
|
71
|
+
.icon-qrcode { background-position: -432px -24px; }
|
72
|
+
.icon-barcode { background-position: -456px -24px; }
|
73
|
+
|
74
|
+
.icon-tag { background-position: 0 -48px; }
|
75
|
+
.icon-tags { background-position: -25px -48px; } // 1px off
|
76
|
+
.icon-book { background-position: -48px -48px; }
|
77
|
+
.icon-bookmark { background-position: -72px -48px; }
|
78
|
+
.icon-print { background-position: -96px -48px; }
|
79
|
+
.icon-camera { background-position: -120px -48px; }
|
80
|
+
.icon-font { background-position: -144px -48px; }
|
81
|
+
.icon-bold { background-position: -167px -48px; } // 1px off
|
82
|
+
.icon-italic { background-position: -192px -48px; }
|
83
|
+
.icon-text-height { background-position: -216px -48px; }
|
84
|
+
.icon-text-width { background-position: -240px -48px; }
|
85
|
+
.icon-align-left { background-position: -264px -48px; }
|
86
|
+
.icon-align-center { background-position: -288px -48px; }
|
87
|
+
.icon-align-right { background-position: -312px -48px; }
|
88
|
+
.icon-align-justify { background-position: -336px -48px; }
|
89
|
+
.icon-list { background-position: -360px -48px; }
|
90
|
+
.icon-indent-left { background-position: -384px -48px; }
|
91
|
+
.icon-indent-right { background-position: -408px -48px; }
|
92
|
+
.icon-facetime-video { background-position: -432px -48px; }
|
93
|
+
.icon-picture { background-position: -456px -48px; }
|
94
|
+
|
95
|
+
.icon-pencil { background-position: 0 -72px; }
|
96
|
+
.icon-map-marker { background-position: -24px -72px; }
|
97
|
+
.icon-adjust { background-position: -48px -72px; }
|
98
|
+
.icon-tint { background-position: -72px -72px; }
|
99
|
+
.icon-edit { background-position: -96px -72px; }
|
100
|
+
.icon-share { background-position: -120px -72px; }
|
101
|
+
.icon-check { background-position: -144px -72px; }
|
102
|
+
.icon-move { background-position: -168px -72px; }
|
103
|
+
.icon-step-backward { background-position: -192px -72px; }
|
104
|
+
.icon-fast-backward { background-position: -216px -72px; }
|
105
|
+
.icon-backward { background-position: -240px -72px; }
|
106
|
+
.icon-play { background-position: -264px -72px; }
|
107
|
+
.icon-pause { background-position: -288px -72px; }
|
108
|
+
.icon-stop { background-position: -312px -72px; }
|
109
|
+
.icon-forward { background-position: -336px -72px; }
|
110
|
+
.icon-fast-forward { background-position: -360px -72px; }
|
111
|
+
.icon-step-forward { background-position: -384px -72px; }
|
112
|
+
.icon-eject { background-position: -408px -72px; }
|
113
|
+
.icon-chevron-left { background-position: -432px -72px; }
|
114
|
+
.icon-chevron-right { background-position: -456px -72px; }
|
115
|
+
|
116
|
+
.icon-plus-sign { background-position: 0 -96px; }
|
117
|
+
.icon-minus-sign { background-position: -24px -96px; }
|
118
|
+
.icon-remove-sign { background-position: -48px -96px; }
|
119
|
+
.icon-ok-sign { background-position: -72px -96px; }
|
120
|
+
.icon-question-sign { background-position: -96px -96px; }
|
121
|
+
.icon-info-sign { background-position: -120px -96px; }
|
122
|
+
.icon-screenshot { background-position: -144px -96px; }
|
123
|
+
.icon-remove-circle { background-position: -168px -96px; }
|
124
|
+
.icon-ok-circle { background-position: -192px -96px; }
|
125
|
+
.icon-ban-circle { background-position: -216px -96px; }
|
126
|
+
.icon-arrow-left { background-position: -240px -96px; }
|
127
|
+
.icon-arrow-right { background-position: -264px -96px; }
|
128
|
+
.icon-arrow-up { background-position: -289px -96px; } // 1px off
|
129
|
+
.icon-arrow-down { background-position: -312px -96px; }
|
130
|
+
.icon-share-alt { background-position: -336px -96px; }
|
131
|
+
.icon-resize-full { background-position: -360px -96px; }
|
132
|
+
.icon-resize-small { background-position: -384px -96px; }
|
133
|
+
.icon-plus { background-position: -408px -96px; }
|
134
|
+
.icon-minus { background-position: -433px -96px; }
|
135
|
+
.icon-asterisk { background-position: -456px -96px; }
|
136
|
+
|
137
|
+
.icon-exclamation-sign { background-position: 0 -120px; }
|
138
|
+
.icon-gift { background-position: -24px -120px; }
|
139
|
+
.icon-leaf { background-position: -48px -120px; }
|
140
|
+
.icon-fire { background-position: -72px -120px; }
|
141
|
+
.icon-eye-open { background-position: -96px -120px; }
|
142
|
+
.icon-eye-close { background-position: -120px -120px; }
|
143
|
+
.icon-warning-sign { background-position: -144px -120px; }
|
144
|
+
.icon-plane { background-position: -168px -120px; }
|
145
|
+
.icon-calendar { background-position: -192px -120px; }
|
146
|
+
.icon-random { background-position: -216px -120px; }
|
147
|
+
.icon-comment { background-position: -240px -120px; }
|
148
|
+
.icon-magnet { background-position: -264px -120px; }
|
149
|
+
.icon-chevron-up { background-position: -288px -120px; }
|
150
|
+
.icon-chevron-down { background-position: -313px -119px; } // 1px off
|
151
|
+
.icon-retweet { background-position: -336px -120px; }
|
152
|
+
.icon-shopping-cart { background-position: -360px -120px; }
|
153
|
+
.icon-folder-close { background-position: -384px -120px; }
|
154
|
+
.icon-folder-open { background-position: -408px -120px; }
|
155
|
+
.icon-resize-vertical { background-position: -432px -119px; }
|
156
|
+
.icon-resize-horizontal { background-position: -456px -118px; }
|
@@ -1,47 +1,59 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
1
|
+
//
|
2
|
+
// Tables.less
|
3
|
+
// Tables for, you guessed it, tabular data
|
4
|
+
// ----------------------------------------
|
5
5
|
|
6
6
|
|
7
|
+
// BASE TABLES
|
8
|
+
// -----------------
|
9
|
+
|
10
|
+
table {
|
11
|
+
max-width: 100%;
|
12
|
+
border-collapse: collapse;
|
13
|
+
border-spacing: 0;
|
14
|
+
}
|
15
|
+
|
7
16
|
// BASELINE STYLES
|
8
17
|
// ---------------
|
9
18
|
|
10
|
-
table {
|
19
|
+
.table {
|
11
20
|
width: 100%;
|
12
|
-
margin-bottom: @
|
13
|
-
|
14
|
-
font-size: @basefont;
|
15
|
-
border-collapse: collapse;
|
21
|
+
margin-bottom: @baseLineHeight;
|
22
|
+
// Cells
|
16
23
|
th,
|
17
24
|
td {
|
18
|
-
padding:
|
19
|
-
line-height: @
|
25
|
+
padding: 8px;
|
26
|
+
line-height: @baseLineHeight;
|
20
27
|
text-align: left;
|
28
|
+
border-top: 1px solid #ddd;
|
21
29
|
}
|
22
30
|
th {
|
23
|
-
padding-top: 9px;
|
24
31
|
font-weight: bold;
|
25
|
-
vertical-align:
|
32
|
+
vertical-align: bottom;
|
26
33
|
}
|
27
34
|
td {
|
28
35
|
vertical-align: top;
|
29
|
-
border-top: 1px solid #ddd;
|
30
36
|
}
|
31
|
-
//
|
32
|
-
|
33
|
-
|
34
|
-
|
37
|
+
// Remove top border from thead by default
|
38
|
+
thead:first-child tr th,
|
39
|
+
thead:first-child tr td {
|
40
|
+
border-top: 0;
|
41
|
+
}
|
42
|
+
// Account for multiple tbody instances
|
43
|
+
tbody + tbody {
|
44
|
+
border-top: 2px solid #ddd;
|
35
45
|
}
|
36
46
|
}
|
37
47
|
|
38
48
|
|
39
|
-
|
40
|
-
//
|
41
|
-
|
49
|
+
|
50
|
+
// CONDENSED TABLE W/ HALF PADDING
|
51
|
+
// -------------------------------
|
52
|
+
|
53
|
+
.table-condensed {
|
42
54
|
th,
|
43
55
|
td {
|
44
|
-
padding:
|
56
|
+
padding: 4px 5px;
|
45
57
|
}
|
46
58
|
}
|
47
59
|
|
@@ -49,42 +61,69 @@ table {
|
|
49
61
|
// BORDERED VERSION
|
50
62
|
// ----------------
|
51
63
|
|
52
|
-
.bordered
|
64
|
+
.table-bordered {
|
53
65
|
border: 1px solid #ddd;
|
54
66
|
border-collapse: separate; // Done so we can round those corners!
|
55
|
-
*border-collapse:
|
67
|
+
*border-collapse: collapsed; // IE7 can't round corners anyway
|
56
68
|
.border-radius(4px);
|
57
69
|
th + th,
|
58
70
|
td + td,
|
59
|
-
th + td
|
71
|
+
th + td,
|
72
|
+
td + th {
|
60
73
|
border-left: 1px solid #ddd;
|
61
74
|
}
|
62
|
-
|
63
|
-
|
75
|
+
// Prevent a double border
|
76
|
+
thead:first-child tr:first-child th,
|
77
|
+
tbody:first-child tr:first-child th,
|
78
|
+
tbody:first-child tr:first-child td {
|
79
|
+
border-top: 0;
|
80
|
+
}
|
81
|
+
// For first th or td in the first row in the first thead or tbody
|
82
|
+
thead:first-child tr:first-child th:first-child,
|
83
|
+
tbody:first-child tr:first-child td:first-child {
|
64
84
|
.border-radius(4px 0 0 0);
|
65
85
|
}
|
66
|
-
thead tr:first-child th:last-child,
|
67
|
-
tbody tr:first-child td:last-child {
|
86
|
+
thead:first-child tr:first-child th:last-child,
|
87
|
+
tbody:first-child tr:first-child td:last-child {
|
68
88
|
.border-radius(0 4px 0 0);
|
69
89
|
}
|
70
|
-
|
90
|
+
// For first th or td in the first row in the first thead or tbody
|
91
|
+
thead:last-child tr:last-child th:first-child,
|
92
|
+
tbody:last-child tr:last-child td:first-child {
|
71
93
|
.border-radius(0 0 0 4px);
|
72
94
|
}
|
73
|
-
|
95
|
+
thead:last-child tr:last-child th:last-child,
|
96
|
+
tbody:last-child tr:last-child td:last-child {
|
74
97
|
.border-radius(0 0 4px 0);
|
75
98
|
}
|
76
99
|
}
|
77
100
|
|
78
101
|
|
79
|
-
//
|
80
|
-
//
|
102
|
+
// ZEBRA-STRIPING
|
103
|
+
// --------------
|
81
104
|
|
82
|
-
//
|
105
|
+
// Default zebra-stripe styles (alternating gray and transparent backgrounds)
|
106
|
+
.table-striped {
|
107
|
+
tbody {
|
108
|
+
tr:nth-child(odd) td,
|
109
|
+
tr:nth-child(odd) th {
|
110
|
+
background-color: #f9f9f9;
|
111
|
+
}
|
112
|
+
}
|
113
|
+
}
|
114
|
+
|
115
|
+
|
116
|
+
|
117
|
+
// TABLE CELL SIZING
|
118
|
+
// -----------------
|
119
|
+
|
120
|
+
// Change the columns
|
83
121
|
.tableColumns(@columnSpan: 1) {
|
84
|
-
|
122
|
+
float: none;
|
123
|
+
width: ((@gridColumnWidth) * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1)) - 16;
|
124
|
+
margin-left: 0;
|
85
125
|
}
|
86
126
|
table {
|
87
|
-
// Default columns
|
88
127
|
.span1 { .tableColumns(1); }
|
89
128
|
.span2 { .tableColumns(2); }
|
90
129
|
.span3 { .tableColumns(3); }
|
@@ -97,128 +136,4 @@ table {
|
|
97
136
|
.span10 { .tableColumns(10); }
|
98
137
|
.span11 { .tableColumns(11); }
|
99
138
|
.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
139
|
}
|
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
|
-
}
|