Foreign Affairs Style Guide
Foreign Affairs
styleguide
› components
Cart modal
The global cart modal.
Data Sources:
Item title
selector:
.cart-item__title
data_source:
allItems.items[i].title
comments:
The title of the item.
Item total
selector:
.cart-item__quantity
data_source:
allItems.items[i].quantity
comments:
The amount of the item that will be purchased
Item price
selector:
.cart-item__content
data_source:
allItems.items[i].price
comments:
The unit price of the item.
Item total
selector:
.cart-item__content
data_source:
itemTotal
comments:
The total price.
Footer title
selector:
.cart-footer__title
data_source:
TBD
comments:
The title for the footer.
Footer content
selector:
data_source:
TBD
comments:
The content of the footer, should include a link. Straight markup.
Footer disclaimer
selector:
.cart-footer__disclaimer-copy
data_source:
TBD
comments:
The disclaimer content in the footer of the modal.
Your Cart
Quantity*
Unit Price
Item Total
Broken BRICs
12
$4.95
$59.4
x
The Rise of Rwanda's Women
1
$5.95
$5.95
x
Update Cart
Order Total
$65.35
Subscribe Now Headline and Save 55% TK TK because of X, Y, and Z.
Add subscription for just $48
Close