feat: initial elm-ui layout

This commit is contained in:
Ananth Venkatesh 2025-01-25 02:38:18 -05:00
parent a86e7dadaf
commit 7dfab317a4
Signed by: ananthv
GPG key ID: 4BB578E748CFE4FF

View file

@ -1,5 +1,82 @@
module Main exposing (main)
import Html exposing (text)
import Browser
import Browser.Events as Events
import Element exposing (..)
import Element.Background as Background
import Element.Font as Font
import Html exposing (Html)
main = text "Hello, world!"
main : Program Flags Model Msg
main =
Browser.document { init = init, update = update, subscriptions = subscribe, view = view }
type alias Model =
{ w : Int, h : Int }
type alias Flags =
( Int, Int )
init : Flags -> ( Model, Cmd Msg )
init flags =
case flags of
( width, height ) ->
( { w = width, h = height }, Cmd.none )
type Msg
= Resize Int Int
update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
case msg of
Resize width height ->
( { model | w = width, h = height }, Cmd.none )
subscribe : Model -> Sub Msg
subscribe _ =
Events.onResize Resize
htmlify : List (Element Msg) -> List (Html Msg)
htmlify =
List.map (Element.layout [])
vw : Model -> Float -> Float
vw model percent =
Basics.toFloat model.w * percent / 100
vh : Model -> Float -> Float
vh model percent =
Basics.toFloat model.h * percent / 100
view : Model -> Browser.Document Msg
view model =
{ title = "MacGregor House"
, body =
htmlify
[ el
[ width fill
, height fill
, Background.color (rgb255 0 0 0)
]
(el
[ alignLeft
, alignTop
, moveRight (vw model 10)
, moveDown (vh model 50)
, Font.color (rgb255 255 255 255)
]
(text "MacGregor House")
)
]
}