styling and fixing returns

src/Aggreact/Comments/Views.hs

@@ -153,7 +153,7 @@ showChildren cvs vt cv@(CommentView comment _) = H.li $
       let children = cvs IxSet.@= ParentId (Just (toS (id comment)))
       if IxSet.null children
         then return ()
-        else H.ul $ traverse_ (showChildren cvs vt) (IxSet.toList children)
+        else H.ul $ traverse_ (H.li . showChildren cvs vt) (IxSet.toList children)
 
 displayOneComment :: Comment -> UTCTime -> H.Markup
 displayOneComment comment vt = do
@@ -171,7 +171,7 @@ displayOneComment comment vt = do
             H.text . toS . approximativeDuration . realToFrac $ diffUTCTime vt (created (metas comment))
             H.text " ago"
       H.div ! A.class_ "tohide" $ do
-        H.pre $ H.text (toS (content (val comment)))
+        H.div ! A.class_ "commentContent" $ H.text (toS (content (val comment)))
         H.a ! A.href (cvt ("/comment/" <> cid)) ! A.class_ "small" $ "reply"
 
 displayTime :: UTCTime -> Entity DefaultMetas a -> H.Html
@@ -186,7 +186,7 @@ displayHidingBlock :: ( StringConv a [Char]
                    => a -> Entity ms NewComment -> H.Markup -> H.Html
 displayHidingBlock cid comment children =
       H.div ! A.class_ "tohide" $ do
-        H.pre $ comment & val & content & toS & H.text
+        H.div ! A.class_ "commentContent" $ comment & val & content & toS & H.text
         H.a ! A.href (cvt ("/comment/" <> cid)) ! A.class_ "small" $ "reply"
         children
 

src/Aggreact/Css.hs

@@ -72,6 +72,7 @@ genCss :: Css
 genCss = do
   body ? do
     fontFamily ["helvetica"] [sansSerif]
+    -- fontFamily ["menlo"] [monospace]
     fontSize (px 14)
     color (rgb 64 64 64)
     margin (px 0) (px 0) (px 0) (px 0)
@@ -107,8 +108,8 @@ genCss = do
     margin (px 0) auto (px 0) auto
     -- borderLeft solid (em 1) yBorderColor
     paddingLeft (em 1)
-    paddingTop (em 1)
-    paddingBottom (em 1)
+    paddingTop (ex 1)
+    paddingBottom (ex 1)
   div # byClass "container" |> ul ? paddingLeft (px 0)
   traverse_ headerstyle ([h1,h2,h3,h4,h5,h6] :: [Clay.Selector])
   h1 ? do
@@ -137,6 +138,9 @@ genCss = do
     minWidth (em 7)
     display inlineBlock
     fontWeight (weight 100)
+  h1 # byClass "mainTitle" ? do
+    display inlineBlock
+    margin (ex 0) (ex 2) (ex 0) (ex 0)
   label # byClass "togglelabel" ? do
     minWidth (em 2)
     display inlineBlock
@@ -174,6 +178,8 @@ genCss = do
     marginTop (px 0)
     marginBottom (px 0)
     overflow scroll
+  ".commentContent" ?
+    whiteSpace preWrap
   body |> ul ?
     paddingLeft (px 0)
   ul ? do
@@ -181,8 +187,11 @@ genCss = do
     marginTop (em 1)
     paddingLeft (em 2)
     marginLeft (px 0)
-  li ? marginTop (em 1)
-  ".small" ? fontSize (px 11)
+  form ? margin (ex 1) (px 0) (ex 1) (px 0)
+  ".small" ? do
+    fontSize (px 11)
+    lineHeight (em 1)
   ".metas" ? do
+    marginTop (ex 1)
     fontSize (px 11)
     color grey

src/Aggreact/Html.hs

@@ -91,7 +91,7 @@ boilerplate headerHtml innerHtml =
       H.link ! A.rel "stylesheet" ! A.type_ "text/css" ! A.href "/main.css"
     H.body $ do
       H.header . container $ do
-        H.a ! A.href "/" $ H.h1 "Aggreact"
+        H.a ! A.href "/" $ H.h1 ! A.class_ "mainTitle" $ "Aggreact"
         headerHtml
       container innerHtml
       H.footer . container $ do