@YaikaRace
Posted
Hi vince congratulations on completing the notification page!
I see that you use Tailwind and that you set the colors using arbitrary values, I am not an expert, but, I recommend you to adjust your Tailwind configuration file to add the color palette that comes in the style guide and other custom properties you want to add to not repeat the color every time you want to use it, for example instead of putting
text-['hsl(224, 21%, 14%)']
you could configure your tailwind.config.js file like this:
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./src/**/*.{html,js}"],
theme: {
colors: {
'very-dark-blue': 'hsl(224, 21%, 14%)'
}
extend: {},
},
plugins: [],
}
so that the color is reusable and in your html file it would look like this:
<h1 class="text-very-dark-blue">Notifications</h1>
and your code will be more readable for people who want to view and/or edit it! This is what I can recommend you, I hope it has been helpful!
Here are some links to documentation that might be useful for you: https://tailwindcss.com/docs/adding-custom-styles https://tailwindcss.com/docs/customizing-colors
Marked as helpful
@vincemarq01
Posted
@YaikaRace ohh this is what I'm looking for. thank you very much yaika