0 | module Text.CSS.Extra
2 | import public Text.HTML
3 | import public Text.HTML.DomID
4 | import public Text.CSS
13 | attr : (t -> Attribute ()) -> t -> Selector
16 | Str n v => Attr n $
Equals v
17 | Bool n _ => Attr n Set
21 | boolAttr : (Bool -> Attribute ()) -> Selector
22 | boolAttr f = attr f True
25 | domID : DomID -> Declarations -> Rule n
29 | attribute : (t -> Attribute ()) -> t -> Declarations -> Rule n
30 | attribute f = sel . attr f
37 | noBorder : Declaration
38 | noBorder = borderStyle (All None)
41 | border : BorderWidth -> Color -> Declarations
43 | [borderStyle (All Solid), borderWidth (All w), borderColor (All c)]
46 | border1 : Color -> Declarations
47 | border1 = border 1.px
50 | border2 : Color -> Declarations
51 | border2 = border 2.px
54 | border3 : Color -> Declarations
55 | border3 = border 3.px
58 | borderH : BorderWidth -> Color -> Declarations
60 | [ borderStyle (VH None Solid)
61 | , borderWidth (VH 0.px w)
62 | , borderColor (VH transparent c)
66 | borderH1 : Color -> Declarations
67 | borderH1 = borderH 1.px
70 | borderH2 : Color -> Declarations
71 | borderH2 = borderH 2.px
74 | borderH3 : Color -> Declarations
75 | borderH3 = borderH 3.px
78 | borderV : BorderWidth -> Color -> Declarations
80 | [ borderStyle (VH Solid None)
81 | , borderWidth (VH w 0.px)
82 | , borderColor (VH c transparent)
86 | borderV1 : Color -> Declarations
87 | borderV1 = borderV 1.px
90 | borderV2 : Color -> Declarations
91 | borderV2 = borderV 2.px
94 | borderV3 : Color -> Declarations
95 | borderV3 = borderV 3.px
98 | borderT : BorderWidth -> Color -> Declarations
100 | [ borderStyle (Top Solid)
101 | , borderWidth (Top w)
102 | , borderColor (Top c)
106 | borderT1 : Color -> Declarations
107 | borderT1 = borderT 1.px
110 | borderT2 : Color -> Declarations
111 | borderT2 = borderT 2.px
114 | borderT3 : Color -> Declarations
115 | borderT3 = borderT 3.px
118 | borderR : BorderWidth -> Color -> Declarations
120 | [ borderStyle (Right Solid)
121 | , borderWidth (Right w)
122 | , borderColor (Right c)
126 | borderR1 : Color -> Declarations
127 | borderR1 = borderR 1.px
130 | borderR2 : Color -> Declarations
131 | borderR2 = borderR 2.px
134 | borderR3 : Color -> Declarations
135 | borderR3 = borderR 3.px
138 | borderB : BorderWidth -> Color -> Declarations
140 | [ borderStyle (Bottom Solid)
141 | , borderWidth (Bottom w)
142 | , borderColor (Bottom c)
146 | borderB1 : Color -> Declarations
147 | borderB1 = borderB 1.px
150 | borderB2 : Color -> Declarations
151 | borderB2 = borderB 2.px
154 | borderB3 : Color -> Declarations
155 | borderB3 = borderB 3.px
158 | borderL : BorderWidth -> Color -> Declarations
160 | [ borderStyle (Left Solid)
161 | , borderWidth (Left w)
162 | , borderColor (Left c)
166 | borderL1 : Color -> Declarations
167 | borderL1 = borderL 1.px
170 | borderL2 : Color -> Declarations
171 | borderL2 = borderL 2.px
174 | borderL3 : Color -> Declarations
175 | borderL3 = borderL 3.px
178 | borderHB : BorderWidth -> Color -> Declarations
180 | [ borderStyle (THB None Solid Solid)
181 | , borderWidth (THB 0.px w w)
182 | , borderColor (THB transparent c c)
186 | borderHB1 : Color -> Declarations
187 | borderHB1 = borderHB 1.px
190 | borderHB2 : Color -> Declarations
191 | borderHB2 = borderHB 2.px
194 | borderHB3 : Color -> Declarations
195 | borderHB3 = borderHB 3.px
198 | round2 : Declaration
199 | round2 = borderRadius 2.px
202 | round4 : Declaration
203 | round4 = borderRadius 4.px
206 | round8 : Declaration
207 | round8 = borderRadius 8.px
210 | round16 : Declaration
211 | round16 = borderRadius 16.px
214 | round32 : Declaration
215 | round32 = borderRadius 32.px
218 | round : Declaration
219 | round = borderRadius 50.perc
226 | noPadding : Declaration
227 | noPadding = padding (All 0.px)
234 | noMargin : Declaration
235 | noMargin = margin (All 0.px)
242 | exactWidth : Width -> Declarations
243 | exactWidth w = [minWidth w, maxWidth w, width w]
246 | exactHeight : Width -> Declarations
247 | exactHeight h = [minHeight h, maxHeight h, height h]
254 | noflex : Declaration
255 | noflex = flex "0 0 auto"
258 | flex1 : Declaration
262 | flex2 : Declaration
266 | flex3 : Declaration
270 | flex4 : Declaration
274 | flexRow : Declarations
275 | flexRow = [display Flex, flexDirection Row]
278 | startRow : Declarations
279 | startRow = alignItems Start :: flexRow
282 | centerRow : Declarations
283 | centerRow = alignItems Center :: flexRow
286 | endRow : Declarations
287 | endRow = alignItems Center :: flexRow
290 | stretchRow : Declarations
291 | stretchRow = alignItems Stretch :: flexRow
294 | flexCol : Declarations
295 | flexCol = [display Flex, flexDirection Column]
298 | startCol : Declarations
299 | startCol = alignItems Start :: flexCol
302 | centerCol : Declarations
303 | centerCol = alignItems Center :: flexCol
306 | endCol : Declarations
307 | endCol = alignItems Center :: flexCol
310 | stretchCol : Declarations
311 | stretchCol = alignItems Stretch :: flexCol
313 | parameters {default 0.5.em gap : Length}
316 | flexSepRow : Declarations
317 | flexSepRow = [display Flex, columnGap gap, flexDirection Row]
320 | startSepRow : Declarations
321 | startSepRow = alignItems Start :: flexSepRow
324 | centerSepRow : Declarations
325 | centerSepRow = alignItems Center :: flexSepRow
328 | endSepRow : Declarations
329 | endSepRow = alignItems Center :: flexSepRow
332 | stretchSepRow : Declarations
333 | stretchSepRow = alignItems Stretch :: flexSepRow
336 | flexSepCol : Declarations
337 | flexSepCol = [display Flex, rowGap gap, flexDirection Column]
340 | startSepCol : Declarations
341 | startSepCol = alignItems Start :: flexSepCol
344 | centerSepCol : Declarations
345 | centerSepCol = alignItems Center :: flexSepCol
348 | endSepCol : Declarations
349 | endSepCol = alignItems Center :: flexSepCol
352 | stretchSepCol : Declarations
353 | stretchSepCol = alignItems Stretch :: flexSepCol