From 96eea1265d02280eb62a2bdc5ab19ad7fae85e8c Mon Sep 17 00:00:00 2001 From: Artyom Date: Wed, 23 Mar 2016 18:28:03 +0300 Subject: [PATCH] Use wrapPage everywhere + sticky footer --- src/Main.hs | 11 ++------- src/View.hs | 59 +++++++++++++++++++++++----------------------- static/css.css | 28 +++++++++++++++++----- static/donate.html | 2 ++ 4 files changed, 56 insertions(+), 44 deletions(-) diff --git a/src/Main.hs b/src/Main.hs index 049ec1d..78b6dc9 100644 --- a/src/Main.hs +++ b/src/Main.hs @@ -372,14 +372,7 @@ main = do -- Main page Spock.get root $ - lucidWithConfig $ do - head_ $ do - title_ "Aelve Guide" - includeCSS "/css.css" - renderTracking - body_ $ do - h1_ "Aelve Guide" - h2_ (a_ [href_ "/haskell"] "Haskell") + lucidWithConfig $ renderRoot -- Admin page prehook adminHook $ do @@ -399,7 +392,7 @@ main = do Spock.get root $ do s <- dbQuery GetGlobalState q <- param "q" - lucidWithConfig $ renderRoot s q + lucidWithConfig $ renderHaskellRoot s q -- Category pages Spock.get var $ \path -> do -- The links look like /parsers-gao238b1 (because it's nice when diff --git a/src/View.hs b/src/View.hs index aac4607..639f691 100644 --- a/src/View.hs +++ b/src/View.hs @@ -11,6 +11,7 @@ module View ( -- * Pages renderRoot, + renderHaskellRoot, renderDonate, renderCategoryPage, renderUnwrittenRules, @@ -95,10 +96,16 @@ instead of simple -} -renderRoot +renderRoot :: (MonadIO m, MonadReader Config m) => HtmlT m () +renderRoot = do + wrapPage "Aelve Guide" $ do + h1_ "Aelve Guide" + h2_ (a_ [href_ "/haskell"] "Haskell") + +renderHaskellRoot :: (MonadIO m, MonadReader Config m) => GlobalState -> Maybe Text -> HtmlT m () -renderRoot globalState mbSearchQuery = +renderHaskellRoot globalState mbSearchQuery = wrapPage "Aelve Guide" $ do -- TODO: [very-easy] this header looks bad when the page is narrow, it -- should be fixed in css.css by adding line-height to it @@ -137,6 +144,23 @@ renderRoot globalState mbSearchQuery = -- TODO: maybe add a button like “give me random category that is -- unfinished” +renderCategoryPage + :: (MonadIO m, MonadReader Config m) => Category -> HtmlT m () +renderCategoryPage category = + wrapPage (category^.title <> " – Aelve Guide") $ do + -- TODO: [very-easy] this header looks bad when the page is narrow, it + -- should be fixed in css.css by adding line-height to it + -- TODO: another absolute link [absolute-links] + h1_ (a_ [href_ "/haskell"] "The Haskeller's guide") + noscript_ $ div_ [id_ "noscript-message"] $ + toHtml $ renderMarkdownBlock [text| + You have Javascript disabled! This site works fine without + Javascript, but since all editing needs Javascript to work, + you won't be able to edit anything. + |] + renderHelp + renderCategory category + -- TODO: when submitting a text field, gray it out (but leave it selectable) -- until it's been submitted @@ -151,15 +175,8 @@ renderTracking = do -- without internet renderDonate :: (MonadIO m, MonadReader Config m) => HtmlT m () -renderDonate = doctypehtml_ $ do - head_ $ do - title_ "Donate to Artyom" - meta_ [name_ "viewport", - content_ "width=device-width, initial-scale=1.0, user-scalable=yes"] - includeCSS "/css.css" - renderTracking - body_ $ - toHtmlRaw =<< liftIO (readFile "static/donate.html") +renderDonate = wrapPage "Donate to Artyom" $ do + toHtmlRaw =<< liftIO (readFile "static/donate.html") renderUnwrittenRules :: (MonadIO m, MonadReader Config m) => HtmlT m () renderUnwrittenRules = wrapPage "Unwritten rules" $ do @@ -213,7 +230,8 @@ wrapPage pageTitle page = doctypehtml_ $ do |] body_ $ do - page + div_ [id_ "main"] $ + page div_ [id_ "footer"] $ do "made by " >> a_ [href_ "https://artyom.me"] "Artyom" emptySpan "2em" @@ -224,23 +242,6 @@ wrapPage pageTitle page = doctypehtml_ $ do a_ [href_ "/donate"] "donate" sup_ [style_ "font-size:50%"] "I don't have a job" -renderCategoryPage - :: (MonadIO m, MonadReader Config m) => Category -> HtmlT m () -renderCategoryPage category = - wrapPage (category^.title <> " – Aelve Guide") $ do - -- TODO: [very-easy] this header looks bad when the page is narrow, it - -- should be fixed in css.css by adding line-height to it - -- TODO: another absolute link [absolute-links] - h1_ (a_ [href_ "/haskell"] "The Haskeller's guide") - noscript_ $ div_ [id_ "noscript-message"] $ - toHtml $ renderMarkdownBlock [text| - You have Javascript disabled! This site works fine without - Javascript, but since all editing needs Javascript to work, - you won't be able to edit anything. - |] - renderHelp - renderCategory category - -- TODO: allow archiving items if they are in every way worse than the rest, -- or something (but searching should still be possible) diff --git a/static/css.css b/static/css.css index cbc3bd8..ef0a127 100644 --- a/static/css.css +++ b/static/css.css @@ -1,6 +1,28 @@ +/* Making textboxes and other text inputs behave normally (i.e. now an input + with “width:100%;padding:10px” is going to take 100% of width, not + 100%+20px) */ + *, *:before, *:after { box-sizing: border-box; } +/* Making the footer stick to the bottom of the screen */ + +body { + display: flex; + min-height: 100vh; + flex-direction: column; } + +#main { + flex: 1; } + +/* Other CSS */ + +#footer { + text-align: center; + padding: 1.5em 0; + margin-top: 2em; + border-top: 1px solid black; } + body { padding-top: 2em; margin: auto; @@ -12,12 +34,6 @@ body { padding: 1px 1em; background-color: #FFEBEE; } -#footer { - text-align: center; - padding: 1.5em 0; - margin-top: 2em; - border-top: 1px solid black; } - #search { font-size: 200%; border: 1px solid #d0d0d0; diff --git a/static/donate.html b/static/donate.html index 0e3a09c..87715bf 100644 --- a/static/donate.html +++ b/static/donate.html @@ -1,3 +1,5 @@ +

Donate

+

Okay, the rules: if you donate anything, I'll spend some time working on the site this day (adding content, implementing new features, etc). Of course, I'm planning to be working on the site anyway, donations or not! However, I jump from project to project way too often (and rarely manage to finish anything), so donating money is a good way to make sure that I'd feel obligated to keep working on this one. If I find out that it doesn't work as a motivation, I'll stop accepting donations.

Just in case, 1000 rub. is 14$ (or 12.5€), and you can choose any amount below 15000 rub. I'd put a Paypal button, but Paypal doesn't allow receiving money in Belarus.