From 347f80eda8d5e13309cbff475f8239d635ab0c92 Mon Sep 17 00:00:00 2001 From: "iksaritsa.nikita" Date: Thu, 13 Jul 2023 20:12:53 +0400 Subject: [PATCH] The priority of pseudo-classes is set. #352 --- examples/Pseudo.elm | 31 +++++++++++++++++++++++++++++++ src/Internal/Model.elm | 16 +++++++++++++++- 2 files changed, 46 insertions(+), 1 deletion(-) create mode 100644 examples/Pseudo.elm diff --git a/examples/Pseudo.elm b/examples/Pseudo.elm new file mode 100644 index 00000000..a1c13c99 --- /dev/null +++ b/examples/Pseudo.elm @@ -0,0 +1,31 @@ +module Pseudo exposing (..) + +import Element exposing (..) +import Element.Background as Background +import Element.Font as Font + + +main = + Element.layout + [ Background.color (rgba 0 0 0 1) + , Font.color (rgba 1 1 1 1) + , Font.italic + , Font.size 32 + , Font.family + [ Font.sansSerif ] + ] + <| + column [ centerX, centerY ] + [ el + [ mouseOver [ Background.color <| rgb255 255 0 0 ] + , mouseDown [ Background.color <| rgb255 0 0 255 ] + ] + <| + text "The following priority of pseudo classes is fixed" + , el + [ mouseDown [ Background.color <| rgb255 0 0 255 ] + , mouseOver [ Background.color <| rgb255 255 0 0 ] + ] + <| + text "hover < focused < active" + ] diff --git a/src/Internal/Model.elm b/src/Internal/Model.elm index b381c70b..7f6b1f89 100644 --- a/src/Internal/Model.elm +++ b/src/Internal/Model.elm @@ -2622,7 +2622,21 @@ toStyleSheetString options stylesheet = in case List.foldl combine { topLevel = [], rules = [] } stylesheet of { topLevel, rules } -> - renderTopLevelValues topLevel ++ String.concat rules + let + ruleWeight s = + if String.contains ":hover" s then + 1 + + else if String.contains ":focus" s then + 2 + + else if String.contains ":active" s then + 3 + + else + 0 + in + renderTopLevelValues topLevel ++ String.concat (List.sortBy ruleWeight rules) renderStyle : OptionRecord -> Maybe PseudoClass -> String -> List Property -> List String