Skip to main content

encre_css/plugins/sizing/
mod.rs

1//! Sizing utilities
2pub mod height;
3pub mod max_height;
4pub mod max_width;
5pub mod min_height;
6pub mod min_width;
7pub mod width;
8
9use crate::prelude::build_plugin::*;
10
11pub(super) const CSS_SIZE_VALUES_HORIZONTAL: phf::Map<&'static str, &'static str> = map! {
12    "none" => "none",
13    "screen" => "100vw",
14    "min" => "min-content",
15    "max" => "max-content",
16    "fit" => "fit-content",
17    "svw" => "100svw",
18    "lvw" => "100lvw",
19    "dvw" => "100dvw",
20    "svh" => "100svh",
21    "lvh" => "100lvh",
22    "dvh" => "100dvh",
23};
24
25pub(super) const CSS_SIZE_VALUES_VERTICAL: phf::Map<&'static str, &'static str> = map! {
26    "none" => "none",
27    "screen" => "100vh",
28    "min" => "min-content",
29    "max" => "max-content",
30    "fit" => "fit-content",
31    "svw" => "100svw",
32    "lvw" => "100lvw",
33    "dvw" => "100dvw",
34    "svh" => "100svh",
35    "lvh" => "100lvh",
36    "dvh" => "100dvh",
37};
38
39#[cfg(test)]
40mod tests {
41    use crate::{generate, utils::testing::base_config};
42
43    use pretty_assertions::assert_eq;
44
45    #[test]
46    fn height() {
47        assert_eq!(
48            generate(["h-px"], &base_config()),
49            ".h-px {
50  height: 1px;
51}"
52        );
53        assert_eq!(
54            generate(["h-2.5"], &base_config()),
55            r".h-2\.5 {
56  height: 0.625rem;
57}"
58        );
59        assert_eq!(
60            generate(["h-60"], &base_config()),
61            ".h-60 {
62  height: 15rem;
63}"
64        );
65        assert_eq!(
66            generate(["-h-60"], &base_config()),
67            ".-h-60 {
68  height: -15rem;
69}"
70        );
71        assert_eq!(
72            generate(["h-auto"], &base_config()),
73            ".h-auto {
74  height: auto;
75}"
76        );
77        assert_eq!(
78            generate(["h-1/3"], &base_config()),
79            r".h-1\/3 {
80  height: 33.333333%;
81}"
82        );
83        assert_eq!(
84            generate(["-h-2/3"], &base_config()),
85            r".-h-2\/3 {
86  height: -66.666667%;
87}"
88        );
89        assert_eq!(
90            generate(["h-full"], &base_config()),
91            ".h-full {
92  height: 100%;
93}"
94        );
95        assert_eq!(
96            generate(["h-screen"], &base_config()),
97            ".h-screen {
98  height: 100vh;
99}"
100        );
101        assert_eq!(
102            generate(["h-lvh"], &base_config()),
103            ".h-lvh {
104  height: 100lvh;
105}"
106        );
107        assert_eq!(
108            generate(["h-fit"], &base_config()),
109            ".h-fit {
110  height: fit-content;
111}"
112        );
113        assert_eq!(
114            generate(["h-[32.555rem]"], &base_config()),
115            r".h-\[32\.555rem\] {
116  height: 32.555rem;
117}"
118        );
119        assert_eq!(
120            generate(["h-[10%]"], &base_config()),
121            r".h-\[10\%\] {
122  height: 10%;
123}"
124        );
125    }
126
127    #[test]
128    fn max_height() {
129        assert_eq!(
130            generate(["max-h-px"], &base_config()),
131            ".max-h-px {
132  max-height: 1px;
133}"
134        );
135        assert_eq!(
136            generate(["max-h-2.5"], &base_config()),
137            r".max-h-2\.5 {
138  max-height: 0.625rem;
139}"
140        );
141        assert_eq!(
142            generate(["max-h-60"], &base_config()),
143            ".max-h-60 {
144  max-height: 15rem;
145}"
146        );
147        assert_eq!(
148            generate(["-max-h-60"], &base_config()),
149            ".-max-h-60 {
150  max-height: -15rem;
151}"
152        );
153        assert_eq!(
154            generate(["max-h-auto"], &base_config()),
155            ".max-h-auto {
156  max-height: auto;
157}"
158        );
159        assert_eq!(
160            generate(["max-h-none"], &base_config()),
161            ".max-h-none {
162  max-height: none;
163}"
164        );
165        assert_eq!(
166            generate(["max-h-1/3"], &base_config()),
167            r".max-h-1\/3 {
168  max-height: 33.333333%;
169}"
170        );
171        assert_eq!(
172            generate(["-max-h-2/3"], &base_config()),
173            r".-max-h-2\/3 {
174  max-height: -66.666667%;
175}"
176        );
177        assert_eq!(
178            generate(["max-h-full"], &base_config()),
179            ".max-h-full {
180  max-height: 100%;
181}"
182        );
183        assert_eq!(
184            generate(["max-h-screen"], &base_config()),
185            ".max-h-screen {
186  max-height: 100vh;
187}"
188        );
189        assert_eq!(
190            generate(["max-h-lvh"], &base_config()),
191            ".max-h-lvh {
192  max-height: 100lvh;
193}"
194        );
195        assert_eq!(
196            generate(["max-h-fit"], &base_config()),
197            ".max-h-fit {
198  max-height: fit-content;
199}"
200        );
201        assert_eq!(
202            generate(["max-h-[32.555rem]"], &base_config()),
203            r".max-h-\[32\.555rem\] {
204  max-height: 32.555rem;
205}"
206        );
207        assert_eq!(
208            generate(["max-h-[10%]"], &base_config()),
209            r".max-h-\[10\%\] {
210  max-height: 10%;
211}"
212        );
213    }
214
215    #[test]
216    fn max_width() {
217        assert_eq!(
218            generate(["max-w-6xl"], &base_config()),
219            ".max-w-6xl {
220  max-width: 72rem;
221}"
222        );
223        assert_eq!(
224            generate(["max-w-prose"], &base_config()),
225            ".max-w-prose {
226  max-width: 65ch;
227}"
228        );
229        assert_eq!(
230            generate(["max-w-screen-xl"], &base_config()),
231            ".max-w-screen-xl {
232  max-width: 1280px;
233}"
234        );
235        assert_eq!(
236            generate(["max-w-px"], &base_config()),
237            ".max-w-px {
238  max-width: 1px;
239}"
240        );
241        assert_eq!(
242            generate(["max-w-2.5"], &base_config()),
243            r".max-w-2\.5 {
244  max-width: 0.625rem;
245}"
246        );
247        assert_eq!(
248            generate(["max-w-60"], &base_config()),
249            ".max-w-60 {
250  max-width: 15rem;
251}"
252        );
253        assert_eq!(
254            generate(["-max-w-60"], &base_config()),
255            ".-max-w-60 {
256  max-width: -15rem;
257}"
258        );
259        assert_eq!(
260            generate(["max-w-none"], &base_config()),
261            ".max-w-none {
262  max-width: none;
263}"
264        );
265        assert_eq!(
266            generate(["max-w-1/3"], &base_config()),
267            r".max-w-1\/3 {
268  max-width: 33.333333%;
269}"
270        );
271        assert_eq!(
272            generate(["-max-w-2/3"], &base_config()),
273            r".-max-w-2\/3 {
274  max-width: -66.666667%;
275}"
276        );
277        assert_eq!(
278            generate(["max-w-full"], &base_config()),
279            ".max-w-full {
280  max-width: 100%;
281}"
282        );
283        assert_eq!(
284            generate(["max-w-screen"], &base_config()),
285            ".max-w-screen {
286  max-width: 100vw;
287}"
288        );
289        assert_eq!(
290            generate(["max-w-fit"], &base_config()),
291            ".max-w-fit {
292  max-width: fit-content;
293}"
294        );
295        assert_eq!(
296            generate(["max-w-[32.555rem]"], &base_config()),
297            r".max-w-\[32\.555rem\] {
298  max-width: 32.555rem;
299}"
300        );
301        assert_eq!(
302            generate(["max-w-[10%]"], &base_config()),
303            r".max-w-\[10\%\] {
304  max-width: 10%;
305}"
306        );
307    }
308
309    #[test]
310    fn min_height() {
311        assert_eq!(
312            generate(["min-h-px"], &base_config()),
313            ".min-h-px {
314  min-height: 1px;
315}"
316        );
317        assert_eq!(
318            generate(["min-h-2.5"], &base_config()),
319            r".min-h-2\.5 {
320  min-height: 0.625rem;
321}"
322        );
323        assert_eq!(
324            generate(["min-h-60"], &base_config()),
325            ".min-h-60 {
326  min-height: 15rem;
327}"
328        );
329        assert_eq!(
330            generate(["-min-h-60"], &base_config()),
331            ".-min-h-60 {
332  min-height: -15rem;
333}"
334        );
335        assert_eq!(
336            generate(["min-h-auto"], &base_config()),
337            ".min-h-auto {
338  min-height: auto;
339}"
340        );
341        assert_eq!(
342            generate(["min-h-1/3"], &base_config()),
343            r".min-h-1\/3 {
344  min-height: 33.333333%;
345}"
346        );
347        assert_eq!(
348            generate(["-min-h-2/3"], &base_config()),
349            r".-min-h-2\/3 {
350  min-height: -66.666667%;
351}"
352        );
353        assert_eq!(
354            generate(["min-h-full"], &base_config()),
355            ".min-h-full {
356  min-height: 100%;
357}"
358        );
359        assert_eq!(
360            generate(["min-h-screen"], &base_config()),
361            ".min-h-screen {
362  min-height: 100vh;
363}"
364        );
365        assert_eq!(
366            generate(["min-h-lvh"], &base_config()),
367            ".min-h-lvh {
368  min-height: 100lvh;
369}"
370        );
371        assert_eq!(
372            generate(["min-h-fit"], &base_config()),
373            ".min-h-fit {
374  min-height: fit-content;
375}"
376        );
377        assert_eq!(
378            generate(["min-h-[32.555rem]"], &base_config()),
379            r".min-h-\[32\.555rem\] {
380  min-height: 32.555rem;
381}"
382        );
383        assert_eq!(
384            generate(["min-h-[10%]"], &base_config()),
385            r".min-h-\[10\%\] {
386  min-height: 10%;
387}"
388        );
389    }
390
391    #[test]
392    fn min_width() {
393        assert_eq!(
394            generate(["min-w-px"], &base_config()),
395            ".min-w-px {
396  min-width: 1px;
397}"
398        );
399        assert_eq!(
400            generate(["min-w-2.5"], &base_config()),
401            r".min-w-2\.5 {
402  min-width: 0.625rem;
403}"
404        );
405        assert_eq!(
406            generate(["min-w-60"], &base_config()),
407            ".min-w-60 {
408  min-width: 15rem;
409}"
410        );
411        assert_eq!(
412            generate(["-min-w-60"], &base_config()),
413            ".-min-w-60 {
414  min-width: -15rem;
415}"
416        );
417        assert_eq!(
418            generate(["min-w-auto"], &base_config()),
419            ".min-w-auto {
420  min-width: auto;
421}"
422        );
423        assert_eq!(
424            generate(["min-w-1/3"], &base_config()),
425            r".min-w-1\/3 {
426  min-width: 33.333333%;
427}"
428        );
429        assert_eq!(
430            generate(["-min-w-2/3"], &base_config()),
431            r".-min-w-2\/3 {
432  min-width: -66.666667%;
433}"
434        );
435        assert_eq!(
436            generate(["min-w-full"], &base_config()),
437            ".min-w-full {
438  min-width: 100%;
439}"
440        );
441        assert_eq!(
442            generate(["min-w-screen"], &base_config()),
443            ".min-w-screen {
444  min-width: 100vw;
445}"
446        );
447        assert_eq!(
448            generate(["min-w-fit"], &base_config()),
449            ".min-w-fit {
450  min-width: fit-content;
451}"
452        );
453        assert_eq!(
454            generate(["min-w-[32.555rem]"], &base_config()),
455            r".min-w-\[32\.555rem\] {
456  min-width: 32.555rem;
457}"
458        );
459        assert_eq!(
460            generate(["min-w-[10%]"], &base_config()),
461            r".min-w-\[10\%\] {
462  min-width: 10%;
463}"
464        );
465    }
466
467    #[test]
468    fn width() {
469        assert_eq!(
470            generate(["w-px"], &base_config()),
471            ".w-px {
472  width: 1px;
473}"
474        );
475        assert_eq!(
476            generate(["w-2.5"], &base_config()),
477            r".w-2\.5 {
478  width: 0.625rem;
479}"
480        );
481        assert_eq!(
482            generate(["w-60"], &base_config()),
483            ".w-60 {
484  width: 15rem;
485}"
486        );
487        assert_eq!(
488            generate(["-w-60"], &base_config()),
489            ".-w-60 {
490  width: -15rem;
491}"
492        );
493        assert_eq!(
494            generate(["w-auto"], &base_config()),
495            ".w-auto {
496  width: auto;
497}"
498        );
499        assert_eq!(
500            generate(["w-1/3"], &base_config()),
501            r".w-1\/3 {
502  width: 33.333333%;
503}"
504        );
505        assert_eq!(
506            generate(["-w-2/3"], &base_config()),
507            r".-w-2\/3 {
508  width: -66.666667%;
509}"
510        );
511        assert_eq!(
512            generate(["w-full"], &base_config()),
513            ".w-full {
514  width: 100%;
515}"
516        );
517        assert_eq!(
518            generate(["w-screen"], &base_config()),
519            ".w-screen {
520  width: 100vw;
521}"
522        );
523        assert_eq!(
524            generate(["w-lvw"], &base_config()),
525            ".w-lvw {
526  width: 100lvw;
527}"
528        );
529        assert_eq!(
530            generate(["w-fit"], &base_config()),
531            ".w-fit {
532  width: fit-content;
533}"
534        );
535        assert_eq!(
536            generate(["w-[32.555rem]"], &base_config()),
537            r".w-\[32\.555rem\] {
538  width: 32.555rem;
539}"
540        );
541        assert_eq!(
542            generate(["w-[10%]"], &base_config()),
543            r".w-\[10\%\] {
544  width: 10%;
545}"
546        );
547    }
548}