playbook_ui_docs 14.14.0.pre.alpha.play1872verticaltimelineresponsiveissue6409 → 14.14.0.pre.alpha.revert4339revert4242play1633displaytitle6424
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_default.html.erb +1 -2
- data/app/pb_kits/playbook/pb_title/docs/_title_default.jsx +1 -1
- data/app/pb_kits/playbook/pb_title/docs/_title_display_size.html.erb +7 -0
- data/app/pb_kits/playbook/pb_title/docs/_title_display_size.jsx +54 -0
- data/app/pb_kits/playbook/pb_title/docs/_title_display_size.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 +1 -1
- 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: e7c8c920a0330d2e76ad73924126ac36b3eba229681f1e5732f0229fda09a83a
|
4
|
+
data.tar.gz: ce779d23588ea697f0ec5b4c6746bf61a780c1603e3845f0980a8da647ebc73f
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: a5e8a9308c58e960f80ce6ad4ef276bbf9f2f9ead11cb0a137091a2998ad69373fbd4cfbcdc6a6c3f7e9341aa8de001fb240d6db62656903663c5d5258f77f6f
|
7
|
+
data.tar.gz: 17a641ee6e6eeb4445011aa289f6c8922cde8fa70dcf2d2bfd0098e4e855a47238badc340237ce885bbb1c33b6b36a5f83e3caf7e5c0bfd6c1fdc0020b9a9e50
|
@@ -1,10 +1,9 @@
|
|
1
1
|
<%= pb_rails("title", props: {
|
2
|
+
margin_bottom: "md"
|
2
3
|
}) do %>
|
3
4
|
Default Title
|
4
5
|
<% end %>
|
5
6
|
|
6
|
-
<br/>
|
7
|
-
|
8
7
|
<%= pb_rails("title", props: { text: "Title 1", tag: "h1", size: 1 }) %>
|
9
8
|
<%= pb_rails("title", props: { text: "Title 2", tag: "h2", size: 2 }) %>
|
10
9
|
<%= pb_rails("title", props: { text: "Title 3", tag: "h3", size: 3 }) %>
|
@@ -0,0 +1,7 @@
|
|
1
|
+
<%= pb_rails("title", props: { text: "Display Size xs", tag: "h1", display_size: "xs" }) %>
|
2
|
+
<%= pb_rails("title", props: { text: "Display Size sm", tag: "h1", display_size: "sm" }) %>
|
3
|
+
<%= pb_rails("title", props: { text: "Display Size md", tag: "h1", display_size: "md" }) %>
|
4
|
+
<%= pb_rails("title", props: { text: "Display Size lg", tag: "h1", display_size: "lg" }) %>
|
5
|
+
<%= pb_rails("title", props: { text: "Display Size xl", tag: "h1", display_size: "xl" }) %>
|
6
|
+
<%= pb_rails("title", props: { text: "Display Size xxl", tag: "h1", display_size: "xxl" }) %>
|
7
|
+
<%= pb_rails("title", props: { text: "This is a size of display", tag: "h1", size: "display"}) %>
|
@@ -0,0 +1,54 @@
|
|
1
|
+
import React from 'react'
|
2
|
+
|
3
|
+
import Title from '../_title'
|
4
|
+
|
5
|
+
const TitleDisplaySize = (props) => {
|
6
|
+
return (
|
7
|
+
<div>
|
8
|
+
<Title
|
9
|
+
displaySize="xs"
|
10
|
+
tag="h1"
|
11
|
+
text="Display Size xs"
|
12
|
+
{...props}
|
13
|
+
/>
|
14
|
+
<Title
|
15
|
+
displaySize="sm"
|
16
|
+
tag="h1"
|
17
|
+
text="Display Size sm"
|
18
|
+
{...props}
|
19
|
+
/>
|
20
|
+
<Title
|
21
|
+
displaySize="md"
|
22
|
+
tag="h1"
|
23
|
+
text="Display Size md"
|
24
|
+
{...props}
|
25
|
+
/>
|
26
|
+
<Title
|
27
|
+
displaySize="lg"
|
28
|
+
tag="h1"
|
29
|
+
text="Display Size lg"
|
30
|
+
{...props}
|
31
|
+
/>
|
32
|
+
<Title
|
33
|
+
displaySize="xl"
|
34
|
+
tag="h1"
|
35
|
+
text="Display Size xl"
|
36
|
+
{...props}
|
37
|
+
/>
|
38
|
+
<Title
|
39
|
+
displaySize="xxl"
|
40
|
+
tag="h1"
|
41
|
+
text="Display Size xxl"
|
42
|
+
{...props}
|
43
|
+
/>
|
44
|
+
<Title
|
45
|
+
size="display"
|
46
|
+
tag="h1"
|
47
|
+
text="This is a size of display"
|
48
|
+
{...props}
|
49
|
+
/>
|
50
|
+
</div>
|
51
|
+
)
|
52
|
+
}
|
53
|
+
|
54
|
+
export default TitleDisplaySize
|
@@ -0,0 +1 @@
|
|
1
|
+
Responsive sizes for large screens and tablets, perfect for digital signage.
|
@@ -5,6 +5,7 @@ examples:
|
|
5
5
|
- title_colors: Colors
|
6
6
|
- title_responsive: Responsive
|
7
7
|
- title_truncate: Truncate
|
8
|
+
- title_display_size: Display Size
|
8
9
|
|
9
10
|
react:
|
10
11
|
- title_default: Default UI
|
@@ -12,3 +13,4 @@ examples:
|
|
12
13
|
- title_colors: Colors
|
13
14
|
- title_responsive: Responsive
|
14
15
|
- title_truncate: Truncate
|
16
|
+
- title_display_size: Display Size
|
@@ -3,3 +3,4 @@ export { default as TitleLightWeight } from './_title_light_weight.jsx'
|
|
3
3
|
export { default as TitleColors } from './_title_colors.jsx'
|
4
4
|
export { default as TitleResponsive } from './_title_responsive.jsx'
|
5
5
|
export { default as TitleTruncate } from './_title_truncate.jsx'
|
6
|
+
export { default as TitleDisplaySize } from './_title_display_size.jsx'
|