squiggle/foretold/components/example/Example/Example__AppGroupHeader.re
2022-01-12 18:33:04 +11:00

60 lines
1.7 KiB
ReasonML

open FC;
open Base;
let make =
<Div>
<GroupHeader>
<Div float=`left>
<div
className=Css.(
style([
fontSize(`em(1.4)),
marginTop(`px(5)),
Colors.FontWeights.heavy,
color(Colors.darkLink),
])
)>
{"Great Community" |> ReasonReact.string}
</div>
<p
className=Css.(
style([
color(`hex("36485c")),
marginTop(`px(5)),
marginBottom(`px(3)),
])
)>
{"Lots of description for the group would be here"
|> ReasonReact.string}
</p>
</Div>
<Div float=`right>
<Button
variant=Button.Secondary
isDisabled=false
size=Button.(Medium)
className=GroupHeader.Styles.actionButtonPosition>
{"Leave Channel" |> ReasonReact.string}
</Button>
<Button
isDisabled=false
size=Button.(Medium)
className=GroupHeader.Styles.actionButtonPosition>
{"Create Question" |> ReasonReact.string}
</Button>
<Button
isDisabled=false
size=Button.(Medium)
className=GroupHeader.Styles.actionButtonPosition>
{"Create Question" |> ReasonReact.string}
</Button>
</Div>
</GroupHeader>
<GroupHeader.SubHeader>
<Tab isActive=true> {"Questions" |> ReasonReact.string} </Tab>
<Tab isActive=false> {"Knowledge Graph" |> ReasonReact.string} </Tab>
<Tab isActive=false> {"Leaderboard" |> ReasonReact.string} </Tab>
<Tab isActive=false> {"Settings" |> ReasonReact.string} </Tab>
</GroupHeader.SubHeader>
</Div>;