Skip to content

Commit d058085

Browse files
committed
Fix invalid icon HTML in AMP templates
1 parent a1b5f38 commit d058085

File tree

7 files changed

+70
-8
lines changed

7 files changed

+70
-8
lines changed

CHANGELOG.md

+1
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22

33
## Draft
44
- Update bigcommerce.com footer link [#990](https://github.com/bigcommerce/cornerstone/pull/990)
5+
- Fix invalid icon HTML in AMP templates [#989](https://github.com/bigcommerce/cornerstone/pull/989)
56

67
## 1.6.3 (2017-03-28)
78
- `stencil.conf.js` was refactored to support webpack2 builds [961](https://github.com/bigcommerce/cornerstone/pull/961)
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<div class="alertBox alertBox--error">
2+
<div class="alertBox-column alertBox-icon">
3+
<span class="icon" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"></path></svg></span>
4+
</div>
5+
<p class="alertBox-column alertBox-message">
6+
<span>{{{this}}}</span>
7+
</p>
8+
</div>
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<div class="alertBox alertBox--success">
2+
<div class="alertBox-column alertBox-icon">
3+
<span class="icon" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"></path></svg></span>
4+
</div>
5+
<p class="alertBox-column alertBox-message">
6+
<span>{{{this}}}</span>
7+
</p>
8+
</div>

templates/components/amp/common/navigation-menu.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
{{#if currency_selector.currencies.length '>' 1}}
2121
<li class="navPages-item">
2222
<a class="navPages-action has-subMenu" href="#" data-collapsible="navPages-currency" aria-controls="navPages-currency" aria-expanded="false">
23-
{{lang 'common.currency' code=currency_selector.active_currency_code}} <i class="icon navPages-action-moreIcon" aria-hidden="true"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-chevron-down"></use></svg></i>
23+
{{lang 'common.currency' code=currency_selector.active_currency_code}} <span class="icon navPages-action-moreIcon" aria-hidden="true"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-chevron-down"></use></svg></span>
2424
</a>
2525
<div class="navPage-subMenu" id="navPages-currency" aria-hidden="true" tabindex="-1">
2626
<ul class="navPage-subMenu-list">
@@ -57,7 +57,7 @@
5757
{{#if customer}}
5858
<li class="navPages-item">
5959
<a class="navPages-action has-subMenu" href="{{urls.account.index}}" data-collapsible="navPages-account">
60-
{{lang 'common.account'}} <i class="icon navPages-action-moreIcon" aria-hidden="true"><svg><use xlink:href="#icon-chevron-down" /></svg></i>
60+
{{lang 'common.account'}} <span class="icon navPages-action-moreIcon" aria-hidden="true"><svg><use xlink:href="#icon-chevron-down" /></svg></span>
6161
</a>
6262
<div class="navPage-subMenu" id="navPages-account" aria-hidden="true" tabindex="-1">
6363
<ul class="navPage-subMenu-list">

templates/components/amp/common/paginator.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
{{#if previous}}
44
<li class="pagination-item pagination-item--previous">
55
<a class="pagination-link" href="{{previous}}" {{#unless reload}}data-faceted-search-facet{{/unless}}>
6-
<i class="icon" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"/></svg></i>
6+
<span class="icon" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"/></svg></span>
77
{{lang 'common.previous'}}
88
</a>
99
</li>
@@ -24,7 +24,7 @@
2424
<li class="pagination-item pagination-item--next">
2525
<a class="pagination-link" href="{{next}}" {{#unless reload}}data-faceted-search-facet{{/unless}}>
2626
{{lang 'common.next'}}
27-
<i class="icon" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/></svg></i>
27+
<span class="icon" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/></svg></span>
2828
</a>
2929
</li>
3030
{{/if}}

templates/components/amp/css/product.html

+45
Original file line numberDiff line numberDiff line change
@@ -167,3 +167,48 @@
167167
content: "\A";
168168
white-space: pre;
169169
}
170+
171+
.alertBox {
172+
margin-bottom: .78571rem;
173+
padding: .78571rem 1.14286rem;
174+
background-color: #e8e8e8;
175+
border-radius: 4px
176+
}
177+
178+
.alertBox .icon {
179+
height:1.42857rem;
180+
width:1.42857rem
181+
}
182+
183+
.alertBox--success {
184+
background-color:#d5ffd8;
185+
border-color:#d5ffd8;
186+
}
187+
188+
.alertBox--success svg {
189+
fill:#69d66f
190+
}
191+
192+
.alertBox--error{
193+
background-color:#fdd;
194+
border-color:#fdd
195+
}
196+
197+
.alertBox--error svg {
198+
fill:#ff7d7d
199+
}
200+
201+
.alertBox-column{
202+
display:table-cell;
203+
vertical-align:middle
204+
}
205+
206+
.alertBox-icon{
207+
text-align: center;
208+
padding-right: 1.14286rem
209+
}
210+
211+
.alertBox-message {
212+
margin: 0;
213+
width: 100%
214+
}

templates/components/amp/products/product-view.html

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
<div class="productView">
22
{{#each product.reviews.messages}}
33
{{#if error}}
4-
{{>components/common/alert-error error}}
4+
{{>components/amp/common/alert-error error}}
55
{{/if}}
66
{{#if success}}
7-
{{>components/common/alert-success success}}
7+
{{>components/amp/common/alert-success success}}
88
{{/if}}
99
{{/each}}
1010

@@ -43,9 +43,9 @@
4343
{{/or}}
4444
{{#if product.out_of_stock}}
4545
{{#if product.out_of_stock_message}}
46-
{{>components/common/alert-error product.out_of_stock_message}}
46+
{{>components/amp/common/alert-error product.out_of_stock_message}}
4747
{{else}}
48-
{{>components/common/alert-error (lang 'products.sold_out')}}
48+
{{>components/amp/common/alert-error (lang 'products.sold_out')}}
4949
{{/if}}
5050
{{/if}}
5151
</div>

0 commit comments

Comments
 (0)