Tweaked some styles in blog Card.

Blog card completed in organisms with a title, summary and date. Adding
fields is done by modifying the PostProp type and the component.

src/Kit/Atoms/Typography.hs

@@ -1,6 +1,7 @@
 module Kit.Atoms.Typography
   ( defaultFontStyle
   , regularFont
+  , smallFont
   , codeFont
   , headings
   ) where
@@ -13,15 +14,23 @@ import           Kit.Constants.Spacing
 defaultFontStyle :: Css
 defaultFontStyle = do
   regularFont
-  -- fontSize fontXS
-  -- breakpointM $ fontSize fontM
-  -- breakpointXXL $ fontSize fontXXL
+  fontSize fontXS
+  breakpointM $ fontSize fontM
+  breakpointXXL $ fontSize fontXXL
 
 regularFont :: Css
 regularFont = do
   fontFamily [] [sansSerif]
   lineHeight regularLineHeight
-  fontSize $ fontXS @+@ (0.3 *@ vw 1)
+  --fontSize $ fontXS @+@ (0.3 *@ vw 1)
+
+smallFont :: Css
+smallFont = do
+  fontFamily [] [sansSerif]
+  lineHeight lowLineHeight
+  fontSize fontTiny
+  breakpointM $ fontSize fontXS
+  breakpointXXL $ fontSize fontM
 
 codeFont :: Css
 codeFont = do

src/Kit/Constants/Spacing.hs

@@ -1,5 +1,6 @@
 module Kit.Constants.Spacing
-  ( fontXS
+  ( fontTiny
+  , fontXS
   , fontM
   , fontXXL
   , scale
@@ -19,7 +20,8 @@ import           Prelude                 hiding ( rem )
 -- |The spacing relates to font sizes and negative space. 
 
 -- |Scaling of the font size for larger screens.
-fontXS, fontM, fontXXL :: Size LengthUnit
+fontTiny, fontXS, fontM, fontXXL :: Size LengthUnit
+fontTiny = rem 0.8
 fontXS = rem 1
 fontM = rem 1.25
 fontXXL = rem 1.625

src/Kit/Molecules/CardFooter.hs

@@ -4,18 +4,18 @@ module Kit.Molecules.CardFooter
 
 import           Clay                          as C
 import           Components
+import           Kit.Atoms.Typography
 import           Kit.Constants.Colors
-import           Kit.Constants.Spacing         as S
 import           Text.Blaze.Html5              as H
 import           Text.Blaze.Html5.Attributes   as A
 
 css :: Css
 css = element ".card-footer" ? do
+  smallFont
+  color $ grays @ 50
   backgroundColor $ grays @ 75
   C.width (pct 100)
   marginTop auto
-  fontSize fontXS
-  color $ grays @ 50
 
 cardFooter :: Component (Html -> Html)
 cardFooter = do