@trilogy-ds/styles 4.13.17-datepicker → 4.14.0-calendar-native
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/default/trilogy-mangled.css +1 -1
- package/dist/default/trilogy-partials.css +1 -1
- package/dist/default/trilogy.css +1 -1
- package/framework/src/components/_flex-box.scss +559 -24
- package/framework/src/utilities/mixins/_mixins.scss +1 -0
- package/framework/src/utilities/mixins/_responsiveness.scss +99 -9
- package/package.json +1 -1
|
@@ -6,13 +6,13 @@
|
|
|
6
6
|
}
|
|
7
7
|
|
|
8
8
|
@mixin until($device) {
|
|
9
|
-
@media screen and (max-width: $device - 1px) {
|
|
9
|
+
@media screen and (max-width: #{$device - 1px}) {
|
|
10
10
|
@content;
|
|
11
11
|
}
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
@mixin mobile {
|
|
15
|
-
@media screen and (max-width: $tablet - 1px) {
|
|
15
|
+
@media screen and (max-width: #{$tablet - 1px}) {
|
|
16
16
|
@content;
|
|
17
17
|
}
|
|
18
18
|
}
|
|
@@ -24,13 +24,13 @@
|
|
|
24
24
|
}
|
|
25
25
|
|
|
26
26
|
@mixin tablet-only {
|
|
27
|
-
@media screen and (min-width: $tablet) and (max-width: $desktop - 1px) {
|
|
27
|
+
@media screen and (min-width: #{$tablet}) and (max-width: #{$desktop - 1px}) {
|
|
28
28
|
@content;
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
31
|
|
|
32
32
|
@mixin touch {
|
|
33
|
-
@media screen and (max-width: $desktop - 1px) {
|
|
33
|
+
@media screen and (max-width: #{$desktop - 1px}) {
|
|
34
34
|
@content;
|
|
35
35
|
}
|
|
36
36
|
}
|
|
@@ -42,13 +42,13 @@
|
|
|
42
42
|
}
|
|
43
43
|
|
|
44
44
|
@mixin desktop-only {
|
|
45
|
-
@media screen and (min-width: $desktop) and (max-width: $widescreen - 1px) {
|
|
45
|
+
@media screen and (min-width: #{$desktop}) and (max-width: #{$widescreen - 1px}) {
|
|
46
46
|
@content;
|
|
47
47
|
}
|
|
48
48
|
}
|
|
49
49
|
|
|
50
50
|
@mixin until-widescreen {
|
|
51
|
-
@media screen and (max-width: $widescreen - 1px) {
|
|
51
|
+
@media screen and (max-width: #{$widescreen - 1px}) {
|
|
52
52
|
@content;
|
|
53
53
|
}
|
|
54
54
|
}
|
|
@@ -60,13 +60,13 @@
|
|
|
60
60
|
}
|
|
61
61
|
|
|
62
62
|
@mixin widescreen-only {
|
|
63
|
-
@media screen and (min-width: $widescreen) and (max-width: $fullhd - 1px) {
|
|
63
|
+
@media screen and (min-width: #{$widescreen}) and (max-width: #{$fullhd - 1px}) {
|
|
64
64
|
@content;
|
|
65
65
|
}
|
|
66
66
|
}
|
|
67
67
|
|
|
68
68
|
@mixin until-fullhd {
|
|
69
|
-
@media screen and (max-width: $fullhd - 1px) {
|
|
69
|
+
@media screen and (max-width: #{$fullhd - 1px}) {
|
|
70
70
|
@content;
|
|
71
71
|
}
|
|
72
72
|
}
|
|
@@ -78,7 +78,97 @@
|
|
|
78
78
|
}
|
|
79
79
|
|
|
80
80
|
@mixin all-desktop-only {
|
|
81
|
-
@media screen and (min-width: $desktop) and (max-width: $fullhd - 1px) {
|
|
81
|
+
@media screen and (min-width: #{$desktop}) and (max-width: #{$fullhd - 1px}) {
|
|
82
82
|
@content;
|
|
83
83
|
}
|
|
84
84
|
}
|
|
85
|
+
|
|
86
|
+
// Responsive for container queries
|
|
87
|
+
.query-container {
|
|
88
|
+
container-type: inline-size;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
@mixin container-from($device) {
|
|
92
|
+
@container (min-width: #{$device}) {
|
|
93
|
+
@content;
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
@mixin container-until($device) {
|
|
98
|
+
@container (max-width: #{$device - 1px}) {
|
|
99
|
+
@content;
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
@mixin container-mobile {
|
|
104
|
+
@container (max-width: #{$tablet - 1px}) {
|
|
105
|
+
@content;
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
@mixin container-tablet {
|
|
110
|
+
@container (min-width: #{$tablet}) {
|
|
111
|
+
@content;
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
@mixin container-tablet-only {
|
|
116
|
+
@container (min-width: #{$tablet}) and (max-width: #{$desktop - 1px}) {
|
|
117
|
+
@content;
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
@mixin container-touch {
|
|
122
|
+
@container (max-width: #{$desktop - 1px}) {
|
|
123
|
+
@content;
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
@mixin container-desktop {
|
|
128
|
+
@container (min-width: #{$desktop}) {
|
|
129
|
+
@content;
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
@mixin container-desktop-only {
|
|
134
|
+
@container (min-width: #{$desktop}) and (max-width: #{$widescreen - 1px}) {
|
|
135
|
+
@content;
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
@mixin container-until-widescreen {
|
|
140
|
+
@container (max-width: #{$widescreen - 1px}) {
|
|
141
|
+
@content;
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
@mixin container-widescreen {
|
|
146
|
+
@container (min-width: #{$widescreen}) {
|
|
147
|
+
@content;
|
|
148
|
+
}
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
@mixin container-widescreen-only {
|
|
152
|
+
@container (min-width: #{$widescreen}) and (max-width: #{$fullhd - 1px}) {
|
|
153
|
+
@content;
|
|
154
|
+
}
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
@mixin container-until-fullhd {
|
|
158
|
+
@container (max-width: #{$fullhd - 1px}) {
|
|
159
|
+
@content;
|
|
160
|
+
}
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
@mixin container-fullhd {
|
|
164
|
+
@container (min-width: #{$fullhd}) {
|
|
165
|
+
@content;
|
|
166
|
+
}
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
@mixin container-all-desktop-only {
|
|
170
|
+
@container (min-width: #{$desktop}) and (max-width: #{$fullhd - 1px}) {
|
|
171
|
+
@content;
|
|
172
|
+
}
|
|
173
|
+
}
|
|
174
|
+
|