commit 18e322a5ffb5eac37d6dc625d29b0e79009bd08f parent 6f5d7287bb56531c0bc9dac925c118acd3e0c768 Author: Yohanes Bandung <bandungpenting@gmail.com> Date: Tue, 13 Aug 2019 19:29:52 +0700 moving to my pc Diffstat:
| M | .gitignore | | | 1 | + |
| A | build/index.html | | | 14 | ++++++++++++++ |
| M | src/App.re | | | 7 | +++---- |
| M | src/CurVi.re | | | 33 | ++++++++++++++++++--------------- |
| A | src/Spoiler.re | | | 30 | ++++++++++++++++++++++++++++++ |
| M | src/Utils.re | | | 3 | ++- |
6 files changed, 68 insertions(+), 20 deletions(-)
diff --git a/.gitignore b/.gitignore @@ -4,3 +4,4 @@ npm-debug.log /lib/bs/ /node_modules/ +*.bs.js diff --git a/build/index.html b/build/index.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>ReasonReact Examples</title> +</head> +<body> + + <div id="root"></div> + <noscript>Please enable Javascript to use this app.</noscript> + + <script src="Index.js"></script> +</body> +</html> diff --git a/src/App.re b/src/App.re @@ -3,7 +3,6 @@ let make = () => { let url = ReasonReact.Router.useUrl(); switch (url.path) { - | [] => <CurVi /> - | _ => <CurVi /> - } -} + | _ => <CurVi /> + }; +}; diff --git a/src/CurVi.re b/src/CurVi.re @@ -2,34 +2,37 @@ type state = { opened: string, dark: bool, }; +type section = + | Quest + | Info + | Contact; +type action = + | ToggleDark + | Open(section); -type section = Quest | Info | Contact; let convert = (s: section) => -switch s { + switch (s) { | Quest => "quest" | Info => "info" | Contact => "contact" -}; - -type action = - | ToggleDark - | Open((section)); - + }; let initialState = {opened: "quest", dark: false}; [@react.component] let make = () => { - let (state, _) = - React.useReducer ( + let (_, _) = + React.useReducer( (state, action) => switch (action) { - | ToggleDark => {...state, dark: !state.dark} - | Open((toOpen)) => {...state, opened: convert( toOpen )}; + | ToggleDark => {...state, dark: !state.dark} + | Open(toOpen) => {...state, opened: convert(toOpen)} }, initialState, ); <div> - {ReasonReact.createElement(span, _, state.opened)} - </div> -} + <span> + <Spoiler content={ReasonReact.string("Hello")} title="Yeay" /> + </span> + </div>; +}; diff --git a/src/Spoiler.re b/src/Spoiler.re @@ -0,0 +1,30 @@ +module Styles = { + open Css; + + let summary = + style([ + marginTop(em(1.0)), + marginBottom(em(1.0)), + marginLeft(px(0)), + marginRight(px(0)), + flex(`num(1.0)), + textAlign(`left), + /* outline(`none), */ + cursor(`pointer), + userSelect(`none), + ]); +}; + +type state = {isopen: bool}; + +let initialState = {isopen: false}; + +type action = + | Toggle; + +[@react.component] +let make = (~content: ReasonReact.reactElement, ~title: string) => + <summary className=Styles.summary> + <details> {ReasonReact.string(title)} </details> + content + </summary>; diff --git a/src/Utils.re b/src/Utils.re @@ -31,4 +31,5 @@ let distanceFromBottom: unit => int = }; /* registerServiceWorker */ -[@bs.module] external registerServiceWorker: unit => unit = "src/registerServiceWorker"; +[@bs.module] +external registerServiceWorker: unit => unit = "./registerServiceWorker";