playbook_ui 5.0.3 → 5.1.0.pre.alpha1
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/index.js +4 -0
- data/app/pb_kits/playbook/pb_filter/templates/_default.html.erb +1 -1
- data/app/pb_kits/playbook/pb_popover/_popover.html.erb +2 -2
- data/app/pb_kits/playbook/pb_popover/_popover.jsx +3 -3
- data/app/pb_kits/playbook/pb_popover/_popover.scss +21 -19
- data/app/pb_kits/playbook/pb_popover/index.js +1 -6
- data/app/pb_kits/playbook/tokens/index.scss +12 -0
- data/lib/playbook/version.rb +1 -1
- data/lib/tasks/pb_release.rake +3 -0
- metadata +5 -72
- data/app/assets/images/clark.jpg +0 -0
- data/app/assets/images/giant.jpg +0 -0
- data/app/assets/images/pb-caret.svg +0 -1
- data/app/assets/images/pb-check.svg +0 -11
- data/app/assets/images/pb.logo.svg +0 -28
- data/app/controllers/playbook/application_controller.rb +0 -13
- data/app/controllers/playbook/guides_controller.rb +0 -11
- data/app/controllers/playbook/pages_controller.rb +0 -79
- data/app/controllers/playbook/samples_controller.rb +0 -40
- data/app/pb_kits/playbook/config/_kit_example.html.erb +0 -9
- data/app/pb_kits/playbook/config/_kit_samples_list.html.erb +0 -3
- data/app/pb_kits/playbook/config/_kit_ui.html.erb +0 -40
- data/app/pb_kits/playbook/config/_pb_kit_api.html.erb +0 -18
- data/app/pb_kits/playbook/data/menu.yml +0 -93
- data/app/pb_kits/playbook/packs/application.js +0 -55
- data/app/pb_kits/playbook/packs/examples.js +0 -174
- data/app/pb_kits/playbook/packs/main.scss +0 -12
- data/app/pb_kits/playbook/packs/samples.js +0 -19
- data/app/pb_kits/playbook/packs/site_styles/_samples.scss +0 -72
- data/app/pb_kits/playbook/packs/site_styles/_scaffold.scss +0 -43
- data/app/pb_kits/playbook/packs/site_styles/_site-style.scss +0 -135
- data/app/pb_kits/playbook/packs/site_styles/docs/_all.scss +0 -9
- data/app/pb_kits/playbook/packs/site_styles/docs/_code_snippet.scss +0 -531
- data/app/pb_kits/playbook/packs/site_styles/docs/_color_utilities.scss +0 -92
- data/app/pb_kits/playbook/packs/site_styles/docs/_flex_examples.scss +0 -15
- data/app/pb_kits/playbook/packs/site_styles/docs/_kit_doc.scss +0 -190
- data/app/pb_kits/playbook/packs/site_styles/docs/_kits_examples.scss +0 -18
- data/app/pb_kits/playbook/packs/site_styles/docs/_markdown.scss +0 -82
- data/app/pb_kits/playbook/packs/site_styles/docs/_spacing_tokens.scss +0 -72
- data/app/views/layouts/playbook/_mobile_hamburger.html.erb +0 -2
- data/app/views/layouts/playbook/_nav.html.erb +0 -13
- data/app/views/layouts/playbook/_sidebar.html.erb +0 -52
- data/app/views/layouts/playbook/application.html.slim +0 -22
- data/app/views/layouts/playbook/fullscreen.html.slim +0 -10
- data/app/views/layouts/playbook/grid.html.slim +0 -10
- data/app/views/layouts/playbook/samples.html.erb +0 -18
- data/app/views/playbook/guides/create_kit/_file_naming.html.md +0 -2
- data/app/views/playbook/guides/create_kit/_generator.html.md +0 -6
- data/app/views/playbook/guides/create_kit/_kit_examples.html.md +0 -2
- data/app/views/playbook/guides/create_kit/_kit_rails.html.md +0 -2
- data/app/views/playbook/guides/create_kit/_kit_react.html.md +0 -2
- data/app/views/playbook/guides/create_kit/_layout.html.md +0 -2
- data/app/views/playbook/guides/create_kit/_view_objects.html.md +0 -2
- data/app/views/playbook/guides/create_kit/_writing_sass.md +0 -10
- data/app/views/playbook/guides/create_kit.html.slim +0 -16
- data/app/views/playbook/guides/use_nitro/_local.html.md +0 -2
- data/app/views/playbook/guides/use_nitro/_nitro_components.html.md +0 -2
- data/app/views/playbook/guides/use_nitro/_versions.html.md +0 -2
- data/app/views/playbook/guides/use_nitro.html.slim +0 -6
- data/app/views/playbook/pages/fullscreen.html.slim +0 -10
- data/app/views/playbook/pages/grid.html.slim +0 -2
- data/app/views/playbook/pages/home.html.slim +0 -4
- data/app/views/playbook/pages/kit_category_show.html.erb +0 -14
- data/app/views/playbook/pages/kit_show.html.erb +0 -33
- data/app/views/playbook/pages/kits.html.erb +0 -12
- data/app/views/playbook/pages/principals/_getting_started.html.md +0 -30
- data/app/views/playbook/pages/principles.html.slim +0 -3
- data/app/views/playbook/pages/tokens/_pb_doc_spacing.html.slim +0 -17
- data/app/views/playbook/pages/tokens.html.slim +0 -15
- data/app/views/playbook/pages/utilities/_pb_doc_color.html.slim +0 -15
- data/app/views/playbook/pages/utilities.html.slim +0 -116
- data/app/views/playbook/samples/dashboards/index.html.erb +0 -81
- data/app/views/playbook/samples/dashboards/index.jsx +0 -130
- data/app/views/playbook/samples/filter_table/index.html.erb +0 -348
- data/app/views/playbook/samples/filter_table/index.jsx +0 -433
- data/app/views/playbook/samples/registration/index.html.erb +0 -316
- data/app/views/playbook/samples/registration/index.jsx +0 -476
- data/app/views/playbook/samples/sample_show.html.erb +0 -36
@@ -1,316 +0,0 @@
|
|
1
|
-
<%= pb_rails("layout", props: {position: "left", size: "lg", collapse: "sm"}) do %>
|
2
|
-
<%= pb_rails("layout/sidebar") do %>
|
3
|
-
<%= pb_rails("flex", props: {orientation: "column", horizontal: "center", padding: "md"}) do %>
|
4
|
-
<%= pb_rails("flex/flex_item") do %>
|
5
|
-
<%= pb_rails("title", props: { text: "Design Expo", tag: "h2", size: 3 }) %>
|
6
|
-
<% end %>
|
7
|
-
<%= pb_rails("flex/flex_item") do %>
|
8
|
-
<%= pb_rails("body", props: {
|
9
|
-
text: "Annual Conference*",
|
10
|
-
color: "light"
|
11
|
-
}) %>
|
12
|
-
<% end %>
|
13
|
-
<% end %>
|
14
|
-
|
15
|
-
<%= pb_rails("section_separator") %>
|
16
|
-
<%= pb_rails("flex", props: {orientation: "column", padding: "md"}) do %>
|
17
|
-
<%= pb_rails("flex/flex_item") do %>
|
18
|
-
<%= pb_rails("title", props: { text: "Regions", tag: "h4", size: 4, padding_bottom: "sm" }) %>
|
19
|
-
<% end %>
|
20
|
-
|
21
|
-
<%= pb_rails("flex", props: {orientation: "column"}) do %>
|
22
|
-
<%= pb_rails("body", props: {classname: "flex-item"}) do %>
|
23
|
-
<%= pb_rails("checkbox" , props: {
|
24
|
-
text: "North America",
|
25
|
-
value: "checkbox-value",
|
26
|
-
checked: true,
|
27
|
-
name: "checkbox-name",
|
28
|
-
padding_left: "sm",
|
29
|
-
padding_bottom: "sm"
|
30
|
-
}) %>
|
31
|
-
<% end %>
|
32
|
-
<%= pb_rails("body", props: {classname: "flex-item"}) do %>
|
33
|
-
<%= pb_rails("checkbox" , props: {
|
34
|
-
text: "Europe",
|
35
|
-
value: "checkbox-value",
|
36
|
-
checked: true,
|
37
|
-
name: "checkbox-name",
|
38
|
-
padding_left: "sm",
|
39
|
-
padding_bottom: "sm"
|
40
|
-
}) %>
|
41
|
-
<% end %>
|
42
|
-
<% end %>
|
43
|
-
|
44
|
-
|
45
|
-
<%= pb_rails("title", props: { text: "Total Registered", tag: "h4", size: 4, padding_y: "sm" }) %>
|
46
|
-
|
47
|
-
<%= pb_rails("table", props: { size: "sm", disable_hover: true, padding_bottom: "xs" }) do %>
|
48
|
-
<thead>
|
49
|
-
<tr>
|
50
|
-
<th>Conference</th>
|
51
|
-
<th>Total #</th>
|
52
|
-
</tr>
|
53
|
-
</thead>
|
54
|
-
<tbody>
|
55
|
-
<tr>
|
56
|
-
<td>2020 | SF</td>
|
57
|
-
<td>2,391</td>
|
58
|
-
</tr>
|
59
|
-
<tr>
|
60
|
-
<td>2020 | TOR</td>
|
61
|
-
<td>3,829</td>
|
62
|
-
</tr>
|
63
|
-
<tr>
|
64
|
-
<td>2019 | AMS</td>
|
65
|
-
<td>2,047</td>
|
66
|
-
</tr>
|
67
|
-
<tr>
|
68
|
-
<td>2018 | SF</td>
|
69
|
-
<td>1,824</td>
|
70
|
-
</tr>
|
71
|
-
<tr>
|
72
|
-
<td>2017 | LA</td>
|
73
|
-
<td>719</td>
|
74
|
-
</tr>
|
75
|
-
<tr>
|
76
|
-
<td>2017 | LDN</td>
|
77
|
-
<td>491</td>
|
78
|
-
</tr>
|
79
|
-
</tbody>
|
80
|
-
<% end %>
|
81
|
-
<%= pb_rails("caption", props: { text: "*This dashboard includes the last six conferences", size: 'xs' }) %>
|
82
|
-
<% end %>
|
83
|
-
|
84
|
-
<% end %>
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
<%= pb_rails("layout/body", props: { padding: "xl" }) do %>
|
89
|
-
|
90
|
-
<%= pb_rails("title", props: { text: "Registration Dashboard", tag: "h1", size: 3, padding_bottom: "lg" }) %>
|
91
|
-
|
92
|
-
|
93
|
-
<%= pb_rails("flex") do %>
|
94
|
-
<%= pb_rails("flex/flex_item", props: {fixed_size: "60%", padding_right: "lg"}) do %>
|
95
|
-
<%= pb_rails("card") do %>
|
96
|
-
<%= pb_rails("flex", props: {vertical: "bottom", spacing: "around", padding_bottom: "md"}) do %>
|
97
|
-
<%= pb_rails("flex/flex_item") do %>
|
98
|
-
<%= pb_rails("flex", props: {orientation: "column", horizontal: "center"}) do %>
|
99
|
-
<%= pb_rails("flex/flex_item") do %>
|
100
|
-
<%= pb_rails("caption", props: { text: "2020 | SF", size: "xs" }) %>
|
101
|
-
<% end %>
|
102
|
-
<%= pb_rails("flex/flex_item") do %>
|
103
|
-
<%= pb_rails("caption", props: { text: "Total Registered" }) %>
|
104
|
-
<% end %>
|
105
|
-
<%= pb_rails("flex/flex_item") do %>
|
106
|
-
<%= pb_rails("title", props: { text: "2,391", tag: "h3", size: 2 }) %>
|
107
|
-
<% end %>
|
108
|
-
<% end %>
|
109
|
-
<% end %>
|
110
|
-
<%= pb_rails("section_separator", props: { orientation: "vertical" }) %>
|
111
|
-
<%= pb_rails("flex/flex_item") do %>
|
112
|
-
<%= pb_rails("flex", props: {orientation: "column", horizontal: "center"}) do %>
|
113
|
-
<%= pb_rails("flex/flex_item") do %>
|
114
|
-
<%= pb_rails("caption", props: { text: "Graphic" }) %>
|
115
|
-
<% end %>
|
116
|
-
<%= pb_rails("flex/flex_item") do %>
|
117
|
-
<%= pb_rails("title", props: { text: "353", tag: "h3", size: 3 }) %>
|
118
|
-
<% end %>
|
119
|
-
<% end %>
|
120
|
-
<% end %>
|
121
|
-
<%= pb_rails("flex/flex_item") do %>
|
122
|
-
<%= pb_rails("flex", props: {orientation: "column", horizontal: "center"}) do %>
|
123
|
-
<%= pb_rails("flex/flex_item") do %>
|
124
|
-
<%= pb_rails("caption", props: { text: "UX/UI" }) %>
|
125
|
-
<% end %>
|
126
|
-
<%= pb_rails("flex/flex_item") do %>
|
127
|
-
<%= pb_rails("title", props: { text: "254", tag: "h3", size: 3 }) %>
|
128
|
-
<% end %>
|
129
|
-
<% end %>
|
130
|
-
<% end %>
|
131
|
-
<%= pb_rails("flex/flex_item") do %>
|
132
|
-
<%= pb_rails("flex", props: {orientation: "column", horizontal: "center"}) do %>
|
133
|
-
<%= pb_rails("flex/flex_item") do %>
|
134
|
-
<%= pb_rails("caption", props: { text: "Product" }) %>
|
135
|
-
<% end %>
|
136
|
-
<%= pb_rails("flex/flex_item") do %>
|
137
|
-
<%= pb_rails("title", props: { text: "194", tag: "h3", size: 3 }) %>
|
138
|
-
<% end %>
|
139
|
-
<% end %>
|
140
|
-
<% end %>
|
141
|
-
<% end %>
|
142
|
-
<%= pb_rails("section_separator") %>
|
143
|
-
<%= pb_rails("flex", props: {vertical: "bottom", spacing: "around", padding_top: "sm"}) do %>
|
144
|
-
<%= pb_rails("flex/flex_item") do %>
|
145
|
-
<%= pb_rails("flex", props: {orientation: "column", horizontal: "center"}) do %>
|
146
|
-
<%= pb_rails("flex/flex_item") do %>
|
147
|
-
<%= pb_rails("caption", props: { text: "2020 | TOR", size: "xs" }) %>
|
148
|
-
<% end %>
|
149
|
-
<%= pb_rails("flex/flex_item") do %>
|
150
|
-
<%= pb_rails("caption", props: { text: "Total Registered" }) %>
|
151
|
-
<% end %>
|
152
|
-
<%= pb_rails("flex/flex_item") do %>
|
153
|
-
<%= pb_rails("title", props: { text: "3,829", tag: "h3", size: 2 }) %>
|
154
|
-
<% end %>
|
155
|
-
<% end %>
|
156
|
-
<% end %>
|
157
|
-
<%= pb_rails("flex/flex_item") do %>
|
158
|
-
<%= pb_rails("section_separator", props: { orientation: "vertical" }) %>
|
159
|
-
<% end %>
|
160
|
-
<%= pb_rails("flex/flex_item") do %>
|
161
|
-
<%= pb_rails("flex", props: {orientation: "column", horizontal: "center"}) do %>
|
162
|
-
<%= pb_rails("flex/flex_item") do %>
|
163
|
-
<%= pb_rails("caption", props: { text: "Graphic" }) %>
|
164
|
-
<% end %>
|
165
|
-
<%= pb_rails("flex/flex_item") do %>
|
166
|
-
<%= pb_rails("title", props: { text: "937", tag: "h3", size: 3 }) %>
|
167
|
-
<% end %>
|
168
|
-
<% end %>
|
169
|
-
<% end %>
|
170
|
-
<%= pb_rails("flex/flex_item") do %>
|
171
|
-
<%= pb_rails("flex", props: {orientation: "column", horizontal: "center"}) do %>
|
172
|
-
<%= pb_rails("flex/flex_item") do %>
|
173
|
-
<%= pb_rails("caption", props: { text: "UX/UI" }) %>
|
174
|
-
<% end %>
|
175
|
-
<%= pb_rails("flex/flex_item") do %>
|
176
|
-
<%= pb_rails("title", props: { text: "721", tag: "h3", size: 3 }) %>
|
177
|
-
<% end %>
|
178
|
-
<% end %>
|
179
|
-
<% end %>
|
180
|
-
<%= pb_rails("flex/flex_item") do %>
|
181
|
-
<%= pb_rails("flex", props: {orientation: "column", horizontal: "center"}) do %>
|
182
|
-
<%= pb_rails("flex/flex_item") do %>
|
183
|
-
<%= pb_rails("caption", props: { text: "Product" }) %>
|
184
|
-
<% end %>
|
185
|
-
<%= pb_rails("flex/flex_item") do %>
|
186
|
-
<%= pb_rails("title", props: { text: "628", tag: "h3", size: 3 }) %>
|
187
|
-
<% end %>
|
188
|
-
<% end %>
|
189
|
-
<% end %>
|
190
|
-
<% end %>
|
191
|
-
<% end %>
|
192
|
-
|
193
|
-
<%= pb_rails("flex", props: {orientation: "column", horizontal: "right", padding_bottom: "md"}) do %>
|
194
|
-
<%= pb_rails("flex/flex_item") do %>
|
195
|
-
<%= pb_rails("button", props: { text: "View full breakdown", variant: "link" }) %>
|
196
|
-
<% end %>
|
197
|
-
<% end %>
|
198
|
-
|
199
|
-
<%= pb_rails("card") do %>
|
200
|
-
<% data = [{
|
201
|
-
name: '2020 | SF',
|
202
|
-
data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175]
|
203
|
-
}, {
|
204
|
-
name: '2020 | TOR',
|
205
|
-
data: [24916, 24064, 29742, 29851, 32490, 30282, 38121, 40434]
|
206
|
-
}, {
|
207
|
-
name: '2019 | AMS',
|
208
|
-
data: [11744, 17722, 16005, 19771, 20185, 24377, 32147, 39387]
|
209
|
-
}, {
|
210
|
-
name: '2018 | SF',
|
211
|
-
data: [nil, nil, 7988, 12169, 15112, 22452, 34400, 34227]
|
212
|
-
}, {
|
213
|
-
name: '2017 | LA',
|
214
|
-
data: [12908, 5948, 8105, 11248, 8989, 11816, 18274, 18111]
|
215
|
-
}] %>
|
216
|
-
|
217
|
-
<%= pb_rails("line_graph", props: {
|
218
|
-
id: "line-registration",
|
219
|
-
gradient: false,
|
220
|
-
chart_data: data,
|
221
|
-
x_axis_categories:['7 wks away','6 wks away','5 wks away','4 wks away','3 wks away','2 wks away','1 wk away','Start of event'],
|
222
|
-
title: 'Running Total',
|
223
|
-
axis_title: 'Total Registration',
|
224
|
-
legend: true,
|
225
|
-
height: '80%'
|
226
|
-
}) %>
|
227
|
-
<% end %>
|
228
|
-
<% end %>
|
229
|
-
|
230
|
-
|
231
|
-
|
232
|
-
<%= pb_rails("flex/flex_item", props: {fixed_size: "40%"}) do %>
|
233
|
-
<%= pb_rails("card") do %>
|
234
|
-
<% total = [{
|
235
|
-
name: 'Registrations',
|
236
|
-
data: [1475, 524, 1344, 780, 200, 900]
|
237
|
-
}] %>
|
238
|
-
<%= pb_rails("bar_graph", props: {
|
239
|
-
axis_title: 'Total Registered',
|
240
|
-
chart_data: total,
|
241
|
-
id: "total-attendees",
|
242
|
-
y_axis_min: 0,
|
243
|
-
x_axis_categories:['\'17 LDN', '\'17 LA', '\'18 SF', '\'19 AMS', '\'20 TOR', '\'20 SF'],
|
244
|
-
height: '30%'
|
245
|
-
}) %>
|
246
|
-
|
247
|
-
<% new_attendees = [{
|
248
|
-
name: 'Registrations',
|
249
|
-
data: [1475, 524, 1344, 780, 200, 900]
|
250
|
-
}] %>
|
251
|
-
<%= pb_rails("bar_graph", props: {
|
252
|
-
axis_title: 'New Attendees',
|
253
|
-
chart_data: new_attendees,
|
254
|
-
id: "new-attendees",
|
255
|
-
y_axis_min: 0,
|
256
|
-
x_axis_categories:['\'17 LDN', '\'17 LA', '\'18 SF', '\'19 AMS', '\'20 TOR', '\'20 SF'],
|
257
|
-
height: '30%'
|
258
|
-
}) %>
|
259
|
-
|
260
|
-
<% repeating_attendees = [{
|
261
|
-
name: 'Registrations',
|
262
|
-
data: [1475, 524, 1344, 780, 200, 900]
|
263
|
-
}] %>
|
264
|
-
<%= pb_rails("bar_graph", props: {
|
265
|
-
axis_title: 'Repeating Attendees',
|
266
|
-
chart_data: repeating_attendees,
|
267
|
-
id: "repeating-attendees",
|
268
|
-
y_axis_min: 0,
|
269
|
-
x_axis_categories:['\'17 LDN', '\'17 LA', '\'18 SF', '\'19 AMS', '\'20 TOR', '\'20 SF'],
|
270
|
-
height: '30%'
|
271
|
-
}) %>
|
272
|
-
|
273
|
-
<% graphic_designers = [{
|
274
|
-
name: 'Registrations',
|
275
|
-
data: [1475, 524, 1344, 780, 200, 900]
|
276
|
-
}] %>
|
277
|
-
<%= pb_rails("bar_graph", props: {
|
278
|
-
axis_title: 'Graphic Designers',
|
279
|
-
chart_data: graphic_designers,
|
280
|
-
id: "graphic-designers",
|
281
|
-
y_axis_min: 0,
|
282
|
-
x_axis_categories:['\'17 LDN', '\'17 LA', '\'18 SF', '\'19 AMS', '\'20 TOR', '\'20 SF'],
|
283
|
-
height: '30%'
|
284
|
-
}) %>
|
285
|
-
|
286
|
-
<% ux_ui = [{
|
287
|
-
name: 'Registrations',
|
288
|
-
data: [1475, 524, 1344, 780, 200, 900]
|
289
|
-
}] %>
|
290
|
-
<%= pb_rails("bar_graph", props: {
|
291
|
-
axis_title: 'UX/UI',
|
292
|
-
chart_data: ux_ui,
|
293
|
-
id: "ux-ui",
|
294
|
-
y_axis_min: 0,
|
295
|
-
x_axis_categories:['\'17 LDN', '\'17 LA', '\'18 SF', '\'19 AMS', '\'20 TOR', '\'20 SF'],
|
296
|
-
height: '30%'
|
297
|
-
}) %>
|
298
|
-
|
299
|
-
<% product_designers = [{
|
300
|
-
name: 'Registrations',
|
301
|
-
data: [1475, 524, 1344, 780, 200, 900]
|
302
|
-
}] %>
|
303
|
-
<%= pb_rails("bar_graph", props: {
|
304
|
-
axis_title: 'Product Designers',
|
305
|
-
chart_data: product_designers,
|
306
|
-
id: "product-designers",
|
307
|
-
y_axis_min: 0,
|
308
|
-
x_axis_categories:['\'17 LDN', '\'17 LA', '\'18 SF', '\'19 AMS', '\'20 TOR', '\'20 SF'],
|
309
|
-
height: '30%'
|
310
|
-
}) %>
|
311
|
-
|
312
|
-
<% end %>
|
313
|
-
<% end %>
|
314
|
-
<% end %>
|
315
|
-
<% end %>
|
316
|
-
<% end %>
|