Mercurial > nebulaweb3
comparison default/node_modules/tablesaw/src/tables.stack-mixin.scss @ 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 Sass Mixins */ | |
2 | |
3 @mixin tablesaw-stack-max { | |
4 /* Table rows have a gray bottom stroke by default */ | |
5 .tablesaw-stack tbody tr { | |
6 display: block; | |
7 width: 100%; | |
8 border-bottom: 1px solid #dfdfdf; | |
9 } | |
10 .tablesaw-stack thead td, | |
11 .tablesaw-stack thead th { | |
12 display: none; | |
13 } | |
14 .tablesaw-stack tbody td, | |
15 .tablesaw-stack tbody th { | |
16 display: block; | |
17 float: left; | |
18 clear: left; | |
19 width: 100%; | |
20 } | |
21 .tablesaw-cell-label { | |
22 vertical-align: top; | |
23 } | |
24 .tablesaw-cell-content { | |
25 max-width: 67%; | |
26 display: inline-block; | |
27 } | |
28 .tablesaw-stack td:empty, | |
29 .tablesaw-stack th:empty { | |
30 display: none; | |
31 } | |
32 } | |
33 | |
34 @mixin tablesaw-stack-min { | |
35 .tablesaw-stack tr { | |
36 display: table-row; | |
37 } | |
38 /* Show the table header rows */ | |
39 .tablesaw-stack td, | |
40 .tablesaw-stack th, | |
41 .tablesaw-stack thead td, | |
42 .tablesaw-stack thead th { | |
43 display: table-cell; | |
44 margin: 0; | |
45 } | |
46 /* Hide the labels in each cell */ | |
47 .tablesaw-stack td .tablesaw-cell-label, | |
48 .tablesaw-stack th .tablesaw-cell-label { | |
49 display: none !important; | |
50 } | |
51 } | |
52 | |
53 $use-respond-mixins: false !default; | |
54 @mixin tablesaw-stack( $breakpoint: 40em ) { | |
55 @if $use-respond-mixins { | |
56 @include respond-max($breakpoint - .0625) { | |
57 @include tablesaw-stack-max; | |
58 } | |
59 @include respond-min($breakpoint) { | |
60 @include tablesaw-stack-min; | |
61 } | |
62 } | |
63 @else { | |
64 @media (max-width: ($breakpoint - .0625)) { | |
65 @include tablesaw-stack-max; | |
66 } | |
67 @media (min-width: $breakpoint) { | |
68 @include tablesaw-stack-min; | |
69 } | |
70 } | |
71 } |