Shop page--Choose Fit/Size

[wcampbell91]

Browse Sweatpants--Buttons

User Story

When the user visits the page I should see checkboxes within the sweatpants product cards to choose fit and size before clicking the buy button.

AC

WHEN The user visits the page THEN they should see product cards for each sweatpant AND there should be two dropdown boxes for choosing both size and fit

Dev Notes

• TODO

  Match Style Guide

  within your sweatpants array, add a key for fit and a key for size. These should both be arrays themselves that will have various fits and sizes available to the user.

  sweatpants = [
      {
        name: 'name',
        gender: 'gender',
        price: 12,
        fit: ['skinny', 'athletic', 'stretch'],
        size: [ 'S', 'M', 'L']
      }
  ]

add drop boxes using bootstrap

<div class="dropdown">
  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropdown button
  </button>
  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
    <a class="dropdown-item" href="#">Action</a>
    <a class="dropdown-item" href="#">Another action</a>
    <a class="dropdown-item" href="#">Something else here</a>
  </div>
</div>