Now that you understand class components and JSX, implement the header component by following the next steps:
- Create a new folder called /src/components/common/Header.
- Create a new file called /src/components/common/Header/Header.css.
- Write the following CSS in Header.css:
.app-header { height: 200px; border-bottom: 1px solid black; } .app-header::after { content: ""; height: 200px; opacity: 0.5; background: url('../../../assets/herobg.jpg'); background-position: center; background-repeat: no-repeat; background-size: cover; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: -1; } .app-logo { height: 80px; margin-left: 50px; } .app-slogan { font-family: 'Comic Sans MS', 'Comic Sans', cursive; font-weight: ...