From ac46252e0d68a1d7176c223515b04a56f9e5cfa9 Mon Sep 17 00:00:00 2001 From: Sridhar Ratnakumar Date: Wed, 3 Jun 2020 14:35:59 -0400 Subject: [PATCH] Reduce surrounding width on mobile --- neuron/src/lib/Neuron/Web/Zettel/CSS.hs | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/neuron/src/lib/Neuron/Web/Zettel/CSS.hs b/neuron/src/lib/Neuron/Web/Zettel/CSS.hs index 893f443f7..406352a29 100644 --- a/neuron/src/lib/Neuron/Web/Zettel/CSS.hs +++ b/neuron/src/lib/Neuron/Web/Zettel/CSS.hs @@ -8,6 +8,7 @@ where import Clay hiding (id, ms, not, object, reverse, s, style, type_) import qualified Clay as C +import qualified Clay.Media as CM import qualified Neuron.Web.Theme as Theme import Neuron.Web.Widget.InvertedTree as IT import Relude hiding ((&)) @@ -23,6 +24,12 @@ themeColor neuronTheme = zettelCss :: Theme.Theme -> Css zettelCss neuronTheme = do zettelCommonCss neuronTheme + C.queryOnly CM.screen [CM.maxWidth $ px 768] $ do + "div#zettel-container" ? do + -- Fix too big of margin on mobile. + C.important $ do + C.marginLeft $ em 0.4 + C.marginRight $ em 0.4 "div.zettel-view" ? do -- This list styling applies both to zettel content, and the rest of the -- view (eg: connections pane)