@skyscanner/backpack-web 38.22.0 → 39.0.0

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.
Files changed (44) hide show
  1. package/bpk-mixins/_badges-v2.scss +37 -36
  2. package/bpk-mixins/_badges.scss +37 -36
  3. package/bpk-mixins/_borders.scss +16 -16
  4. package/bpk-mixins/_breakpoints.scss +11 -11
  5. package/bpk-mixins/_buttons.scss +141 -137
  6. package/bpk-mixins/_cards.scss +13 -13
  7. package/bpk-mixins/_chips.scss +66 -66
  8. package/bpk-mixins/_forms.scss +214 -202
  9. package/bpk-mixins/_icons.scss +7 -4
  10. package/bpk-mixins/_index.scss +19 -19
  11. package/bpk-mixins/_layers.scss +34 -34
  12. package/bpk-mixins/_margins.scss +3 -3
  13. package/bpk-mixins/_panels.scss +9 -9
  14. package/bpk-mixins/_radii.scss +6 -6
  15. package/bpk-mixins/_scroll-indicators.scss +2 -2
  16. package/bpk-mixins/_shadows.scss +4 -4
  17. package/bpk-mixins/_spinners.scss +10 -10
  18. package/bpk-mixins/_tokens.scss +1 -3
  19. package/bpk-mixins/_typography.scss +204 -195
  20. package/bpk-mixins/_utils.scss +17 -12
  21. package/bpk-stylesheets/index.scss +13 -14
  22. package/bpk-stylesheets/normalize.css +18 -422
  23. package/bpk-stylesheets/normalize.scss +422 -0
  24. package/package.json +1 -5
  25. package/unstable__bpk-mixins/_badges-v2.scss +0 -240
  26. package/unstable__bpk-mixins/_badges.scss +0 -240
  27. package/unstable__bpk-mixins/_borders.scss +0 -268
  28. package/unstable__bpk-mixins/_breakpoints.scss +0 -221
  29. package/unstable__bpk-mixins/_buttons.scss +0 -587
  30. package/unstable__bpk-mixins/_cards.scss +0 -94
  31. package/unstable__bpk-mixins/_chips.scss +0 -249
  32. package/unstable__bpk-mixins/_forms.scss +0 -1045
  33. package/unstable__bpk-mixins/_icons.scss +0 -88
  34. package/unstable__bpk-mixins/_index.scss +0 -38
  35. package/unstable__bpk-mixins/_layers.scss +0 -199
  36. package/unstable__bpk-mixins/_margins.scss +0 -75
  37. package/unstable__bpk-mixins/_panels.scss +0 -96
  38. package/unstable__bpk-mixins/_radii.scss +0 -80
  39. package/unstable__bpk-mixins/_scroll-indicators.scss +0 -79
  40. package/unstable__bpk-mixins/_shadows.scss +0 -58
  41. package/unstable__bpk-mixins/_spinners.scss +0 -102
  42. package/unstable__bpk-mixins/_tokens.scss +0 -19
  43. package/unstable__bpk-mixins/_typography.scss +0 -1225
  44. package/unstable__bpk-mixins/_utils.scss +0 -267
package/unstable__bpk-mixins/_breakpoints.scss DELETED
@@ -1,221 +0,0 @@
1
- /*
2
- * Backpack - Skyscanner's Design System
3
- *
4
- * Copyright 2016 Skyscanner Ltd
5
- *
6
- * Licensed under the Apache License, Version 2.0 (the "License");
7
- * you may not use this file except in compliance with the License.
8
- * You may obtain a copy of the License at
9
- *
10
- * http://www.apache.org/licenses/LICENSE-2.0
11
- *
12
- * Unless required by applicable law or agreed to in writing, software
13
- * distributed under the License is distributed on an "AS IS" BASIS,
14
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15
- * See the License for the specific language governing permissions and
16
- * limitations under the License.
17
- */
18
-
19
- /* stylelint-disable at-rule-disallowed-list */
20
-
21
- @use 'tokens.scss';
22
-
23
- ////
24
- /// @group breakpoints
25
- ////
26
-
27
- /// @alias bpk-grid__container
28
-
29
- @mixin bpk-container {
30
- @include bpk-grid__container;
31
- }
32
-
33
- /// Breakpoint to target up to and including small mobile viewports.
34
- ///
35
- /// @content
36
- ///
37
- /// @example scss
38
- /// .selector {
39
- /// @include bpk-breakpoint-small-mobile {
40
- /// /* small mobile viewport scss goes here */
41
- /// }
42
- ///
43
- /// /* larger mobile, tablet & desktop viewport scss goes here */
44
- /// }
45
-
46
- @mixin bpk-breakpoint-small-mobile {
47
- @media #{tokens.$bpk-breakpoint-query-small-mobile} {
48
- @content;
49
- }
50
- }
51
-
52
- /// Breakpoint to target up to and including mobile viewports.
53
- ///
54
- /// @content
55
- ///
56
- /// @example scss
57
- /// .selector {
58
- /// @include bpk-breakpoint-mobile {
59
- /// /* up to and including mobile viewport scss goes here */
60
- /// }
61
- ///
62
- /// /* tablet & desktop viewport scss goes here */
63
- /// }
64
-
65
- @mixin bpk-breakpoint-mobile {
66
- @media #{tokens.$bpk-breakpoint-query-mobile} {
67
- @content;
68
- }
69
- }
70
-
71
- /// Breakpoint to target up to and including small tablet viewports.
72
- ///
73
- /// @content
74
- ///
75
- /// @example scss
76
- /// .selector {
77
- /// @include bpk-breakpoint-small-tablet {
78
- /// /* up to and including small tablet viewport scss goes here */
79
- /// }
80
- ///
81
- /// /* larger tablet & desktop viewport scss goes here */
82
- /// }
83
-
84
- @mixin bpk-breakpoint-small-tablet {
85
- @media #{tokens.$bpk-breakpoint-query-small-tablet} {
86
- @content;
87
- }
88
- }
89
-
90
- /// Breakpoint to target up to and including tablet viewports.
91
- ///
92
- /// @content
93
- ///
94
- /// @example scss
95
- /// .selector {
96
- /// @include bpk-breakpoint-tablet {
97
- /// /* mobile & tablet viewport scss goes here */
98
- /// }
99
- ///
100
- /// /* desktop viewport scss goes here */
101
- /// }
102
-
103
- @mixin bpk-breakpoint-tablet {
104
- @media #{tokens.$bpk-breakpoint-query-tablet} {
105
- @content;
106
- }
107
- }
108
-
109
- /// Breakpoint to target only small tablet viewports.
110
- ///
111
- /// @content
112
- ///
113
- /// @example scss
114
- /// .selector {
115
- /// @include bpk-breakpoint-small-tablet-only {
116
- /// /* small tablet viewport scss goes here */
117
- /// }
118
- ///
119
- /// /* mobile, larger tablet & desktop viewport scss goes here */
120
- /// }
121
-
122
- @mixin bpk-breakpoint-small-tablet-only {
123
- @media #{tokens.$bpk-breakpoint-query-small-tablet-only} {
124
- @content;
125
- }
126
- }
127
-
128
- /// Breakpoint to target only tablet viewports.
129
- ///
130
- /// @content
131
- ///
132
- /// @example scss
133
- /// .selector {
134
- /// @include bpk-breakpoint-tablet-only {
135
- /// /* tablet viewport scss goes here */
136
- /// }
137
- ///
138
- /// /* mobile & desktop viewport scss goes here */
139
- /// }
140
-
141
- @mixin bpk-breakpoint-tablet-only {
142
- @media #{tokens.$bpk-breakpoint-query-tablet-only} {
143
- @content;
144
- }
145
- }
146
-
147
- /// Breakpoint to target tablet & desktop viewports.
148
- ///
149
- /// @content
150
- ///
151
- /// @example scss
152
- /// .selector {
153
- /// @include bpk-breakpoint-above-mobile {
154
- /// /* tablet & desktop viewport scss goes here */
155
- /// }
156
- ///
157
- /// /* mobile viewport scss goes here */
158
- /// }
159
-
160
- @mixin bpk-breakpoint-above-mobile {
161
- @media #{tokens.$bpk-breakpoint-query-above-mobile} {
162
- @content;
163
- }
164
- }
165
-
166
- /// Breakpoint to target desktop viewports.
167
- ///
168
- /// @content
169
- ///
170
- /// @example scss
171
- /// .selector {
172
- /// @include bpk-breakpoint-above-tablet {
173
- /// /* desktop viewport scss goes here */
174
- /// }
175
- ///
176
- /// /* mobile & tablet viewport scss goes here */
177
- /// }
178
-
179
- @mixin bpk-breakpoint-above-tablet {
180
- @media #{tokens.$bpk-breakpoint-query-above-tablet} {
181
- @content;
182
- }
183
- }
184
-
185
- /// Breakpoint to target large desktop viewports.
186
- ///
187
- /// @content
188
- ///
189
- /// @example scss
190
- /// .selector {
191
- /// @include bpk-breakpoint-above-desktop {
192
- /// /* large desktop viewport scss goes here */
193
- /// }
194
- ///
195
- /// /* mobile, tablet, desktop viewport scss goes here */
196
- /// }
197
-
198
- @mixin bpk-breakpoint-above-desktop {
199
- @media #{tokens.$bpk-breakpoint-query-above-desktop} {
200
- @content;
201
- }
202
- }
203
-
204
- /// Breakpoint to target only desktop viewports.
205
- ///
206
- /// @content
207
- ///
208
- /// @example scss
209
- /// .selector {
210
- /// @include bpk-breakpoint-desktop-only {
211
- /// /* desktop viewport scss goes here */
212
- /// }
213
- ///
214
- /// /* mobile, tablet & large desktop viewport scss goes here */
215
- /// }
216
-
217
- @mixin bpk-breakpoint-desktop-only {
218
- @media #{tokens.$bpk-breakpoint-query-desktop-only} {
219
- @content;
220
- }
221
- }