Skip to content
This repository was archived by the owner on Nov 19, 2024. It is now read-only.

Commit 1654eee

Browse files
bdenhambdenham
committed
Updates to template and data
1 parent ed615a4 commit 1654eee

File tree

2 files changed

+145
-160
lines changed

2 files changed

+145
-160
lines changed

‎src/_data/roadmap.yml

Lines changed: 35 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,65 @@
1-
categories:
2-
- name: In progress
1+
roadmap:
2+
- name: In Progress
33
features:
44
- name: Framework updates (e.g. KnockoutJS, RequireJS, etc.)
5+
status: inProgress
6+
- name: GraphQL - Asynchronous orders
7+
status: inProgress
58
- name: GraphQL - Admin configuration
9+
status: inProgress
610
- name: GraphQL - Caching updates
11+
status: inProgress
712
- name: jQuery 3.6.x support
13+
status: inProgress
814
- name: OpenSearch 1.x support
15+
status: inProgress
916
- name: PayPal and Braintree updates
17+
status: inProgress
1018
- name: PHP 8.1 support
1119
- name: PWA - Global theming/styling
20+
status: inProgress
1221
- name: PWA - Custom product attributes
22+
status: inProgress
1323
- name: PWA - Performance optimizations
24+
status: inProgress
1425
- name: PWA - Shopping and cart improvements
26+
status: inProgress
1527
- name: Security and quality improvements
28+
status: inProgress
1629
- name: Vendor Bundled Extensions (VBEs) – Updates
30+
status: inProgress
1731
- name: Planned
1832
features:
1933
- name: Accelerated checkout powered by Bolt (extension)
2034
- name: Accessibility improvements for storefront/admin
35+
status: Planned
2136
- name: Framework updates (e.g. KnockoutJS, RequireJS, etc.)
37+
status: Planned
2238
- name: GraphQL - Personalization updates
39+
status: Planned
2340
- name: GraphQL - Page Builder improvements
41+
status: Planned
2442
- name: GraphQL - Inventory improvements
43+
status: Planned
2544
- name: Walmart Marketplace (extension)
45+
status: Planned
2646
- name: Page Builder - Mobile layout optimization
47+
status: Planned
2748
- name: Page Builder - Column grid layouts (viewports)
49+
status: Planned
2850
- name: Payment services (extension)
51+
status: Planned
2952
- name: PWA - Server-side rendering (SSR)
53+
status: Planned
3054
- name: PWA - Extensibility improvements (payment/ship)
55+
status: Planned
3156
- name: PWA - Bundle product type
57+
status: Planned
58+
- name: PWA - Staging and preview
59+
status: Planned
60+
- name: PWA - Bundle product type
61+
status: Planned
62+
- name: PWA - Live Search (Venia)
63+
status: Planned
3264
- name: Security and quality improvements
65+
status: Planned

‎src/_includes/roadmap.md

Lines changed: 110 additions & 158 deletions
Original file line numberDiff line numberDiff line change
@@ -1,179 +1,131 @@
1-
<!-- {% assign categories = include.data.categories %}
2-
{% if include.categories %}
3-
{% assign categories = include.data.categories | where: "name", include.categories %}
4-
{% endif %} -->
5-
6-
<!-- <table class="status-table">
7-
<tbody>
8-
<tr class="category-name">
9-
<th>In progress</th>
10-
<th>Planned</th>
11-
</tr>
12-
{% for categories in categories %}
13-
{% for categoryFeature in categories.features %}
14-
<tr class="category-feature">
15-
{% if categories.name == "In progress" %}
16-
<td>{{ categoryFeature.name }}</td>
17-
<td></td>
18-
{% elsif categories.name == "Planned" %}
19-
<td></td>
20-
<td>{{ categoryFeature.name }}</td>
21-
{% endif %}
22-
</tr>
23-
{% endfor %}
24-
{% endfor %}
25-
</tbody>
26-
</table> -->
27-
28-
<table class="status-table">
29-
<tbody>
30-
<tr class="category-name">
31-
<th>In progress</th>
32-
<th>Planned</th>
33-
</tr>
34-
<tr class="category-feature">
35-
<td>Framework updates (e.g. KnockoutJS, RequireJS, etc.)</td>
36-
<td>Accelerated checkout powered by Bolt (extension) <img src="{{ site.baseurl }}/common/images/Smock_Extension_18_N.svg"></td>
37-
</tr>
38-
<tr class="category-feature">
39-
<td>GraphQL - Admin configuration</td>
40-
<td>Accessibility improvements for storefront/admin</td>
41-
</tr>
42-
<tr class="category-feature">
43-
<td>GraphQL - Caching updates</td>
44-
<td>Framework updates (e.g. KnockoutJS, RequireJS, etc.)</td>
45-
</tr>
46-
<tr class="category-feature">
47-
<td>jQuery 3.6.x support</td>
48-
<td>GraphQL - Personalization updates</td>
49-
</tr>
50-
<tr class="category-feature">
51-
<td>OpenSearch 1.x support</td>
52-
<td>GraphQL - Page Builder improvements</td>
53-
</tr>
54-
<tr class="category-feature">
55-
<td>PayPal and Braintree updates <img src="{{ site.baseurl }}/common/images/Smock_Extension_18_N.svg"></td>
56-
<td>GraphQL - Inventory improvements</td>
57-
</tr>
58-
<tr class="category-feature">
59-
<td>PHP 8.1 support</td>
60-
<td>Page Builder - Mobile layout optimization</td>
61-
</tr>
62-
<tr class="category-feature">
63-
<td>PWA - Global theming/styling</td>
64-
<td>Page Builder - Column grid layouts (viewports)</td>
65-
</tr>
66-
<tr class="category-feature">
67-
<td>PWA - Custom product attributes</td>
68-
<td>Payment services (extension) <img src="{{ site.baseurl }}/common/images/Smock_Extension_18_N.svg"></td>
69-
</tr>
70-
<tr class="category-feature">
71-
<td>PWA - Performance optimizations</td>
72-
<td>PWA - Server-side rendering (SSR)</td>
73-
</tr>
74-
<tr class="category-feature">
75-
<td>PWA - Shopping and cart improvements</td>
76-
<td>PWA - Extensibility improvements (payment/ship)</td>
77-
</tr>
78-
<tr class="category-feature">
79-
<td>Security and quality improvements</td>
80-
<td>PWA - Bundle product type</td>
81-
</tr>
82-
<tr class="category-feature">
83-
<td>Vendor Bundled Extensions (VBEs) – Updates <img src="{{ site.baseurl }}/common/images/Smock_Extension_18_N.svg"></td>
84-
<td>Security and quality improvements</td>
85-
</tr>
86-
<tr class="category-feature">
87-
<td></td>
88-
<td>Walmart Marketplace (extension) <img src="{{ site.baseurl }}/common/images/Smock_Extension_18_N.svg"></td>
89-
</tr>
90-
</tbody>
91-
</table>
1+
{% assign roadmap = include.data.roadmap %}
2+
{% if include.roadmap %}
3+
{% assign roadmap = include.data.roadmap | where: "name", include.roadmap %}
4+
{% endif %}
925

936
![Extension icon]({{ site.baseurl }}/common/images/Smock_Extension_18_N.svg) Indicates extensions available on the Commerce Marketplace.
947

8+
<table class="roadmap-table">
9+
<tr class="roadmap-header">
10+
{% for roadmap in roadmap %}
11+
<th>{{roadmap.name}}</th>
12+
{% endfor %}
13+
</tr>
14+
<tr>
15+
{% for roadmap in roadmap %}
16+
<td class="table-container">
17+
<table class="inner-table">
18+
{% for roadmapFeature in roadmap.features %}
19+
<tr class="inner-row"><td class="inner-cell">{{ roadmapFeature.name }}</td></tr>
20+
{% endfor %}
21+
</table>
22+
</td>
23+
{% endfor %}
24+
</tr>
25+
</table>
26+
9527
<style>
96-
/***Table***/
9728

98-
.status-table {
99-
table-layout: fixed;
29+
/****************/
30+
/***— Tables —***/
31+
/****************/
32+
33+
/**
34+
* Main Table
35+
*/
36+
table.roadmap-table {
37+
padding: 0.5em;
38+
margin: 0;
39+
border: 1 solid #ddd;
10040
}
10141

102-
/***Rows***/
103-
104-
.category-feature {
105-
transition: all .2s;
106-
height: 26px;
42+
/**
43+
* Inner Tables
44+
*/
45+
table.roadmap-table tr td.table-container table.inner-table {
46+
padding: 0.5em;
47+
margin: 0;
48+
border: 0 solid #ddd;
10749
}
10850

109-
.category-feature:hover {
110-
background: rgba(20,115,230,10%);
51+
/*****************/
52+
/***— Headers —***/
53+
/*****************/
54+
55+
/**
56+
* Main Table Header
57+
*/
58+
table.roadmap-table tr.roadmap-header th {
59+
padding: .7rem;
60+
margin: 0;
61+
border: 1 solid #ddd;
62+
text-align: left;
63+
background-color: #f5f5f5;
64+
font-weight: bold;
65+
color: #333;
66+
font-size: 1rem;
11167
}
11268

113-
tbody tr.category-feature:last-child td {
114-
padding-bottom: 5px;
69+
/**************/
70+
/***— Rows —***/
71+
/**************/
72+
73+
/**
74+
* Main Table Row
75+
*/
76+
table.roadmap-table tr {
77+
padding: 0.7rem;
78+
margin-left: 1rem;
79+
border: 0 solid #ddd;
80+
border-collapse: collapse;
11581
}
11682

117-
/***Columns***/
118-
119-
.category-name th {
120-
padding: 10px;
121-
font-size: 14px !important;
122-
font-weight: bold;
123-
color: black;
124-
background-color: #f1f1f1;
83+
/**
84+
* Inner Table Rows
85+
*/
86+
table.roadmap-table tr td.table-container table.inner-table tr.inner-row {
87+
padding: 0.7rem;
88+
margin: 0;
89+
border-bottom: 1 solid #ddd;
90+
border-collapse: collapse;
12591
}
12692

127-
/*.category-name th:nth-child(1) {
128-
width: 100%;
93+
/***************/
94+
/***— Cells —***/
95+
/***************/
96+
97+
/**
98+
* Main Table Cell
99+
*/
100+
table.roadmap-table tr td.table-container {
101+
padding: 0;
102+
margin: 0;
103+
border: 0 solid #ddd;
104+
border-collapse: collapse;
129105
}
130106

131-
.category-name th:nth-child(2) {
132-
width: 90px;
133-
text-align: center;
134-
} */
135-
136-
/***Cells***/
137-
138-
.category-feature td {
139-
padding: 10px;
107+
/**
108+
* Inner Table Cell
109+
*/
110+
table.roadmap-table tr td.table-container table.inner-table tr.inner-row td.inner-cell {
111+
padding: 0.7rem;
112+
margin: 0;
113+
border: 0 solid #ddd;
114+
border-collapse: collapse;
115+
font-size: .9rem;
140116
}
141117

142-
/*.category-feature td:nth-child(2) {
143-
text-align: center;
144-
}*/
145-
146-
/***Icons***/
147-
148-
.status {
149-
height: 32px;
150-
font-size: 14px;
151-
font-weight: 400;
152-
}
153-
154-
.status::before {
155-
content: '';
156-
display: inline-block;
157-
width: 8px;
158-
height: 8px;
159-
border-radius: 50%;
160-
margin: 0 12px;
161-
}
162-
163-
.status.complete::before {
164-
background: rgb(45, 157, 120);
165-
}
166-
167-
.status.in-progress::before {
168-
background: rgb(230, 134, 25);
169-
}
170-
171-
.status.planned {
172-
font-style: italic;
173-
}
174-
175-
.status.planned::before {
176-
background: rgb(179, 179, 179);
177-
}
118+
/***************/
119+
/***— Icons —***/
120+
/***************/
121+
122+
.extension::before {
123+
content: '';
124+
display: inline-block;
125+
width: 8px;
126+
height: 8px;
127+
border-radius: 50%;
128+
margin: 0 12px;
129+
}
178130

179131
</style>

0 commit comments

Comments
 (0)