git.iko.soy/rowtype-yoga/psfp
on 21e940e help sign in
129 lines 4.1 kB history raw
1module Theme.Types where
3import Prelude
5import CSS (ColorSpace(..), blue, brightness, darken, desaturate, isLight, lighten, mix, rotateHue)
6import CSS.Color (toHexString)
7import Color (Color)
8import Data.Foldable (intercalate)
9import Data.Symbol (SProxy(..))
10import Record.Builder as RB
12type Theme =
13 { backgroundColour ∷ Color
14 , textColour ∷ Color
15 , interfaceColour ∷ Color
16 , highlightColour ∷ Color
17 , altHighlightColour ∷ Color
18 , textFontFamily ∷ Array String
19 , headingFontFamily ∷ Array String
20 , yellow ∷ Color
21 , green ∷ Color
22 , pink ∷ Color
23 , orange ∷ Color
24 , turquoise ∷ Color
25 , red ∷ Color
26 , blue ∷ Color
27 }
29f ∷ ∀ fieldName. SProxy fieldName
30f = SProxy
32fromTheme ∷ Theme -> CSSTheme
33fromTheme theme = RB.build (
34 -- background
35 RB.modify (f ∷ _ "backgroundColour") toHexString
36 >>> RB.insert (f ∷ _ "backgroundColourLighter")
37 (theme.backgroundColour # lighter >>> toHexString)
38 >>> RB.modify (f ∷ _ "interfaceColour") toHexString
39 >>> RB.insert (f ∷ _ "interfaceColourLighter")
40 (theme.interfaceColour # lighter >>> toHexString)
41 >>> RB.insert (f ∷ _ "interfaceColourLightest")
42 (theme.interfaceColour # lighter >>> lighter >>> toHexString)
43 >>> RB.insert (f ∷ _ "interfaceColourDarker")
44 (theme.interfaceColour # darker >>> toHexString)
45 >>> RB.insert (f ∷ _ "interfaceColourDarkest")
46 (theme.interfaceColour # darker >>> darker >>> toHexString)
47 -- foreground
48 >>> RB.modify (f ∷ _ "textColour") toHexString
49 >>> RB.insert (f ∷ _ "textColourLighter")
50 (theme.textColour # lighter >>> toHexString)
51 >>> RB.insert (f ∷ _ "textColourLightest")
52 (theme.textColour # lighter >>> lighter >>> toHexString)
53 >>> RB.insert (f ∷ _ "textColourDarker")
54 (theme.textColour # darker >>> toHexString)
55 >>> RB.insert (f ∷ _ "textColourDarkest")
56 (theme.textColour # darker >>> darker >>> toHexString)
57 -- highlight
58 >>> RB.modify (f ∷ _ "highlightColour") toHexString
59 >>> RB.insert (f ∷ _ "highlightColourDark")
60 (theme.highlightColour # darken 0.2 # rotateHue (-10.0) # toHexString)
61 -- altHighlight
62 >>> RB.modify (f ∷ _ "altHighlightColour") toHexString
63 >>> RB.insert (f ∷ _ "altHighlightColourDark")
64 (theme.altHighlightColour # darken 0.2 # toHexString)
65 -- palette
66 >>> RB.modify (f ∷ _ "yellow") toHexString
67 >>> RB.modify (f ∷ _ "green") toHexString
68 >>> RB.modify (f ∷ _ "pink") toHexString
69 >>> RB.modify (f ∷ _ "orange") toHexString
70 >>> RB.modify (f ∷ _ "turquoise") toHexString
71 >>> RB.modify (f ∷ _ "red") toHexString
72 >>> RB.modify (f ∷ _ "blue") toHexString
73 -- fonts
74 >>> RB.modify (f ∷ _ "textFontFamily") (intercalate ",")
75 >>> RB.modify (f ∷ _ "headingFontFamily") (intercalate ",")
76 >>> RB.insert (f ∷ _ "isLight") isLightTheme
77 ) theme
78 where
79 isLightTheme = isLight theme.backgroundColour
80 yellower ∷ Color -> Color
81 yellower col =
82 if brightness col > 0.8
83 then
84 lighten 0.02 col
85 else
86 col
87 # lighten 0.1
88 # desaturate 0.03
90 bluer col =
91 mix HSL col blue 0.05
92 # darken 0.1
93 # desaturate 0.03
95 lighter ∷ Color -> Color
96 lighter = yellower
98 darker ∷ Color -> Color
99 darker = bluer
101type CSSTheme =
102 { backgroundColour ∷ String
103 , backgroundColourLighter ∷ String
104 , interfaceColour ∷ String
105 , interfaceColourDarker ∷ String
106 , interfaceColourDarkest ∷ String
107 , interfaceColourLighter ∷ String
108 , interfaceColourLightest ∷ String
109 , textColourLightest ∷ String
110 , textColourLighter ∷ String
111 , textColour ∷ String
112 , textColourDarker ∷ String
113 , textColourDarkest ∷ String
114 , highlightColour ∷ String
115 , highlightColourDark ∷ String
116 , altHighlightColour ∷ String
117 , altHighlightColourDark ∷ String
118 , isLight ∷ Boolean
119 , textFontFamily ∷ String
120 , headingFontFamily ∷ String
121 , yellow ∷ String
122 , green ∷ String
123 , pink ∷ String
124 , orange ∷ String
125 , turquoise ∷ String
126 , red ∷ String
127 , blue ∷ String
128 }