Some more styling
This commit is contained in:
parent
e9c0304be8
commit
8408bb6b55
6 changed files with 126 additions and 78 deletions
38
noodle.css
38
noodle.css
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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)
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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
|
||||
|
|
Loading…
Reference in a new issue