playbook_ui_docs 12.25.0.pre.alpha.railsmultilevelimprovements780 → 12.25.0.pre.alpha.railsmultilevelimprovements785

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 CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 32c03f3180741d787ec711cae5916c44b644c86395b4aa2674a115375ddb62e5
4
- data.tar.gz: cf27a0c06ab7c53e2866cad873ffb9dbaf5ec8489146f37498bd4010e88c2934
3
+ metadata.gz: 2737ce30ca3cb270e8e3f6a2f9eafd78b76b07436b9d0337f2b235595b7b95f7
4
+ data.tar.gz: 44de39157e02ee1fd45ec9bb1e148288b63347ae020830ea6c98f92e72eded81
5
5
  SHA512:
6
- metadata.gz: 1db727b802ecf299e3172287d0b29d12c3486904f0a8b307126d344fa7afc89c3505be45c2c2fdb0320c1d2b58c2aeabebe73bd1971571c82b1efc7ee40e3a11
7
- data.tar.gz: c201d3b7c0279ef992c01cd617f4e372bff8f49be0f79cee60dac518b32c8614c4b8b64aa86b0bd71cffeae68d617dc887744811fe180774f8c5a07c420a4791
6
+ metadata.gz: d0c6d6e42d65dc939eb7190950432e516b19243d370bc8bef979f4011403ba4691c16d3303fda169c0d8eb1d4e7a73295b79ef46352c5920d3333ed486e622d8
7
+ data.tar.gz: da62f5d968a51fcedafe6d221371a416c48c8926c129c30276455673ca201088a68d1ffd2d5bab2a0493a3ca81cc583298e339fc92c974efa05b3b9be17c1963
@@ -0,0 +1 @@
1
+ Used for tables or designs with large amounts of data or text.
@@ -0,0 +1,34 @@
1
+ <%= pb_rails("detail", props: {
2
+ bold: true,
3
+ text: "I am a bold detail kit"
4
+ }) %>
5
+
6
+ <%= pb_rails("detail", props: {
7
+ bold: true,
8
+ color: "default",
9
+ text: "I am a bold detail kit"
10
+ }) %>
11
+
12
+ <%= pb_rails("detail", props: {
13
+ bold: true,
14
+ color: "lighter",
15
+ text: "I am a bold detail kit"
16
+ }) %>
17
+
18
+ <%= pb_rails("detail", props: {
19
+ bold: true,
20
+ color: "link",
21
+ text: "I am a bold detail kit"
22
+ }) %>
23
+
24
+ <%= pb_rails("detail", props: {
25
+ bold: true,
26
+ color: "error",
27
+ text: "I am a bold detail kit"
28
+ }) %>
29
+
30
+ <%= pb_rails("detail", props: {
31
+ bold: true,
32
+ color: "success",
33
+ text: "I am a bold detail kit"
34
+ }) %>
@@ -0,0 +1,49 @@
1
+ import React from 'react'
2
+ import { Detail } from '../..'
3
+
4
+ const DetailBold = (props) => (
5
+ <div>
6
+ <Detail
7
+ bold
8
+ text="I am a bold detail kit"
9
+ {...props}
10
+ />
11
+
12
+ <Detail
13
+ bold
14
+ color="default"
15
+ text="I am a bold detail kit"
16
+ {...props}
17
+ />
18
+
19
+ <Detail
20
+ bold
21
+ color="lighter"
22
+ text="I am a bold detail kit"
23
+ {...props}
24
+ />
25
+
26
+ <Detail
27
+ bold
28
+ color="link"
29
+ text="I am a bold detail kit"
30
+ {...props}
31
+ />
32
+
33
+ <Detail
34
+ bold
35
+ color="error"
36
+ text="I am a bold detail kit"
37
+ {...props}
38
+ />
39
+
40
+ <Detail
41
+ bold
42
+ color="success"
43
+ text="I am a bold detail kit"
44
+ {...props}
45
+ />
46
+ </div>
47
+ )
48
+
49
+ export default DetailBold
@@ -0,0 +1 @@
1
+ Use the `bold` prop to strongly emphasis your text.
@@ -0,0 +1,24 @@
1
+ <%= pb_rails("detail", props: {
2
+ text: "I am a detail kit",
3
+ color: "default"
4
+ }) %>
5
+
6
+ <%= pb_rails("detail", props: {
7
+ text: "I am a detail kit",
8
+ color: "lighter"
9
+ }) %>
10
+
11
+ <%= pb_rails("detail", props: {
12
+ text: "I am a detail kit",
13
+ color: "link"
14
+ }) %>
15
+
16
+ <%= pb_rails("detail", props: {
17
+ text: "I am a detail kit",
18
+ color: "error"
19
+ }) %>
20
+
21
+ <%= pb_rails("detail", props: {
22
+ text: "I am a detail kit",
23
+ color: "success"
24
+ }) %>
@@ -0,0 +1,38 @@
1
+ import React from 'react'
2
+ import { Detail } from '../..'
3
+
4
+ const DetailColors = (props) => (
5
+ <div>
6
+ <Detail
7
+ color="default"
8
+ text="I am a detail kit"
9
+ {...props}
10
+ />
11
+
12
+ <Detail
13
+ color="lighter"
14
+ text="I am a detail kit"
15
+ {...props}
16
+ />
17
+
18
+ <Detail
19
+ color="link"
20
+ text="I am a detail kit"
21
+ {...props}
22
+ />
23
+
24
+ <Detail
25
+ color="error"
26
+ text="I am a detail kit"
27
+ {...props}
28
+ />
29
+
30
+ <Detail
31
+ color="success"
32
+ text="I am a detail kit"
33
+ {...props}
34
+ />
35
+ </div>
36
+ )
37
+
38
+ export default DetailColors
@@ -0,0 +1,6 @@
1
+ ##### Prop
2
+ This kit uses the `light` color by default, and can be replaced with colors below:
3
+
4
+ `default` `lighter` `link` `error` `success`
5
+
6
+ These colors are not for standard usage. You can use the `color` prop to make fixes if colors are not appearing properly, but consult your UX team members if you are deciding to implement it.
@@ -0,0 +1,3 @@
1
+ <%= pb_rails("detail", props: {
2
+ text: "I am a detail kit"
3
+ }) %>
@@ -0,0 +1,13 @@
1
+ import React from 'react'
2
+ import { Detail } from '../..'
3
+
4
+ const DetailDefault = (props) => (
5
+ <div>
6
+ <Detail
7
+ text="I am a detail kit"
8
+ {...props}
9
+ />
10
+ </div>
11
+ )
12
+
13
+ export default DetailDefault
@@ -0,0 +1,22 @@
1
+ <%= pb_rails("detail") do %>
2
+ <b>This text is using the <%="<b>"%> tag.</b>
3
+ <br />
4
+ <br />
5
+ <strong>This text is using the <%="<strong>"%> tag.</strong>
6
+ <br />
7
+ <br />
8
+ <a>This text is using the <%="<a>"%> tag.</a>
9
+ <br />
10
+ <br />
11
+ <i>This text is using the <%="<i>"%> tag.</i>
12
+ <br />
13
+ <br />
14
+ This <em>word</em> is using an <%="<em>"%> tag.
15
+ <br />
16
+ <br />
17
+ <small>This text is using the <%="<small>"%> tag.</small>
18
+ <br />
19
+ <br />
20
+ <u>This text is using the <%="<u>"%> tag.</u>
21
+ <br />
22
+ <% end %>
@@ -0,0 +1,32 @@
1
+ import React from 'react'
2
+ import { Detail } from '../..'
3
+
4
+ const DetailStyled = (props) => (
5
+ <>
6
+ <Detail {...props}>
7
+ <b>{"This text is using the <b> tag."}</b>
8
+ <br />
9
+ <br />
10
+ <strong>{"This text is using the <strong> tag."}</strong>
11
+ <br />
12
+ <br />
13
+ <a>{"This text is using the <a> tag."}</a>
14
+ <br />
15
+ <br />
16
+ <i>{"This text is using the <i> tag."}</i>
17
+ <br />
18
+ <br />
19
+ {"This "}<em>{"word"}</em>{" is using an <em> tag."}
20
+ <br />
21
+ <br />
22
+ <small>{"This text is using the <small> tag."}</small>
23
+ <br />
24
+ <br />
25
+ <u>{"This text is using the <u> tag."}</u>
26
+ <br />
27
+ <br />
28
+ </Detail>
29
+ </>
30
+ )
31
+
32
+ export default DetailStyled
@@ -0,0 +1,11 @@
1
+ examples:
2
+
3
+ rails:
4
+ - detail_default: Default
5
+ - detail_colors: Colors
6
+ - detail_bold: Bold
7
+
8
+ react:
9
+ - detail_default: Default
10
+ - detail_colors: Colors
11
+ - detail_bold: Bold
@@ -0,0 +1,4 @@
1
+ export { default as DetailDefault } from './_detail_default.jsx'
2
+ export { default as DetailColors } from './_detail_colors.jsx'
3
+ export { default as DetailStyled } from './_detail_styled.jsx'
4
+ export { default as DetailBold } from './_detail_bold.jsx'