comparison default/node_modules/tablesaw/dist/stackonly/tablesaw.stackonly.css @ 0:1d038bc9b3d2 default tip

Up:default
author Liny <dev@neowd.com>
date Sat, 31 May 2025 09:21:51 +0800
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:1d038bc9b3d2
1 /*! Tablesaw - v3.0.8 - 2018-01-25
2 * https://github.com/filamentgroup/tablesaw
3 * Copyright (c) 2018 Filament Group; Licensed MIT */
4
5 .tablesaw {
6 width: 100%;
7 max-width: 100%;
8 empty-cells: show;
9 border-collapse: collapse;
10 border: 0;
11 padding: 0;
12 }
13
14 .tablesaw * {
15 box-sizing: border-box;
16 }
17
18 .tablesaw-stack td .tablesaw-cell-label,
19 .tablesaw-stack th .tablesaw-cell-label {
20 display: none;
21 }
22
23 /* Mobile first styles: Begin with the stacked presentation at narrow widths */
24
25 /* Support note IE9+: @media only all */
26
27 @media only all {
28 /* Show the table cells as a block level element */
29
30 .tablesaw-stack {
31 clear: both;
32 }
33
34 .tablesaw-stack td,
35 .tablesaw-stack th {
36 text-align: left;
37 display: block;
38 }
39
40 .tablesaw-stack tr {
41 clear: both;
42 display: table-row;
43 }
44
45 /* Make the label elements a percentage width */
46
47 .tablesaw-stack td .tablesaw-cell-label,
48 .tablesaw-stack th .tablesaw-cell-label {
49 display: inline-block;
50 padding: 0 .6em 0 0;
51 width: 30%;
52 }
53
54 /* For grouped headers, have a different style to visually separate the levels by classing the first label in each col group */
55
56 .tablesaw-stack th .tablesaw-cell-label-top,
57 .tablesaw-stack td .tablesaw-cell-label-top {
58 display: block;
59 padding: .4em 0;
60 margin: .4em 0;
61 }
62
63 .tablesaw-cell-label {
64 display: block;
65 }
66
67 /* Avoid double strokes when stacked */
68
69 .tablesaw-stack tbody th.group {
70 margin-top: -1px;
71 }
72
73 /* Avoid double strokes when stacked */
74
75 .tablesaw-stack th.group b.tablesaw-cell-label {
76 display: none !important;
77 }
78 }
79
80 @media (max-width: 39.9375em) {
81 /* Table rows have a gray bottom stroke by default */
82
83 .tablesaw-stack tbody tr {
84 display: block;
85 width: 100%;
86 border-bottom: 1px solid #dfdfdf;
87 }
88
89 .tablesaw-stack thead td,
90 .tablesaw-stack thead th {
91 display: none;
92 }
93
94 .tablesaw-stack tbody td,
95 .tablesaw-stack tbody th {
96 display: block;
97 float: left;
98 clear: left;
99 width: 100%;
100 }
101
102 .tablesaw-cell-label {
103 vertical-align: top;
104 }
105
106 .tablesaw-cell-content {
107 display: inline-block;
108 max-width: 67%;
109 }
110
111 .tablesaw-stack .tablesaw-stack-block .tablesaw-cell-label,
112 .tablesaw-stack .tablesaw-stack-block .tablesaw-cell-content {
113 display: block;
114 width: 100%;
115 max-width: 100%;
116 padding: 0;
117 }
118
119 .tablesaw-stack td:empty,
120 .tablesaw-stack th:empty {
121 display: none;
122 }
123 }
124
125 /* Media query to show as a standard table at 560px (35em x 16px) or wider */
126
127 @media (min-width: 40em) {
128 .tablesaw-stack tr {
129 display: table-row;
130 }
131
132 /* Show the table header rows */
133
134 .tablesaw-stack td,
135 .tablesaw-stack th,
136 .tablesaw-stack thead td,
137 .tablesaw-stack thead th {
138 display: table-cell;
139 margin: 0;
140 }
141
142 /* Hide the labels in each cell */
143
144 .tablesaw-stack td .tablesaw-cell-label,
145 .tablesaw-stack th .tablesaw-cell-label {
146 display: none !important;
147 }
148 }