playbook_ui_docs 12.30.0.pre.alpha.PLAY906multilevelselectedidsprop902 → 12.30.1.pre.alpha.PLAY802responsivetitlekit909
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_title/docs/_title_responsive.html.erb +1 -0
- data/app/pb_kits/playbook/pb_title/docs/_title_responsive.jsx +16 -0
- data/app/pb_kits/playbook/pb_title/docs/_title_responsive.md +1 -0
- data/app/pb_kits/playbook/pb_title/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_title/docs/index.js +1 -0
- data/dist/playbook-doc.js +3 -3
- metadata +4 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: c23e361b6b8faaac63b5556229a71d0b07a515a9a5577c8442916b58fe19849b
|
4
|
+
data.tar.gz: f7d4065b32620b6c29a0d76151a8ec9e2a0b30db90f150e91a8e0813aa1ad4df
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 7ededa65bb353427b3c7d6d48ab8ba60274a6745098a78caffa5160095d681952e5d2b5f9a207ab271cdbe07a5b48bc0f4bc5788241ad6b5d3110011df12f612
|
7
|
+
data.tar.gz: e6b5832805f48f7c625b338a5ae8f9fc57db0bd4bc94018f4b1d6d86473b7b1fc8f216b0df7167356276b4e5bf0828544ac78716621e472064d30b2dc59783d0
|
@@ -0,0 +1 @@
|
|
1
|
+
<%= pb_rails("title", props: { text: "Responsive Title", tag: "h1", size: {xs: 3, sm: 2, md: 1} }) %>
|
@@ -0,0 +1,16 @@
|
|
1
|
+
import React from 'react'
|
2
|
+
import Title from '../_title'
|
3
|
+
|
4
|
+
const TitleResponsive = (props) => {
|
5
|
+
return (
|
6
|
+
<>
|
7
|
+
<Title
|
8
|
+
size={{xs: "3", sm: "2", md: "1"}}
|
9
|
+
text="Responsive Title"
|
10
|
+
{...props}
|
11
|
+
/>
|
12
|
+
</>
|
13
|
+
)
|
14
|
+
}
|
15
|
+
|
16
|
+
export default TitleResponsive
|
@@ -0,0 +1 @@
|
|
1
|
+
The `size` prop supports responsive sizes. To use them, pass an object to the size prop containing your size values relative to responsive break points (show code below). To test this here, resize your browser window to responsively change this Title's size.
|
@@ -3,8 +3,10 @@ examples:
|
|
3
3
|
- title_default: Default UI
|
4
4
|
- title_light_weight: Light Weight UI
|
5
5
|
- title_colors: Colors
|
6
|
+
- title_responsive: Responsive
|
6
7
|
|
7
8
|
react:
|
8
9
|
- title_default: Default UI
|
9
10
|
- title_light_weight: Light Weight UI
|
10
11
|
- title_colors: Colors
|
12
|
+
- title_responsive: Responsive
|