aboutsummaryrefslogtreecommitdiff
path: root/src/server/Design/Media.hs
blob: 77220eed54a64530246cadc5fd4fd9610b5ab7e7 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
module Design.Media
  ( mobile
  , mobileTablet
  , tablet
  , tabletDesktop
  , desktop
  ) where

import Clay hiding (query)
import qualified Clay
import Clay.Stylesheet (Feature)
import qualified Clay.Media as Media

mobile :: Css -> Css
mobile = query [Media.maxWidth mobileTabletLimit]

mobileTablet :: Css -> Css
mobileTablet = query [Media.maxWidth tabletDesktopLimit]

tablet :: Css -> Css
tablet = query [Media.minWidth mobileTabletLimit, Media.maxWidth tabletDesktopLimit]

tabletDesktop :: Css -> Css
tabletDesktop = query [Media.minWidth mobileTabletLimit]

desktop :: Css -> Css
desktop = query [Media.minWidth tabletDesktopLimit]

query :: [Feature] -> Css -> Css
query = Clay.query Media.screen

mobileTabletLimit :: Size LengthUnit
mobileTabletLimit = (px 520)

tabletDesktopLimit :: Size LengthUnit
tabletDesktopLimit = (px 950)