@@ -1,109 +1,4 @@
1−module Internal.Model exposing
2− ( Aligned(..)
3− , Angle
4− , Attribute(..)
5− , Axis(..)
6− , Children(..)
7− , Color(..)
8− , Description(..)
9− , Element(..)
10− , EmbedStyle(..)
11− , FocusStyle
12− , Font(..)
13− , Gathered
14− , HAlign(..)
15− , HoverSetting(..)
16− , LayoutContext(..)
17− , Length(..)
18− , Location(..)
19− , NearbyChildren(..)
20− , NodeName(..)
21− , Option(..)
22− , OptionRecord
23− , Padding(..)
24− , Property(..)
25− , PseudoClass(..)
26− , RenderMode(..)
27− , Shadow
28− , Spacing(..)
29− , Style(..)
30− , TransformComponent(..)
31− , Transformation(..)
32− , VAlign(..)
33− , Variant(..)
34− , XYZ
35− , addNodeName
36− , addWhen
37− , alignXName
38− , alignYName
39− , asColumn
40− , asEl
41− , asGrid
42− , asParagraph
43− , asRow
44− , asTextColumn
45− , boxShadowClass
46− , columnClass
47− , composeTransformation
48− , contextClasses
49− , createElement
50− , defaultOptions
51− , div
52− , element
53− , embedKeyed
54− , embedWith
55− , extractSpacingAndPadding
56− , filter
57− , finalizeNode
58− , floatClass
59− , focusDefaultStyle
60− , formatBoxShadow
61− , formatColor
62− , formatColorClass
63− , formatDropShadow
64− , formatTextShadow
65− , gatherAttrRecursive
66− , get
67− , getHeight
68− , getSpacing
69− , getStyleName
70− , getWidth
71− , gridClass
72− , htmlClass
73− , isContent
74− , lengthClassName
75− , map
76− , mapAttr
77− , mapAttrFromStyle
78− , noStyleSheet
79− , onlyStyles
80− , optionsToRecord
81− , paddingName
82− , paddingNameFloat
83− , pageClass
84− , paragraphClass
85− , reduceRecursive
86− , reduceStyles
87− , reduceStylesRecursive
88− , removeNever
89− , renderFontClassName
90− , renderHeight
91− , renderRoot
92− , renderVariant
93− , renderWidth
94− , rootStyle
95− , rowClass
96− , singleClass
97− , spacingName
98− , tag
99− , textShadowClass
100− , toHtml
101− , toStyleSheet
102− , transformClass
103− , unstyled
104− , unwrapDecorations
105− , variantName
106− )
1+module Internal.Model exposing (Aligned(..), Angle, Attribute(..), Axis(..), Children(..), Color(..), Description(..), Element(..), EmbedStyle(..), FocusStyle, Font(..), Gathered, HAlign(..), HoverSetting(..), LayoutContext(..), Length(..), Location(..), NodeName(..), Option(..), OptionRecord, Padding(..), Property(..), PseudoClass(..), RenderMode(..), Shadow, Spacing(..), Style(..), TransformComponent(..), Transformation(..), VAlign(..), XYZ, addNodeName, addWhen, alignXName, alignYName, asColumn, asEl, asGrid, asParagraph, asRow, asTextColumn, boxShadowName, columnClass, composeTransformation, contextClasses, createElement, defaultOptions, div, element, embedKeyed, embedWith, extractSpacingAndPadding, filter, finalizeNode, floatClass, focusDefaultStyle, formatBoxShadow, formatColor, formatColorClass, formatDropShadow, formatTextShadow, gatherAttrRecursive, get, getHeight, getSpacing, getStyleName, getWidth, gridClass, htmlClass, lengthClassName, map, mapAttr, mapAttrFromStyle, noStyleSheet, onlyStyles, optionsToRecord, paddingName, pageClass, paragraphClass, reduceRecursive, reduceRecursiveCalcName, reduceStyles, reduceStylesRecursive, removeNever, renderFocusStyle, renderFont, renderFontClassName, renderHeight, renderRoot, renderWidth, rootStyle, rowClass, singleClass, skippable, sortedReduce, spacingName, staticRoot, tag, textElement, textElementFill, textShadowName, toHtml, toStyleSheet, toStyleSheetString, transformClass, transformValue, unit, unstyled, untransformed, unwrapDecorations, unwrapDecsHelper)
1072
1083{-| -}
1094
@@ -112,7 +7,7 @@ import Html.Attributes
1127import Html.Keyed
1138import Internal.Flag as Flag exposing (Flag)
1149import Internal.Style exposing (classes, dot)
115−import Json.Encode as Encode
10+import Json.Encode as Json
11611import Set exposing (Set)
11712import VirtualDom
11813
@@ -173,8 +68,7 @@ type Style
17368 | Single String String String
17469 | Colored String String Color
17570 | SpacingStyle String Int Int
176− | BorderWidth String Int Int Int Int
177− | PaddingStyle String Float Float Float Float
71+ | PaddingStyle String Int Int Int Int
17872 | GridTemplateStyle
17973 { spacing : ( Length, Length )
18074 , columns : List Length
@@ -205,86 +99,12 @@ type PseudoClass
20599 | Active
206100
207101
208−{-| -}
209−type alias Adjustment =
210− { capital : Float
211− , lowercase : Float
212− , baseline : Float
213− , descender : Float
214− }
215−
216−
217102type Font
218103 = Serif
219104 | SansSerif
220105 | Monospace
221106 | Typeface String
222107 | ImportFont String String
223− | FontWith
224− { name : String
225− , adjustment : Maybe Adjustment
226− , variants : List Variant
227− }
228−
229−
230−type Variant
231− = VariantActive String
232− | VariantOff String
233− | VariantIndexed String Int
234−
235−
236−renderVariant var =
237− case var of
238− VariantActive name ->
239− "\"" ++ name ++ "\""
240−
241− VariantOff name ->
242− "\"" ++ name ++ "\" 0"
243−
244− VariantIndexed name index ->
245− "\"" ++ name ++ "\" " ++ String.fromInt index
246−
247−
248−variantName var =
249− case var of
250− VariantActive name ->
251− name
252−
253− VariantOff name ->
254− name ++ "-0"
255−
256− VariantIndexed name index ->
257− name ++ "-" ++ String.fromInt index
258−
259−
260−renderVariants typeface =
261− case typeface of
262− FontWith font ->
263− Just (String.join ", " (List.map renderVariant font.variants))
264−
265− _ ->
266− Nothing
267−
268−
269−isSmallCaps var =
270− case var of
271− VariantActive name ->
272− name == "smcp"
273−
274− VariantOff name ->
275− False
276−
277− VariantIndexed name index ->
278− name == "smcp" && index == 1
279−
280−
281−hasSmallCaps typeface =
282− case typeface of
283− FontWith font ->
284− List.any isSmallCaps font.variants
285−
286− _ ->
287− False
288108
289109
290110type Property
@@ -372,13 +192,6 @@ type NodeName
372192 | Embedded String String
373193
374194
375−type NearbyChildren msg
376− = NoNearbyChildren
377− | ChildrenBehind (List (Html.Html msg))
378− | ChildrenInFront (List (Html.Html msg))
379− | ChildrenBehindAndInFront (List (Html.Html msg)) (List (Html.Html msg))
380−
381−
382195div =
383196 Generic
384197
@@ -387,7 +200,7 @@ type alias Gathered msg =
387200 { node : NodeName
388201 , attributes : List (VirtualDom.Attribute msg)
389202 , styles : List Style
390− , children : NearbyChildren msg
203+ , children : List (VirtualDom.Node msg)
391204 , has : Flag.Field
392205 }
393206
@@ -455,10 +268,7 @@ finalizeNode has node attributes children embedMode parentContext =
455268 Embedded nodeName internal ->
456269 VirtualDom.node nodeName
457270 attributes
458− [ createNode internal
459− [ Html.Attributes.class
460− (classes.any ++ " " ++ classes.single)
461− ]
271+ [ createNode internal [ Html.Attributes.class (classes.any ++ " " ++ classes.single) ]
462272 ]
463273 in
464274 case parentContext of
@@ -535,45 +345,49 @@ finalizeNode has node attributes children embedMode parentContext =
535345
536346
537347embedWith static opts styles children =
538− let
539− dynamicStyleSheet =
540− styles
541− |> List.foldl reduceStyles ( Set.empty, renderFocusStyle opts.focus )
542− |> Tuple.second
543− -- |> reduceStylesRecursive Set.empty [ ]) --renderFocusStyle opts.focus ]
544− -- |> sortedReduce
545− |> toStyleSheet opts
546− in
547348 if static then
548− staticRoot opts
549− :: dynamicStyleSheet
349+ staticRoot
350+ :: (styles
351+ |> List.foldl reduceStyles ( Set.empty, [ renderFocusStyle opts.focus ] )
352+ |> Tuple.second
353+ -- |> reduceStylesRecursive Set.empty [ ]) --renderFocusStyle opts.focus ]
354+ -- |> sortedReduce
355+ |> toStyleSheet opts
356+ )
550357 :: children
551358
552359 else
553− dynamicStyleSheet
360+ (styles
361+ |> List.foldl reduceStyles ( Set.empty, [ renderFocusStyle opts.focus ] )
362+ |> Tuple.second
363+ -- |> reduceStylesRecursive Set.empty [ ]) --renderFocusStyle opts.focus ]
364+ -- |> sortedReduce
365+ |> toStyleSheet opts
366+ )
554367 :: children
555368
556369
557370embedKeyed static opts styles children =
558− let
559− dynamicStyleSheet =
560− styles
561− |> List.foldl reduceStyles ( Set.empty, renderFocusStyle opts.focus )
562− |> Tuple.second
563− -- |> reduceStylesRecursive Set.empty [ ]) --renderFocusStyle opts.focus ]
564− -- |> sortedReduce
565− |> toStyleSheet opts
566− in
567371 if static then
568− ( "static-stylesheet", staticRoot opts )
372+ ( "static-stylesheet", staticRoot )
569373 :: ( "dynamic-stylesheet"
570− , dynamicStyleSheet
374+ , styles
375+ |> List.foldl reduceStyles ( Set.empty, [ renderFocusStyle opts.focus ] )
376+ |> Tuple.second
377+ -- |> reduceStylesRecursive Set.empty [ ]) --renderFocusStyle opts.focus ]
378+ -- |> sortedReduce
379+ |> toStyleSheet opts
571380 )
572381 :: children
573382
574383 else
575384 ( "dynamic-stylesheet"
576− , dynamicStyleSheet
385+ , styles
386+ |> List.foldl reduceStyles ( Set.empty, [ renderFocusStyle opts.focus ] )
387+ |> Tuple.second
388+ -- |> reduceStylesRecursive Set.empty [ ]) --renderFocusStyle opts.focus ]
389+ -- |> sortedReduce
390+ |> toStyleSheet opts
577391 )
578392 :: children
579393
@@ -889,16 +703,7 @@ skippable flag style =
889703 False
890704
891705
892−gatherAttrRecursive :
893− String
894− -> NodeName
895− -> Flag.Field
896− -> Transformation
897− -> List Style
898− -> List (VirtualDom.Attribute msg)
899− -> NearbyChildren msg
900− -> List (Attribute aligned msg)
901− -> Gathered msg
706+gatherAttrRecursive : String -> NodeName -> Flag.Field -> Transformation -> List Style -> List (VirtualDom.Attribute msg) -> List (VirtualDom.Node msg) -> List (Attribute aligned msg) -> Gathered msg
902707gatherAttrRecursive classes node has transform styles attrs children elementAttrs =
903708 case elementAttrs of
904709 [] ->
@@ -1032,7 +837,7 @@ gatherAttrRecursive classes node has transform styles attrs children elementAttr
1032837 in
1033838 gatherAttrRecursive (classes ++ " " ++ newClass)
1034839 node
1035− (Flag.merge addToFlags (Flag.add Flag.width has))
840+ (Flag.merge addToFlags has)
1036841 transform
1037842 (newStyles ++ styles)
1038843 attrs
@@ -1053,7 +858,7 @@ gatherAttrRecursive classes node has transform styles attrs children elementAttr
1053858 name =
1054859 "height-px-" ++ val
1055860 in
1056− gatherAttrRecursive (Internal.Style.classes.heightExact ++ " " ++ name ++ " " ++ classes)
861+ gatherAttrRecursive (name ++ " " ++ classes)
1057862 node
1058863 (Flag.add Flag.height has)
1059864 transform
@@ -1110,7 +915,7 @@ gatherAttrRecursive classes node has transform styles attrs children elementAttr
1110915 in
1111916 gatherAttrRecursive (classes ++ " " ++ newClass)
1112917 node
1113− (Flag.merge addToFlags (Flag.add Flag.height has))
918+ (Flag.merge addToFlags has)
1114919 transform
1115920 (newStyles ++ styles)
1116921 attrs
@@ -1142,15 +947,20 @@ gatherAttrRecursive classes node has transform styles attrs children elementAttr
1142947 gatherAttrRecursive classes (addNodeName "h6" node) has transform styles attrs children remaining
1143948
1144949 Paragraph ->
1145− -- previously we rendered a <p> tag, though apparently this invalidates the html if it has <div>s inside.
1146− -- Since we can't guaranteee that there are no divs, we need another strategy.
1147− -- While it's not documented in many places, there apparently is a paragraph aria role
1148− -- https://github.com/w3c/aria/blob/11f85f41a5b621fdbe85fc9bcdcd270e653a48ba/common/script/roleInfo.js
1149− -- Though we'll need to wait till it gets released in an official wai-aria spec to use it.
1150− -- If it's used at the moment, then Lighthouse complains (likely rightfully) that role paragraph is not recognized.
1151− gatherAttrRecursive
1152− classes
1153− node
950+ let
951+ newNode =
952+ case node of
953+ Generic ->
954+ NodeName "p"
955+
956+ NodeName name ->
957+ NodeName name
958+
959+ Embedded x y ->
960+ Embedded x y
961+ in
962+ gatherAttrRecursive classes
963+ newNode
1154964 has
1155965 transform
1156966 styles
@@ -1185,16 +995,75 @@ gatherAttrRecursive classes node has transform styles attrs children elementAttr
1185995
1186996 Styled styled ->
1187997 styles ++ styled.styles
998+
999+ nearbyElement =
1000+ Html.div
1001+ [ Html.Attributes.class <|
1002+ case location of
1003+ Above ->
1004+ String.join " "
1005+ [ Internal.Style.classes.any
1006+ , Internal.Style.classes.single
1007+ , Internal.Style.classes.above
1008+ ]
1009+
1010+ Below ->
1011+ String.join " "
1012+ [ Internal.Style.classes.any
1013+ , Internal.Style.classes.single
1014+ , Internal.Style.classes.below
1015+ ]
1016+
1017+ OnRight ->
1018+ String.join " "
1019+ [ Internal.Style.classes.any
1020+ , Internal.Style.classes.single
1021+ , Internal.Style.classes.onRight
1022+ ]
1023+
1024+ OnLeft ->
1025+ String.join " "
1026+ [ Internal.Style.classes.any
1027+ , Internal.Style.classes.single
1028+ , Internal.Style.classes.onLeft
1029+ ]
1030+
1031+ InFront ->
1032+ String.join " "
1033+ [ Internal.Style.classes.any
1034+ , Internal.Style.classes.single
1035+ , Internal.Style.classes.inFront
1036+ ]
1037+
1038+ Behind ->
1039+ String.join " "
1040+ [ Internal.Style.classes.any
1041+ , Internal.Style.classes.single
1042+ , Internal.Style.classes.behind
1043+ ]
1044+ ]
1045+ [ case elem of
1046+ Empty ->
1047+ VirtualDom.text ""
1048+
1049+ Text str ->
1050+ textElement str
1051+
1052+ Unstyled html ->
1053+ html asEl
1054+
1055+ Styled styled ->
1056+ styled.html NoStyleSheet asEl
1057+ ]
1058+
1059+ newClasses =
1060+ if location == Behind then
1061+ Internal.Style.classes.hasBehind ++ " " ++ classes
1062+
1063+ else
1064+ classes
11881065 in
1189− gatherAttrRecursive
1190− classes
1191− node
1192− has
1193− transform
1194− newStyles
1195− attrs
1196− (addNearbyElement location elem children)
1197− remaining
1066+ gatherAttrRecursive newClasses node has transform newStyles attrs (nearbyElement :: children) remaining
11981067
11991068 AlignX x ->
12001069 if Flag.present Flag.xAlign has then
@@ -1250,106 +1119,6 @@ gatherAttrRecursive classes node has transform styles attrs children elementAttr
12501119 remaining
12511120
12521121
1253−addNearbyElement location elem existing =
1254− let
1255− nearby =
1256− nearbyElement location elem
1257− in
1258− case existing of
1259− NoNearbyChildren ->
1260− case location of
1261− Behind ->
1262− ChildrenBehind [ nearby ]
1263−
1264− _ ->
1265− ChildrenInFront [ nearby ]
1266−
1267− ChildrenBehind existingBehind ->
1268− case location of
1269− Behind ->
1270− ChildrenBehind (nearby :: existingBehind)
1271−
1272− _ ->
1273− ChildrenBehindAndInFront existingBehind [ nearby ]
1274−
1275− ChildrenInFront existingInFront ->
1276− case location of
1277− Behind ->
1278− ChildrenBehindAndInFront [ nearby ] existingInFront
1279−
1280− _ ->
1281− ChildrenInFront (nearby :: existingInFront)
1282−
1283− ChildrenBehindAndInFront existingBehind existingInFront ->
1284− case location of
1285− Behind ->
1286− ChildrenBehindAndInFront (nearby :: existingBehind) existingInFront
1287−
1288− _ ->
1289− ChildrenBehindAndInFront existingBehind (nearby :: existingInFront)
1290−
1291−
1292−nearbyElement location elem =
1293− Html.div
1294− [ Html.Attributes.class <|
1295− case location of
1296− Above ->
1297− String.join " "
1298− [ Internal.Style.classes.nearby
1299− , Internal.Style.classes.single
1300− , Internal.Style.classes.above
1301− ]
1302−
1303− Below ->
1304− String.join " "
1305− [ Internal.Style.classes.nearby
1306− , Internal.Style.classes.single
1307− , Internal.Style.classes.below
1308− ]
1309−
1310− OnRight ->
1311− String.join " "
1312− [ Internal.Style.classes.nearby
1313− , Internal.Style.classes.single
1314− , Internal.Style.classes.onRight
1315− ]
1316−
1317− OnLeft ->
1318− String.join " "
1319− [ Internal.Style.classes.nearby
1320− , Internal.Style.classes.single
1321− , Internal.Style.classes.onLeft
1322− ]
1323−
1324− InFront ->
1325− String.join " "
1326− [ Internal.Style.classes.nearby
1327− , Internal.Style.classes.single
1328− , Internal.Style.classes.inFront
1329− ]
1330−
1331− Behind ->
1332− String.join " "
1333− [ Internal.Style.classes.nearby
1334− , Internal.Style.classes.single
1335− , Internal.Style.classes.behind
1336− ]
1337− ]
1338− [ case elem of
1339− Empty ->
1340− VirtualDom.text ""
1341−
1342− Text str ->
1343− textElement str
1344−
1345− Unstyled html ->
1346− html asEl
1347−
1348− Styled styled ->
1349− styled.html NoStyleSheet asEl
1350− ]
1351−
1352−
13531122renderWidth w =
13541123 case w of
13551124 Px px ->
@@ -1436,7 +1205,7 @@ renderHeight h =
14361205 "height-px-" ++ val
14371206 in
14381207 ( Flag.none
1439− , Internal.Style.classes.heightExact ++ " " ++ name
1208+ , name
14401209 , [ Single name "height" (val ++ "px") ]
14411210 )
14421211
@@ -1459,7 +1228,7 @@ renderHeight h =
14591228 , [ Single
14601229 (Internal.Style.classes.any
14611230 ++ "."
1462− ++ Internal.Style.classes.column
1231+ ++ Internal.Style.classes.row
14631232 ++ " > "
14641233 ++ (Internal.Style.dot <| "height-fill-" ++ String.fromInt portion)
14651234 )
@@ -1478,9 +1247,7 @@ renderHeight h =
14781247 Single
14791248 cls
14801249 "min-height"
1481− -- This needs to be !important because we're using `min-height: min-content`
1482− -- to correct for safari's incorrect implementation of flexbox.
1483− (String.fromInt minSize ++ "px !important")
1250+ (String.fromInt minSize ++ "px")
14841251
14851252 ( newFlag, newAttrs, newStyle ) =
14861253 renderHeight len
@@ -1558,7 +1325,7 @@ element : LayoutContext -> NodeName -> List (Attribute aligned msg) -> Children
15581325element context node attributes children =
15591326 attributes
15601327 |> List.reverse
1561− |> gatherAttrRecursive (contextClasses context) node Flag.none untransformed [] [] NoNearbyChildren
1328+ |> gatherAttrRecursive (contextClasses context) node Flag.none untransformed [] [] []
15621329 |> createElement context children
15631330
15641331
@@ -1566,6 +1333,13 @@ untransformed =
15661333 Untransformed
15671334
15681335
1336+
1337+-- space =
1338+-- VirtualDom.text " "
1339+-- keyedSpace =
1340+-- ( " ", space )
1341+
1342+
15691343createElement : LayoutContext -> Children (Element msg) -> Gathered msg -> Element msg
15701344createElement context children rendered =
15711345 let
@@ -1607,33 +1381,36 @@ createElement context children rendered =
16071381 -- Same if it's a column or row with one child and width-content, height-content
16081382 -- interferes with css grid
16091383 -- Maybe we could unpack text elements in a paragraph as well,
1610− -- however, embedded elements that are larger than the line height will overlap with exisitng text.
1384+ -- however embedded style elements that are larger than the line height will overlap with exisitng text.
16111385 -- I don't think that's what we want.
1612− -- if
1613− -- context
1614− -- == asEl
1615− -- || context
1616− -- == asParagraph
1617− -- then
1618− -- ( VirtualDom.text
1619− -- (if context == asParagraph then
1620− -- str
1621− -- else
1622− -- str
1623− -- )
1624− -- :: htmls
1625− -- , existingStyles
1626− -- )
1627− -- else
1628− ( (if context == asEl then
1629− textElementFill str
1630−
1631− else
1632− textElement str
1633− )
1634− :: htmls
1635− , existingStyles
1636− )
1386+ if
1387+ context
1388+ == asEl
1389+ || context
1390+ == asParagraph
1391+ then
1392+ ( VirtualDom.text
1393+ (if context == asParagraph then
1394+ str ++ " "
1395+
1396+ else
1397+ str
1398+ )
1399+ :: htmls
1400+ , existingStyles
1401+ )
1402+
1403+ else
1404+ ( textElement
1405+ (if context == asParagraph then
1406+ str ++ " "
1407+
1408+ else
1409+ str
1410+ )
1411+ :: htmls
1412+ , existingStyles
1413+ )
16371414
16381415 Empty ->
16391416 ( htmls, existingStyles )
@@ -1675,30 +1452,38 @@ createElement context children rendered =
16751452 -- TEXT OPTIMIZATION
16761453 -- You can have raw text if the element is an el, and has `width-content` and `height-content`
16771454 -- Same if it's a column or row with one child and width-content, height-content
1678− -- if
1679− -- context
1680− -- == asEl
1681− -- || context
1682− -- == asParagraph
1683− -- then
1684− -- ( ( key
1685− -- , VirtualDom.text
1686− -- str
1687− -- )
1688− -- :: htmls
1689− -- , existingStyles
1690− -- )
1691− -- else
1692− ( ( key
1693− , if context == asEl then
1694− textElementFill str
1455+ if
1456+ context
1457+ == asEl
1458+ || context
1459+ == asParagraph
1460+ then
1461+ ( ( key
1462+ , VirtualDom.text
1463+ (if context == asParagraph then
1464+ str ++ " "
1465+
1466+ else
1467+ str
1468+ )
1469+ )
1470+ :: htmls
1471+ , existingStyles
1472+ )
16951473
1696− else
1697− textElement str
1698− )
1699− :: htmls
1700− , existingStyles
1701− )
1474+ else
1475+ ( ( key
1476+ , textElement
1477+ (if context == asParagraph then
1478+ str ++ " "
1479+
1480+ else
1481+ str
1482+ )
1483+ )
1484+ :: htmls
1485+ , existingStyles
1486+ )
17021487
17031488 Empty ->
17041489 ( htmls, existingStyles )
@@ -1721,9 +1506,7 @@ createElement context children rendered =
17211506 (finalizeNode rendered.has
17221507 rendered.node
17231508 rendered.attributes
1724− (Keyed
1725− (addKeyedChildren "nearby-element-pls" keyed rendered.children)
1726− )
1509+ (Keyed <| List.map (\x -> ( "nearby-elements-pls", x )) rendered.children ++ keyed)
17271510 NoStyleSheet
17281511 )
17291512
@@ -1731,13 +1514,7 @@ createElement context children rendered =
17311514 Styled
17321515 { styles = allStyles
17331516 , html =
1734− finalizeNode
1735− rendered.has
1736− rendered.node
1737− rendered.attributes
1738− (Keyed
1739− (addKeyedChildren "nearby-element-pls" keyed rendered.children)
1740− )
1517+ finalizeNode rendered.has rendered.node rendered.attributes (Keyed (List.map (\x -> ( "nearby-elements-pls", x )) rendered.children ++ keyed))
17411518 }
17421519
17431520 Unkeyed unkeyedChildren ->
@@ -1754,58 +1531,20 @@ createElement context children rendered =
17541531 case newStyles of
17551532 [] ->
17561533 Unstyled
1757− (finalizeNode
1758− rendered.has
1534+ (finalizeNode rendered.has
17591535 rendered.node
17601536 rendered.attributes
1761− (Unkeyed (addChildren unkeyed rendered.children))
1537+ (Unkeyed <| rendered.children ++ unkeyed)
17621538 NoStyleSheet
17631539 )
17641540
17651541 allStyles ->
17661542 Styled
17671543 { styles = allStyles
1768− , html =
1769− finalizeNode
1770− rendered.has
1771− rendered.node
1772− rendered.attributes
1773− (Unkeyed (addChildren unkeyed rendered.children))
1544+ , html = finalizeNode rendered.has rendered.node rendered.attributes (Unkeyed (rendered.children ++ unkeyed))
17741545 }
17751546
17761547
1777−addChildren existing nearbyChildren =
1778− case nearbyChildren of
1779− NoNearbyChildren ->
1780− existing
1781−
1782− ChildrenBehind behind ->
1783− behind ++ existing
1784−
1785− ChildrenInFront inFront ->
1786− existing ++ inFront
1787−
1788− ChildrenBehindAndInFront behind inFront ->
1789− behind ++ existing ++ inFront
1790−
1791−
1792−addKeyedChildren key existing nearbyChildren =
1793− case nearbyChildren of
1794− NoNearbyChildren ->
1795− existing
1796−
1797− ChildrenBehind behind ->
1798− List.map (\x -> ( key, x )) behind ++ existing
1799−
1800− ChildrenInFront inFront ->
1801− existing ++ List.map (\x -> ( key, x )) inFront
1802−
1803− ChildrenBehindAndInFront behind inFront ->
1804− List.map (\x -> ( key, x )) behind
1805− ++ existing
1806− ++ List.map (\x -> ( key, x )) inFront
1807−
1808−
18091548unit =
18101549 0
18111550
@@ -1817,20 +1556,8 @@ defaultOptions =
18171556 }
18181557
18191558
1820−staticRoot : OptionRecord -> VirtualDom.Node msg
1821−staticRoot opts =
1822− case opts.mode of
1823− Layout ->
1824− -- wrap the style node in a div to prevent `Dark Reader` from blowin up the dom.
1825− VirtualDom.node "div"
1826− []
1827− [ VirtualDom.node "style" [] [ VirtualDom.text Internal.Style.rules ] ]
1828−
1829− NoStaticStyleSheet ->
1830− VirtualDom.text ""
1831−
1832− WithVirtualCss ->
1833− VirtualDom.node "elm-ui-static-rules" [ VirtualDom.property "rules" (Encode.string Internal.Style.rules) ] []
1559+staticRoot =
1560+ VirtualDom.node "style" [] [ VirtualDom.text Internal.Style.rules ]
18341561
18351562
18361563addWhen ifThis x to =
@@ -1913,21 +1640,6 @@ filter attrs =
19131640 attrs
19141641
19151642
1916−isContent len =
1917− case len of
1918− Content ->
1919− True
1920−
1921− Max _ l ->
1922− isContent l
1923−
1924− Min _ l ->
1925− isContent l
1926−
1927− _ ->
1928− False
1929−
1930−
19311643get : List (Attribute aligned msg) -> (Attribute aligned msg -> Bool) -> List (Attribute aligned msg)
19321644get attrs isAttr =
19331645 attrs
@@ -1948,7 +1660,7 @@ type Spacing
19481660
19491661
19501662type Padding
1951− = Padding String Float Float Float Float
1663+ = Padding String Int Int Int Int
19521664
19531665
19541666extractSpacingAndPadding : List (Attribute aligned msg) -> ( Maybe Padding, Maybe Spacing )
@@ -2044,44 +1756,35 @@ getHeight attrs =
20441756 Nothing
20451757
20461758
2047−textElementClasses : String
2048−textElementClasses =
2049− classes.any
2050− ++ " "
2051− ++ classes.text
2052− ++ " "
2053− ++ classes.widthContent
2054− ++ " "
2055− ++ classes.heightContent
2056−
2057−
20581759textElement : String -> VirtualDom.Node msg
20591760textElement str =
20601761 Html.div
20611762 [ Html.Attributes.class
2062− textElementClasses
1763+ (String.join " "
1764+ [ classes.any
1765+ , classes.text
1766+ , classes.widthContent
1767+ , classes.heightContent
1768+ ]
1769+ )
20631770 ]
20641771 [ Html.text str ]
20651772
20661773
2067−textElementFillClasses : String
2068−textElementFillClasses =
2069− classes.any
2070− ++ " "
2071− ++ classes.text
2072− ++ " "
2073− ++ classes.widthFill
2074− ++ " "
2075− ++ classes.heightFill
2076−
2077−
20781774textElementFill : String -> VirtualDom.Node msg
20791775textElementFill str =
2080− Html.div
2081− [ Html.Attributes.class
2082− textElementFillClasses
1776+ VirtualDom.node "div"
1777+ [ VirtualDom.property "className"
1778+ (Json.string <|
1779+ String.join " "
1780+ [ classes.any
1781+ , classes.text
1782+ , classes.widthFill
1783+ , classes.heightFill
1784+ ]
1785+ )
20831786 ]
2084− [ Html.text str ]
1787+ [ VirtualDom.text str ]
20851788
20861789
20871790type Children x
@@ -2089,6 +1792,10 @@ type Children x
20891792 | Keyed (List ( String, x ))
20901793
20911794
1795+
1796+-- toHtml : OptionRecord -> Element msg -> VirtualDom.Node msg
1797+
1798+
20921799toHtml mode el =
20931800 case el of
20941801 Unstyled html ->
@@ -2124,7 +1831,8 @@ renderRoot optionList attributes child =
21241831
21251832
21261833type RenderMode
2127− = Layout
1834+ = Viewport
1835+ | Layout
21281836 | NoStaticStyleSheet
21291837 | WithVirtualCss
21301838
@@ -2173,8 +1881,8 @@ rootStyle =
21731881 , SansSerif
21741882 ]
21751883 in
2176− [ StyleClass Flag.bgColor (Colored ("bg-" ++ formatColorClass (Rgba 1 1 1 0)) "background-color" (Rgba 1 1 1 0))
2177− , StyleClass Flag.fontColor (Colored ("fc-" ++ formatColorClass (Rgba 0 0 0 1)) "color" (Rgba 0 0 0 1))
1884+ [ StyleClass Flag.bgColor (Colored ("bg-color-" ++ formatColorClass (Rgba 1 1 1 0)) "background-color" (Rgba 1 1 1 0))
1885+ , StyleClass Flag.fontColor (Colored ("font-color-" ++ formatColorClass (Rgba 0 0 0 1)) "color" (Rgba 0 0 0 1))
21781886 , StyleClass Flag.fontSize (FontSize 20)
21791887 , StyleClass Flag.fontFamily <|
21801888 FontFamily (List.foldl renderFontClassName "font-" families)
@@ -2206,49 +1914,14 @@ renderFontClassName font current =
22061914 |> String.toLower
22071915 |> String.words
22081916 |> String.join "-"
2209−
2210− FontWith { name } ->
2211− name
2212− |> String.toLower
2213− |> String.words
2214− |> String.join "-"
22151917 )
22161918
22171919
22181920renderFocusStyle :
22191921 FocusStyle
2220− -> List Style
1922+ -> Style
22211923renderFocusStyle focus =
2222− [ Style (Internal.Style.dot classes.focusedWithin ++ ":focus-within")
2223− (List.filterMap identity
2224− [ Maybe.map (\color -> Property "border-color" (formatColor color)) focus.borderColor
2225− , Maybe.map (\color -> Property "background-color" (formatColor color)) focus.backgroundColor
2226− , Maybe.map
2227− (\shadow ->
2228− Property "box-shadow"
2229− (formatBoxShadow
2230− { color = shadow.color
2231− , offset =
2232− shadow.offset
2233− |> Tuple.mapFirst toFloat
2234− |> Tuple.mapSecond toFloat
2235− , inset = False
2236− , blur =
2237− toFloat shadow.blur
2238− , size =
2239− toFloat shadow.size
2240− }
2241− )
2242− )
2243− focus.shadow
2244− , Just <| Property "outline" "none"
2245− ]
2246− )
2247− , Style
2248− ((Internal.Style.dot classes.any ++ ":focus .focusable, ")
2249− ++ (Internal.Style.dot classes.any ++ ".focusable:focus, ")
2250− ++ (".ui-slide-bar:focus + " ++ Internal.Style.dot classes.any ++ " .focusable-thumb")
2251− )
1924+ Style (Internal.Style.dot classes.any ++ ":focus .focusable, " ++ Internal.Style.dot classes.any ++ ".focusable:focus")
22521925 (List.filterMap identity
22531926 [ Maybe.map (\color -> Property "border-color" (formatColor color)) focus.borderColor
22541927 , Maybe.map (\color -> Property "background-color" (formatColor color)) focus.backgroundColor
@@ -2271,7 +1944,6 @@ renderFocusStyle focus =
22711944 , Just <| Property "outline" "none"
22721945 ]
22731946 )
2274− ]
22751947
22761948
22771949focusDefaultStyle : { backgroundColor : Maybe Color, borderColor : Maybe Color, shadow : Maybe Shadow }
@@ -2283,7 +1955,7 @@ focusDefaultStyle =
22831955 { color =
22841956 Rgba (155 / 255) (203 / 255) 1 1
22851957 , offset = ( 0, 0 )
2286− , blur = 0
1958+ , blur = 3
22871959 , size = 3
22881960 }
22891961 }
@@ -2351,734 +2023,498 @@ optionsToRecord options =
23512023 options
23522024
23532025
2354−toStyleSheet : OptionRecord -> List Style -> VirtualDom.Node msg
2355−toStyleSheet options styleSheet =
2356− case options.mode of
2357− Layout ->
2358− -- wrap the style node in a div to prevent `Dark Reader` from blowin up the dom.
2359− VirtualDom.node "div"
2360− []
2361− [ VirtualDom.node "style"
2362− []
2363− [ VirtualDom.text (toStyleSheetString options styleSheet) ]
2364− ]
2365−
2366− NoStaticStyleSheet ->
2367− -- wrap the style node in a div to prevent `Dark Reader` from blowin up the dom.
2368− VirtualDom.node "div"
2369− []
2370− [ VirtualDom.node "style"
2371− []
2372− [ VirtualDom.text (toStyleSheetString options styleSheet) ]
2373− ]
2374−
2375− WithVirtualCss ->
2376− VirtualDom.node "elm-ui-rules"
2377− [ VirtualDom.property "rules"
2378− (encodeStyles options styleSheet)
2379− ]
2380− []
2381−
2382−
2383−renderTopLevelValues rules =
2026+renderFont : List Font -> String
2027+renderFont families =
23842028 let
2385− withImport font =
2029+ fontName font =
23862030 case font of
2387− ImportFont _ url ->
2388− Just ("@import url('" ++ url ++ "');")
2389−
2390− -- FontWith with ->
2391− -- case with.url of
2392− -- Just x ->
2393− -- Just ("@import url('" ++ x ++ "');")
2394− -- Nothing ->
2395− -- Nothing
2396− _ ->
2397− Nothing
2398−
2399− allNames =
2400− List.map Tuple.first rules
2401−
2402− fontImports ( name, typefaces ) =
2403− let
2404− imports =
2405− String.join "\n" (List.filterMap withImport typefaces)
2406− in
2407− imports
2408−
2409− fontAdjustments ( name, typefaces ) =
2410− case typefaceAdjustment typefaces of
2411− Nothing ->
2412− String.join ""
2413− (List.map (renderNullAdjustmentRule name) allNames)
2031+ Serif ->
2032+ "serif"
24142033
2415− Just adjustment ->
2416− String.join ""
2417− (List.map (renderFontAdjustmentRule name adjustment) allNames)
2418− in
2419− String.join "\n" (List.map fontImports rules)
2420− ++ String.join "\n" (List.map fontAdjustments rules)
2034+ SansSerif ->
2035+ "sans-serif"
24212036
2037+ Monospace ->
2038+ "monospace"
24222039
2423−renderNullAdjustmentRule fontToAdjust otherFontName =
2424− let
2425− name =
2426− if fontToAdjust == otherFontName then
2427− fontToAdjust
2040+ Typeface name ->
2041+ "\"" ++ name ++ "\""
24282042
2429− else
2430− otherFontName ++ " ." ++ fontToAdjust
2043+ ImportFont name url ->
2044+ "\"" ++ name ++ "\""
24312045 in
2432− String.join " "
2433− [ bracket
2434− ("."
2435− ++ name
2436− ++ "."
2437− ++ classes.sizeByCapital
2438− ++ ", "
2439− ++ "."
2440− ++ name
2441− ++ " ."
2442− ++ classes.sizeByCapital
2443− )
2444− [ ( "line-height", "1" )
2445− ]
2446− , bracket
2447− ("."
2448− ++ name
2449− ++ "."
2450− ++ classes.sizeByCapital
2451− ++ "> ."
2452− ++ Internal.Style.classes.text
2453− ++ ", ."
2454− ++ name
2455− ++ " ."
2456− ++ classes.sizeByCapital
2457− ++ " > ."
2458− ++ Internal.Style.classes.text
2459− )
2460− [ ( "vertical-align", "0" )
2461− , ( "line-height", "1" )
2462− ]
2463− ]
2046+ families
2047+ |> List.map fontName
2048+ |> String.join ", "
24642049
24652050
2466−fontRule name modifier ( parentAdj, textAdjustment ) =
2467− [ bracket
2468− ("."
2469− ++ name
2470− ++ "."
2471− ++ modifier
2472− ++ ", "
2473− ++ "."
2474− ++ name
2475− ++ " ."
2476− ++ modifier
2477− )
2478− parentAdj
2479− , bracket
2480− ("."
2481− ++ name
2482− ++ "."
2483− ++ modifier
2484− ++ "> ."
2485− ++ Internal.Style.classes.text
2486− ++ ", ."
2487− ++ name
2488− ++ " ."
2489− ++ modifier
2490− ++ " > ."
2491− ++ Internal.Style.classes.text
2492− )
2493− textAdjustment
2494− ]
2051+toStyleSheet : OptionRecord -> List Style -> VirtualDom.Node msg
2052+toStyleSheet options styleSheet =
2053+ VirtualDom.node "style" [] [ VirtualDom.text (toStyleSheetString options styleSheet) ]
24952054
24962055
2497−renderFontAdjustmentRule fontToAdjust ( full, capital ) otherFontName =
2056+toStyleSheetString : OptionRecord -> List Style -> String
2057+toStyleSheetString options stylesheet =
24982058 let
2499− name =
2500− if fontToAdjust == otherFontName then
2501− fontToAdjust
2502−
2503− else
2504− otherFontName ++ " ." ++ fontToAdjust
2505− in
2506− String.join " "
2507− (fontRule name classes.sizeByCapital capital ++ fontRule name classes.fullSize full)
2508−
2059+ renderTopLevels rule =
2060+ case rule of
2061+ FontFamily name typefaces ->
2062+ let
2063+ getImports font =
2064+ case font of
2065+ ImportFont _ url ->
2066+ Just ("@import url('" ++ url ++ "');")
25092067
2510−bracket selector rules =
2511− let
2512− renderPair ( name, val ) =
2513− name ++ ": " ++ val ++ ";"
2514− in
2515− selector ++ " {" ++ String.join "" (List.map renderPair rules) ++ "}"
2068+ _ ->
2069+ Nothing
2070+ in
2071+ typefaces
2072+ |> List.filterMap getImports
2073+ |> String.join "\n"
2074+ |> Just
25162075
2076+ _ ->
2077+ Nothing
25172078
2518−fontAdjustmentRules converted =
2519− ( [ ( "display", "block" )
2520− ]
2521− , [ ( "display", "inline-block" )
2522− , ( "line-height", String.fromFloat converted.height )
2523− , ( "vertical-align", String.fromFloat converted.vertical ++ "em" )
2524− , ( "font-size", String.fromFloat converted.size ++ "em" )
2525− ]
2526− )
2079+ renderProps force (Property key val) existing =
2080+ if force then
2081+ existing ++ "\n " ++ key ++ ": " ++ val ++ " !important;"
25272082
2083+ else
2084+ existing ++ "\n " ++ key ++ ": " ++ val ++ ";"
25282085
2529−typefaceAdjustment typefaces =
2530− List.foldl
2531− (\face found ->
2532− case found of
2086+ renderStyle maybePseudo selector props =
2087+ case maybePseudo of
25332088 Nothing ->
2534− case face of
2535− FontWith with ->
2536− case with.adjustment of
2537− Nothing ->
2538− found
2539−
2540− Just adjustment ->
2541− Just
2542− ( fontAdjustmentRules
2543− (.full (convertAdjustment adjustment))
2544− , fontAdjustmentRules
2545− (.capital (convertAdjustment adjustment))
2546− )
2547−
2548− _ ->
2549− found
2550−
2551− Just _ ->
2552− found
2553− )
2554− Nothing
2555− typefaces
2556−
2557−
2558−fontName font =
2559− case font of
2560− Serif ->
2561− "serif"
2562−
2563− SansSerif ->
2564− "sans-serif"
2565−
2566− Monospace ->
2567− "monospace"
2568−
2569− Typeface name ->
2570− "\"" ++ name ++ "\""
2571−
2572− ImportFont name url ->
2573− "\"" ++ name ++ "\""
2574−
2575− FontWith { name } ->
2576− "\"" ++ name ++ "\""
2577−
2578−
2579−topLevelValue rule =
2580− case rule of
2581− FontFamily name typefaces ->
2582− Just ( name, typefaces )
2583−
2584− _ ->
2585− Nothing
2089+ selector ++ "{" ++ List.foldl (renderProps False) "" props ++ "\n}"
25862090
2091+ Just pseudo ->
2092+ case pseudo of
2093+ Hover ->
2094+ case options.hover of
2095+ NoHover ->
2096+ ""
25872097
2588−renderProps force (Property key val) existing =
2589− if force then
2590− existing ++ "\n " ++ key ++ ": " ++ val ++ " !important;"
2098+ ForceHover ->
2099+ selector ++ "-hv {" ++ List.foldl (renderProps True) "" props ++ "\n}"
25912100
2592− else
2593− existing ++ "\n " ++ key ++ ": " ++ val ++ ";"
2594−
2595−
2596−encodeStyles options stylesheet =
2597− stylesheet
2598− |> List.map
2599− (\style ->
2600− let
2601− styled =
2602− renderStyleRule options style Nothing
2603− in
2604− ( getStyleName style, Encode.list Encode.string styled )
2605− )
2606− |> Encode.object
2101+ AllowHover ->
2102+ selector ++ "-hv:hover {" ++ List.foldl (renderProps False) "" props ++ "\n}"
26072103
2104+ Focus ->
2105+ let
2106+ renderedProps =
2107+ List.foldl (renderProps False) "" props
2108+ in
2109+ String.join "\n"
2110+ [ selector
2111+ ++ "-fs:focus {"
2112+ ++ renderedProps
2113+ ++ "\n}"
2114+ , "."
2115+ ++ classes.any
2116+ ++ ":focus ~ "
2117+ ++ selector
2118+ ++ "-fs:not(.focus) {"
2119+ ++ renderedProps
2120+ ++ "\n}"
2121+ , "."
2122+ ++ classes.any
2123+ ++ ":focus "
2124+ ++ selector
2125+ ++ "-fs {"
2126+ ++ renderedProps
2127+ ++ "\n}"
2128+ , ".focusable-parent:focus ~ "
2129+ ++ "."
2130+ ++ classes.any
2131+ ++ " "
2132+ ++ selector
2133+ ++ "-fs {"
2134+ ++ renderedProps
2135+ ++ "\n}"
2136+ ]
26082137
2609−toStyleSheetString : OptionRecord -> List Style -> String
2610−toStyleSheetString options stylesheet =
2611− let
2612− combine style rendered =
2613− { rules = rendered.rules ++ renderStyleRule options style Nothing
2614− , topLevel =
2615− case topLevelValue style of
2616− Nothing ->
2617− rendered.topLevel
2618−
2619− Just topLevel ->
2620− topLevel :: rendered.topLevel
2621− }
2622− in
2623− case List.foldl combine { topLevel = [], rules = [] } stylesheet of
2624− { topLevel, rules } ->
2625− renderTopLevelValues topLevel ++ String.concat rules
2626−
2627−
2628−renderStyle : OptionRecord -> Maybe PseudoClass -> String -> List Property -> List String
2629−renderStyle options maybePseudo selector props =
2630− case maybePseudo of
2631− Nothing ->
2632− [ selector ++ "{" ++ List.foldl (renderProps False) "" props ++ "\n}" ]
2633−
2634− Just pseudo ->
2635− case pseudo of
2636− Hover ->
2637− case options.hover of
2638− NoHover ->
2639− []
2138+ Active ->
2139+ selector ++ "-act:active {" ++ List.foldl (renderProps False) "" props ++ "\n}"
26402140
2641− ForceHover ->
2642− [ selector ++ "-hv {" ++ List.foldl (renderProps True) "" props ++ "\n}" ]
2141+ renderStyleRule rule maybePseudo =
2142+ case rule of
2143+ Style selector props ->
2144+ renderStyle maybePseudo selector props
26432145
2644− AllowHover ->
2645− [ selector ++ "-hv:hover {" ++ List.foldl (renderProps False) "" props ++ "\n}" ]
2146+ Shadows name prop ->
2147+ renderStyle
2148+ maybePseudo
2149+ ("." ++ name)
2150+ [ Property "box-shadow" prop
2151+ ]
26462152
2647− Focus ->
2153+ Transparency name transparency ->
26482154 let
2649− renderedProps =
2650− List.foldl (renderProps False) "" props
2155+ opacity =
2156+ (1 - transparency)
2157+ |> min 1
2158+ |> max 0
26512159 in
2652− [ selector ++ "-fs:focus {" ++ renderedProps ++ "\n}"
2653− , ("." ++ classes.any ++ ":focus " ++ selector ++ "-fs {")
2654− ++ renderedProps
2655− ++ "\n}"
2656− , (selector ++ "-fs:focus-within {")
2657− ++ renderedProps
2658− ++ "\n}"
2659− , (".ui-slide-bar:focus + " ++ Internal.Style.dot classes.any ++ " .focusable-thumb" ++ selector ++ "-fs {")
2660− ++ renderedProps
2661− ++ "\n}"
2662− ]
2663−
2664− Active ->
2665− [ selector ++ "-act:active {" ++ List.foldl (renderProps False) "" props ++ "\n}" ]
2666−
2667−
2668−renderStyleRule : OptionRecord -> Style -> Maybe PseudoClass -> List String
2669−renderStyleRule options rule maybePseudo =
2670− case rule of
2671− Style selector props ->
2672− renderStyle options maybePseudo selector props
2673−
2674− Shadows name prop ->
2675− renderStyle options
2676− maybePseudo
2677− ("." ++ name)
2678− [ Property "box-shadow" prop
2679− ]
2680−
2681− Transparency name transparency ->
2682− let
2683− opacity =
2684− (1 - transparency)
2685− |> min 1
2686− |> max 0
2687− in
2688− renderStyle options
2689− maybePseudo
2690− ("." ++ name)
2691− [ Property "opacity" (String.fromFloat opacity)
2692− ]
2693−
2694− FontSize i ->
2695− renderStyle options
2696− maybePseudo
2697− (".font-size-" ++ String.fromInt i)
2698− [ Property "font-size" (String.fromInt i ++ "px")
2699− ]
2160+ renderStyle
2161+ maybePseudo
2162+ ("." ++ name)
2163+ [ Property "opacity" (String.fromFloat opacity)
2164+ ]
27002165
2701− FontFamily name typefaces ->
2702− let
2703− features =
2704− typefaces
2705− |> List.filterMap renderVariants
2706− |> String.join ", "
2707−
2708− families =
2709− [ Property "font-family"
2710− (typefaces
2711− |> List.map fontName
2712− |> String.join ", "
2713− )
2714− , Property "font-feature-settings" features
2715− , Property "font-variant"
2716− (if List.any hasSmallCaps typefaces then
2717− "small-caps"
2166+ FontSize i ->
2167+ renderStyle
2168+ maybePseudo
2169+ (".font-size-" ++ String.fromInt i)
2170+ [ Property "font-size" (String.fromInt i ++ "px")
2171+ ]
27182172
2719− else
2720− "normal"
2721− )
2722− ]
2723− in
2724− renderStyle options
2725− maybePseudo
2726− ("." ++ name)
2727− families
2173+ FontFamily name typefaces ->
2174+ renderStyle
2175+ maybePseudo
2176+ ("." ++ name)
2177+ [ Property "font-family" (renderFont typefaces)
2178+ ]
27282179
2729− Single class prop val ->
2730− renderStyle options
2731− maybePseudo
2732− ("." ++ class)
2733− [ Property prop val
2734− ]
2180+ Single class prop val ->
2181+ renderStyle
2182+ maybePseudo
2183+ ("." ++ class)
2184+ [ Property prop val
2185+ ]
27352186
2736− Colored class prop color ->
2737− renderStyle options
2738− maybePseudo
2739− ("." ++ class)
2740− [ Property prop (formatColor color)
2741− ]
2187+ Colored class prop color ->
2188+ renderStyle
2189+ maybePseudo
2190+ ("." ++ class)
2191+ [ Property prop (formatColor color)
2192+ ]
27422193
2743− SpacingStyle cls x y ->
2744− let
2745− class =
2746− "." ++ cls
2194+ SpacingStyle cls x y ->
2195+ let
2196+ class =
2197+ "." ++ cls
27472198
2748− halfX =
2749− String.fromFloat (toFloat x / 2) ++ "px"
2199+ xPx =
2200+ String.fromInt x ++ "px"
27502201
2751− halfY =
2752− String.fromFloat (toFloat y / 2) ++ "px"
2202+ yPx =
2203+ String.fromInt y ++ "px"
27532204
2754− xPx =
2755− String.fromInt x ++ "px"
2205+ row =
2206+ "." ++ Internal.Style.classes.row
27562207
2757− yPx =
2758− String.fromInt y ++ "px"
2208+ wrappedRow =
2209+ "." ++ Internal.Style.classes.wrapped ++ row
27592210
2760− row =
2761− "." ++ Internal.Style.classes.row
2211+ column =
2212+ "." ++ Internal.Style.classes.column
27622213
2763− wrappedRow =
2764− "." ++ Internal.Style.classes.wrapped ++ row
2214+ page =
2215+ "." ++ Internal.Style.classes.page
27652216
2766− column =
2767− "." ++ Internal.Style.classes.column
2217+ paragraph =
2218+ "." ++ Internal.Style.classes.paragraph
27682219
2769− page =
2770− "." ++ Internal.Style.classes.page
2220+ left =
2221+ "." ++ Internal.Style.classes.alignLeft
27712222
2772− paragraph =
2773− "." ++ Internal.Style.classes.paragraph
2223+ right =
2224+ "." ++ Internal.Style.classes.alignRight
27742225
2775− left =
2776− "." ++ Internal.Style.classes.alignLeft
2226+ any =
2227+ "." ++ Internal.Style.classes.any
27772228
2778− right =
2779− "." ++ Internal.Style.classes.alignRight
2229+ single =
2230+ "." ++ Internal.Style.classes.single
2231+ in
2232+ String.concat
2233+ [ renderStyle maybePseudo (class ++ row ++ " > " ++ any) [ Property "margin-right" xPx ]
27802234
2781− any =
2782− "." ++ Internal.Style.classes.any
2235+ -- margins don't apply to last element of normal, unwrapped rows
2236+ , renderStyle maybePseudo (class ++ row ++ " > " ++ any ++ ":last-child") [ Property "margin" "0" ]
27832237
2784− single =
2785− "." ++ Internal.Style.classes.single
2786− in
2787− List.concat
2788− [ renderStyle options maybePseudo (class ++ row ++ " > " ++ any ++ " + " ++ any) [ Property "margin-left" xPx ]
2789−
2790− -- margins don't apply to last element of normal, unwrapped rows
2791− -- , renderStyle options maybePseudo (class ++ row ++ " > " ++ any ++ ":first-child") [ Property "margin" "0" ]
2792− -- For wrapped rows, margins always apply because we handle "canceling out" the other margins manually in the element.
2793− , renderStyle options
2794− maybePseudo
2795− (class ++ wrappedRow ++ " > " ++ any)
2796− [ Property "margin" (halfY ++ " " ++ halfX)
2797− ]
2238+ -- For wrapped rows, margins always apply because we handle "canceling out" the other margins manually in the element.
2239+ , renderStyle maybePseudo
2240+ (class ++ wrappedRow ++ " > " ++ any)
2241+ [ Property "margin" ("0 " ++ xPx ++ " " ++ yPx ++ " 0")
2242+ ]
2243+ , renderStyle maybePseudo
2244+ (class ++ wrappedRow ++ " > " ++ any ++ ":last-child")
2245+ [ Property "margin-right" "0"
2246+ ]
27982247
2799− -- , renderStyle options maybePseudo
2800− -- (class ++ wrappedRow ++ " > " ++ any ++ ":last-child")
2801− -- [ Property "margin-right" "0"
2802− -- ]
2803− -- columns
2804− , renderStyle options maybePseudo (class ++ column ++ " > " ++ any ++ " + " ++ any) [ Property "margin-top" yPx ]
2805− , renderStyle options maybePseudo (class ++ page ++ " > " ++ any ++ " + " ++ any) [ Property "margin-top" yPx ]
2806− , renderStyle options maybePseudo (class ++ page ++ " > " ++ left) [ Property "margin-right" xPx ]
2807− , renderStyle options maybePseudo (class ++ page ++ " > " ++ right) [ Property "margin-left" xPx ]
2808− , renderStyle options
2809− maybePseudo
2810− (class ++ paragraph)
2811− [ Property "line-height" ("calc(1em + " ++ String.fromInt y ++ "px)")
2812− ]
2813− , renderStyle options
2814− maybePseudo
2815− ("textarea" ++ any ++ class)
2816− [ Property "line-height" ("calc(1em + " ++ String.fromInt y ++ "px)")
2817− , Property "height" ("calc(100% + " ++ String.fromInt y ++ "px)")
2818− ]
2248+ -- columns
2249+ , renderStyle maybePseudo (class ++ column ++ " > " ++ any ++ " + " ++ any) [ Property "margin-top" yPx ]
2250+ , renderStyle maybePseudo (class ++ page ++ " > " ++ any ++ " + " ++ any) [ Property "margin-top" yPx ]
2251+ , renderStyle maybePseudo (class ++ page ++ " > " ++ left) [ Property "margin-right" xPx ]
2252+ , renderStyle maybePseudo (class ++ page ++ " > " ++ right) [ Property "margin-left" xPx ]
2253+ , renderStyle
2254+ maybePseudo
2255+ (class ++ paragraph)
2256+ [ Property "line-height" ("calc(1em + " ++ String.fromInt y ++ "px)")
2257+ ]
2258+ , renderStyle
2259+ maybePseudo
2260+ ("textarea" ++ class)
2261+ [ Property "line-height" ("calc(1em + " ++ String.fromInt y ++ "px)")
2262+ ]
28192263
2820− -- , renderStyle options
2821− -- maybePseudo
2822− -- (class ++ paragraph ++ " > " ++ any)
2823− -- [ Property "margin-right" xPx
2824− -- , Property "margin-bottom" yPx
2825− -- ]
2826− , renderStyle options
2827− maybePseudo
2828− (class ++ paragraph ++ " > " ++ left)
2829− [ Property "margin-right" xPx
2830− ]
2831− , renderStyle options
2832− maybePseudo
2833− (class ++ paragraph ++ " > " ++ right)
2834− [ Property "margin-left" xPx
2835− ]
2836− , renderStyle options
2837− maybePseudo
2838− (class ++ paragraph ++ "::after")
2839− [ Property "content" "''"
2840− , Property "display" "block"
2841− , Property "height" "0"
2842− , Property "width" "0"
2843− , Property "margin-top" (String.fromInt (-1 * (y // 2)) ++ "px")
2844− ]
2845− , renderStyle options
2846− maybePseudo
2847− (class ++ paragraph ++ "::before")
2848− [ Property "content" "''"
2849− , Property "display" "block"
2850− , Property "height" "0"
2851− , Property "width" "0"
2852− , Property "margin-bottom" (String.fromInt (-1 * (y // 2)) ++ "px")
2853− ]
2854− ]
2264+ -- , renderStyle
2265+ -- maybePseudo
2266+ -- (class ++ paragraph ++ " > " ++ any)
2267+ -- [ Property "margin-right" xPx
2268+ -- , Property "margin-bottom" yPx
2269+ -- ]
2270+ , renderStyle
2271+ maybePseudo
2272+ (class ++ paragraph ++ " > " ++ left)
2273+ [ Property "margin-right" xPx
2274+ ]
2275+ , renderStyle
2276+ maybePseudo
2277+ (class ++ paragraph ++ " > " ++ right)
2278+ [ Property "margin-left" xPx
2279+ ]
2280+ , renderStyle
2281+ maybePseudo
2282+ (class ++ paragraph ++ "::after")
2283+ [ Property "content" "''"
2284+ , Property "display" "block"
2285+ , Property "height" "0"
2286+ , Property "width" "0"
2287+ , Property "margin-top" (String.fromInt (-1 * (y // 2)) ++ "px")
2288+ ]
2289+ , renderStyle
2290+ maybePseudo
2291+ (class ++ paragraph ++ "::before")
2292+ [ Property "content" "''"
2293+ , Property "display" "block"
2294+ , Property "height" "0"
2295+ , Property "width" "0"
2296+ , Property "margin-bottom" (String.fromInt (-1 * (y // 2)) ++ "px")
2297+ ]
2298+ ]
28552299
2856− PaddingStyle cls top right bottom left ->
2857− let
2858− class =
2859− "."
2860− ++ cls
2861− in
2862− renderStyle options
2863− maybePseudo
2864− class
2865− [ Property "padding"
2866− (String.fromFloat top
2867− ++ "px "
2868− ++ String.fromFloat right
2869− ++ "px "
2870− ++ String.fromFloat bottom
2871− ++ "px "
2872− ++ String.fromFloat left
2873− ++ "px"
2874− )
2875− ]
2300+ PaddingStyle cls top right bottom left ->
2301+ let
2302+ class =
2303+ "."
2304+ ++ cls
2305+ in
2306+ renderStyle
2307+ maybePseudo
2308+ class
2309+ [ Property "padding"
2310+ (String.fromInt top
2311+ ++ "px "
2312+ ++ String.fromInt right
2313+ ++ "px "
2314+ ++ String.fromInt bottom
2315+ ++ "px "
2316+ ++ String.fromInt left
2317+ ++ "px"
2318+ )
2319+ ]
28762320
2877− BorderWidth cls top right bottom left ->
2878− let
2879− class =
2880− "."
2881− ++ cls
2882− in
2883− renderStyle options
2884− maybePseudo
2885− class
2886− [ Property "border-width"
2887− (String.fromInt top
2888− ++ "px "
2889− ++ String.fromInt right
2890− ++ "px "
2891− ++ String.fromInt bottom
2892− ++ "px "
2893− ++ String.fromInt left
2894− ++ "px"
2895− )
2896− ]
2321+ GridTemplateStyle template ->
2322+ let
2323+ class =
2324+ ".grid-rows-"
2325+ ++ String.join "-" (List.map lengthClassName template.rows)
2326+ ++ "-cols-"
2327+ ++ String.join "-" (List.map lengthClassName template.columns)
2328+ ++ "-space-x-"
2329+ ++ lengthClassName (Tuple.first template.spacing)
2330+ ++ "-space-y-"
2331+ ++ lengthClassName (Tuple.second template.spacing)
2332+
2333+ ySpacing =
2334+ toGridLength (Tuple.second template.spacing)
2335+
2336+ xSpacing =
2337+ toGridLength (Tuple.first template.spacing)
2338+
2339+ toGridLength x =
2340+ toGridLengthHelper Nothing Nothing x
2341+
2342+ toGridLengthHelper minimum maximum x =
2343+ case x of
2344+ Px px ->
2345+ String.fromInt px ++ "px"
2346+
2347+ Content ->
2348+ case ( minimum, maximum ) of
2349+ ( Nothing, Nothing ) ->
2350+ "max-content"
2351+
2352+ ( Just minSize, Nothing ) ->
2353+ "minmax(" ++ String.fromInt minSize ++ "px, " ++ "max-content)"
2354+
2355+ ( Nothing, Just maxSize ) ->
2356+ "minmax(max-content, " ++ String.fromInt maxSize ++ "px)"
2357+
2358+ ( Just minSize, Just maxSize ) ->
2359+ "minmax(" ++ String.fromInt minSize ++ "px, " ++ String.fromInt maxSize ++ "px)"
2360+
2361+ Fill i ->
2362+ case ( minimum, maximum ) of
2363+ ( Nothing, Nothing ) ->
2364+ String.fromInt i ++ "fr"
2365+
2366+ ( Just minSize, Nothing ) ->
2367+ "minmax(" ++ String.fromInt minSize ++ "px, " ++ String.fromInt i ++ "fr" ++ "fr)"
2368+
2369+ ( Nothing, Just maxSize ) ->
2370+ "minmax(max-content, " ++ String.fromInt maxSize ++ "px)"
2371+
2372+ ( Just minSize, Just maxSize ) ->
2373+ "minmax(" ++ String.fromInt minSize ++ "px, " ++ String.fromInt maxSize ++ "px)"
2374+
2375+ Min m len ->
2376+ toGridLengthHelper (Just m) maximum len
2377+
2378+ Max m len ->
2379+ toGridLengthHelper minimum (Just m) len
2380+
2381+ msColumns =
2382+ template.columns
2383+ |> List.map toGridLength
2384+ |> String.join ySpacing
2385+ |> (\x -> "-ms-grid-columns: " ++ x ++ ";")
2386+
2387+ msRows =
2388+ template.columns
2389+ |> List.map toGridLength
2390+ |> String.join ySpacing
2391+ |> (\x -> "-ms-grid-rows: " ++ x ++ ";")
2392+
2393+ base =
2394+ class ++ "{" ++ msColumns ++ msRows ++ "}"
2395+
2396+ columns =
2397+ template.columns
2398+ |> List.map toGridLength
2399+ |> String.join " "
2400+ |> (\x -> "grid-template-columns: " ++ x ++ ";")
2401+
2402+ rows =
2403+ template.rows
2404+ |> List.map toGridLength
2405+ |> String.join " "
2406+ |> (\x -> "grid-template-rows: " ++ x ++ ";")
2407+
2408+ gapX =
2409+ "grid-column-gap:" ++ toGridLength (Tuple.first template.spacing) ++ ";"
2410+
2411+ gapY =
2412+ "grid-row-gap:" ++ toGridLength (Tuple.second template.spacing) ++ ";"
2413+
2414+ modernGrid =
2415+ class ++ "{" ++ columns ++ rows ++ gapX ++ gapY ++ "}"
2416+
2417+ supports =
2418+ "@supports (display:grid) {" ++ modernGrid ++ "}"
2419+ in
2420+ base ++ supports
28972421
2898− GridTemplateStyle template ->
2899− let
2900− class =
2901− ".grid-rows-"
2902− ++ String.join "-" (List.map lengthClassName template.rows)
2903− ++ "-cols-"
2904− ++ String.join "-" (List.map lengthClassName template.columns)
2905− ++ "-space-x-"
2906− ++ lengthClassName (Tuple.first template.spacing)
2907− ++ "-space-y-"
2908− ++ lengthClassName (Tuple.second template.spacing)
2909−
2910− ySpacing =
2911− toGridLength (Tuple.second template.spacing)
2912−
2913− xSpacing =
2914− toGridLength (Tuple.first template.spacing)
2915−
2916− toGridLength x =
2917− toGridLengthHelper Nothing Nothing x
2918−
2919− toGridLengthHelper minimum maximum x =
2920− case x of
2921− Px px ->
2922− String.fromInt px ++ "px"
2923−
2924− Content ->
2925− case ( minimum, maximum ) of
2926− ( Nothing, Nothing ) ->
2927− "max-content"
2928−
2929− ( Just minSize, Nothing ) ->
2930− "minmax(" ++ String.fromInt minSize ++ "px, " ++ "max-content)"
2931−
2932− ( Nothing, Just maxSize ) ->
2933− "minmax(max-content, " ++ String.fromInt maxSize ++ "px)"
2934−
2935− ( Just minSize, Just maxSize ) ->
2936− "minmax(" ++ String.fromInt minSize ++ "px, " ++ String.fromInt maxSize ++ "px)"
2937−
2938− Fill i ->
2939− case ( minimum, maximum ) of
2940− ( Nothing, Nothing ) ->
2941− String.fromInt i ++ "fr"
2942−
2943− ( Just minSize, Nothing ) ->
2944− "minmax(" ++ String.fromInt minSize ++ "px, " ++ String.fromInt i ++ "fr" ++ "fr)"
2945−
2946− ( Nothing, Just maxSize ) ->
2947− "minmax(max-content, " ++ String.fromInt maxSize ++ "px)"
2948−
2949− ( Just minSize, Just maxSize ) ->
2950− "minmax(" ++ String.fromInt minSize ++ "px, " ++ String.fromInt maxSize ++ "px)"
2951−
2952− Min m len ->
2953− toGridLengthHelper (Just m) maximum len
2954−
2955− Max m len ->
2956− toGridLengthHelper minimum (Just m) len
2957−
2958− msColumns =
2959− template.columns
2960− |> List.map toGridLength
2961− |> String.join ySpacing
2962− |> (\x -> "-ms-grid-columns: " ++ x ++ ";")
2963−
2964− msRows =
2965− template.columns
2966− |> List.map toGridLength
2967− |> String.join ySpacing
2968− |> (\x -> "-ms-grid-rows: " ++ x ++ ";")
2969−
2970− base =
2971− class ++ "{" ++ msColumns ++ msRows ++ "}"
2972−
2973− columns =
2974− template.columns
2975− |> List.map toGridLength
2976− |> String.join " "
2977− |> (\x -> "grid-template-columns: " ++ x ++ ";")
2422+ GridPosition position ->
2423+ let
2424+ class =
2425+ ".grid-pos-"
2426+ ++ String.fromInt position.row
2427+ ++ "-"
2428+ ++ String.fromInt position.col
2429+ ++ "-"
2430+ ++ String.fromInt position.width
2431+ ++ "-"
2432+ ++ String.fromInt position.height
2433+
2434+ msPosition =
2435+ String.join " "
2436+ [ "-ms-grid-row: "
2437+ ++ String.fromInt position.row
2438+ ++ ";"
2439+ , "-ms-grid-row-span: "
2440+ ++ String.fromInt position.height
2441+ ++ ";"
2442+ , "-ms-grid-column: "
2443+ ++ String.fromInt position.col
2444+ ++ ";"
2445+ , "-ms-grid-column-span: "
2446+ ++ String.fromInt position.width
2447+ ++ ";"
2448+ ]
2449+
2450+ base =
2451+ class ++ "{" ++ msPosition ++ "}"
2452+
2453+ modernPosition =
2454+ String.join " "
2455+ [ "grid-row: "
2456+ ++ String.fromInt position.row
2457+ ++ " / "
2458+ ++ String.fromInt (position.row + position.height)
2459+ ++ ";"
2460+ , "grid-column: "
2461+ ++ String.fromInt position.col
2462+ ++ " / "
2463+ ++ String.fromInt (position.col + position.width)
2464+ ++ ";"
2465+ ]
2466+
2467+ modernGrid =
2468+ class ++ "{" ++ modernPosition ++ "}"
2469+
2470+ supports =
2471+ "@supports (display:grid) {" ++ modernGrid ++ "}"
2472+ in
2473+ base ++ supports
29782474
2979− rows =
2980− template.rows
2981− |> List.map toGridLength
2475+ PseudoSelector class styles ->
2476+ let
2477+ renderPseudoRule style =
2478+ renderStyleRule style (Just class)
2479+ in
2480+ List.map renderPseudoRule styles
29822481 |> String.join " "
2983− |> (\x -> "grid-template-rows: " ++ x ++ ";")
2984−
2985− gapX =
2986− "grid-column-gap:" ++ toGridLength (Tuple.first template.spacing) ++ ";"
2987−
2988− gapY =
2989− "grid-row-gap:" ++ toGridLength (Tuple.second template.spacing) ++ ";"
2990−
2991− modernGrid =
2992− class ++ "{" ++ columns ++ rows ++ gapX ++ gapY ++ "}"
2993−
2994− supports =
2995− "@supports (display:grid) {" ++ modernGrid ++ "}"
2996− in
2997− [ base
2998− , supports
2999− ]
30002482
3001− GridPosition position ->
3002− let
3003− class =
3004− ".grid-pos-"
3005− ++ String.fromInt position.row
3006− ++ "-"
3007− ++ String.fromInt position.col
3008− ++ "-"
3009− ++ String.fromInt position.width
3010− ++ "-"
3011− ++ String.fromInt position.height
3012−
3013− msPosition =
3014− String.join " "
3015− [ "-ms-grid-row: "
3016− ++ String.fromInt position.row
3017− ++ ";"
3018− , "-ms-grid-row-span: "
3019− ++ String.fromInt position.height
3020− ++ ";"
3021− , "-ms-grid-column: "
3022− ++ String.fromInt position.col
3023− ++ ";"
3024− , "-ms-grid-column-span: "
3025− ++ String.fromInt position.width
3026− ++ ";"
3027− ]
3028−
3029− base =
3030− class ++ "{" ++ msPosition ++ "}"
3031−
3032− modernPosition =
3033− String.join " "
3034− [ "grid-row: "
3035− ++ String.fromInt position.row
3036− ++ " / "
3037− ++ String.fromInt (position.row + position.height)
3038− ++ ";"
3039− , "grid-column: "
3040− ++ String.fromInt position.col
3041− ++ " / "
3042− ++ String.fromInt (position.col + position.width)
3043− ++ ";"
3044− ]
3045−
3046− modernGrid =
3047− class ++ "{" ++ modernPosition ++ "}"
3048−
3049− supports =
3050− "@supports (display:grid) {" ++ modernGrid ++ "}"
3051− in
3052− [ base
3053− , supports
3054− ]
2483+ Transform transform ->
2484+ let
2485+ val =
2486+ transformValue transform
30552487
3056− PseudoSelector class styles ->
3057− let
3058− renderPseudoRule style =
3059− renderStyleRule options style (Just class)
3060− in
3061− List.concatMap renderPseudoRule styles
2488+ class =
2489+ transformClass transform
2490+ in
2491+ case ( class, val ) of
2492+ ( Just cls, Just v ) ->
2493+ renderStyle
2494+ maybePseudo
2495+ ("." ++ cls)
2496+ [ Property "transform"
2497+ v
2498+ ]
30622499
3063− Transform transform ->
3064− let
3065− val =
3066− transformValue transform
2500+ _ ->
2501+ ""
30672502
3068− class =
3069− transformClass transform
3070− in
3071− case ( class, val ) of
3072− ( Just cls, Just v ) ->
3073− renderStyle options
3074− maybePseudo
3075− ("." ++ cls)
3076− [ Property "transform"
3077− v
3078− ]
2503+ combine style rendered =
2504+ { rendered
2505+ | rules = rendered.rules ++ renderStyleRule style Nothing
2506+ , topLevel =
2507+ case renderTopLevels style of
2508+ Nothing ->
2509+ rendered.topLevel
30792510
3080− _ ->
3081− []
2511+ Just topLevel ->
2512+ rendered.topLevel ++ topLevel
2513+ }
2514+ in
2515+ case List.foldl combine { rules = "", topLevel = "" } stylesheet of
2516+ { topLevel, rules } ->
2517+ topLevel ++ rules
30822518
30832519
30842520lengthClassName : Length -> String
@@ -3118,12 +2554,12 @@ formatTextShadow shadow =
31182554 ]
31192555
31202556
3121−textShadowClass shadow =
2557+textShadowName shadow =
31222558 String.concat
31232559 [ "txt"
3124− , floatClass (Tuple.first shadow.offset) ++ "px"
3125− , floatClass (Tuple.second shadow.offset) ++ "px"
3126− , floatClass shadow.blur ++ "px"
2560+ , String.fromFloat (Tuple.first shadow.offset) ++ "px"
2561+ , String.fromFloat (Tuple.second shadow.offset) ++ "px"
2562+ , String.fromFloat shadow.blur ++ "px"
31272563 , formatColorClass shadow.color
31282564 ]
31292565
@@ -3144,17 +2580,17 @@ formatBoxShadow shadow =
31442580 ]
31452581
31462582
3147−boxShadowClass shadow =
2583+boxShadowName shadow =
31482584 String.concat <|
31492585 [ if shadow.inset then
31502586 "box-inset"
31512587
31522588 else
31532589 "box-"
3154− , floatClass (Tuple.first shadow.offset) ++ "px"
3155− , floatClass (Tuple.second shadow.offset) ++ "px"
3156− , floatClass shadow.blur ++ "px"
3157− , floatClass shadow.size ++ "px"
2590+ , String.fromFloat (Tuple.first shadow.offset) ++ "px"
2591+ , String.fromFloat (Tuple.second shadow.offset) ++ "px"
2592+ , String.fromFloat shadow.blur ++ "px"
2593+ , String.fromFloat shadow.size ++ "px"
31582594 , formatColorClass shadow.color
31592595 ]
31602596
@@ -3199,17 +2635,6 @@ paddingName top right bottom left =
31992635 ++ String.fromInt left
32002636
32012637
3202−paddingNameFloat top right bottom left =
3203− "pad-"
3204− ++ floatClass top
3205− ++ "-"
3206− ++ floatClass right
3207− ++ "-"
3208− ++ floatClass bottom
3209− ++ "-"
3210− ++ floatClass left
3211−
3212−
32132638getStyleName : Style -> String
32142639getStyleName style =
32152640 case style of
@@ -3240,9 +2665,6 @@ getStyleName style =
32402665 PaddingStyle cls top right bottom left ->
32412666 cls
32422667
3243− BorderWidth cls top right bottom left ->
3244− cls
3245−
32462668 GridTemplateStyle template ->
32472669 "grid-rows-"
32482670 ++ String.join "-" (List.map lengthClassName template.rows)
@@ -3475,76 +2897,3 @@ onlyStyles attr =
34752897
34762898 _ ->
34772899 Nothing
3478−
3479−
3480−
3481−{- Font Adjustments -}
3482−
3483−
3484−convertAdjustment adjustment =
3485− let
3486− lineHeight =
3487− 1.5
3488−
3489− base =
3490− lineHeight
3491−
3492− normalDescender =
3493− (lineHeight - 1)
3494− / 2
3495−
3496− oldMiddle =
3497− lineHeight / 2
3498−
3499− newCapitalMiddle =
3500− ((ascender - newBaseline) / 2) + newBaseline
3501−
3502− newFullMiddle =
3503− ((ascender - descender) / 2) + descender
3504−
3505− lines =
3506− [ adjustment.capital
3507− , adjustment.baseline
3508− , adjustment.descender
3509− , adjustment.lowercase
3510− ]
3511−
3512− ascender =
3513− Maybe.withDefault adjustment.capital (List.maximum lines)
3514−
3515− descender =
3516− Maybe.withDefault adjustment.descender (List.minimum lines)
3517−
3518− newBaseline =
3519− lines
3520− |> List.filter (\x -> x /= descender)
3521− |> List.minimum
3522− |> Maybe.withDefault adjustment.baseline
3523−
3524− capitalVertical =
3525− 1 - ascender
3526−
3527− capitalSize =
3528− 1 / (ascender - newBaseline)
3529−
3530− fullSize =
3531− 1 / (ascender - descender)
3532−
3533− fullVertical =
3534− 1 - ascender
3535−
3536− -- (oldMiddle - newFullMiddle) * 2
3537− in
3538− { full =
3539− adjust fullSize (ascender - descender) fullVertical
3540− , capital =
3541− adjust capitalSize (ascender - newBaseline) capitalVertical
3542− }
3543−
3544−
3545−adjust size height vertical =
3546− { vertical = vertical
3547− , height =
3548− height / size
3549− , size = size
3550− }