I'm proud I didn't spend decades on this design
What specific areas of your project would you like help with?I would like suggestions on how to make the 'button and 'a' tags sync
How analyse and create minimal components for integration.
Learning the concept of using modals in components
I was not able to hover the current day element bar to show different background color. Though it shows different background but the hover effect shows same background as other bars
I would like to get help on the layout of the page with css
Though I have the project running with the best I can, but I can't really tell if how I handled state with the components was right.
Also, the links with the next step button, I have a doubt if I am suppose to do it that way.
I know how to get media queries. But I have a challenge with declaring different media queries and using them on the same project.
Can someone help me with an explanation concerning declaring multiple media queries on CSS and using them in the same project to cover all devices for that project?
I'm proud I didn't spend decades on this design
What specific areas of your project would you like help with?I would like suggestions on how to make the 'button and 'a' tags sync
Hi @AlhassanMariam congratulation.
So I have noticed you have not added CSS
code for responsiveness. Try to learn about media queries to help you improve on your designs.
Hope this helps.
I am most proud of trying out Tailwind CSS for the first time, and I find it incredibly handy. I am glad that I decided to give it a try. If I were to do something differently next time, I would probably explore more advanced features within Tailwind CSS to further enhance my projects.
What challenges did you encounter, and how did you overcome them?When I first started using Tailwind CSS, I faced some challenges. Figuring out how it works, organizing my folders, extending styles with custom colors, and adding custom fonts were all new to me. To overcome these, I searched for better tutorials and resources. I followed the official Tailwind CSS documentation and also watched the crash course on JS Mastery YouTube channel. This experience not only helped me understand Tailwind CSS better but also improved how I organize my projects and style them.
What specific areas of your project would you like help with?I need help organizing my code for better readability and following best practices. I'm looking for guidance on how to structure my project effectively with Tailwind CSS or recommendations for the best resources to follow.
You're doing great; keep it up.
You can read more about semantic HTML on the web, from codecademy, but you may follow this structure as well.
<body>
<nav>
<--for your navigation(s)-->
</nav>
<main>
<section>
<--
some divs comes here
what section you want to put here.
maybe you slide frame-->
</section>
</main>
<footer>
<-- some sections and divs can come here
</footer>
</body>
First Challenge Will try to do on my own
What challenges did you encounter, and how did you overcome them?The layout was challenging. I didn't know I had to use flexbox
What specific areas of your project would you like help with?Flexbox and Bootstrap
Your project did not include Bootstrap file(s) but if you want include Bootstrap, consider using the CDN
or check out this link to learn more about
Bootstrap.
Also, make sure to use the style-guide.md
file that came with the project to define your CSS
file.
:root { --White: hsl(0, 0%, 100%); . . . }
I would start editing on mobile first.
What challenges did you encounter, and how did you overcome them?Centering was also difficult.
What specific areas of your project would you like help with?I have already solved this project.
Congratulations on your hard work!. However, I would like to give some suggestions.
Try to identify your codes with a class or id so you can target them in the CSS file.
In the CSS file, try to define your variables, especially the colors, using
`*{
--var-name: value;
}
`
You can get the colors as
selector-name { style-name: var(--var-name); }
Hello @JGedd
you can refer to my solution on GitHub concerning the JS
problem
Also, I have noticed that your site is not responsive to mobile views. Feel free to look at my solution and provide any comments you deem fit.
Happy coding.
It took me a little longer to solve the task, but I'm glad I started again.
What challenges did you encounter, and how did you overcome them?Maybe it's just that exact centering was difficult.
What specific areas of your project would you like help with?I solved the project alone, but afterwards I received useful advice.
Your solution looks great!
however, in the HTML, where you made <p class="bolder">...</p>
You could have used <h1>
or any to help you minimize your CSS code