]>
Commit | Line | Data |
---|---|---|
91e44d91 S |
1 | // scss-lint:disable ImportantRule |
2 | ||
3 | // | |
4 | // Responsive tests | |
5 | // | |
6 | ||
7 | // Responsive (scrollable) doc tables | |
8 | .table-responsive .highlight pre { | |
9 | white-space: normal; | |
10 | } | |
11 | ||
12 | // Utility classes table | |
13 | .bd-table th small, | |
14 | .responsive-utilities th small { | |
15 | display: block; | |
16 | font-weight: normal; | |
17 | color: #999; | |
18 | } | |
19 | .responsive-utilities tbody th { | |
20 | font-weight: normal; | |
21 | } | |
22 | .responsive-utilities td { | |
23 | text-align: center; | |
24 | } | |
25 | .responsive-utilities .is-visible { | |
26 | color: #468847; | |
27 | background-color: #dff0d8 !important; | |
28 | } | |
29 | .responsive-utilities .is-hidden { | |
30 | color: #ccc; | |
31 | background-color: #f9f9f9 !important; | |
32 | } | |
33 | ||
34 | // Responsive tests | |
35 | .responsive-utilities-test { | |
36 | margin-top: .25rem; | |
37 | } | |
38 | .responsive-utilities-test .col-6 { | |
39 | margin-top: .5rem; | |
40 | margin-bottom: .5rem; | |
41 | } | |
42 | .responsive-utilities-test span { | |
43 | display: block; | |
44 | padding: 1rem .5rem; | |
45 | font-size: 1rem; | |
46 | font-weight: bold; | |
47 | line-height: 1.1; | |
48 | text-align: center; | |
49 | border-radius: .25rem; | |
50 | } | |
51 | .visible-on, | |
52 | .hidden-on { | |
53 | .col-6 { | |
54 | > .not-visible { | |
55 | color: #999; | |
56 | border: 1px solid #ddd; | |
57 | } | |
58 | } | |
59 | } | |
60 | .visible-on, | |
61 | .hidden-on { | |
62 | .col-6 { | |
63 | .visible { | |
64 | color: #468847; | |
65 | background-color: #dff0d8; | |
66 | border: 1px solid #d6e9c6; | |
67 | } | |
68 | } | |
69 | } | |
70 | ||
71 | @include media-breakpoint-only(xs) { | |
72 | .hidden-xs-only { | |
73 | display: none !important; | |
74 | } | |
75 | } | |
76 | @include media-breakpoint-only(sm) { | |
77 | .hidden-sm-only { | |
78 | display: none !important; | |
79 | } | |
80 | } | |
81 | @include media-breakpoint-only(md) { | |
82 | .hidden-md-only { | |
83 | display: none !important; | |
84 | } | |
85 | } | |
86 | @include media-breakpoint-only(lg) { | |
87 | .hidden-lg-only { | |
88 | display: none !important; | |
89 | } | |
90 | } | |
91 | @include media-breakpoint-only(xl) { | |
92 | .hidden-xl-only { | |
93 | display: none !important; | |
94 | } | |
95 | } |