From ead6db471d5d0e8f477f11e8fb442febaa1c30c3 Mon Sep 17 00:00:00 2001 From: Cecile Tonglet Date: Wed, 23 Sep 2020 18:33:41 +0200 Subject: [PATCH] Macro to generate examples & fix CI (#9) --- .travis.yml | 3 +- README.md | 1 + src/app.rs | 4 +- src/buttons.rs | 90 ---------------- src/buttons/example.rs | 42 ++++++++ src/buttons/mod.rs | 108 +++++++++++++++++++ src/collapse/example.rs | 66 ++++++++++++ src/{collapse.rs => collapse/mod.rs} | 56 ++-------- src/example.rs | 91 ++++++++++++++++ src/forms/mod.rs | 1 - src/icon/example.rs | 26 +++++ src/{icon.rs => icon/mod.rs} | 13 ++- src/lib.rs | 29 ++++-- src/{menu.rs => menu/mod.rs} | 0 src/{forms/controls.rs => switch/mod.rs} | 0 src/tree/example.rs | 126 +++++++++++++++++++++++ src/{tree.rs => tree/mod.rs} | 116 ++------------------- static/index.html | 30 ++++++ 18 files changed, 545 insertions(+), 257 deletions(-) delete mode 100644 src/buttons.rs create mode 100644 src/buttons/example.rs create mode 100644 src/buttons/mod.rs create mode 100644 src/collapse/example.rs rename src/{collapse.rs => collapse/mod.rs} (72%) create mode 100644 src/example.rs delete mode 100644 src/forms/mod.rs create mode 100644 src/icon/example.rs rename src/{icon.rs => icon/mod.rs} (94%) rename src/{menu.rs => menu/mod.rs} (100%) rename src/{forms/controls.rs => switch/mod.rs} (100%) create mode 100644 src/tree/example.rs rename src/{tree.rs => tree/mod.rs} (74%) diff --git a/.travis.yml b/.travis.yml index 6739db7..d37fdc2 100644 --- a/.travis.yml +++ b/.travis.yml @@ -16,6 +16,5 @@ before_script: script: - 'if [ -n "$TRAVIS_PULL_REQUEST" ]; then rustfmt --check **/*.rs; fi' - 'if [ -n "$TRAVIS_PULL_REQUEST" ]; then cargo clippy --all-targets --all-features -- -D warnings; fi' - - cargo build - - cargo test + - cargo test --all-features - cargo doc diff --git a/README.md b/README.md index dc8abea..d6bda6c 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,5 @@ [![Build Status](https://travis-ci.org/cecton/yewprint.svg?branch=main)](https://travis-ci.org/cecton/yewprint) +[![Netlify Status](https://api.netlify.com/api/v1/badges/17f076ed-49e5-4185-921e-5c5759de2fdb/deploy-status)](https://app.netlify.com/sites/epic-poincare-f8adaa/deploys) ![Demo](https://github.com/cecton/blueprint-rs/blob/main/demo.mp4?raw=true) diff --git a/src/app.rs b/src/app.rs index 72e11f5..02e92f3 100644 --- a/src/app.rs +++ b/src/app.rs @@ -1,8 +1,8 @@ use crate::buttons::doc::*; use crate::collapse::doc::*; -use crate::forms::controls::doc::SwitchDoc; use crate::icon::doc::*; use crate::menu::*; +use crate::switch::doc::SwitchDoc; use crate::tree::doc::*; use yew::prelude::*; @@ -24,7 +24,7 @@ impl Component for App { fn create(_: Self::Properties, link: ComponentLink) -> Self { App { dark_theme: true, - doc_menu: DocMenu::Tree, + doc_menu: DocMenu::Button, link, } } diff --git a/src/buttons.rs b/src/buttons.rs deleted file mode 100644 index 0d6f8d1..0000000 --- a/src/buttons.rs +++ /dev/null @@ -1,90 +0,0 @@ -use yew::prelude::*; - -pub struct Button { - props: Props, -} - -#[derive(Clone, PartialEq, Properties)] -pub struct Props { - #[prop_or_default] - pub title: String, - #[prop_or_default] - pub onclick: Callback, - pub children: html::Children, -} - -impl Component for Button { - type Message = (); - type Properties = Props; - - fn create(props: Self::Properties, _link: ComponentLink) -> Self { - Button { props } - } - - fn update(&mut self, _msg: Self::Message) -> ShouldRender { - true - } - - fn change(&mut self, props: Self::Properties) -> ShouldRender { - if self.props != props { - self.props = props; - true - } else { - false - } - } - - fn view(&self) -> Html { - html! { - - } - } -} - -#[cfg(feature = "doc")] -pub mod doc { - use super::*; - - pub struct ButtonDoc { - link: ComponentLink, - counter: i64, - } - - pub enum Msg { - AddOne, - } - - impl Component for ButtonDoc { - type Message = Msg; - type Properties = (); - - fn create(_: Self::Properties, link: ComponentLink) -> Self { - ButtonDoc { counter: 0, link } - } - - fn update(&mut self, msg: Self::Message) -> ShouldRender { - match msg { - Msg::AddOne => self.counter += 1, - } - true - } - - fn change(&mut self, _props: Self::Properties) -> ShouldRender { - true - } - - fn view(&self) -> Html { - html! { -
-

{"Button"}

-

{"Counter: "} { self.counter }

-
- -
-
- } - } - } -} diff --git a/src/buttons/example.rs b/src/buttons/example.rs new file mode 100644 index 0000000..762d75c --- /dev/null +++ b/src/buttons/example.rs @@ -0,0 +1,42 @@ +use yew::prelude::*; +use yewprint::Button; + +pub struct Example { + link: ComponentLink, + counter: i64, +} + +pub enum Msg { + AddOne, +} + +impl Component for Example { + type Message = Msg; + type Properties = (); + + fn create(_: Self::Properties, link: ComponentLink) -> Self { + Example { counter: 0, link } + } + + fn update(&mut self, msg: Self::Message) -> ShouldRender { + match msg { + Msg::AddOne => self.counter += 1, + } + true + } + + fn change(&mut self, _props: Self::Properties) -> ShouldRender { + true + } + + fn view(&self) -> Html { + html! { +
+

{"Counter: "} { self.counter }

+
+ +
+
+ } + } +} diff --git a/src/buttons/mod.rs b/src/buttons/mod.rs new file mode 100644 index 0000000..f6c0b26 --- /dev/null +++ b/src/buttons/mod.rs @@ -0,0 +1,108 @@ +use crate::{Icon, IconName, Intent}; +use yew::prelude::*; + +pub struct Button { + props: Props, +} + +#[derive(Clone, PartialEq, Properties)] +pub struct Props { + #[prop_or_default] + pub fill: bool, + #[prop_or_default] + pub minimal: bool, + #[prop_or_default] + pub icon: Option, + #[prop_or_default] + pub intent: Option, + #[prop_or_default] + pub title: String, + #[prop_or_default] + pub onclick: Callback, + pub children: html::Children, +} + +impl Component for Button { + type Message = (); + type Properties = Props; + + fn create(props: Self::Properties, _link: ComponentLink) -> Self { + Button { props } + } + + fn update(&mut self, _msg: Self::Message) -> ShouldRender { + true + } + + fn change(&mut self, props: Self::Properties) -> ShouldRender { + if self.props != props { + self.props = props; + true + } else { + false + } + } + + fn view(&self) -> Html { + let mut class = Classes::from("bp3-button"); + if self.props.fill { + class.push("bp3-fill"); + } + if self.props.minimal { + class.push("bp3-minimal"); + } + class = class.extend(&self.props.intent); + + html! { + + } + } +} + +#[cfg(feature = "doc")] +pub mod doc { + use yew::prelude::*; + + pub struct ButtonDoc; + + impl Component for ButtonDoc { + type Message = (); + type Properties = (); + + fn create(_: Self::Properties, _link: ComponentLink) -> Self { + ButtonDoc + } + + fn update(&mut self, _msg: Self::Message) -> ShouldRender { + true + } + + fn change(&mut self, _props: Self::Properties) -> ShouldRender { + true + } + + fn view(&self) -> Html { + let source = crate::include_example!("example.rs"); + + html! { +
+

{"Button"}

+
{source}
+
+ } + } + } +} diff --git a/src/collapse/example.rs b/src/collapse/example.rs new file mode 100644 index 0000000..20e9cfc --- /dev/null +++ b/src/collapse/example.rs @@ -0,0 +1,66 @@ +use yew::prelude::*; +use yewprint::{Button,Collapse}; + +pub struct Example { + link: ComponentLink, + collapsed: bool, +} + +pub enum Msg { + ToggleCollapse, +} + +impl Component for Example { + type Message = Msg; + type Properties = (); + + fn create(_: Self::Properties, link: ComponentLink) -> Self { + Example { + collapsed: true, + link, + } + } + + fn update(&mut self, msg: Self::Message) -> ShouldRender { + match msg { + Msg::ToggleCollapse => self.collapsed ^= true, + } + true + } + + fn change(&mut self, _props: Self::Properties) -> ShouldRender { + true + } + + fn view(&self) -> Html { + html! { +
+ + +
+                        
{"[INFO]: Installing wasm-bindgen..."}
+
{"[INFO]: Optional fields missing from Cargo.toml: 'description', 'repository', and 'license'. These are not necessary, but recommended"}
+
{"[INFO]: :-) Done in 0.69s"}
+
{"[INFO]: :-) Your wasm pkg is ready to publish at /home/cecile/repos/blueprint-rs/./static."}
+
{" Index: enabled, Upload: disabled, Cache: disabled, Cors: enabled, Range: enabled, Sort: enabled, Threads: 3"}
+
{" Auth: disabled, Compression: disabled"}
+
{" https: disabled, Cert: , Cert-Password: "}
+
{" Root: /home/cecile/repos/blueprint-rs,"}
+
{" TryFile404: "}
+
{" Address: http://0.0.0.0:8000"}
+
{" ======== [2020-09-07 20:39:46] ========"}
+
{"[2020-09-07 20:39:46] - 127.0.0.1 - 200 - GET /"}
+
{"[2020-09-07 20:39:46] - 127.0.0.1 - 200 - GET /static/blueprint.css"}
+
{"[2020-09-07 20:39:46] - 127.0.0.1 - 200 - GET /static/wasm.js"}
+
{"[2020-09-07 20:39:46] - 127.0.0.1 - 200 - GET /static/wasm_bg.wasm"}
+
+
+
+ } + } +} diff --git a/src/collapse.rs b/src/collapse/mod.rs similarity index 72% rename from src/collapse.rs rename to src/collapse/mod.rs index 11c137a..5cc74eb 100644 --- a/src/collapse.rs +++ b/src/collapse/mod.rs @@ -199,33 +199,19 @@ impl Component for Collapse { #[cfg(feature = "doc")] pub mod doc { - use super::*; - use crate::buttons::Button; + use yew::prelude::*; - pub struct CollapseDoc { - link: ComponentLink, - collapsed: bool, - } - - pub enum Msg { - ToggleCollapse, - } + pub struct CollapseDoc; impl Component for CollapseDoc { - type Message = Msg; + type Message = (); type Properties = (); - fn create(_: Self::Properties, link: ComponentLink) -> Self { - CollapseDoc { - collapsed: true, - link, - } + fn create(_: Self::Properties, _link: ComponentLink) -> Self { + CollapseDoc } - fn update(&mut self, msg: Self::Message) -> ShouldRender { - match msg { - Msg::ToggleCollapse => self.collapsed ^= true, - } + fn update(&mut self, _msg: Self::Message) -> ShouldRender { true } @@ -234,34 +220,12 @@ pub mod doc { } fn view(&self) -> Html { + let source = crate::include_example!("example.rs"); + html! {
-

{"Collapse"}

- - -
-                            
{"[INFO]: Installing wasm-bindgen..."}
-
{"[INFO]: Optional fields missing from Cargo.toml: 'description', 'repository', and 'license'. These are not necessary, but recommended"}
-
{"[INFO]: :-) Done in 0.69s"}
-
{"[INFO]: :-) Your wasm pkg is ready to publish at /home/cecile/repos/blueprint-rs/./static."}
-
{" Index: enabled, Upload: disabled, Cache: disabled, Cors: enabled, Range: enabled, Sort: enabled, Threads: 3"}
-
{" Auth: disabled, Compression: disabled"}
-
{" https: disabled, Cert: , Cert-Password: "}
-
{" Root: /home/cecile/repos/blueprint-rs,"}
-
{" TryFile404: "}
-
{" Address: http://0.0.0.0:8000"}
-
{" ======== [2020-09-07 20:39:46] ========"}
-
{"[2020-09-07 20:39:46] - 127.0.0.1 - 200 - GET /"}
-
{"[2020-09-07 20:39:46] - 127.0.0.1 - 200 - GET /static/blueprint.css"}
-
{"[2020-09-07 20:39:46] - 127.0.0.1 - 200 - GET /static/wasm.js"}
-
{"[2020-09-07 20:39:46] - 127.0.0.1 - 200 - GET /static/wasm_bg.wasm"}
-
-
+

{"Tree"}

+
{source}
} } diff --git a/src/example.rs b/src/example.rs new file mode 100644 index 0000000..70d9657 --- /dev/null +++ b/src/example.rs @@ -0,0 +1,91 @@ +use crate::{Button, Collapse, IconName, Intent}; +use yew::prelude::*; + +pub struct ExampleContainer { + collapsed: bool, + props: Props, + link: ComponentLink, +} + +pub enum Msg { + ToggleSource, +} + +#[derive(Clone, PartialEq, Properties)] +pub struct Props { + pub source: &'static str, + pub children: html::Children, +} + +impl Component for ExampleContainer { + type Message = Msg; + type Properties = Props; + + fn create(props: Self::Properties, link: ComponentLink) -> Self { + ExampleContainer { + collapsed: true, + props, + link, + } + } + + fn update(&mut self, msg: Self::Message) -> ShouldRender { + match msg { + Msg::ToggleSource => self.collapsed ^= true, + } + true + } + + fn change(&mut self, _props: Self::Properties) -> ShouldRender { + // TODO: never re-render this component? How to optimize this + false + } + + fn view(&self) -> Html { + html! { +
+
+ {self.props.children.clone()} +
+
+ + +
{self.props.source}
+
+
+
+ } + } +} + +#[macro_export] +macro_rules! include_example { + ($file:expr) => {{ + use crate::ExampleContainer; + + let source = include_str!($file); + + mod source { + // TODO: example.rs files are not formatted because of this include + include!($file); + } + use source::Example; + + html! { + + + + } + }}; +} diff --git a/src/forms/mod.rs b/src/forms/mod.rs deleted file mode 100644 index 1a8fe5f..0000000 --- a/src/forms/mod.rs +++ /dev/null @@ -1 +0,0 @@ -pub mod controls; diff --git a/src/icon/example.rs b/src/icon/example.rs new file mode 100644 index 0000000..6662588 --- /dev/null +++ b/src/icon/example.rs @@ -0,0 +1,26 @@ +use yew::prelude::*; +use yewprint::{Icon, IconName}; + +pub struct Example {} + +impl Component for Example { + type Message = (); + type Properties = (); + + fn create(_: Self::Properties, _link: ComponentLink) -> Self { + Example {} + } + fn update(&mut self, _msg: Self::Message) -> ShouldRender { + true + } + fn change(&mut self, _props: Self::Properties) -> ShouldRender { + true + } + fn view(&self) -> Html { + html! { +
+ +
+ } + } +} diff --git a/src/icon.rs b/src/icon/mod.rs similarity index 94% rename from src/icon.rs rename to src/icon/mod.rs index 86d717a..236fb9a 100644 --- a/src/icon.rs +++ b/src/icon/mod.rs @@ -96,28 +96,33 @@ impl Component for Icon { #[cfg(feature = "doc")] pub mod doc { - use super::*; + use yew::prelude::*; - pub struct IconDoc {} + pub struct IconDoc; impl Component for IconDoc { type Message = (); type Properties = (); fn create(_: Self::Properties, _link: ComponentLink) -> Self { - IconDoc {} + IconDoc } + fn update(&mut self, _msg: Self::Message) -> ShouldRender { true } + fn change(&mut self, _props: Self::Properties) -> ShouldRender { true } + fn view(&self) -> Html { + let source = crate::include_example!("example.rs"); + html! {

{"Icon"}

- +
{source}
} } diff --git a/src/lib.rs b/src/lib.rs index ff93a2b..f37b581 100644 --- a/src/lib.rs +++ b/src/lib.rs @@ -1,13 +1,30 @@ #![recursion_limit = "512"] +#[cfg(feature = "doc")] +extern crate self as yewprint; + #[cfg(feature = "doc")] mod app; -pub mod buttons; -pub mod collapse; -pub mod forms; -pub mod icon; -pub mod menu; -pub mod tree; +mod buttons; +mod collapse; +#[cfg(feature = "doc")] +mod example; +mod icon; +mod menu; +mod switch; +mod tree; + +#[cfg(feature = "doc")] +pub use app::*; +pub use buttons::*; +pub use collapse::*; +#[cfg(feature = "doc")] +pub use example::*; +pub use icon::*; +pub use id_tree; +pub use menu::*; +pub use switch::*; +pub use tree::*; use yew::virtual_dom::Classes; diff --git a/src/menu.rs b/src/menu/mod.rs similarity index 100% rename from src/menu.rs rename to src/menu/mod.rs diff --git a/src/forms/controls.rs b/src/switch/mod.rs similarity index 100% rename from src/forms/controls.rs rename to src/switch/mod.rs diff --git a/src/tree/example.rs b/src/tree/example.rs new file mode 100644 index 0000000..04c2ec4 --- /dev/null +++ b/src/tree/example.rs @@ -0,0 +1,126 @@ +use yew::prelude::*; +use yewprint::{Tree, Icon, NodeData, IconName, Intent, TreeData}; +use yewprint::id_tree::{InsertBehavior, Node, TreeBuilder, NodeId}; + +pub struct Example { + tree: TreeData, + callback_expand_node: Callback<(NodeId, MouseEvent)>, + callback_select_node: Callback<(NodeId, MouseEvent)>, +} + +pub enum Msg { + ExpandNode(NodeId), + SelectNode(NodeId), +} + +impl Component for Example { + type Message = Msg; + type Properties = (); + + fn create(_props: Self::Properties, link: ComponentLink) -> Self { + let mut tree = TreeBuilder::new().build(); + let root_id = tree + .insert( + Node::new(NodeData { + data: 0, + ..Default::default() + }), + InsertBehavior::AsRoot, + ) + .unwrap(); + let dir1 = tree + .insert( + Node::new(NodeData { + icon: Some(IconName::FolderClose), + label: "Big directory".into(), + has_caret: true, + data: 1, + ..Default::default() + }), + InsertBehavior::UnderNode(&root_id), + ) + .unwrap(); + for i in 0..10 { + let dir2 = tree + .insert( + Node::new(NodeData { + icon: Some(IconName::FolderClose), + label: format!("Directory {}", i + 1).into(), + has_caret: true, + data: 1, + ..Default::default() + }), + InsertBehavior::UnderNode(&dir1), + ) + .unwrap(); + for i in 0..10 { + tree.insert( + Node::new(NodeData { + icon: Some(IconName::Document), + label: format!("File {}", i + 1).into(), + data: i, + ..Default::default() + }), + InsertBehavior::UnderNode(&dir2), + ) + .unwrap(); + } + } + tree.insert( + Node::new(NodeData { + icon: Some(IconName::Tag), + icon_intent: Some(Intent::Primary), + label: "Outer file".into(), + secondary_label: Some(html!()), + data: 3, + ..Default::default() + }), + InsertBehavior::UnderNode(&root_id), + ) + .unwrap(); + + Self { + tree: tree.into(), + callback_expand_node: link.callback(|(node_id, _)| Msg::ExpandNode(node_id)), + callback_select_node: link.callback(|(node_id, _)| Msg::SelectNode(node_id)), + } + } + + fn update(&mut self, msg: Self::Message) -> ShouldRender { + match msg { + Msg::ExpandNode(node_id) => { + let mut tree = self.tree.borrow_mut(); + let node = tree.get_mut(&node_id).unwrap(); + let data = node.data_mut(); + data.is_expanded ^= true; + data.icon = Some(if data.is_expanded { + IconName::FolderOpen + } else { + IconName::FolderClose + }) + } + Msg::SelectNode(node_id) => { + let mut tree = self.tree.borrow_mut(); + let node = tree.get_mut(&node_id).unwrap(); + node.data_mut().is_selected ^= true; + } + } + + true + } + + fn change(&mut self, _props: Self::Properties) -> ShouldRender { + true + } + + fn view(&self) -> Html { + html! { + + tree=self.tree.clone() + on_collapse=Some(self.callback_expand_node.clone()) + on_expand=Some(self.callback_expand_node.clone()) + onclick=Some(self.callback_select_node.clone()) + /> + } + } +} diff --git a/src/tree.rs b/src/tree/mod.rs similarity index 74% rename from src/tree.rs rename to src/tree/mod.rs index 3f80950..e562814 100644 --- a/src/tree.rs +++ b/src/tree/mod.rs @@ -1,7 +1,7 @@ use crate::collapse::Collapse; use crate::icon::{Icon, IconName}; use crate::Intent; -pub use id_tree::*; +use id_tree::*; use std::cell::{Ref, RefCell, RefMut}; use std::collections::hash_map::DefaultHasher; use std::collections::HashMap; @@ -365,112 +365,19 @@ impl Component for TreeNode { #[cfg(feature = "doc")] pub mod doc { - use super::*; + use yew::prelude::*; - pub struct TreeDoc { - tree: TreeData, - callback_expand_node: Callback<(NodeId, MouseEvent)>, - callback_select_node: Callback<(NodeId, MouseEvent)>, - } - - pub enum Msg { - ExpandNode(NodeId), - SelectNode(NodeId), - } + pub struct TreeDoc; impl Component for TreeDoc { - type Message = Msg; + type Message = (); type Properties = (); - fn create(_props: Self::Properties, link: ComponentLink) -> Self { - let mut tree = TreeBuilder::new().build(); - let root_id = tree - .insert( - Node::new(NodeData { - data: 0, - ..Default::default() - }), - InsertBehavior::AsRoot, - ) - .unwrap(); - let dir1 = tree - .insert( - Node::new(NodeData { - icon: Some(IconName::FolderClose), - label: "Big directory".into(), - has_caret: true, - data: 1, - ..Default::default() - }), - InsertBehavior::UnderNode(&root_id), - ) - .unwrap(); - for i in 0..10 { - let dir2 = tree - .insert( - Node::new(NodeData { - icon: Some(IconName::FolderClose), - label: format!("Directory {}", i + 1).into(), - has_caret: true, - data: 1, - ..Default::default() - }), - InsertBehavior::UnderNode(&dir1), - ) - .unwrap(); - for i in 0..10 { - tree.insert( - Node::new(NodeData { - icon: Some(IconName::Document), - label: format!("File {}", i + 1).into(), - data: i, - ..Default::default() - }), - InsertBehavior::UnderNode(&dir2), - ) - .unwrap(); - } - } - tree.insert( - Node::new(NodeData { - icon: Some(IconName::Tag), - icon_intent: Some(Intent::Primary), - label: "Outer file".into(), - secondary_label: Some(html!()), - data: 3, - ..Default::default() - }), - InsertBehavior::UnderNode(&root_id), - ) - .unwrap(); - - Self { - tree: tree.into(), - callback_expand_node: link.callback(|(node_id, _)| Msg::ExpandNode(node_id)), - callback_select_node: link.callback(|(node_id, _)| Msg::SelectNode(node_id)), - } + fn create(_: Self::Properties, _link: ComponentLink) -> Self { + TreeDoc } - fn update(&mut self, msg: Self::Message) -> ShouldRender { - match msg { - Msg::ExpandNode(node_id) => { - let mut tree = self.tree.borrow_mut(); - let node = tree.get_mut(&node_id).unwrap(); - let data = node.data_mut(); - data.is_expanded ^= true; - data.icon = Some(if data.is_expanded { - IconName::FolderOpen - } else { - IconName::FolderClose - }) - } - Msg::SelectNode(node_id) => { - let mut tree = self.tree.borrow_mut(); - let node = tree.get_mut(&node_id).unwrap(); - node.data_mut().is_selected ^= true; - } - } - + fn update(&mut self, _msg: Self::Message) -> ShouldRender { true } @@ -479,15 +386,12 @@ pub mod doc { } fn view(&self) -> Html { + let source = crate::include_example!("example.rs"); + html! {

{"Tree"}

- - tree=self.tree.clone() - on_collapse=Some(self.callback_expand_node.clone()) - on_expand=Some(self.callback_expand_node.clone()) - onclick=Some(self.callback_select_node.clone()) - /> +
{source}
} } diff --git a/static/index.html b/static/index.html index 7778c6d..fd9e368 100644 --- a/static/index.html +++ b/static/index.html @@ -72,6 +72,36 @@ line-height: 40px; font-size: 36px; } + + .docs-example-wrapper .bp3-code-block { + /* + display: inline-block; + clear: both; + */ + } + + .docs-example-wrapper .docs-example { + border-radius: 6px; + background-color: #fff; + padding: 20px; + } + + .bp3-dark .docs-example-wrapper .docs-example { + background-color: #293742; + } + + .docs-example-wrapper > .docs-source > .bp3-button { + background-color: #ebf1f5; + } + + .bp3-dark .docs-example-wrapper > .docs-source > .bp3-button { + background-color: #394b59; + } + + .docs-example-wrapper > .docs-source { + margin-bottom: 40px; + margin-top: 10px; + }