|
0
|
1 /*
|
|
|
2 Styles for the table stack mode
|
|
|
3 */
|
|
|
4
|
|
|
5 .tablesaw-stack td .tablesaw-cell-label,
|
|
|
6 .tablesaw-stack th .tablesaw-cell-label {
|
|
|
7 display: none;
|
|
|
8 }
|
|
|
9
|
|
|
10 /* Mobile first styles: Begin with the stacked presentation at narrow widths */
|
|
|
11 /* Support note IE9+: @media only all */
|
|
|
12 @media only all {
|
|
|
13 /* Show the table cells as a block level element */
|
|
|
14 .tablesaw-stack {
|
|
|
15 clear: both;
|
|
|
16 }
|
|
|
17 .tablesaw-stack td,
|
|
|
18 .tablesaw-stack th {
|
|
|
19 text-align: left;
|
|
|
20 display: block;
|
|
|
21 }
|
|
|
22 .tablesaw-stack tr {
|
|
|
23 clear: both;
|
|
|
24 display: table-row;
|
|
|
25 }
|
|
|
26 /* Make the label elements a percentage width */
|
|
|
27 .tablesaw-stack td .tablesaw-cell-label,
|
|
|
28 .tablesaw-stack th .tablesaw-cell-label {
|
|
|
29 display: inline-block;
|
|
|
30 padding: 0 .6em 0 0;
|
|
|
31 width: 30%;
|
|
|
32 }
|
|
|
33 /* For grouped headers, have a different style to visually separate the levels by classing the first label in each col group */
|
|
|
34 .tablesaw-stack th .tablesaw-cell-label-top,
|
|
|
35 .tablesaw-stack td .tablesaw-cell-label-top {
|
|
|
36 display: block;
|
|
|
37 padding: .4em 0;
|
|
|
38 margin: .4em 0;
|
|
|
39 }
|
|
|
40 .tablesaw-cell-label {
|
|
|
41 display: block;
|
|
|
42 }
|
|
|
43 /* Avoid double strokes when stacked */
|
|
|
44 .tablesaw-stack tbody th.group {
|
|
|
45 margin-top:-1px;
|
|
|
46 }
|
|
|
47 /* Avoid double strokes when stacked */
|
|
|
48 .tablesaw-stack th.group b.tablesaw-cell-label {
|
|
|
49 display: none !important;
|
|
|
50 }
|
|
|
51 } |
