Prettify

1 files changed, 29 insertions, 16 deletions

diff --git a/front/src/Main.elm b/front/src/Main.elm
index 18e13b6..19fd765 100644
--- a/front/src/Main.elm
+++ b/front/src/Main.elm
@@ -1,7 +1,7 @@
 module Main exposing (main)
 
 import Browser
-import Html exposing (Html, button, div, hr, input, span, table, tbody, td, text, th, thead, tr)
+import Html exposing (Attribute, Html, button, div, hr, input, span, table, tbody, td, text, th, thead, tr)
 import Html.Attributes exposing (class, disabled, max, min, step, style, title, type_, value)
 import Html.Events exposing (onClick, onInput)
 import Http
@@ -191,6 +191,15 @@ update msg model =
 
 
 
+-- VIEW (THEME)
+
+
+butAttrs : List (Attribute Msg)
+butAttrs =
+    [ class "px-3 rounded-md bg-lime-300 enabled:active:bg-lime-400 border border-lime-600 disabled:opacity-75" ]
+
+
+
 -- VIEW
 
 
@@ -228,7 +237,7 @@ specsView simSpecsTxt =
         simSpecs =
             simSpecsParse simSpecsTxt
 
-        simButtonAttrs =
+        simButAttrs =
             case simSpecs of
                 Nothing ->
                     [ disabled True ]
@@ -237,10 +246,11 @@ specsView simSpecsTxt =
                     [ onClick (RunSimulation specs) ]
     in
     div []
-        [ div []
+        [ div [ class "flex" ]
             [ text "Principal: "
             , input
                 [ type_ "range"
+                , class "accent-lime-300"
                 , Html.Attributes.min "0"
                 , Html.Attributes.max "1000000"
                 , step "10000"
@@ -250,7 +260,7 @@ specsView simSpecsTxt =
                 []
             , text principalTxt
             ]
-        , div []
+        , div [ class "flex" ]
             [ text "Interest rate: "
             , input
                 [ Html.Attributes.min "0"
@@ -260,10 +270,11 @@ specsView simSpecsTxt =
                 ]
                 []
             ]
-        , div []
+        , div [ class "flex" ]
             [ text "Years: "
             , input
                 [ type_ "range"
+                , class "accent-lime-300"
                 , Html.Attributes.min "1"
                 , Html.Attributes.max "50"
                 , step "1"
@@ -273,7 +284,7 @@ specsView simSpecsTxt =
                 []
             , text yearsTxt
             ]
-        , button simButtonAttrs [ text "Simulate" ]
+        , button (butAttrs ++ simButAttrs) [ text "Simulate" ]
         ]
 
 
@@ -284,7 +295,7 @@ historyView quotas =
             [ "Month", "Quota", "Pending" ]
 
         head =
-            thead [] [ tr [] (List.map (\t -> th [ class "px-3 py-1 border border-gray-300" ] [ text t ]) titles) ]
+            thead [ class "bg-lime-100" ] [ tr [] (List.map (\t -> th [ class "px-3 py-1 border border-gray-300" ] [ text t ]) titles) ]
     in
     table [ class "border border-collapse border-gray-400" ] [ head, tbody [] (List.map quotaView quotas) ]
 
@@ -325,13 +336,15 @@ simView { history, topay, payed } =
 
 view : Model -> Html Msg
 view model =
-    div []
-        [ specsView model.simSpecsTxt
-        , case model.simulation of
-            Nothing ->
-                text ""
-
-            Just sim ->
-                div [] [ simView sim ]
-        , div [] [ text model.error ]
+    div [ class "flex flex-row max-w-sm mx-auto" ]
+        [ div [ class "flex flex-col items-center" ]
+            [ specsView model.simSpecsTxt
+            , case model.simulation of
+                Nothing ->
+                    text ""
+
+                Just sim ->
+                    div [] [ simView sim ]
+            , div [] [ text model.error ]
+            ]
         ]