This component is to show an image, a header, a search option, and a list of volunteer opportunities.
HTML
Create a div with the id "volunteer_list_page" to wrap all other elements
Inside the div:
Create an image with a placeholder image
Create an h1 element with the text "Volunteer" inside
Create a new div element to wrap up our search functionality with an id set to "volunteer_search" (Only create the div, do not create the search functionality. This will be done later. You can add text that says search just to clarify what it does)
Create a div element to wrap the individual volunteer component and add a class set to "volunteer_card"
Create two more of the same divs
CSS
Style the image
The image should be of width 100% and height of 50px (For now)
Style the h1
Use the text-align selector to center the h1 element
Style the Volunteer Card
Give the volunteer card a solid black border of 1px width
This component is to show an image, a header, a search option, and a list of volunteer opportunities.
HTML
Create a div with the id "volunteer_list_page" to wrap all other elements Inside the div:
CSS
Style the image
Style the h1
Style the Volunteer Card