CS-381
/
MiniLogo
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add styling and headings.

This commit is contained in:
Danila Fedorin 2019-02-01 20:39:34 -08:00
parent 91a294a56d
commit cdbd0be256
3 changed files with 45 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
index.html
View File

@ -3,6 +3,7 @@
<title>MiniLogo Simulator</title>
<script src="minilogo.js"></script>
<script src="http://unpkg.com/elm-canvas/elm-canvas.js"></script>
<link rel="stylesheet" href="minilogo.css">
</head>
<body>
<div id="elm-container">

37
minilogo.scss Normal file
View File

@ -0,0 +1,37 @@
@import url('https://fonts.googleapis.com/css?family=Raleway');
$default-shadow: 0px 0px 5px rgba(0, 0, 0, .25);
body {
background-color: rgb(247, 248, 249);
font-family: Raleway, sans-serif;
}
h1, h2 {
text-align: center;
}
div.logo-container {
display: flex;
flex-direction: row;
justify-content: center;
}
div.logo-pane {
flex-grow: 1;
flex-basis: 50%;
padding: 10px;
}
textarea {
width: 100%;
max-width: 500px;
height: 500px;
border: none;
padding: 10px;
}
textarea, canvas {
display: block;
margin: auto;
box-shadow: $default-shadow;
}

11
src/Main.elm
View File

@ -1,4 +1,4 @@
import Html exposing (Html, div, text, textarea)
import Html exposing (Html, div, text, textarea, h1, h2)
import Html.Attributes exposing (class)
import Html.Events exposing (onInput)
import Browser exposing (element)
@ -320,9 +320,12 @@ view m =
<| Result.withDefault (Err "Couldn't parse program")
<| Result.map (\prg -> evaluateAll prg [] initialState) (run parseProg m.programText)
in
div [ class "logo-container" ]
[ div [ class "logo-pane" ] [ textarea [ onInput UpdateText ] [ text m.programText ] ]
, div [ class "logo-pane" ] [ canvas dat ]
div []
[ h1 [] [ text "MiniLogo Functional Evaluator" ]
, div [ class "logo-container" ]
[ div [ class "logo-pane" ] [ h2 [] [ text "MiniLogo" ], textarea [ onInput UpdateText ] [ text m.programText ] ]
, div [ class "logo-pane" ] [ h2 [] [ text "Output" ], canvas dat ]
]
]
update : Msg -> Model -> (Model, Cmd Msg)