Started header.
This commit is contained in:
parent
6428597dde
commit
ccc0bf7afd
5 changed files with 44 additions and 3 deletions
|
@ -26,7 +26,9 @@ library
|
|||
Kit.Atoms.BreakpointQueries
|
||||
Kit.Atoms.Button
|
||||
Kit.Atoms.ButtonLink
|
||||
Kit.Atoms.Container
|
||||
Kit.Atoms.Fonts
|
||||
Kit.Atoms.Header
|
||||
Kit.Atoms.Stylesheet
|
||||
Kit.Atoms.Typography
|
||||
Kit.Constants.Breakpoints
|
||||
|
|
16
src/Kit/Atoms/Container.hs
Normal file
16
src/Kit/Atoms/Container.hs
Normal file
|
@ -0,0 +1,16 @@
|
|||
module Kit.Atoms.Container
|
||||
( container
|
||||
) where
|
||||
|
||||
import Clay
|
||||
import Core.Components
|
||||
import Text.Blaze.Html5 as H
|
||||
import Text.Blaze.Html5.Attributes as A
|
||||
|
||||
css :: Css
|
||||
css = element ".container" ? do
|
||||
paddingLeft <> paddingRight $ px 15
|
||||
marginLeft <> marginRight $ auto
|
||||
|
||||
container :: Component (Html -> Html)
|
||||
container = new "container" css $ H.div H.! class_ "container"
|
17
src/Kit/Atoms/Header.hs
Normal file
17
src/Kit/Atoms/Header.hs
Normal file
|
@ -0,0 +1,17 @@
|
|||
module Kit.Atoms.Header
|
||||
( Kit.Atoms.Header.header
|
||||
) where
|
||||
|
||||
import Clay as C
|
||||
import Core.Components
|
||||
import Kit.Constants.Colors
|
||||
import Text.Blaze.Html5 as H
|
||||
|
||||
css :: Css
|
||||
css = C.header ? do
|
||||
paddingTop <> paddingBottom $ px 30
|
||||
backgroundColor $ grays @ 90
|
||||
borderTop (px 10) solid (primary @ 20)
|
||||
|
||||
header :: Component (Html -> Html)
|
||||
header = new "header" css H.header
|
|
@ -2,7 +2,7 @@ module Kit.Molecules.DefaultCss
|
|||
( defaultCss
|
||||
) where
|
||||
|
||||
import Clay
|
||||
import Clay as C
|
||||
import qualified Clay.Pseudo as P
|
||||
import Core.Components
|
||||
import Kit.Atoms.Stylesheet
|
||||
|
@ -15,9 +15,9 @@ css :: Css
|
|||
css = do
|
||||
star # P.root ? do
|
||||
defaultFontStyle
|
||||
margin nil nil nil nil
|
||||
color (primary @ 10)
|
||||
backgroundColor (primary @ 45)
|
||||
C.body ? margin nil nil nil nil
|
||||
headings
|
||||
|
||||
defaultCss :: Component Html
|
||||
|
|
|
@ -7,13 +7,19 @@ import Core.Components
|
|||
import Core.Render ( putHtml )
|
||||
import Kit.Atoms.Button
|
||||
import Kit.Atoms.ButtonLink
|
||||
import Kit.Atoms.Container
|
||||
import Kit.Atoms.Header as K
|
||||
import Kit.Organisms.Head
|
||||
import Routes
|
||||
import Text.Blaze.Html5 as H
|
||||
hiding ( main )
|
||||
|
||||
indexBody :: Component Html
|
||||
indexBody = mconcat [buttonWithText "Click!", buttonLink Blog "All posts"]
|
||||
indexBody = mconcat
|
||||
[ K.header <*> (container <*> pure (h1 "My site"))
|
||||
, buttonWithText "Click!"
|
||||
, buttonLink Blog "All posts"
|
||||
]
|
||||
|
||||
indexTemplate :: Component Html
|
||||
indexTemplate =
|
||||
|
|
Loading…
Reference in a new issue