tailwind-rs 0.2.0

Tailwind translater for html and more
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126


<html lang="en">
<head>
    <meta charset="UTF-8"></meta>
    <link rel="icon" href="https://upload.wikimedia.org/wikipedia/commons/d/d5/Tailwind_CSS_Logo.svg"></link>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"></meta>
    <title>Flexbox tests</title>
</head>
<body>
<!-- https://tailwindcss.com/docs/flex-basis -->
<div style="flex-basis:0rem;"></div>
<div style="flex-basis:0.625rem;"></div>
<div style="flex-basis:0%;"></div>
<div style="flex-basis:50%;"></div>
<div style="flex-basis:100%;"></div>
<div style="flex-basis:100%;"></div>
<div style="flex-basis:auto;"></div>
<div style="flex-basis:min-content;"></div>
<div style="flex-basis:max-content;"></div>
<div style="flex-basis:fit-content;"></div>
<div style="flex-basis:fit-content;"></div>
<div style="flex-basis:1px;"></div>
<div style="flex-basis:unset;"></div>
<div style="flex-basis:unset;"></div>
<div style="flex-basis:calc(20% - 30px);"></div>
<!-- https://tailwindcss.com/docs/flex-direction -->
<div style="flex-direction:column;"></div>
<div style="flex-direction:column-reverse;"></div>
<div style="flex-direction:row;"></div>
<div style="flex-direction:row-reverse;"></div>
<div style="flex-direction:row-reverse;"></div>
<div style="flex-direction:unset;"></div>
<div style="flex-direction:unset;"></div>
<!-- https://tailwindcss.com/docs/flex-wrap -->
<div style="flex-wrap:wrap;"></div>
<div style="flex-wrap:wrap-reverse;"></div>
<div style="flex-wrap:wrap-reverse;"></div>
<div style="flex-wrap:nowrap;"></div>
<div style="flex-wrap:nowrap;"></div>
<div style="flex-wrap:unset;"></div>
<div style="flex-wrap:unset;"></div>
<!-- https://tailwindcss.com/docs/flex -->
<div style="flex:0;"></div>
<div style="flex:0;"></div>
<div style="flex:1;"></div>
<div style="flex:1;"></div>
<div style="flex:auto;"></div>
<div style="flex:initial;"></div>
<div style="flex:none;"></div>
<div style="flex:10 30px;"></div>
<div style="flex:2 2 10%;"></div>
<!-- https://tailwindcss.com/docs/flex-grow -->
<div style="flex-grow:100;"></div>
<div style="flex-grow:0;"></div>
<div style="flex-grow:0;"></div>
<div style="flex-grow:1;"></div>
<div style="flex-grow:1;"></div>
<div style="flex-grow:unset;"></div>
<div style="flex-grow:[unset];"></div>
<!-- https://tailwindcss.com/docs/flex-shrink -->
<div style="flex-shrink:1;"></div>
<div style="flex-shrink:0;"></div>
<div style="flex-shrink:0;"></div>
<div style="flex-shrink:0.01;"></div>
<div style="flex-shrink:0.01;"></div>
<div style="flex-shrink:unset;"></div>
<div style="flex-shrink:unset;"></div>
<!-- https://tailwindcss.com/docs/order -->
<div style="order:0;"></div>
<div style="order:0;"></div>
<div style="order:0;"></div>
<div style="order:1;"></div>
<div style="order:1;"></div>
<div style="order:9999;"></div>
<div style="order:9999;"></div>
<div style="order:unset;"></div>
<div style="order:[unset];"></div>
<!-- https://tailwindcss.com/docs/grid-template-columns -->
<div style="grid-template-columns:repeat(1,minmax(0,1fr));"></div>
<div style="grid-template-columns:repeat(0,minmax(0,1fr));"></div>
<div style="grid-template-columns:none;"></div>
<div class="grid-cols-unset"></div>
<div style="grid-template-columns:unset;"></div>
<!-- https://tailwindcss.com/docs/grid-column -->
<div style="grid-column:auto;"></div>
<!-- https://tailwindcss.com/docs/grid-template-rows -->
<div style="grid-template-rows:repeat(1,minmax(0,1fr));"></div>
<!-- https://tailwindcss.com/docs/grid-row -->
<div style="grid-row:auto;"></div>
<!-- https://tailwindcss.com/docs/grid-auto-flow -->
<div style="grid-auto-flow:row;"></div>
<div style="grid-auto-flow:column;"></div>
<div style="grid-auto-flow:row dense;"></div>
<div style="grid-auto-flow:column dense;"></div>
<!-- https://tailwindcss.com/docs/grid-auto-columns -->
<div style="grid-auto-columns:auto;"></div>
<div style="grid-auto-columns:min-content;"></div>
<div style="grid-auto-columns:max-content;"></div>
<div style="grid-auto-columns:minmax(0,1fr);"></div>
<!-- https://tailwindcss.com/docs/grid-auto-rows -->
<div style="grid-auto-rows:auto;"></div>
<div style="grid-auto-rows:min-content;"></div>
<div style="grid-auto-rows:max-content;"></div>
<div style="grid-auto-rows:minmax(0,1fr);"></div>
<!-- https://tailwindcss.com/docs/gap -->
<div style="gap:0rem;"></div>
<div style="column-gap:0rem;"></div>
<div style="row-gap:0rem;"></div>
<!-- https://tailwindcss.com/docs/justify-content -->
<div style="justify-content:start;"></div>
<!-- https://tailwindcss.com/docs/justify-items -->
<div style="justify-items:start;"></div>
<!-- https://tailwindcss.com/docs/justify-self -->
<div style="justify-self:start;"></div>
<!-- https://tailwindcss.com/docs/align-content -->
<div style="align-content:start;"></div>
<!-- https://tailwindcss.com/docs/align-items -->
<div style="align-self:start;"></div>
<!-- https://tailwindcss.com/docs/place-content -->
<div style="place-content:start;"></div>
<!-- https://tailwindcss.com/docs/place-items -->
<div style="place-items:start;"></div>
<!-- https://tailwindcss.com/docs/place-self -->
<div style="place-self:start;"></div>
</body>
</html>