corrade-http-templates – Blame information for rev 61

Subversion Repositories:
Rev:
Rev Author Line No. Line
61 office 1 //
2 // Basic Bootstrap table
3 //
4  
5 .table {
6 width: 100%;
7 margin-bottom: $spacer;
8 background-color: $table-bg; // Reset for nesting within parents with `background-color`.
9  
10 th,
11 td {
12 padding: $table-cell-padding;
13 vertical-align: top;
14 border-top: $table-border-width solid $table-border-color;
15 }
16  
17 thead th {
18 vertical-align: bottom;
19 border-bottom: (2 * $table-border-width) solid $table-border-color;
20 }
21  
22 tbody + tbody {
23 border-top: (2 * $table-border-width) solid $table-border-color;
24 }
25  
26 .table {
27 background-color: $body-bg;
28 }
29 }
30  
31  
32 //
33 // Condensed table w/ half padding
34 //
35  
36 .table-sm {
37 th,
38 td {
39 padding: $table-cell-padding-sm;
40 }
41 }
42  
43  
44 // Border versions
45 //
46 // Add or remove borders all around the table and between all the columns.
47  
48 .table-bordered {
49 border: $table-border-width solid $table-border-color;
50  
51 th,
52 td {
53 border: $table-border-width solid $table-border-color;
54 }
55  
56 thead {
57 th,
58 td {
59 border-bottom-width: (2 * $table-border-width);
60 }
61 }
62 }
63  
64 .table-borderless {
65 th,
66 td,
67 thead th,
68 tbody + tbody {
69 border: 0;
70 }
71 }
72  
73 // Zebra-striping
74 //
75 // Default zebra-stripe styles (alternating gray and transparent backgrounds)
76  
77 .table-striped {
78 tbody tr:nth-of-type(#{$table-striped-order}) {
79 background-color: $table-accent-bg;
80 }
81 }
82  
83  
84 // Hover effect
85 //
86 // Placed here since it has to come after the potential zebra striping
87  
88 .table-hover {
89 tbody tr {
90 @include hover {
91 background-color: $table-hover-bg;
92 }
93 }
94 }
95  
96  
97 // Table backgrounds
98 //
99 // Exact selectors below required to override `.table-striped` and prevent
100 // inheritance to nested tables.
101  
102 @each $color, $value in $theme-colors {
103 @include table-row-variant($color, theme-color-level($color, -9));
104 }
105  
106 @include table-row-variant(active, $table-active-bg);
107  
108  
109 // Dark styles
110 //
111 // Same table markup, but inverted color scheme: dark background and light text.
112  
113 // stylelint-disable-next-line no-duplicate-selectors
114 .table {
115 .thead-dark {
116 th {
117 color: $table-dark-color;
118 background-color: $table-dark-bg;
119 border-color: $table-dark-border-color;
120 }
121 }
122  
123 .thead-light {
124 th {
125 color: $table-head-color;
126 background-color: $table-head-bg;
127 border-color: $table-border-color;
128 }
129 }
130 }
131  
132 .table-dark {
133 color: $table-dark-color;
134 background-color: $table-dark-bg;
135  
136 th,
137 td,
138 thead th {
139 border-color: $table-dark-border-color;
140 }
141  
142 &.table-bordered {
143 border: 0;
144 }
145  
146 &.table-striped {
147 tbody tr:nth-of-type(odd) {
148 background-color: $table-dark-accent-bg;
149 }
150 }
151  
152 &.table-hover {
153 tbody tr {
154 @include hover {
155 background-color: $table-dark-hover-bg;
156 }
157 }
158 }
159 }
160  
161  
162 // Responsive tables
163 //
164 // Generate series of `.table-responsive-*` classes for configuring the screen
165 // size of where your table will overflow.
166  
167 .table-responsive {
168 @each $breakpoint in map-keys($grid-breakpoints) {
169 $next: breakpoint-next($breakpoint, $grid-breakpoints);
170 $infix: breakpoint-infix($next, $grid-breakpoints);
171  
172 &#{$infix} {
173 @include media-breakpoint-down($breakpoint) {
174 display: block;
175 width: 100%;
176 overflow-x: auto;
177 -webkit-overflow-scrolling: touch;
178 -ms-overflow-style: -ms-autohiding-scrollbar; // See https://github.com/twbs/bootstrap/pull/10057
179  
180 // Prevent double border on horizontal scroll due to use of `display: block;`
181 > .table-bordered {
182 border: 0;
183 }
184 }
185 }
186 }
187 }