Exercise8 #12
Exercise8 #12
Conversation
There was a problem hiding this comment.
Hey @Systems-Development-and-Frameworks/dirty_thirties you received 5/5 ⭐ and even one 🚀 in this submission. Congrats!
I saw two tailwind PRs so far (including yours) and I tend to really like that it does not bloat the markup and the DOM with unnecessary <div>s for layouting purposes. 👍
Here's what I have for you:
⭐ For a header and it's responsiveness (direct links vs. hamburger menu)
⭐ For a content section and it's content items
⭐ For a responsive content section (3-column vs 1-column layout)
⭐ For responsive content items (1-column vs. 2-column layout)
⭐ For a footer
🚀 For a sidebar containing all the navigation links. The sidebar is revealed when the hamburger menu button is clicked and can be closed.
|
|
||
| The components directory contains your Vue.js Components. | ||
|
|
||
| _Nuxt.js doesn't supercharge these components._ |
There was a problem hiding this comment.
You could have done us a favour and rebased this change out of the diff 😉
| @@ -0,0 +1,33 @@ | |||
| <template> | |||
| <div class="flex flex-row px-2 lg:flex-col"> | |||
There was a problem hiding this comment.
You could have used semantic HTML here. E.g. <article>
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/article
| <nav | ||
| class="absolute inset-y-0 right-0 w-full max-w-md p-6 text-white bg-gray-800" | ||
| > | ||
| <a href="#" @click.prevent="close" class="inline-block mb-12"> |
There was a problem hiding this comment.
This should have better been a <button>. For accessibility, you could add aria-label: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute
Last one! :-)