Web Design System: I understood the assignment

I am trying to finish up both the front end and the Web Dev. strands and I finally got to thes design a Web Design System project. The project sort of states go ahead and throw the kitchen sink at it with everything you’ve learnt. So like guac :avocado: at that famous burrito spot: I went extra.

I did this all with HTML and CSS even though this would have been much quicker to ecode this using Bootstrap but… actually … that wasn’t the assignment but heck if I don’t love what Bootstrap let’s you do even more.

Looked up what full grown front end UX UI developers do in the wild and they honestly plan for everything you could possibly ever use in a website down to radio buttons and calendars. I didn’t go that granular but this is what I came up with:

This is what it looks like rendered:
Web Design System: Styles

Web Design System: Website Mock Up

Did it all in the Codecademy Workspace so you can view my code here

But I’m going to push it to my GitHub so you can see all the deets there.

Let me know what I can do to make this better. I could probably do with a refactor and implement some other variables to make it more succinct TBH.

2 Likes

That’s pretty cool! :partying_face:

One small thing, the comments box is layered over the second para of the blog post at the bottom.

1 Like

I noticed that too… But when I opened it full screen the box was fine ?? I wondered if it was my browser or not. . Ill look into it.