Reduce surrounding width on mobile

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)