Added flexbox. Closes #6

This commit is contained in:
Shaun Kerr 2018-06-28 10:08:45 +12:00
parent 5c08a1c5d8
commit 6aab9b7f8d

113
Main.hs
View File

@ -68,7 +68,8 @@ getHomeR = defaultLayout $ do
} }
body { body {
width: 740px; min-width: 400px;
max-width: 600px;
margin: auto; margin: auto;
padding: 20px; padding: 20px;
text-align: left; text-align: left;
@ -81,7 +82,7 @@ getHomeR = defaultLayout $ do
padding: 5px; padding: 5px;
} }
header { header, footer {
margin: 0px; margin: 0px;
padding: 5px; padding: 5px;
border-top: 4px solid white; border-top: 4px solid white;
@ -103,48 +104,24 @@ getHomeR = defaultLayout $ do
padding: 5px; padding: 5px;
} }
.flexboxcontainer {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
ul { ul {
text-align: initial; text-align: initial;
} }
.current {
width: 600px;
}
.currentFormat {
margin: auto;
padding: 1px;
}
.currentLeft {
width: 300px;
float: left;
}
.currentRight {
margin-left: 300px;
}
.upcoming {
width: 600px;
}
.changes {
margin: auto;
padding: 1px;
}
.upcomingIn { .upcomingIn {
color: #00DD00; color: #00DD00;
background-color: inherit; background-color: inherit;
width: 300px;
float: left;
} }
.upcomingOut { .upcomingOut {
color: #DD0000; color: #DD0000;
background-color: inherit; background-color: inherit;
margin-left: 300px;
} }
|] |]
addScriptRemote "https://fonts.googleapis.com/css?family=Inconsolata" addScriptRemote "https://fonts.googleapis.com/css?family=Inconsolata"
@ -155,40 +132,38 @@ getHomeR = defaultLayout $ do
|] |]
toWidgetBody [hamlet| toWidgetBody [hamlet|
<section class="rotation"> <section class="rotation">
<div class="current"> <h2>Format for #{showMonth month} #{year}:
<h2>Format for #{showMonth month} #{year}: <div class="flexboxcontainer">
<div class="currentFormat"> <div class="rotationLeft">
<div class="currentLeft"> <h3>Evergreen:
<h3>Evergreen: <ul>
<ul> <li>Revised Core Set x3
<li>Revised Core Set x3 <h3>Big Boxes:
<h3>Big Boxes: <ul>
<ul> $forall bb <- bbout
$forall bb <- bbout <li>#{bb}
<li>#{bb} <div class="rotationRight">
<div class="currentRight"> <h3>Data-packs:
<h3>Data-packs: <ul>
<ul> $forall dp <- dpout
$forall dp <- dpout <li>#{dp}
<li>#{dp} <h2>Upcoming Changes for #{showMonth nextMonth} #{year}:
<div class="upcoming"> <div class="flexboxcontainer">
<h2>Upcoming Changes for #{showMonth nextMonth} #{year}:
$maybe (pin, pout, pbin, pbout) <- pr $maybe (pin, pout, pbin, pbout) <- pr
<div class="changes"> <div class="upcomingIn">
<div class="upcomingIn"> <h3>In:
<h3>In: <ul>
<ul> $maybe pbbin <- pbin
$maybe pbbin <- pbin <li>+ #{show pbbin}
<li>+ #{show pbbin} $forall indp <- pin
$forall indp <- pin <li>+ #{show indp}
<li>+ #{show indp} <div class="upcomingOut">
<div class="upcomingOut"> <h3>Out:
<h3>Out: <ul>
<ul> $maybe pbbout <- pbout
$maybe pbbout <- pbout <li>- #{show pbbout}
<li>- #{show pbbout} $forall outdp <- pout
$forall outdp <- pout <li>- #{show outdp}
<li>- #{show outdp}
$nothing $nothing
<h3>Coming soon! <h3>Coming soon!
|] |]
@ -224,9 +199,15 @@ getHomeR = defaultLayout $ do
<li>On the 20th of every month, a preview of the next months format will be shown <li>On the 20th of every month, a preview of the next months format will be shown
<li><del>No matter what the currently legal packs are, Door to Door (Escalation #59) will always be legal</del> <li><del>No matter what the currently legal packs are, Door to Door (Escalation #59) will always be legal</del>
|] |]
toWidgetBody [hamlet|
<footer>
<p>Shaun Kerr (techieAgnostic) - shaundavidkerr@gmail.com
<p>Credit to Chris Hay
<p><em>Powered by Haskell - Minimally Tested</em>
|]
main :: IO () main :: IO ()
main = warp 80 Chhf main = warp 7280 Chhf
toTS :: (Integer, Int, Int) -> Timestamp toTS :: (Integer, Int, Int) -> Timestamp
toTS (y,m,d) = Ts (fromIntegral d) (fromIntegral m) y toTS (y,m,d) = Ts (fromIntegral d) (fromIntegral m) y