Employee photo grid

[emilykdewitt]

User Story

As a user, when I visit the 'Taproom' page of the Kiss the Goat website, I should see a 4 photo grid of the 'brewmasters' with their information below each photo.

Acceptance Criteria

WHEN the 'Taproom' page of the Kiss the Goat website loads, THEN I should see a photo grid of the 'brewmasters' AND their information (name, hometown, favorite beers) should display below the photo

Development

• Create an array of employee information into the main.js file: ex.

  {
  name: 'Emily',
  hometown: 'Hartwell, Georgia',
  favorite beers: [Three Floyds, Wiseacre, Tiny Bomb],
  photo: 'emily.jpg'
  }

• Create an employeeCards div to taproom.html that the employee cards will print to
• Create employeeBuilder function that will create the domString to be printed to the DOM (we can't use one domStringBuilder function because we are making beer cards and employee cards)
• Create printToDom function that will print cards to the employeeCards div in the HTML document
• For now, the employee information (name, hometown, favorite beers) should be printed on the employee card below the photo - we will later create a function that hides or shows this text upon hover

[zoeames]

👍