Bug fix

ChangeLog.md

@@ -1,6 +1,10 @@
-0.12
+0.12.1
 ===
+* Changed the order of Page elements, so that inline css over-rides libraries.
+* Added cssColorScheme to API
 
+0.12
+===
 * markupInput replaces inputToHtml as per markup-parse
 * ToByteString introduced
 * upgrade to box-socket-0.5

src/Web/Rep.hs

@@ -34,6 +34,7 @@ module Web.Rep
     -- * Css
     Css (..),
     renderCss,
+    cssColorScheme,
 
     -- * JS
     Js (..),

src/Web/Rep/Page.hs

@@ -15,6 +15,7 @@ module Web.Rep.Page
     PageStructure (..),
     Css (..),
     renderCss,
+    cssColorScheme,
     Js (..),
     onLoad,
   )
@@ -132,6 +133,27 @@ renderCss :: RenderStyle -> Css -> ByteString
 renderCss Compact = C.filter (\c -> c /= ' ' && c /= '\n') . cssByteString
 renderCss _ = cssByteString
 
+-- | Css snippet for reponsiveness to preferred color-scheme.
+cssColorScheme :: Css
+cssColorScheme =
+  Css
+    [i|
+{
+  color-scheme: light dark;
+}
+{
+  body {
+    background-color: rgb(92%, 92%, 92%);
+    color: rgb(5%, 5%, 5%);
+  }
+}
+@media (prefers-color-scheme:dark) {
+  body {
+    background-color: rgb(5%, 5%, 5%);
+    color: rgb(92%, 92%, 92%);
+  }
+}|]
+
 -- | Javascript as string
 newtype Js = Js {jsByteString :: ByteString} deriving (Eq, Show, Generic, Semigroup, Monoid)
 

src/Web/Rep/Render.hs

@@ -50,8 +50,8 @@ renderPageWith pc p =
                   "head"
                   []
                   (element_ "meta" [Attr "charset" "utf-8"])
-                  <> cssInline
                   <> libsCss'
+                  <> cssInline
                   <> view #htmlHeader p
               )
             <> element
@@ -71,8 +71,8 @@ renderPageWith pc p =
             <> libsJs'
             <> jsInline
         Snippet ->
-          libsCss'
-            <> cssInline
+          cssInline
+            <> libsCss'
             <> view #htmlHeader p
             <> view #htmlBody p
             <> libsJs'

src/Web/Rep/Socket.hs

@@ -87,6 +87,7 @@ defaultSocketPage :: Page
 defaultSocketPage =
   bootstrapPage
     <> socketPage
+      & set #cssBody cssColorScheme
       & set
         #htmlBody
         ( element

web-rep.cabal

@@ -1,6 +1,6 @@
 cabal-version: 3.0
 name: web-rep
-version: 0.12.0.0
+version: 0.12.1.0
 license: BSD-3-Clause
 license-file: LICENSE
 copyright: Tony Day (c) 2015