playbook_ui 5.5.1 → 6.0.1.pre.alpha5
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/_playbook.scss +0 -2
- data/app/pb_kits/playbook/data/menu.yml +0 -2
- data/app/pb_kits/playbook/index.js +0 -1
- data/app/pb_kits/playbook/packs/examples.js +0 -4
- data/app/pb_kits/playbook/pb_button/_button.jsx +2 -0
- data/app/pb_kits/playbook/pb_checkbox/checkbox.rb +3 -0
- data/app/pb_kits/playbook/pb_circle_chart/_circle_chart.html.erb +21 -11
- data/app/pb_kits/playbook/pb_circle_chart/_circle_chart.scss +10 -0
- data/app/pb_kits/playbook/pb_circle_chart/circle_chart.rb +14 -0
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_block.html.erb +26 -0
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors.html.erb +20 -0
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_rounded.html.erb +22 -0
- data/app/pb_kits/playbook/pb_circle_chart/docs/example.yml +5 -1
- data/app/pb_kits/playbook/pb_filter/docs/_filter_default.html.erb +6 -2
- data/app/pb_kits/playbook/pb_form/docs/_form_form_with.html.erb +1 -0
- data/app/pb_kits/playbook/pb_form/docs/_form_form_with_validate.html.erb +1 -0
- data/app/pb_kits/playbook/pb_form/docs/_form_simple_form.html.erb +3 -1
- data/app/pb_kits/playbook/pb_form/docs/_form_simple_form_validate.html.erb +3 -1
- data/app/pb_kits/playbook/pb_form/form_builder.rb +2 -0
- data/app/pb_kits/playbook/pb_form/form_builder/checkbox_field.rb +26 -0
- data/app/pb_kits/playbook/pb_form/form_builder/form_field_builder.rb +1 -0
- data/app/pb_kits/playbook/pb_image/_image.html.erb +2 -1
- data/app/pb_kits/playbook/pb_image/_image.jsx +31 -8
- data/app/pb_kits/playbook/pb_image/docs/_default_image.jsx +3 -3
- data/app/pb_kits/playbook/pb_label_value/_label_value.html.erb +20 -2
- data/app/pb_kits/playbook/pb_label_value/_label_value.jsx +109 -5
- data/app/pb_kits/playbook/pb_label_value/_label_value.scss +0 -10
- data/app/pb_kits/playbook/pb_label_value/docs/_description.md +3 -1
- data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details.html.erb +39 -0
- data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details.jsx +50 -0
- data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details.md +1 -0
- data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details_dark.html.erb +43 -0
- data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details_dark.jsx +54 -0
- data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details_examples.html.erb +72 -0
- data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details_examples.jsx +92 -0
- data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details_examples_dark.html.erb +80 -0
- data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details_examples_dark.jsx +101 -0
- data/app/pb_kits/playbook/pb_label_value/docs/example.yml +9 -0
- data/app/pb_kits/playbook/pb_label_value/docs/index.js +5 -0
- data/app/pb_kits/playbook/pb_label_value/label_value.rb +19 -2
- data/app/pb_kits/playbook/pb_progress_simple/_progress_simple.jsx +5 -1
- data/app/pb_kits/playbook/pb_progress_simple/_progress_simple.scss +12 -1
- data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_variants.html.erb +9 -0
- data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_variants.jsx +26 -0
- data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_variants.md +1 -0
- data/app/pb_kits/playbook/pb_progress_simple/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_progress_simple/docs/index.js +2 -0
- data/app/pb_kits/playbook/pb_progress_simple/progress_simple.rb +8 -1
- data/app/pb_kits/playbook/pb_time_range_inline/_time_range_inline.html.erb +2 -2
- data/app/pb_kits/playbook/pb_time_range_inline/_time_range_inline.jsx +24 -10
- data/app/pb_kits/playbook/pb_time_range_inline/_time_range_inline.scss +3 -1
- data/app/pb_kits/playbook/pb_time_range_inline/time_range_inline.rb +6 -0
- data/app/pb_kits/playbook/pb_title/_title.scss +3 -4
- data/app/pb_kits/playbook/pb_title/title.rb +2 -2
- data/app/pb_kits/playbook/plugins/pb_chart.js +49 -4
- data/lib/playbook/version.rb +1 -1
- metadata +20 -23
- data/app/pb_kits/playbook/pb_installer/_installer.html.erb +0 -16
- data/app/pb_kits/playbook/pb_installer/_installer.jsx +0 -54
- data/app/pb_kits/playbook/pb_installer/_installer.scss +0 -7
- data/app/pb_kits/playbook/pb_installer/docs/_installer_default.html.erb +0 -8
- data/app/pb_kits/playbook/pb_installer/docs/_installer_default.jsx +0 -16
- data/app/pb_kits/playbook/pb_installer/docs/example.yml +0 -9
- data/app/pb_kits/playbook/pb_installer/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_installer/installer.rb +0 -18
- data/app/pb_kits/playbook/pb_label_value/docs/index.html.erb +0 -25
- data/app/pb_kits/playbook/pb_logistic/_logistic.html.erb +0 -20
- data/app/pb_kits/playbook/pb_logistic/_logistic.jsx +0 -111
- data/app/pb_kits/playbook/pb_logistic/_logistic.scss +0 -7
- data/app/pb_kits/playbook/pb_logistic/docs/_logistic_dark.html.erb +0 -27
- data/app/pb_kits/playbook/pb_logistic/docs/_logistic_dark.jsx +0 -39
- data/app/pb_kits/playbook/pb_logistic/docs/_logistic_default.html.erb +0 -24
- data/app/pb_kits/playbook/pb_logistic/docs/_logistic_default.jsx +0 -35
- data/app/pb_kits/playbook/pb_logistic/docs/example.yml +0 -11
- data/app/pb_kits/playbook/pb_logistic/docs/index.js +0 -2
- data/app/pb_kits/playbook/pb_logistic/logistic.rb +0 -31
@@ -3,6 +3,24 @@
|
|
3
3
|
id: object.id,
|
4
4
|
data: object.data,
|
5
5
|
class: object.classname) do %>
|
6
|
-
|
7
|
-
|
6
|
+
<%= pb_rails("caption", props: { text: object.label, dark: object.dark }) %>
|
7
|
+
<% if object.variant == "details" %>
|
8
|
+
<%= pb_rails("flex", props: {inline: true, vertical: "center"}) do %>
|
9
|
+
<%= pb_rails("body", props: { color: "light", dark: object.dark }) do %>
|
10
|
+
<%= pb_rails("icon", props: { icon: object.icon, fixed_width: true, margin_right: "xs", }) if object.icon.present? %>
|
11
|
+
<% end %>
|
12
|
+
<%= pb_rails("body", props: { text: object.description, color: "light", margin_right: "xs", dark: object.dark }) if object.description.present? %>
|
13
|
+
<% if object.active %>
|
14
|
+
<%= pb_rails("flex", props: {inline: true, vertical: "center"}) do %>
|
15
|
+
<%= pb_rails("title", props: { text: object.title, tag: "h4", size: 4, variant: "link", dark: object.dark }) if object.title.present? %>
|
16
|
+
<%= pb_rails("title", props: { text: object.date_element, tag: "span", size: 4, margin_left: "xs", variant: "link", dark: object.dark }) if object.date.present? %>
|
17
|
+
<% end %>
|
18
|
+
<% else %>
|
19
|
+
<%= pb_rails("title", props: { text: object.title, tag: "h4", size: 4, dark: object.dark }) if object.title.present? %>
|
20
|
+
<%= pb_rails("title", props: { text: object.date_element, tag: "span", size: 4, margin_left: "xs", dark: object.dark }) if object.date.present? %>
|
21
|
+
<% end %>
|
22
|
+
<% end %>
|
23
|
+
<% else %>
|
24
|
+
<%= pb_rails("body", props: { text: object.value, dark: object.dark }) if object.value.present? %>
|
25
|
+
<% end %>
|
8
26
|
<% end %>
|
@@ -2,8 +2,9 @@
|
|
2
2
|
|
3
3
|
import React from 'react'
|
4
4
|
import classnames from 'classnames'
|
5
|
+
import DateTime from '../pb_kit/dateTime.js'
|
5
6
|
import { buildAriaProps, buildDataProps } from '../utilities/props'
|
6
|
-
import { Body, Caption } from '../'
|
7
|
+
import { Body, Caption, Flex, Icon, Title } from '../'
|
7
8
|
import { spacing } from '../utilities/spacing.js'
|
8
9
|
|
9
10
|
type LabelValueProps = {
|
@@ -13,21 +14,42 @@ type LabelValueProps = {
|
|
13
14
|
data?: object,
|
14
15
|
id?: String,
|
15
16
|
label: String,
|
16
|
-
value
|
17
|
+
value?: String,
|
18
|
+
variant?: "default" | "details",
|
19
|
+
icon?: String,
|
20
|
+
description?: String,
|
21
|
+
title?: String,
|
22
|
+
date?: Date,
|
23
|
+
active?: Boolean
|
24
|
+
}
|
25
|
+
|
26
|
+
const dateString = (value: DateTime) => {
|
27
|
+
const month = value.toMonthNum()
|
28
|
+
const day = value.toDay()
|
29
|
+
|
30
|
+
return ` · ${month}/${day}`
|
17
31
|
}
|
18
32
|
|
19
33
|
const LabelValue = (props: LabelValueProps) => {
|
20
34
|
const {
|
35
|
+
active = false,
|
21
36
|
aria = {},
|
22
37
|
className,
|
23
38
|
dark = false,
|
24
39
|
data = {},
|
40
|
+
date,
|
41
|
+
description,
|
42
|
+
icon,
|
25
43
|
id,
|
26
44
|
label,
|
27
|
-
|
45
|
+
title,
|
46
|
+
value,
|
47
|
+
variant = 'default',
|
48
|
+
} = props
|
28
49
|
|
29
50
|
const ariaProps = buildAriaProps(aria)
|
30
51
|
const dataProps = buildDataProps(data)
|
52
|
+
const formattedDate = new DateTime({ value: date })
|
31
53
|
const themeStyle = dark === true ? '_dark' : ''
|
32
54
|
const css = classnames(
|
33
55
|
['pb_label_value_kit' + themeStyle, className],
|
@@ -39,10 +61,92 @@ const LabelValue = (props: LabelValueProps) => {
|
|
39
61
|
{...ariaProps}
|
40
62
|
{...dataProps}
|
41
63
|
className={css}
|
64
|
+
dark={dark}
|
65
|
+
description={description}
|
66
|
+
icon={icon}
|
42
67
|
id={id}
|
68
|
+
title={title}
|
43
69
|
>
|
44
|
-
<Caption
|
45
|
-
|
70
|
+
<Caption
|
71
|
+
dark={dark}
|
72
|
+
text={label}
|
73
|
+
/>
|
74
|
+
<If condition={variant === 'details'}>
|
75
|
+
<Flex
|
76
|
+
inline
|
77
|
+
vertical="center"
|
78
|
+
>
|
79
|
+
<If condition={icon}>
|
80
|
+
<Body
|
81
|
+
color="light"
|
82
|
+
dark={dark}
|
83
|
+
marginRight="xs"
|
84
|
+
>
|
85
|
+
<Icon
|
86
|
+
dark={dark}
|
87
|
+
fixedWidth
|
88
|
+
icon={icon}
|
89
|
+
/>
|
90
|
+
</Body>
|
91
|
+
</If>
|
92
|
+
<If condition={description}>
|
93
|
+
<Body
|
94
|
+
color="light"
|
95
|
+
dark={dark}
|
96
|
+
marginRight="xs"
|
97
|
+
text={description}
|
98
|
+
/>
|
99
|
+
</If>
|
100
|
+
<Choose>
|
101
|
+
<When condition={active === true}>
|
102
|
+
<Flex
|
103
|
+
inline
|
104
|
+
vertical="center"
|
105
|
+
>
|
106
|
+
<If condition={title}>
|
107
|
+
<Title
|
108
|
+
dark={dark}
|
109
|
+
size={4}
|
110
|
+
text={title}
|
111
|
+
variant="link"
|
112
|
+
/>
|
113
|
+
</If>
|
114
|
+
<If condition={date}>
|
115
|
+
<Title
|
116
|
+
dark={dark}
|
117
|
+
marginLeft="xs"
|
118
|
+
size={4}
|
119
|
+
text={' ' + dateString(formattedDate)}
|
120
|
+
variant="link"
|
121
|
+
/>
|
122
|
+
</If>
|
123
|
+
</Flex>
|
124
|
+
</When>
|
125
|
+
<Otherwise>
|
126
|
+
<If condition={title}>
|
127
|
+
<Title
|
128
|
+
dark={dark}
|
129
|
+
size={4}
|
130
|
+
text={title}
|
131
|
+
/>
|
132
|
+
</If>
|
133
|
+
<If condition={date}>
|
134
|
+
<Title
|
135
|
+
dark={dark}
|
136
|
+
marginLeft="xs"
|
137
|
+
size={4}
|
138
|
+
text={' ' + dateString(formattedDate)}
|
139
|
+
/>
|
140
|
+
</If>
|
141
|
+
</Otherwise>
|
142
|
+
</Choose>
|
143
|
+
</Flex>
|
144
|
+
<Else />
|
145
|
+
<Body
|
146
|
+
dark={dark}
|
147
|
+
text={value}
|
148
|
+
/>
|
149
|
+
</If>
|
46
150
|
</div>
|
47
151
|
)
|
48
152
|
}
|
@@ -1,17 +1,7 @@
|
|
1
1
|
@import "../tokens/spacing";
|
2
|
-
@import "../pb_caption/caption";
|
3
|
-
@import "../pb_body/body";
|
4
2
|
|
5
3
|
[class^=pb_label_value_kit] {
|
6
4
|
[class^=pb_caption_kit] {
|
7
5
|
margin-bottom: $space-xs/1.5;
|
8
6
|
}
|
9
|
-
&[class*=_dark] {
|
10
|
-
[class^=pb_caption_kit] {
|
11
|
-
color: $text_dk_light;
|
12
|
-
}
|
13
|
-
[class^=pb_body_kit] {
|
14
|
-
color: $text_dk_default;
|
15
|
-
}
|
16
|
-
}
|
17
7
|
}
|
@@ -1 +1,3 @@
|
|
1
|
-
This kit can be very versatile when used to display text data.
|
1
|
+
This kit can be very versatile when used to display text data.
|
2
|
+
|
3
|
+
Variant `default` includes a label and text. However, variant `details` can be used if multiple elements are necessary in order to make it more descriptive. Variant `details` may include icon, light text, title and date, as well as the option to make it active (with link color) for clickability purposes.
|
@@ -0,0 +1,39 @@
|
|
1
|
+
<%= pb_rails("label_value", props: {
|
2
|
+
variant: "details",
|
3
|
+
label: "Installer",
|
4
|
+
icon: "truck",
|
5
|
+
title: "JD Installations LLC",
|
6
|
+
}) %>
|
7
|
+
|
8
|
+
<br>
|
9
|
+
|
10
|
+
<%= pb_rails("label_value", props: {
|
11
|
+
variant: "details",
|
12
|
+
label: "Project",
|
13
|
+
icon: "home",
|
14
|
+
description: "33-12345",
|
15
|
+
title: "Jefferson-Smith",
|
16
|
+
}) %>
|
17
|
+
|
18
|
+
<br>
|
19
|
+
|
20
|
+
<%= pb_rails("label_value", props: {
|
21
|
+
variant: "details",
|
22
|
+
label: "Project",
|
23
|
+
icon: "home",
|
24
|
+
description: "33-12345",
|
25
|
+
title: "Jefferson-Smith",
|
26
|
+
date: Date.new(2019, 11, 18)
|
27
|
+
}) %>
|
28
|
+
|
29
|
+
<br>
|
30
|
+
|
31
|
+
<%= pb_rails("label_value", props: {
|
32
|
+
variant: "details",
|
33
|
+
active: true,
|
34
|
+
label: "Project",
|
35
|
+
icon: "home",
|
36
|
+
description: "33-12345",
|
37
|
+
title: "Jefferson-Smith",
|
38
|
+
date: Date.new(2019, 11, 18)
|
39
|
+
}) %>
|
@@ -0,0 +1,50 @@
|
|
1
|
+
import React from 'react'
|
2
|
+
import { LabelValue } from '../../'
|
3
|
+
|
4
|
+
const LabelValueDetails = () => {
|
5
|
+
return (
|
6
|
+
<div>
|
7
|
+
<LabelValue
|
8
|
+
icon="truck"
|
9
|
+
label="Installer"
|
10
|
+
title="JD Installations LLC"
|
11
|
+
variant="details"
|
12
|
+
/>
|
13
|
+
|
14
|
+
<br />
|
15
|
+
|
16
|
+
<LabelValue
|
17
|
+
description="33-12345"
|
18
|
+
icon="home"
|
19
|
+
label="Project"
|
20
|
+
title="Jefferson-Smith"
|
21
|
+
variant="details"
|
22
|
+
/>
|
23
|
+
|
24
|
+
<br />
|
25
|
+
|
26
|
+
<LabelValue
|
27
|
+
date={new Date('18 Nov 2019')}
|
28
|
+
description="33-12345"
|
29
|
+
icon="home"
|
30
|
+
label="Project"
|
31
|
+
title="Jefferson-Smith"
|
32
|
+
variant="details"
|
33
|
+
/>
|
34
|
+
|
35
|
+
<br />
|
36
|
+
|
37
|
+
<LabelValue
|
38
|
+
active
|
39
|
+
date={new Date('18 Nov 2019')}
|
40
|
+
description="33-12345"
|
41
|
+
icon="home"
|
42
|
+
label="Project"
|
43
|
+
title="Jefferson-Smith"
|
44
|
+
variant="details"
|
45
|
+
/>
|
46
|
+
</div>
|
47
|
+
)
|
48
|
+
}
|
49
|
+
|
50
|
+
export default LabelValueDetails
|
@@ -0,0 +1 @@
|
|
1
|
+
Variant `details` can pass icon, description, title, date, and active props.
|
@@ -0,0 +1,43 @@
|
|
1
|
+
<%= pb_rails("label_value", props: {
|
2
|
+
variant: "details",
|
3
|
+
label: "Installer",
|
4
|
+
icon: "truck",
|
5
|
+
title: "JD Installations LLC",
|
6
|
+
dark: true
|
7
|
+
}) %>
|
8
|
+
|
9
|
+
<br>
|
10
|
+
|
11
|
+
<%= pb_rails("label_value", props: {
|
12
|
+
variant: "details",
|
13
|
+
label: "Project",
|
14
|
+
icon: "home",
|
15
|
+
description: "33-12345",
|
16
|
+
title: "Jefferson-Smith",
|
17
|
+
dark: true
|
18
|
+
}) %>
|
19
|
+
|
20
|
+
<br>
|
21
|
+
|
22
|
+
<%= pb_rails("label_value", props: {
|
23
|
+
variant: "details",
|
24
|
+
label: "Project",
|
25
|
+
icon: "home",
|
26
|
+
description: "33-12345",
|
27
|
+
title: "Jefferson-Smith",
|
28
|
+
date: Date.new(2019, 11, 18),
|
29
|
+
dark: true
|
30
|
+
}) %>
|
31
|
+
|
32
|
+
<br>
|
33
|
+
|
34
|
+
<%= pb_rails("label_value", props: {
|
35
|
+
variant: "details",
|
36
|
+
label: "Project",
|
37
|
+
icon: "home",
|
38
|
+
description: "33-12345",
|
39
|
+
title: "Jefferson-Smith",
|
40
|
+
date: Date.new(2019, 11, 18),
|
41
|
+
dark: true,
|
42
|
+
active: true
|
43
|
+
}) %>
|
@@ -0,0 +1,54 @@
|
|
1
|
+
import React from 'react'
|
2
|
+
import { LabelValue } from '../../'
|
3
|
+
|
4
|
+
const LabelValueDetailsDark = () => {
|
5
|
+
return (
|
6
|
+
<div>
|
7
|
+
<LabelValue
|
8
|
+
dark
|
9
|
+
icon="truck"
|
10
|
+
label="Installer"
|
11
|
+
title="JD Installations LLC"
|
12
|
+
variant="details"
|
13
|
+
/>
|
14
|
+
|
15
|
+
<br />
|
16
|
+
|
17
|
+
<LabelValue
|
18
|
+
dark
|
19
|
+
description="33-12345"
|
20
|
+
icon="home"
|
21
|
+
label="Project"
|
22
|
+
title="Jefferson-Smith"
|
23
|
+
variant="details"
|
24
|
+
/>
|
25
|
+
|
26
|
+
<br />
|
27
|
+
|
28
|
+
<LabelValue
|
29
|
+
dark
|
30
|
+
date={new Date('18 Nov 2019')}
|
31
|
+
description="33-12345"
|
32
|
+
icon="home"
|
33
|
+
label="Project"
|
34
|
+
title="Jefferson-Smith"
|
35
|
+
variant="details"
|
36
|
+
/>
|
37
|
+
|
38
|
+
<br />
|
39
|
+
|
40
|
+
<LabelValue
|
41
|
+
active
|
42
|
+
dark
|
43
|
+
date={new Date('18 Nov 2019')}
|
44
|
+
description="33-12345"
|
45
|
+
icon="home"
|
46
|
+
label="Project"
|
47
|
+
title="Jefferson-Smith"
|
48
|
+
variant="details"
|
49
|
+
/>
|
50
|
+
</div>
|
51
|
+
)
|
52
|
+
}
|
53
|
+
|
54
|
+
export default LabelValueDetailsDark
|
@@ -0,0 +1,72 @@
|
|
1
|
+
<%= pb_rails("title", props: { text: "Patient Profile", tag: "h4", size: 4, margin_bottom: "sm" }) %>
|
2
|
+
|
3
|
+
<%= pb_rails("flex") do %>
|
4
|
+
<%= pb_rails("flex", props: {orientation: "column", margin_right: "lg" }) do %>
|
5
|
+
|
6
|
+
<%= pb_rails("label_value", props: {
|
7
|
+
variant: "details",
|
8
|
+
label: "Age",
|
9
|
+
icon: "user",
|
10
|
+
title: "24 yrs old",
|
11
|
+
padding_bottom: "sm"
|
12
|
+
}) %>
|
13
|
+
<%= pb_rails("label_value", props: {
|
14
|
+
variant: "details",
|
15
|
+
label: "Weight",
|
16
|
+
icon: "weight",
|
17
|
+
title: "91 kg",
|
18
|
+
}) %>
|
19
|
+
|
20
|
+
<% end %>
|
21
|
+
<%= pb_rails("flex", props: {orientation: "column"}) do %>
|
22
|
+
|
23
|
+
<%= pb_rails("label_value", props: {
|
24
|
+
variant: "details",
|
25
|
+
label: "Blood",
|
26
|
+
icon: "tint",
|
27
|
+
title: "A +",
|
28
|
+
padding_bottom: "sm"
|
29
|
+
}) %>
|
30
|
+
<%= pb_rails("label_value", props: {
|
31
|
+
variant: "details",
|
32
|
+
label: "Height",
|
33
|
+
icon: "arrows-v",
|
34
|
+
title: "187 cm",
|
35
|
+
}) %>
|
36
|
+
|
37
|
+
<% end %>
|
38
|
+
<% end %>
|
39
|
+
|
40
|
+
<br><br><br>
|
41
|
+
|
42
|
+
<%= pb_rails("title", props: { text: "Workout Schedule", tag: "h4", size: 4, margin_bottom: "sm" }) %>
|
43
|
+
|
44
|
+
<%= pb_rails("label_value", props: {
|
45
|
+
variant: "details",
|
46
|
+
label: "Chest",
|
47
|
+
icon: "dumbbell",
|
48
|
+
description: "6 sets • 8 reps • 40-100 kg",
|
49
|
+
title: "Bench Press",
|
50
|
+
padding_bottom: "sm",
|
51
|
+
active: true
|
52
|
+
}) %>
|
53
|
+
|
54
|
+
<%= pb_rails("label_value", props: {
|
55
|
+
variant: "details",
|
56
|
+
label: "Biceps",
|
57
|
+
icon: "dumbbell",
|
58
|
+
description: "5 sets • 12 reps • 20-40 kg",
|
59
|
+
title: "Barbell Curl",
|
60
|
+
padding_bottom: "sm",
|
61
|
+
active: true
|
62
|
+
}) %>
|
63
|
+
|
64
|
+
<%= pb_rails("label_value", props: {
|
65
|
+
variant: "details",
|
66
|
+
label: "Back",
|
67
|
+
icon: "dumbbell",
|
68
|
+
description: "8 sets • 8 reps • 40-120 kg",
|
69
|
+
title: "Back Squat",
|
70
|
+
padding_bottom: "sm",
|
71
|
+
active: true
|
72
|
+
}) %>
|