diff --git a/TODO b/TODO index fdb963dd7..30448cf66 100644 --- a/TODO +++ b/TODO @@ -1 +1,2 @@ * Bootstrap: http://twitter.github.com/bootstrap/index.html +* use forM_ ( http://jaspervdj.be/blaze/tutorial.html ) \ No newline at end of file diff --git a/res/blog.css b/res/blog.css new file mode 100644 index 000000000..8ab3522d7 --- /dev/null +++ b/res/blog.css @@ -0,0 +1 @@ +@charset UTF-8;@font-face{font-family:'PT Sans';font-style:normal;font-weight:400;src:local('PT Sans'), local(PTSans-Regular), url(http://themes.googleusercontent.com/static/fonts/ptsans/v2/7YGmE4Ls5b94ct65u07hVQLUuEpTyoUstqEm5AMlJo4.woff) format(woff);}html,body{margin:0;padding:0;}body{padding-top:10px;font-family:'PT Sans', sans-serif;min-height:850px;background-color:#4A525A;color:#EEE;}a{color:#000;}input,textarea,select{border:1px solid #555;font-size:15px;line-height:1.2em;width:550px;background:#F9F9F9;-webkit-border-radius:.5em;padding:.5em;}.header{z-index:4;padding-left:20px;padding-bottom:70px;padding-top:30px;position:relative;box-shadow:0 6px 5px 1px #848F9A;}.link{color:#EEE;}.middle{position:relative;z-index:2;display:block;width:100%;padding-top:40px;background-color:#EEE;color:#000;}.footer{z-index:4;position:relative;background-color:#4A525A;margin-top:30px;padding-top:20px;box-shadow:0 -6px 5px 1px #848F9A;color:#EEE;}.btitle{text-decoration:none;color:#EEE;font-size:x-large;font-weight:700;margin-top:15px;margin-bottom:10px;}.contacts{float:left;}.righttext{float:right;padding-right:20px;}.rightbox{text-align:right;padding-right:14px;}.innerTitle{margin-left:10px;font-weight:700;}.innerBoxComments{margin-left:10px;}.innerContainer{padding-right:20px;}.centerbox{text-align:center;min-height:45px;}.cInput{margin-left:15px;}.tt{font-family:"courier new",courier,monospace;font-size:13px;}.cl{text-decoration:none;color:#000;}.cHead{font-size:large;font-weight:700;}.notFoundFace{text-align:center;font-size:100px;}.notFoundText{text-align:center;font-size:24px;font-weight:700;} diff --git a/res/blogstyle.css b/res/blogstyle.css index 3a5070ab3..d58c405cd 100644 --- a/res/blogstyle.css +++ b/res/blogstyle.css @@ -8,51 +8,118 @@ src: local('PT Sans'), local('PTSans-Regular'), url('http://themes.googleusercontent.com/static/fonts/ptsans/v2/7YGmE4Ls5b94ct65u07hVQLUuEpTyoUstqEm5AMlJo4.woff') format('woff'); } +html, body{ + margin: 0; + padding: 0; +} + body { - padding-top: 20px; + padding-top: 10px; font-family: 'PT Sans', sans-serif; min-height: 850px; - background-image: linear-gradient(bottom, rgb(245,245,245) 66%, rgb(239,239,239) 83%); - background-image: -o-linear-gradient(bottom, rgb(245,245,245) 66%, rgb(239,239,239) 83%); - background-image: -moz-linear-gradient(bottom, rgb(245,245,245) 66%, rgb(239,239,239) 83%); - background-image: -webkit-linear-gradient(bottom, rgb(245,245,245) 66%, rgb(239,239,239) 83%); - background-image: -ms-linear-gradient(bottom, rgb(245,245,245) 66%, rgb(239,239,239) 83%); - background-image: -webkit-gradient( - linear, - left bottom, - left top, - color-stop(0.66, rgb(245,245,245)), - color-stop(0.83, rgb(239,239,239)) - ); + background-color: #4A525A; + color: #EEE; } -.mainshell { - width: 98%; - margin: auto; +a { + color: black; } -.gradBox { - width: 98%; - margin: auto; +input, textarea, select { + border: 1px solid #555; + padding: 0.5em; + font-size: 15px; + line-height: 1.2em; + width: 550px; + background: #F9F9F9; + -webkit-border-radius: 0.5em; + } + +/* site sections */ +.header { + z-index: 4; + padding-left: 20px; + padding-bottom: 70px; + padding-top: 30px; + position: relative; + box-shadow: 0 6px 5px 1px #848F9A; } -.myclear { - clear: both; - height: 20px; +.link { + color: #EEE; } +.middle { + position: relative; + z-index: 2; + display: block; + width: 100%; + padding-top: 40px; + background-color: #EEE; + color: black; +} + +.footer { + z-index: 4; + position: relative; + background-color: #4A525A; + margin-top: 30px; + padding-top: 20px; + box-shadow: 0 -6px 5px 1px #848F9A; + color: #EEE; +} + +/* header elements */ + +.btitle { + text-decoration:none; + color: #EEE; + font-size:x-large; + font-weight:bold; + margin-top: 15px; + margin-bottom: 10px; +} + +.contacts { + float: left; +} + +.righttext { + float:right; + padding-right: 20px; +} + +.rightbox { + text-align:right; + padding-right: 14px; +} + +/* middle elements */ +.innerTitle { + margin-left: 10px; + font-weight: bold; +} + +.innerBoxComments{ + margin-left: 10px; +} + +.innerContainer { + padding-right: 20px; + +} + +/* common elements */ .centerbox { text-align:center; min-height: 45px; } -.rightbox { - text-align:right; -} -.innerBox { - width: 100%; - margin-top: 20px; +/* style elements */ + +.cInput { + margin-left: 15px; } .tt { @@ -69,56 +136,6 @@ body { font-weight:bold; } -.innerBoxTop { - height: 28px; - color: #000000; - font-weight: bold; - font-size: 16px; - padding-left: 20px; - padding-top: 11px; - border: 1px solid #b6b6b6; - border-top-left-radius: 6px; - border-top-right-radius: 6px; - -moz-border-radius-topleft: 6px; - -moz-border-radius-topright: 6px; - -webkit-border-top-left-radius: 6px; - -webkit-border-top-right-radius: 6px; - border-bottom: 1px solid #dcdcdc; - background-image: linear-gradient(bottom, rgb(246,246,246) 31%, rgb(234,234,234) 83%); - background-image: -o-linear-gradient(bottom, rgb(246,246,246) 31%, rgb(234,234,234) 83%); - background-image: -moz-linear-gradient(bottom, rgb(246,246,246) 31%, rgb(234,234,234) 83%); - background-image: -webkit-linear-gradient(bottom, rgb(246,246,246) 31%, rgb(234,234,234) 83%); - background-image: -ms-linear-gradient(bottom, rgb(246,246,246) 31%, rgb(234,234,234) 83%); - - background-image: -webkit-gradient( - linear, - left bottom, - left top, - color-stop(0.31, rgb(246,246,246)), - color-stop(0.83, rgb(234,234,234)) - ); -} - -.innerBoxMiddle { - border: 1px solid #b6b6b6; - border-bottom-left-radius: 6px; - border-bottom-right-radius: 6px; - -moz-border-radius-bottomleft: 6px; - -moz-border-radius-bottomright: 6px; - -webkit-border-bottom-left-radius: 6px; - -webkit-border-bottom-right-radius: 6px; - border-top: 0px hidden; - background-color: #FFFFFF; - min-height: 500px; - height: auto; - padding-top: 21px; - padding-right: 2px; -} - -.innerBoxComments { - padding-left: 20px -} - .notFoundFace { text-align: center; font-size: 100px; @@ -129,12 +146,3 @@ body { font-size: 24px; font-weight: bold; } - -label span { - width: 6%; - float: left; -} - -label input { - display: block; -} diff --git a/src/Blog.hs b/src/Blog.hs index fd69d4df5..33d7c3779 100644 --- a/src/Blog.hs +++ b/src/Blog.hs @@ -43,45 +43,43 @@ blogTemplate lang t_append body = H.docTypeHtml $ do --add body H.head $ do H.title $ (toHtml $ blogTitle lang t_append) H.link ! A.rel "alternate" ! A.type_ "application/rss+xml" ! A.title "RSS-Feed" ! A.href "/rss" - H.link ! A.rel "stylesheet" ! A.type_ "text/css" ! A.href "/res/blogstyle.css" ! A.media "all" + H.link ! A.rel "stylesheet" ! A.type_ "text/css" ! A.href "/res/blog.css" ! A.media "all" H.meta ! A.httpEquiv "content-type" ! A.content "text/html;charset=UTF-8" --H.style ! A.type_ "text/css" ! A.title "iOS iMessage" ! A.media "screen and (max-device-width: 1024px)" $ "#cosx{display:none;}" preEscapedText analytics H.body $ do - H.div ! A.class_ "mainshell" $ H.div ! A.class_ "gradBox" $ do - H.div ! A.class_ "header" $ do - H.a ! A.href (toValue $ "/" ++ show lang) ! - A.style "text-decoration:none;color:black;font-size:x-large;font-weight:bold;" $ - toHtml $ blogTitle lang "" - H.p ! A.style "clear: both;" $ do - H.span ! A.style "float: left;" ! A.id "cosx" $ H.b $ contactInfo iMessage - -- H.span ! A.id "cios" ! A.style "display:none;" $ H.b $ contactInfo "sms:tazjin@me.com" - H.span ! A.style "float:right;" $ preEscapedText $ rightText lang - H.div ! A.class_ "myclear" $ mempty + H.div ! A.class_ "header" $ do + H.a ! A.class_ "btitle" ! A.href (toValue $ "/" ++ show lang) $ + toHtml $ blogTitle lang "" + H.p ! A.style "clear: both;" $ do + H.span ! A.class_ "contacts" ! A.id "cosx" $ H.b $ contactInfo iMessage + -- H.span ! A.id "cios" ! A.style "display:none;" $ H.b $ contactInfo "sms:tazjin@me.com" + H.span ! A.class_ "righttext" $ preEscapedText $ rightText lang + H.div ! A.class_ "middle" $ do body - H.div ! A.class_ "myclear" $ mempty - showFooter lang $ T.pack version - H.div ! A.class_ "centerbox" $ - H.img ! A.src "http://getpunchd.com/img/june/idiots.png" ! A.alt "" + H.div ! A.class_ "footer" $ do + showFooter lang $ T.pack version + H.div ! A.class_ "centerbox" $ + H.span ! A.style "font-size: 17px; font-family: Helvetica;" $ "ಠ_ಠ" + --H.img ! A.src "http://cl.ly/F9m4/idiots.png" ! A.alt "" where contactInfo (imu :: Text) = do toHtml $ contactText lang - H.a ! A.href (toValue mailTo) $ "Mail" + H.a ! A.class_ "link" ! A.href (toValue mailTo) $ "Mail" ", " - H.a ! A.href (toValue twitter) ! A.target "_blank" $ "Twitter" + H.a ! A.class_ "link" ! A.href (toValue twitter) ! A.target "_blank" $ "Twitter" toHtml $ orText lang - H.a ! A.href (toValue imu) ! A.target "_blank" $ "iMessage" + H.a ! A.class_ "link" ! A.href (toValue imu) ! A.target "_blank" $ "iMessage" "." renderEntries :: Bool -> [Entry] -> Text -> Maybe Html -> Html -renderEntries showAll entries topText footerLinks = - H.div ! A.class_ "innerBox" $ do - H.div ! A.class_ "innerBoxTop" $ toHtml topText - H.div ! A.class_ "innerBoxMiddle" $ do - H.ul $ if' showAll - (sequence_ $ map showEntry entries) - (sequence_ . take 6 $ map showEntry entries) - getFooterLinks footerLinks +renderEntries showAll entries topText footerLinks = do + H.span ! A.class_ "innerTitle" $ toHtml topText + H.div ! A.class_ "innerContainer" $ do + H.ul $ if' showAll + (sequence_ $ map showEntry entries) + (sequence_ . take 6 $ map showEntry entries) + getFooterLinks footerLinks where showEntry :: Entry -> Html showEntry e = H.li $ do @@ -99,9 +97,10 @@ renderEntries showAll entries topText footerLinks = getFooterLinks Nothing = mempty renderEntry :: Entry -> Html -renderEntry (Entry{..}) = H.div ! A.class_ "innerBox" $ do - H.div ! A.class_ "innerBoxTop" $ toHtml $ title - H.div ! A.class_ "innerBoxMiddle" $ do +renderEntry (Entry{..}) = do + H.span ! A.class_ "innerTitle" $ toHtml $ title + H.span ! A.class_ "righttext" $ H.i $ toHtml $ woText + H.div ! A.class_ "innerContainer" $ do H.article $ H.ul $ H.li $ do preEscapedText $ btext H.p $ preEscapedText $ mtext @@ -109,18 +108,17 @@ renderEntry (Entry{..}) = H.div ! A.class_ "innerBox" $ do H.div ! A.class_ "cHead" $ toHtml $ cHead lang -- ! A.style "font-size:large;font-weight:bold;" H.ul $ renderComments comments lang renderCommentBox lang entryId + where + woText = flip T.append author $ T.pack $ (formatTime defaultTimeLocale (eTimeFormat lang) edate) renderCommentBox :: BlogLang -> EntryId -> Html renderCommentBox cLang cId = do H.div ! A.class_ "cHead" $ toHtml $ cwHead cLang H.form ! A.method "POST" ! A.action (toValue $ "/" ++ (show cLang) ++ "/postcomment/" ++ show cId) $ do - H.p $ H.label $ do - H.span $ "Name:" --toHtml ("Name:" :: String) - H.input ! A.name "cname" - H.p $ H.label $ do - H.span $ toHtml $ cSingle cLang -- toHtml (cSingle lang) - H.textarea ! A.name "ctext" ! A.cols "50" ! A.rows "13" $ mempty - H.p $ H.input ! A.type_ "submit" ! A.value (toValue $ cSend cLang) + H.p $ H.input ! A.name "cname" ! A.placeholder "Name" ! A.class_ "cInput" + H.p $ H.label $ H.textarea ! A.name "ctext" ! A.cols "50" ! A.rows "13" ! A.class_ "cInput" ! + A.placeholder (toValue $ cTextPlaceholder cLang) $ mempty + H.p $ H.input ! A.class_ "cInput" ! A.style "width: 120px;" ! A.type_ "submit" ! A.value (toValue $ cSend cLang) renderComments :: [Comment] -> BlogLang -> Html renderComments [] lang = H.li $ toHtml $ noComments lang @@ -149,14 +147,14 @@ showLinks Nothing lang = H.div ! A.class_ "centerbox" $ showFooter :: BlogLang -> Text -> Html showFooter l v = H.div ! A.class_ "rightbox" ! A.style "text-align:right;" $ do toHtml ("Proudly made with " :: Text) - H.a ! A.href "http://haskell.org" $ "Haskell" + H.a ! A.class_ "link" ! A.href "http://haskell.org" $ "Haskell" toHtml (", " :: Text) - H.a ! A.href "http://hackage.haskell.org/package/acid-state-0.6.3" $ "Acid-State" + H.a ! A.class_ "link" ! A.href "http://hackage.haskell.org/package/acid-state-0.6.3" $ "Acid-State" toHtml (" and without PHP, Java, Perl, MySQL and Python." :: Text) H.br - H.a ! A.href (toValue repoURL) $ toHtml $ T.append "Version " v + H.a ! A.class_ "link" ! A.href (toValue repoURL) $ toHtml $ T.append "Version " v preEscapedText " " - H.a ! A.href "/notice" $ toHtml $ noticeText l + H.a ! A.class_ "link" ! A.href "/notice" $ toHtml $ noticeText l showSiteNotice :: Html showSiteNotice = H.docTypeHtml $ do @@ -190,7 +188,7 @@ adminLogin = adminTemplate "Login" $ H.div ! A.class_ "loginBoxMiddle" $ H.form ! A.action "/dologin" ! A.method "post" $ do H.p $ "Account ID" H.p $ H.input ! A.type_ "text" ! A.style "font-size: 2;" - ! A.name "account" ! A.value "tazjin" ! A.readonly "1" + ! A.name "account" -- ! A.value "tazjin" ! A.readonly "1" H.p $ "Passwort" H.p $ H.input ! A.type_ "password" ! A.style "font-size: 2;" ! A.name "password" H.p $ H.input ! A.alt "Anmelden" ! A.type_ "image" ! A.src "/res/signin.gif" @@ -250,9 +248,8 @@ editPage (Entry{..}) = adminTemplate "Index" $ -- Error pages showError :: BlogError -> BlogLang -> Html -showError NotFound l = blogTemplate l (T.append ": " $ notFoundTitle l) $ - H.div ! A.class_ "innerBox" $ do - H.div ! A.class_ "innerBoxTop" $ toHtml $ notFoundTitle l - H.div ! A.class_ "innerBoxMiddle" $ do - H.p ! A.class_ "notFoundFace" $ toHtml (":'(" :: Text) - H.p ! A.class_ "notFoundText" $ toHtml $ notFoundText l +showError NotFound l = blogTemplate l (T.append ": " $ notFoundTitle l) $ do + H.span ! A.class_ "innerTitle" $ toHtml $ notFoundTitle l + H.div ! A.class_ "innerContainer" $ do + H.p ! A.class_ "notFoundFace" $ toHtml (":'(" :: Text) + H.p ! A.class_ "notFoundText" $ toHtml $ notFoundText l diff --git a/src/Locales.hs b/src/Locales.hs index 7d36b2d2b..b73321f4f 100644 --- a/src/Locales.hs +++ b/src/Locales.hs @@ -13,7 +13,7 @@ import BlogDB (BlogLang (..)) data BlogError = NotFound | DBError -version = "3.0" +version = "3.1" allLang = [EN, DE] @@ -76,6 +76,10 @@ readMore :: BlogLang -> Text readMore DE = "Weiterlesen" readMore EN = "Read more" +eTimeFormat :: BlogLang -> String +eTimeFormat DE = "Geschrieben am %d.%m.%y von " +eTimeFormat EN = "Written on %D by " + -- contact information contactText :: BlogLang -> Text contactText DE = "Wer mich kontaktieren will: " @@ -115,6 +119,10 @@ cSend :: BlogLang -> Text cSend DE = "Absenden" cSend EN = "Submit" +cTextPlaceholder :: BlogLang -> Text +cTextPlaceholder DE = "Kommentartext hier eingeben :]" +cTextPlaceholder EN = "Enter your comment here :]" + -- errors notFoundTitle :: BlogLang -> Text notFoundTitle DE = "Nicht gefunden" @@ -126,8 +134,8 @@ notFoundText EN = "The requested object could unfortunately not be found." -- right side text (this is inserted AS IS. Escape HTML!) rightText :: BlogLang -> Text -rightText DE = "English version available here." -rightText EN = "Deutsche Version hier verfügbar." +rightText DE = "English version available here." +rightText EN = "Deutsche Version hier verfügbar." -- static information repoURL :: Text = "https://bitbucket.org/tazjin/tazblog-haskell" diff --git a/src/Main.hs b/src/Main.hs index ce423f932..d376f9ef0 100644 --- a/src/Main.hs +++ b/src/Main.hs @@ -146,7 +146,7 @@ postEntry acid = do nMtext <- lookText' "mtext" nEntry <- Entry <$> pure eId <*> getLang lang - <*> lookText' "author" + <*> readCookieValue "sUser" <*> lookText' "title" <*> pure (entryEscape nBtext) <*> pure (entryEscape nMtext)