ananthv/macgregor
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

refactor: use compositions

Browse source
This commit is contained in:
Ananth Venkatesh 2025-02-09 01:05:58 -05:00
parent 567742186b
commit 147da72331
Signed by: ananthv
GPG key ID: 4BB578E748CFE4FF
1 changed files with 32 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

44
src/Main.elm
View file

@ -206,6 +206,26 @@ btn disp act =
button btnStyle { onPress = Just act, label = text (String.toUpper disp) }
vw2pt : Model -> Float -> Int
vw2pt model ratio =
(round << vw model) ratio
vw2px : Model -> Float -> Length
vw2px model ratio =
px (vw2pt model ratio)
vh2pt : Model -> Float -> Int
vh2pt model ratio =
(round << vh model) ratio
vh2px : Model -> Float -> Length
vh2px model ratio =
px (vh2pt model ratio)
view : Model -> Browser.Document Msg
view model =
{ title = "MacGregor House"
@ -214,35 +234,35 @@ view model =
[ column
[ width fill
, height fill
, spacing (round (vh model -100))
, spacing (vh2pt model -100)
]
[ el
[ width fill
, height (px (round (vh model 100)))
, height (vh2px model 100)
, Background.color (rgb255 0 0 0)
]
Element.none
, animatedEl crossfadeIn
[ width fill
, height (px (round (vh model 100)))
, height (vh2px model 100)
, Background.gradient { angle = 45, steps = [ rgb255 200 0 100, rgb255 100 0 200 ] }
]
Element.none
, animatedEl crossfadeOut
[ width fill
, height (px (round (vh model 100)))
, height (vh2px model 100)
, Background.gradient { angle = 45, steps = [ rgb255 0 100 200, rgb255 0 200 100 ] }
]
Element.none
, el
[ alignLeft
, alignTop
, width (px (round (vw model 50)))
, height (px (round (vh model 100)))
, width (vw2px model 50)
, height (vh2px model 100)
, paddingEach
{ top = round (vh model 50) - 96
{ top = vh2pt model 50 - 96
, bottom = 0
, left = round (vw model 10)
, left = vw2pt model 10
, right = 0
}
, Font.color (rgb255 255 255 255)
@ -265,11 +285,11 @@ view model =
, el
[ alignRight
, alignTop
, width (px (round (vw model 60)))
, height (px (round (vh model 100)))
, width (vw2px model 60)
, height (vh2px model 100)
, paddingEach
{ top = round (vh model 25)
, bottom = round (vh model 25)
{ top = vh2pt model 25
, bottom = vh2pt model 25
, left = 0
, right = 0
}