react-responsive-tools 2.1.4 → 2.1.5

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-responsive-tools",
3
- "version": "2.1.4",
3
+ "version": "2.1.5",
4
4
  "description": "",
5
5
  "main": "index.js",
6
6
  "module": "index.js",
@@ -12,12 +12,12 @@ const __dirname = path.dirname(__filename);
12
12
  const generateHorizontalSCSS = (breakpoints) => {
13
13
  const beforeMixins = Object.keys(breakpoints).map(bp => `
14
14
  /**
15
- * Mixin for applying styles for screens greater than or equal to ${breakpoints[bp]}px.
16
- * Usage:
17
- *
18
- * @include for-${bp} {
15
+ * @mixin for-${bp}
16
+ * @description Mixin for applying styles for screens greater than or equal to ${breakpoints[bp]}px.
17
+ * @example
18
+ * @include for-${bp} {
19
19
  * // your styles here
20
- * }
20
+ * }
21
21
  */
22
22
  @mixin for-${bp}() {
23
23
  @include mob-first(${bp}) {
@@ -27,12 +27,12 @@ const generateHorizontalSCSS = (breakpoints) => {
27
27
 
28
28
  const afterMixins = Object.keys(breakpoints).map(bp => `
29
29
  /**
30
- * Mixin for applying styles for screens less than ${breakpoints[bp]}px.
31
- * Usage:
32
- *
33
- * @include before-${bp} {
30
+ * @mixin before-${bp}
31
+ * @description Mixin for applying styles for screens less than ${breakpoints[bp]}px.
32
+ * @example
33
+ * @include before-${bp} {
34
34
  * // your styles here
35
- * }
35
+ * }
36
36
  */
37
37
  @mixin before-${bp}() {
38
38
  @include desk-first(${bp}) {
@@ -53,12 +53,12 @@ ${afterMixins}
53
53
  const generateVerticalSCSS = (breakpoints) => {
54
54
  const beforeMixins = Object.keys(breakpoints).map(bp => `
55
55
  /**
56
- * Mixin for applying styles for screens with height greater than or equal to ${breakpoints[bp]}px.
57
- * Usage:
58
- *
59
- * @include v-for-${bp} {
56
+ * @mixin v-for-${bp}
57
+ * @description Mixin for applying styles for screens with height greater than or equal to ${breakpoints[bp]}px.
58
+ * @example
59
+ * @include v-for-${bp} {
60
60
  * // your styles here
61
- * }
61
+ * }
62
62
  */
63
63
  @mixin v-for-${bp}() {
64
64
  @include v-mob-first(${bp}) {
@@ -68,12 +68,12 @@ const generateVerticalSCSS = (breakpoints) => {
68
68
 
69
69
  const afterMixins = Object.keys(breakpoints).map(bp => `
70
70
  /**
71
- * Mixin for applying styles for screens with height less than ${breakpoints[bp]}px.
72
- * Usage:
73
- *
74
- * @include v-before-${bp} {
71
+ * @mixin v-before-${bp}
72
+ * @description Mixin for applying styles for screens with height less than ${breakpoints[bp]}px.
73
+ * @example
74
+ * @include v-before-${bp} {
75
75
  * // your styles here
76
- * }
76
+ * }
77
77
  */
78
78
  @mixin v-before-${bp}() {
79
79
  @include v-desk-first(${bp}) {
@@ -3,12 +3,12 @@
3
3
 
4
4
 
5
5
  /**
6
- * Mixin for applying styles for screens greater than or equal to 320pxpx.
7
- * Usage:
8
- *
9
- * @include for-xs {
6
+ * @mixin for-xs
7
+ * @description Mixin for applying styles for screens greater than or equal to 320pxpx.
8
+ * @example
9
+ * @include for-xs {
10
10
  * // your styles here
11
- * }
11
+ * }
12
12
  */
13
13
  @mixin for-xs() {
14
14
  @include mob-first(xs) {
@@ -16,13 +16,14 @@
16
16
  }
17
17
  }
18
18
 
19
+
19
20
  /**
20
- * Mixin for applying styles for screens greater than or equal to 576pxpx.
21
- * Usage:
22
- *
23
- * @include for-sm {
21
+ * @mixin for-sm
22
+ * @description Mixin for applying styles for screens greater than or equal to 576pxpx.
23
+ * @example
24
+ * @include for-sm {
24
25
  * // your styles here
25
- * }
26
+ * }
26
27
  */
27
28
  @mixin for-sm() {
28
29
  @include mob-first(sm) {
@@ -31,12 +32,12 @@
31
32
  }
32
33
 
33
34
  /**
34
- * Mixin for applying styles for screens greater than or equal to 768pxpx.
35
- * Usage:
36
- *
37
- * @include for-md {
35
+ * @mixin for-md
36
+ * @description Mixin for applying styles for screens greater than or equal to 768pxpx.
37
+ * @example
38
+ * @include for-md {
38
39
  * // your styles here
39
- * }
40
+ * }
40
41
  */
41
42
  @mixin for-md() {
42
43
  @include mob-first(md) {
@@ -45,12 +46,12 @@
45
46
  }
46
47
 
47
48
  /**
48
- * Mixin for applying styles for screens greater than or equal to 992pxpx.
49
- * Usage:
50
- *
51
- * @include for-lg {
49
+ * @mixin for-lg
50
+ * @description Mixin for applying styles for screens greater than or equal to 992pxpx.
51
+ * @example
52
+ * @include for-lg {
52
53
  * // your styles here
53
- * }
54
+ * }
54
55
  */
55
56
  @mixin for-lg() {
56
57
  @include mob-first(lg) {
@@ -59,12 +60,12 @@
59
60
  }
60
61
 
61
62
  /**
62
- * Mixin for applying styles for screens greater than or equal to 1024pxpx.
63
- * Usage:
64
- *
65
- * @include for-lt {
63
+ * @mixin for-lt
64
+ * @description Mixin for applying styles for screens greater than or equal to 1024pxpx.
65
+ * @example
66
+ * @include for-lt {
66
67
  * // your styles here
67
- * }
68
+ * }
68
69
  */
69
70
  @mixin for-lt() {
70
71
  @include mob-first(lt) {
@@ -73,12 +74,12 @@
73
74
  }
74
75
 
75
76
  /**
76
- * Mixin for applying styles for screens greater than or equal to 1200pxpx.
77
- * Usage:
78
- *
79
- * @include for-ltm {
77
+ * @mixin for-ltm
78
+ * @description Mixin for applying styles for screens greater than or equal to 1200pxpx.
79
+ * @example
80
+ * @include for-ltm {
80
81
  * // your styles here
81
- * }
82
+ * }
82
83
  */
83
84
  @mixin for-ltm() {
84
85
  @include mob-first(ltm) {
@@ -87,12 +88,12 @@
87
88
  }
88
89
 
89
90
  /**
90
- * Mixin for applying styles for screens greater than or equal to 1440pxpx.
91
- * Usage:
92
- *
93
- * @include for-ltl {
91
+ * @mixin for-ltl
92
+ * @description Mixin for applying styles for screens greater than or equal to 1440pxpx.
93
+ * @example
94
+ * @include for-ltl {
94
95
  * // your styles here
95
- * }
96
+ * }
96
97
  */
97
98
  @mixin for-ltl() {
98
99
  @include mob-first(ltl) {
@@ -101,12 +102,12 @@
101
102
  }
102
103
 
103
104
  /**
104
- * Mixin for applying styles for screens greater than or equal to 1920pxpx.
105
- * Usage:
106
- *
107
- * @include for-xl {
105
+ * @mixin for-xl
106
+ * @description Mixin for applying styles for screens greater than or equal to 1920pxpx.
107
+ * @example
108
+ * @include for-xl {
108
109
  * // your styles here
109
- * }
110
+ * }
110
111
  */
111
112
  @mixin for-xl() {
112
113
  @include mob-first(xl) {
@@ -115,12 +116,12 @@
115
116
  }
116
117
 
117
118
  /**
118
- * Mixin for applying styles for screens greater than or equal to 2560pxpx.
119
- * Usage:
120
- *
121
- * @include for-xxl {
119
+ * @mixin for-xxl
120
+ * @description Mixin for applying styles for screens greater than or equal to 2560pxpx.
121
+ * @example
122
+ * @include for-xxl {
122
123
  * // your styles here
123
- * }
124
+ * }
124
125
  */
125
126
  @mixin for-xxl() {
126
127
  @include mob-first(xxl) {
@@ -129,12 +130,12 @@
129
130
  }
130
131
 
131
132
  /**
132
- * Mixin for applying styles for screens greater than or equal to 3840pxpx.
133
- * Usage:
134
- *
135
- * @include for-qxl {
133
+ * @mixin for-qxl
134
+ * @description Mixin for applying styles for screens greater than or equal to 3840pxpx.
135
+ * @example
136
+ * @include for-qxl {
136
137
  * // your styles here
137
- * }
138
+ * }
138
139
  */
139
140
  @mixin for-qxl() {
140
141
  @include mob-first(qxl) {
@@ -144,12 +145,12 @@
144
145
 
145
146
 
146
147
  /**
147
- * Mixin for applying styles for screens less than 320pxpx.
148
- * Usage:
149
- *
150
- * @include before-xs {
148
+ * @mixin before-xs
149
+ * @description Mixin for applying styles for screens less than 320pxpx.
150
+ * @example
151
+ * @include before-xs {
151
152
  * // your styles here
152
- * }
153
+ * }
153
154
  */
154
155
  @mixin before-xs() {
155
156
  @include desk-first(xs) {
@@ -158,12 +159,12 @@
158
159
  }
159
160
 
160
161
  /**
161
- * Mixin for applying styles for screens less than 576pxpx.
162
- * Usage:
163
- *
164
- * @include before-sm {
162
+ * @mixin before-sm
163
+ * @description Mixin for applying styles for screens less than 576pxpx.
164
+ * @example
165
+ * @include before-sm {
165
166
  * // your styles here
166
- * }
167
+ * }
167
168
  */
168
169
  @mixin before-sm() {
169
170
  @include desk-first(sm) {
@@ -172,12 +173,12 @@
172
173
  }
173
174
 
174
175
  /**
175
- * Mixin for applying styles for screens less than 768pxpx.
176
- * Usage:
177
- *
178
- * @include before-md {
176
+ * @mixin before-md
177
+ * @description Mixin for applying styles for screens less than 768pxpx.
178
+ * @example
179
+ * @include before-md {
179
180
  * // your styles here
180
- * }
181
+ * }
181
182
  */
182
183
  @mixin before-md() {
183
184
  @include desk-first(md) {
@@ -186,12 +187,12 @@
186
187
  }
187
188
 
188
189
  /**
189
- * Mixin for applying styles for screens less than 992pxpx.
190
- * Usage:
191
- *
192
- * @include before-lg {
190
+ * @mixin before-lg
191
+ * @description Mixin for applying styles for screens less than 992pxpx.
192
+ * @example
193
+ * @include before-lg {
193
194
  * // your styles here
194
- * }
195
+ * }
195
196
  */
196
197
  @mixin before-lg() {
197
198
  @include desk-first(lg) {
@@ -200,12 +201,12 @@
200
201
  }
201
202
 
202
203
  /**
203
- * Mixin for applying styles for screens less than 1024pxpx.
204
- * Usage:
205
- *
206
- * @include before-lt {
204
+ * @mixin before-lt
205
+ * @description Mixin for applying styles for screens less than 1024pxpx.
206
+ * @example
207
+ * @include before-lt {
207
208
  * // your styles here
208
- * }
209
+ * }
209
210
  */
210
211
  @mixin before-lt() {
211
212
  @include desk-first(lt) {
@@ -214,12 +215,12 @@
214
215
  }
215
216
 
216
217
  /**
217
- * Mixin for applying styles for screens less than 1200pxpx.
218
- * Usage:
219
- *
220
- * @include before-ltm {
218
+ * @mixin before-ltm
219
+ * @description Mixin for applying styles for screens less than 1200pxpx.
220
+ * @example
221
+ * @include before-ltm {
221
222
  * // your styles here
222
- * }
223
+ * }
223
224
  */
224
225
  @mixin before-ltm() {
225
226
  @include desk-first(ltm) {
@@ -228,12 +229,12 @@
228
229
  }
229
230
 
230
231
  /**
231
- * Mixin for applying styles for screens less than 1440pxpx.
232
- * Usage:
233
- *
234
- * @include before-ltl {
232
+ * @mixin before-ltl
233
+ * @description Mixin for applying styles for screens less than 1440pxpx.
234
+ * @example
235
+ * @include before-ltl {
235
236
  * // your styles here
236
- * }
237
+ * }
237
238
  */
238
239
  @mixin before-ltl() {
239
240
  @include desk-first(ltl) {
@@ -242,12 +243,12 @@
242
243
  }
243
244
 
244
245
  /**
245
- * Mixin for applying styles for screens less than 1920pxpx.
246
- * Usage:
247
- *
248
- * @include before-xl {
246
+ * @mixin before-xl
247
+ * @description Mixin for applying styles for screens less than 1920pxpx.
248
+ * @example
249
+ * @include before-xl {
249
250
  * // your styles here
250
- * }
251
+ * }
251
252
  */
252
253
  @mixin before-xl() {
253
254
  @include desk-first(xl) {
@@ -256,12 +257,12 @@
256
257
  }
257
258
 
258
259
  /**
259
- * Mixin for applying styles for screens less than 2560pxpx.
260
- * Usage:
261
- *
262
- * @include before-xxl {
260
+ * @mixin before-xxl
261
+ * @description Mixin for applying styles for screens less than 2560pxpx.
262
+ * @example
263
+ * @include before-xxl {
263
264
  * // your styles here
264
- * }
265
+ * }
265
266
  */
266
267
  @mixin before-xxl() {
267
268
  @include desk-first(xxl) {
@@ -270,12 +271,12 @@
270
271
  }
271
272
 
272
273
  /**
273
- * Mixin for applying styles for screens less than 3840pxpx.
274
- * Usage:
275
- *
276
- * @include before-qxl {
274
+ * @mixin before-qxl
275
+ * @description Mixin for applying styles for screens less than 3840pxpx.
276
+ * @example
277
+ * @include before-qxl {
277
278
  * // your styles here
278
- * }
279
+ * }
279
280
  */
280
281
  @mixin before-qxl() {
281
282
  @include desk-first(qxl) {
@@ -3,12 +3,12 @@
3
3
 
4
4
 
5
5
  /**
6
- * Mixin for applying styles for screens with height greater than or equal to 600pxpx.
7
- * Usage:
8
- *
9
- * @include v-for-xs {
6
+ * @mixin v-for-xs
7
+ * @description Mixin for applying styles for screens with height greater than or equal to 600pxpx.
8
+ * @example
9
+ * @include v-for-xs {
10
10
  * // your styles here
11
- * }
11
+ * }
12
12
  */
13
13
  @mixin v-for-xs() {
14
14
  @include v-mob-first(xs) {
@@ -17,12 +17,12 @@
17
17
  }
18
18
 
19
19
  /**
20
- * Mixin for applying styles for screens with height greater than or equal to 800pxpx.
21
- * Usage:
22
- *
23
- * @include v-for-sm {
20
+ * @mixin v-for-sm
21
+ * @description Mixin for applying styles for screens with height greater than or equal to 800pxpx.
22
+ * @example
23
+ * @include v-for-sm {
24
24
  * // your styles here
25
- * }
25
+ * }
26
26
  */
27
27
  @mixin v-for-sm() {
28
28
  @include v-mob-first(sm) {
@@ -31,12 +31,12 @@
31
31
  }
32
32
 
33
33
  /**
34
- * Mixin for applying styles for screens with height greater than or equal to 1000pxpx.
35
- * Usage:
36
- *
37
- * @include v-for-md {
34
+ * @mixin v-for-md
35
+ * @description Mixin for applying styles for screens with height greater than or equal to 1000pxpx.
36
+ * @example
37
+ * @include v-for-md {
38
38
  * // your styles here
39
- * }
39
+ * }
40
40
  */
41
41
  @mixin v-for-md() {
42
42
  @include v-mob-first(md) {
@@ -45,12 +45,12 @@
45
45
  }
46
46
 
47
47
  /**
48
- * Mixin for applying styles for screens with height greater than or equal to 1200pxpx.
49
- * Usage:
50
- *
51
- * @include v-for-lg {
48
+ * @mixin v-for-lg
49
+ * @description Mixin for applying styles for screens with height greater than or equal to 1200pxpx.
50
+ * @example
51
+ * @include v-for-lg {
52
52
  * // your styles here
53
- * }
53
+ * }
54
54
  */
55
55
  @mixin v-for-lg() {
56
56
  @include v-mob-first(lg) {
@@ -59,12 +59,12 @@
59
59
  }
60
60
 
61
61
  /**
62
- * Mixin for applying styles for screens with height greater than or equal to 1600pxpx.
63
- * Usage:
64
- *
65
- * @include v-for-xl {
62
+ * @mixin v-for-xl
63
+ * @description Mixin for applying styles for screens with height greater than or equal to 1600pxpx.
64
+ * @example
65
+ * @include v-for-xl {
66
66
  * // your styles here
67
- * }
67
+ * }
68
68
  */
69
69
  @mixin v-for-xl() {
70
70
  @include v-mob-first(xl) {
@@ -73,12 +73,12 @@
73
73
  }
74
74
 
75
75
  /**
76
- * Mixin for applying styles for screens with height greater than or equal to 1601pxpx.
77
- * Usage:
78
- *
79
- * @include v-for-xxl {
76
+ * @mixin v-for-xxl
77
+ * @description Mixin for applying styles for screens with height greater than or equal to 1601pxpx.
78
+ * @example
79
+ * @include v-for-xxl {
80
80
  * // your styles here
81
- * }
81
+ * }
82
82
  */
83
83
  @mixin v-for-xxl() {
84
84
  @include v-mob-first(xxl) {
@@ -88,12 +88,12 @@
88
88
 
89
89
 
90
90
  /**
91
- * Mixin for applying styles for screens with height less than 600pxpx.
92
- * Usage:
93
- *
94
- * @include v-before-xs {
91
+ * @mixin v-before-xs
92
+ * @description Mixin for applying styles for screens with height less than 600pxpx.
93
+ * @example
94
+ * @include v-before-xs {
95
95
  * // your styles here
96
- * }
96
+ * }
97
97
  */
98
98
  @mixin v-before-xs() {
99
99
  @include v-desk-first(xs) {
@@ -102,12 +102,12 @@
102
102
  }
103
103
 
104
104
  /**
105
- * Mixin for applying styles for screens with height less than 800pxpx.
106
- * Usage:
107
- *
108
- * @include v-before-sm {
105
+ * @mixin v-before-sm
106
+ * @description Mixin for applying styles for screens with height less than 800pxpx.
107
+ * @example
108
+ * @include v-before-sm {
109
109
  * // your styles here
110
- * }
110
+ * }
111
111
  */
112
112
  @mixin v-before-sm() {
113
113
  @include v-desk-first(sm) {
@@ -116,12 +116,12 @@
116
116
  }
117
117
 
118
118
  /**
119
- * Mixin for applying styles for screens with height less than 1000pxpx.
120
- * Usage:
121
- *
122
- * @include v-before-md {
119
+ * @mixin v-before-md
120
+ * @description Mixin for applying styles for screens with height less than 1000pxpx.
121
+ * @example
122
+ * @include v-before-md {
123
123
  * // your styles here
124
- * }
124
+ * }
125
125
  */
126
126
  @mixin v-before-md() {
127
127
  @include v-desk-first(md) {
@@ -130,12 +130,12 @@
130
130
  }
131
131
 
132
132
  /**
133
- * Mixin for applying styles for screens with height less than 1200pxpx.
134
- * Usage:
135
- *
136
- * @include v-before-lg {
133
+ * @mixin v-before-lg
134
+ * @description Mixin for applying styles for screens with height less than 1200pxpx.
135
+ * @example
136
+ * @include v-before-lg {
137
137
  * // your styles here
138
- * }
138
+ * }
139
139
  */
140
140
  @mixin v-before-lg() {
141
141
  @include v-desk-first(lg) {
@@ -144,12 +144,12 @@
144
144
  }
145
145
 
146
146
  /**
147
- * Mixin for applying styles for screens with height less than 1600pxpx.
148
- * Usage:
149
- *
150
- * @include v-before-xl {
147
+ * @mixin v-before-xl
148
+ * @description Mixin for applying styles for screens with height less than 1600pxpx.
149
+ * @example
150
+ * @include v-before-xl {
151
151
  * // your styles here
152
- * }
152
+ * }
153
153
  */
154
154
  @mixin v-before-xl() {
155
155
  @include v-desk-first(xl) {
@@ -158,12 +158,12 @@
158
158
  }
159
159
 
160
160
  /**
161
- * Mixin for applying styles for screens with height less than 1601pxpx.
162
- * Usage:
163
- *
164
- * @include v-before-xxl {
161
+ * @mixin v-before-xxl
162
+ * @description Mixin for applying styles for screens with height less than 1601pxpx.
163
+ * @example
164
+ * @include v-before-xxl {
165
165
  * // your styles here
166
- * }
166
+ * }
167
167
  */
168
168
  @mixin v-before-xxl() {
169
169
  @include v-desk-first(xxl) {