FREELessons: 18Length: 2.4 hours

Next lesson playing in 5 seconds

  • Overview
  • Transcript

4.5 Quick Footer

Hey welcome to the last lesson in XD to code with Avocode three. This is just gonna be a super quick lesson, all we're doing is just adding in this footer. So just gonna add in one last div, it's gonna have the class name panel eight. We're gonna go into Avocode, use the select tool, right click this text here. And I know its gone off your screen but I'm gonna choose copy paragraph, and we'll paste in that paragraph with that copyright message. And now we'll add in the panel eight style. We're gonna set our text-align to center, so our text is centered. We're gonna set a little bit of padding around the inside of our panel. We'll just set it to use var spacing small, and then we'll also just add in our dark panel claaa. And that will take care of the color of the panel itself, as well as the color of the text. And that is it, that's everything, just go all the way down to the bottom. And then we have a nice footer, which because we've already set up the media queries that decrease the size of the variable that we use for our padding. That's already just instantly responsive and shrinks down as it needs to. So now let's come back up here, expand the panels that we commented out earlier. Just select the whole lot, and uncomment them. Now we can take a look at our handy work, so this is all done, all up and running, everything's fully coded, fully responsive. Look at our typography, we've got our images, everything is optimized and ready to go. So we've got just one more video in this course, in that video we're gonna have a quick summary of everything that we've stepped through in this course. Gonna be a bullet list of all of the key points. So whenever you need to remind yourself of some of the particulars that you picked up in this course, you can just watch this video and it'll help to jog your memory. So I hope you'll join me in the final video of this course. I'll see you there.

Back to the top