@beowulf1958
Posted
Congratulations on completing this challenge. It looks great and is responsive. Your project is also well organized with the folder structure. I do have a few suggestions.
First, the font is all wrong; it displays in the Chrome browser with a default serif font, but the design calls for a sans-serif called "Figtree". I notice that your project hosts the font locally in the "assets" folder, but there is no reference to it in the CSS. You need to call the font with an @font-face after the root in the CSS. Try this:
@font-face {
font-family: Figtree;
src: url(../fonts/Figtree-VariableFont_wght.ttf);
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: Figtree;
src:url(../fonts/Figtree-VariableFont_wght.ttf);
font-weight: bold;
font-style: normal;
}
Then you add the font-family to the body:
font-family: Figtree;
Also, the design calls for the h1 to change text color when you hover over it.
.text h1:hover
{
color: rgb(241, 198, 118);
}
Lastly, the "container" needs a dark box-shadow. If you google "box-shadow examples" there is a website with box-shadows you can copy. Hope this helps! And keep on coding.