git.iko.soy/rowtype-yoga/psfp
on master help sign in
broken in build
e677d30Mark Eibes
assets/icons/logo.png
compare with master
unifiedsplit

Binary file not shown.

blog/src/components/PSLayout.purs+84−35
@@ -1,7 +1,7 @@
1module PSLayout where
1module PSLayout where
2
2
3import Prelude
3import Prelude
4−
4+import CSS.Safer (cssSafer)
5import CSSBaseline (mkCssBaseline)
5import CSSBaseline (mkCssBaseline)
6import CompileEditor.Component (mkCompileEditor)
6import CompileEditor.Component (mkCompileEditor)
7import Data.Array as Array
7import Data.Array as Array
@@ -15,9 +15,12 @@ import React.Basic (JSX, ReactComponent)
15import React.Basic.DOM (unsafeCreateDOMComponent)
15import React.Basic.DOM (unsafeCreateDOMComponent)
16import React.Basic.DOM as R
16import React.Basic.DOM as R
17import React.Basic.Hooks (ReactChildren, componentWithChildren, element)
17import React.Basic.Hooks (ReactChildren, componentWithChildren, element)
18+import React.Basic.Hooks as React
18import Theme (fromTheme)
19import Theme (fromTheme)
19import Theme.Default (darkTheme)
20import Theme.Default (darkTheme)
20import Theme.Provider (mkThemeProvider)
21import Theme.Provider (mkThemeProvider)
22+import Theme.Styles (makeStyles)
23+import Theme.Types (CSSTheme)
21import Typography.Header (HeadingLevel(..), mkH)
24import Typography.Header (HeadingLevel(..), mkH)
22import Typography.Paragraph (mkP)
25import Typography.Paragraph (mkP)
23import Unsafe.Coerce (unsafeCoerce)
26import Unsafe.Coerce (unsafeCoerce)
@@ -25,6 +28,18 @@ import Unsafe.Coerce (unsafeCoerce)
25type SiteQueryResult
28type SiteQueryResult
26 = { site ∷ { siteMetadata ∷ { title ∷ String } } }
29 = { site ∷ { siteMetadata ∷ { title ∷ String } } }
27
30
31+type PreProps
32+ = { children ∷
33+ Nullable
34+ { props ∷
35+ Nullable
36+ { mdxType ∷ Nullable String
37+ , children ∷ Nullable String
38+ , className ∷ Nullable String
39+ }
40+ }
41+ }
42+
28mkLayout ∷
43mkLayout ∷
29 ∀ children.
44 ∀ children.
30 FetchImpl ->
45 FetchImpl ->
@@ -36,11 +51,52 @@ mkLayout ∷
36 )
51 )
37mkLayout fetchImpl = do
52mkLayout fetchImpl = do
38 themeProvider <- mkThemeProvider
53 themeProvider <- mkThemeProvider
54+ mdxProviderComponent <- mkMdxProviderComponent fetchImpl
55+ componentWithChildren "MDXLayout" \{ children, siteInfo } -> React.do
56+ pure
57+ $ element themeProvider
58+ { theme: fromTheme darkTheme
59+ , children:
60+ [ element mdxProviderComponent
61+ { children
62+ , siteInfo
63+ }
64+ ]
65+ }
66+
67+mkMdxProviderComponent ::
68+ ∀ children.
69+ FetchImpl ->
70+ Effect
71+ ( ReactComponent
72+ { children ∷ ReactChildren children
73+ , siteInfo ∷ SiteQueryResult
74+ }
75+ )
76+mkMdxProviderComponent fetchImpl = do
39 cssBaseline <- mkCssBaseline
77 cssBaseline <- mkCssBaseline
40 editor <- mkCompileEditor fetchImpl
78 editor <- mkCompileEditor fetchImpl
41 h <- mkH
79 h <- mkH
42 p <- mkP
80 p <- mkP
81+ useStyles <-
82+ makeStyles \(theme :: CSSTheme) ->
83+ { code:
84+ cssSafer
85+ { fontFamily: "PragmataPro Liga"
86+ , backgroundColor: theme.interfaceColour
87+ , fontSize: "10pt"
88+ , border: "1px solid #383c39"
89+ , padding: "3px"
90+ , borderRadius: "3px"
91+ }
92+ , margins:
93+ cssSafer
94+ { marginLeft: "35px"
95+ , marginRight: "35px"
96+ }
97+ }
43− componentWithChildren "MDXLayout" \{ children, siteInfo } -> React.do
98+ componentWithChildren "MDXProviderComponent" \{ children, siteInfo } -> React.do
99+ classes <- useStyles
44 let
100 let
45 baseline child = element cssBaseline { kids: child }
101 baseline child = element cssBaseline { kids: child }
46
102
@@ -59,29 +115,24 @@ mkLayout fetchImpl = do
59 mdxComponents =
115 mdxComponents =
60 { h1:
116 { h1:
61 \props ->
117 \props ->
62− element h { level: H2, text: props.children, className: Nothing }
118+ element h { level: H2, text: props.children, className: Just classes.margins }
63 , h2:
119 , h2:
64 \props ->
120 \props ->
65− element h { level: H3, text: props.children, className: Nothing }
121+ element h { level: H3, text: props.children, className: Just classes.margins }
66 , h3:
122 , h3:
67 \props ->
123 \props ->
68− element h { level: H4, text: props.children, className: Nothing }
124+ element h { level: H4, text: props.children, className: Just classes.margins }
69 , p:
125 , p:
70 \props ->
126 \props ->
127+ R.div
71− element p { text: props.children }
128+ { children: [ element p { text: props.children } ]
72− , pre:
129+ , className: classes.margins
73− \( props ∷
74− { children ∷
75− Nullable
76− { props ∷
77− Nullable
78− { mdxType ∷ Nullable String
79− , children ∷ Nullable String
80− , className ∷ Nullable String
81− }
82− }
83 }
130 }
84− ) -> do
131+ , inlineCode:
132+ \props -> do
133+ R.span { className: classes.code, children: props.children }
134+ , pre:
135+ \(props ∷ PreProps) -> do
85 let
136 let
86 childrenQ = Nullable.toMaybe props.children
137 childrenQ = Nullable.toMaybe props.children
87
138
@@ -97,12 +148,15 @@ mkLayout fetchImpl = do
97
148
98 codeQ = childrenQ2
149 codeQ = childrenQ2
99
150
151+ height =
100− height = (fromMaybe 200 >>> show >>> (_ <> "px")) do
152+ (fromMaybe 200 >>> show >>> (_ <> "px")) do
101− code <- codeQ
153+ code <- codeQ
154+ pure
102− pure (String.split (String.Pattern "\n") code
155+ ( String.split (String.Pattern "\n") code
103− # Array.length
156+ # Array.length
104− # \x -> (x * 12) + 100
157+ # \x -> (x * 12) + 100
105− )
158+ )
159+
106 language = fromMaybe "" (classNameQ >>= String.stripPrefix (String.Pattern "language-"))
160 language = fromMaybe "" (classNameQ >>= String.stripPrefix (String.Pattern "language-"))
107 if isCode then
161 if isCode then
108 element editor
162 element editor
@@ -114,17 +168,12 @@ mkLayout fetchImpl = do
114 element (unsafeCreateDOMComponent "pre") props
168 element (unsafeCreateDOMComponent "pre") props
115 }
169 }
116 pure
170 pure
117− $ element themeProvider
118− { theme: fromTheme darkTheme
119− , children:
120− [ baseline
171+ $ baseline
121− [ element mdxProvider
172+ [ element mdxProvider
122− { children: [ siteInfoJSX ]
173+ { children: [ siteInfoJSX ]
123− , components: mdxComponents
174+ , components: mdxComponents
124− }
175+ }
125− ]
126− ]
176+ ]
127− }
128
177
129foreign import mdxProvider ∷
178foreign import mdxProvider ∷
130 ∀ r.
179 ∀ r.
blog/src/images/logo3.pngnew file

Binary file not shown.

blog/src/pages/index.mdx+1
@@ -19,6 +19,7 @@ main = log $ "Hello!" <> show heinz
19heinz = 7
19heinz = 7
20```
20```
21
21
22+This is some `inline code`.
22
23
23Now go build something great.
24Now go build something great.
24<Link to="/page-2/">Go to page 2</Link>
25<Link to="/page-2/">Go to page 2</Link>