Some more styling

This commit is contained in:
Konrad Merz 2015-04-10 16:51:24 +02:00
parent e9c0304be8
commit 8408bb6b55
6 changed files with 126 additions and 78 deletions

View file

@ -2,14 +2,42 @@ body {
font-family: Sans;
}
h4 {
margin-bottom: 7px;
h2.header {
font-weight: lighter;
width: 100%;
border-bottom: 1px solid #ddd;
}
h3.title {
font-weight: lighter;
}
.container {
margin: 30px 20px;
}
.poll-name {
font-weight: normal;
border-bottom: 1px solid #ddd;
margin-bottom: 10px;
}
.poll-desc {
font-family: monospace;
margin-bottom: 20px;
padding: 5px 5px 30px 5px;
background-color: #ddd;
}
.opt-edit.btn {
float: right;
border: 1px solid #bbb;
}
.table {
border-collapse: collapse;
margin-top: 25px;
width: 500px;
width: 100%;
}
.table td {
@ -19,6 +47,10 @@ h4 {
border-top: 1px solid #ddd;
}
.table .btn {
float: right;
}
.table a {
text-decoration: none;
}

View file

@ -5,7 +5,6 @@ module Noodle.Views.Edit where
import Text.Blaze.Html5 as H
import Text.Blaze.Html5.Attributes as A
import Text.Blaze.Html.Renderer.Text
import Data.Monoid ((<>))
render (pollId, pollName, pollDesc) options errors =
H.html $ do
@ -13,22 +12,26 @@ render (pollId, pollName, pollDesc) options errors =
H.title "Noodle - The doodle"
H.link ! A.rel "stylesheet" ! A.type_ "text/css" ! A.href "/noodle.css"
H.body $ do
H.h3 $ toHtml $ "Edit options of " ++ pollName
mapM_ renderErrors errors
H.form ! A.method "post" ! A.action "/options/" $ do
H.input ! A.class_ "input" ! A.placeholder "add a option" ! A.name "name"
H.input ! A.class_ "input" ! A.placeholder "with description" ! A.name "desc"
H.input ! A.type_ "hidden" ! A.value (H.stringValue (show pollId)) !
A.name "id"
H.input ! A.class_ "btn" ! A.type_ "submit" ! A.value "Add"
H.form ! A.method "post" !
A.action (H.stringValue "/options/delete") $ do
H.table $ mapM_ renderLn options
H.input ! A.type_ "hidden" ! A.value (H.stringValue (show pollId)) !
A.name "id"
H.input ! A.class_ "btn" ! A.type_ "submit" ! A.value "Delete"
H.a ! A.class_ "btn" ! A.href (H.stringValue ("/polls/" ++ show pollId)) $
"To poll"
H.h2 ! A.class_ "header" $ "Noodle - The doodle"
H.h3 ! A.class_ "title" $ toHtml $ "Edit options of " ++ pollName
H.div ! A.class_ "container" $ do
mapM_ renderErrors errors
H.form ! A.method "post" ! A.action "/options/" $ do
H.input ! A.class_ "input" ! A.placeholder "add a option" !
A.name "name"
H.input ! A.class_ "input" ! A.placeholder "with description" !
A.name "desc"
H.input ! A.type_ "hidden" ! A.value (H.stringValue (show pollId)) !
A.name "id"
H.input ! A.class_ "btn" ! A.type_ "submit" ! A.value "Add"
H.form ! A.method "post" !
A.action (H.stringValue "/options/delete") $ do
H.table $ mapM_ renderLn options
H.input ! A.type_ "hidden" ! A.value (H.stringValue (show pollId)) !
A.name "id"
H.input ! A.class_ "btn" ! A.type_ "submit" ! A.value "Delete"
H.a ! A.class_ "btn" !
A.href (H.stringValue ("/polls/" ++ show pollId)) $ "To poll"
where renderErrors error = do
H.p ! A.class_ "error" $ error
H.br

View file

@ -13,22 +13,24 @@ render (pollId, pollName, pollDesc) errors =
H.title "Noodle - The doodle"
H.link ! A.rel "stylesheet" ! A.type_ "text/css" ! A.href "/noodle.css"
H.body $ do
H.h2 "Edit the poll"
mapM_ renderErrors errors
H.form ! A.class_ "form" ! A.method "post" !
A.action (H.stringValue ("/polls/" ++ show pollId ++ "/update")) $ do
H.table $ do
H.tr $ do
H.td $ H.label "Name: "
H.td $ H.input ! A.name "name" ! A.value (H.stringValue pollName)
H.tr $ do
H.td $ H.label "Description: "
H.td $ H.textarea ! A.name "desc" ! A.cols "50" ! A.rows "10" $
H.toHtml pollDesc
H.div ! A.class_ "btns" $ do
H.a ! A.class_ "btn" ! A.href (
H.stringValue ("/polls/" ++ show pollId)) $ "To poll"
H.input ! A.class_ "btn" ! A.type_ "submit" ! A.value "Update Poll"
H.h2 ! A.class_ "header" $ "Noodle - The doodle"
H.h3 ! A.class_ "title" $ "Edit the poll"
H.div ! A.class_ "container" $ do
mapM_ renderErrors errors
H.form ! A.class_ "form" ! A.method "post" !
A.action (H.stringValue ("/polls/" ++ show pollId ++ "/update")) $ do
H.table $ do
H.tr $ do
H.td $ H.label "Name: "
H.td $ H.input ! A.name "name" ! A.value (H.stringValue pollName)
H.tr $ do
H.td $ H.label "Description: "
H.td $ H.textarea ! A.name "desc" ! A.cols "50" ! A.rows "10" $
H.toHtml pollDesc
H.div ! A.class_ "btns" $ do
H.a ! A.class_ "btn" ! A.href (
H.stringValue ("/polls/" ++ show pollId)) $ "To poll"
H.input ! A.class_ "btn" ! A.type_ "submit" ! A.value "Update Poll"
where renderErrors error = do
H.p ! A.class_ "error" $ error
H.br

View file

@ -13,9 +13,11 @@ render items =
H.title "Noodle - The doodle"
H.link ! A.rel "stylesheet" ! A.type_ "text/css" ! A.href "/noodle.css"
H.body $ do
H.h2 "Noodle - The doodle"
H.a ! A.class_ "btn" ! A.href "/polls/new" $ "New Poll"
H.table ! A.class_ "table" $ mapM_ renderLn items
H.h2 ! A.class_ "header" $ "Noodle - The doodle"
H.h3 ! A.class_ "title" $ "All polls"
H.div ! A.class_ "container" $ do
H.a ! A.class_ "btn" ! A.href "/polls/new" $ "New Poll"
H.table ! A.class_ "table" $ mapM_ renderLn items
where renderLn i = H.tr $ do
H.td $ H.a ! A.href ("/polls/" <> H.stringValue (show $ fst i)) $
H.toHtml (snd i)

View file

@ -13,19 +13,21 @@ render errors =
H.title "Noodle - The doodle"
H.link ! A.rel "stylesheet" ! A.type_ "text/css" ! A.href "/noodle.css"
H.body $ do
H.h2 "Create a poll"
mapM_ renderErrors errors
H.form ! A.class_ "form" ! A.method "post" ! A.action "/polls/" $ do
H.table $ do
H.tr $ do
H.td $ H.label "Name: "
H.td $ H.input ! A.name "name"
H.tr $ do
H.td $ H.label "Description: "
H.td $ H.textarea ! A.name "desc" ! A.cols "50" ! A.rows "10" $ ""
H.div ! A.class_ "btns" $ do
H.a ! A.class_ "btn" ! A.href "/polls" $ "Back"
H.input ! A.class_ "btn" ! A.type_ "submit" ! A.value "Add Poll"
H.h2 ! A.class_ "header" $ "Noodle - The doodle"
H.h3 ! A.class_ "title" $ "Create a poll"
H.div ! A.class_ "container" $ do
mapM_ renderErrors errors
H.form ! A.class_ "form" ! A.method "post" ! A.action "/polls/" $ do
H.table $ do
H.tr $ do
H.td $ H.label "Name: "
H.td $ H.input ! A.name "name"
H.tr $ do
H.td $ H.label "Description: "
H.td $ H.textarea ! A.name "desc" ! A.cols "50" ! A.rows "10" $ ""
H.div ! A.class_ "btns" $ do
H.a ! A.class_ "btn" ! A.href "/polls" $ "Back"
H.input ! A.class_ "btn" ! A.type_ "submit" ! A.value "Add Poll"
where renderErrors error = do
H.p ! A.class_ "error" $ error
H.br

View file

@ -14,32 +14,39 @@ render (pollId, pollName, pollDesc) options voters cants errors editVoter =
H.title "Noodle - The doodle"
H.link ! A.rel "stylesheet" ! A.type_ "text/css" ! A.href "/noodle.css"
H.body $ do
H.h3 $ toHtml pollName
mapM_ (\x-> do H.toHtml x; H.br) (lines pollDesc)
H.br
H.a ! A.class_ "btn" ! A.href (
H.stringValue ("/polls/" ++ show pollId ++ "/edit_name")) $ "Edit"
mapM_ renderErrors errors
H.table $ do
H.tr $ do
H.td ""
mapM_ renderOption options
mapM_ renderVoter $ M.keys voters
mapM_ renderCants cants
H.tr $ do
H.td ""
mapM_ renderVoteCount options
H.tr $
H.form ! A.method "post" !
A.action (H.stringValue ("/polls/" ++ show pollId ++ "/vote")) $ do
H.td $
H.input ! A.class_ "input" ! A.placeholder "Vote as" ! A.name "name"
mapM_ renderCheckbox options
H.td $ H.input ! A.class_ "btn" ! A.type_ "submit" ! A.value "Vote"
H.br
H.a ! A.class_ "btn" ! A.href "/polls" $ "To overview"
H.a ! A.class_ "btn" !
A.href (H.stringValue ("/polls/" ++ show pollId ++ "/edit")) $ "Edit Options"
H.h2 ! A.class_ "header" $ "Noodle - The doodle"
H.h3 ! A.class_ "title" $ "Show poll"
H.div ! A.class_ "container" $ do
H.div ! A.class_ "poll" $ do
H.h4 ! A.class_ "poll-name" ! A.class_ "title" $ toHtml pollName
H.div ! A.class_ "poll-desc" $ do
mapM_ (\x-> do H.toHtml x; H.br) (lines pollDesc)
H.a ! A.class_ "opt-edit btn" ! A.href (
H.stringValue ("/polls/" ++ show pollId ++ "/edit_name")) $ "Edit"
mapM_ renderErrors errors
H.table $ do
H.tr $ do
H.td ""
mapM_ renderOption options
H.tr $ do
H.td ""
mapM_ renderVoteCount options
mapM_ renderVoter $ M.keys voters
mapM_ renderCants cants
H.tr $
H.form ! A.method "post" ! A.action
(H.stringValue ("/polls/" ++ show pollId ++ "/vote")) $ do
H.td $
H.input ! A.class_ "input" ! A.placeholder "Vote as" !
A.name "name"
mapM_ renderCheckbox options
H.td $ H.input ! A.class_ "btn" ! A.type_ "submit" !
A.value "Vote"
H.br
H.a ! A.class_ "btn" ! A.href "/polls" $ "To overview"
H.a ! A.class_ "btn" !
A.href (H.stringValue ("/polls/" ++ show pollId ++ "/edit")) $
"Edit Options"
where renderOption (id, name, desc) =
H.td $ do
H.b $ H.toHtml name