From 2858755c326273666cf467ed0608ec811badb42b Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Wed, 31 Aug 2022 15:01:41 +0000 Subject: [PATCH] docs(checkbox): add basic playground --- docs/api/checkbox.md | 4 +++- static/usage/checkbox/basic/angular.md | 6 ++++++ static/usage/checkbox/basic/demo.html | 24 ++++++++++++++++++++++ static/usage/checkbox/basic/index.md | 16 +++++++++++++++ static/usage/checkbox/basic/javascript.md | 6 ++++++ static/usage/checkbox/basic/react.md | 18 ++++++++++++++++ static/usage/checkbox/basic/vue.md | 25 +++++++++++++++++++++++ 7 files changed, 98 insertions(+), 1 deletion(-) create mode 100644 static/usage/checkbox/basic/angular.md create mode 100644 static/usage/checkbox/basic/demo.html create mode 100644 static/usage/checkbox/basic/index.md create mode 100644 static/usage/checkbox/basic/javascript.md create mode 100644 static/usage/checkbox/basic/react.md create mode 100644 static/usage/checkbox/basic/vue.md diff --git a/docs/api/checkbox.md b/docs/api/checkbox.md index 5461036afba..a98ee09efe5 100644 --- a/docs/api/checkbox.md +++ b/docs/api/checkbox.md @@ -24,7 +24,9 @@ Checkboxes allow the selection of multiple options from a set of options. They a ## Basic -TODO Playground +import Basic from '@site/static/usage/checkbox/basic/index.md'; + + ## Indeterminate Checkboxes diff --git a/static/usage/checkbox/basic/angular.md b/static/usage/checkbox/basic/angular.md new file mode 100644 index 00000000000..29c262a3522 --- /dev/null +++ b/static/usage/checkbox/basic/angular.md @@ -0,0 +1,6 @@ +```html + + + I agree to the terms and conditions + +``` diff --git a/static/usage/checkbox/basic/demo.html b/static/usage/checkbox/basic/demo.html new file mode 100644 index 00000000000..d95a66ee2fd --- /dev/null +++ b/static/usage/checkbox/basic/demo.html @@ -0,0 +1,24 @@ + + + + + + Checkbox + + + + + + + + +
+ + + I agree to the terms and conditions + +
+
+
+ + diff --git a/static/usage/checkbox/basic/index.md b/static/usage/checkbox/basic/index.md new file mode 100644 index 00000000000..8e6d70bb205 --- /dev/null +++ b/static/usage/checkbox/basic/index.md @@ -0,0 +1,16 @@ +import Playground from '@site/src/components/global/Playground'; + +import javascript from './javascript.md'; +import react from './react.md'; +import vue from './vue.md'; +import angular from './angular.md'; + + diff --git a/static/usage/checkbox/basic/javascript.md b/static/usage/checkbox/basic/javascript.md new file mode 100644 index 00000000000..29c262a3522 --- /dev/null +++ b/static/usage/checkbox/basic/javascript.md @@ -0,0 +1,6 @@ +```html + + + I agree to the terms and conditions + +``` diff --git a/static/usage/checkbox/basic/react.md b/static/usage/checkbox/basic/react.md new file mode 100644 index 00000000000..64dda9457bb --- /dev/null +++ b/static/usage/checkbox/basic/react.md @@ -0,0 +1,18 @@ +```tsx +import React from 'react'; +import { + IonCheckbox, + IonItem, + IonLabel +} from '@ionic/react'; + +function Example() { + return ( + + + I agree to the terms and conditions + + ); +} +export default Example; +``` \ No newline at end of file diff --git a/static/usage/checkbox/basic/vue.md b/static/usage/checkbox/basic/vue.md new file mode 100644 index 00000000000..53cb1d16ccf --- /dev/null +++ b/static/usage/checkbox/basic/vue.md @@ -0,0 +1,25 @@ +```html + + + +```