Open SamPatt opened 8 months ago
I appreciate how you used CSS to have more consistent styling across your UI - all your elements look fairly aligned and neat.
I have found that using a combination of Tailwind and CSS extremely beneficial for elements that require specific styling like hover functionality:
.green:hover { color: rgb(2, 38, 2); background:rgb(74, 175, 91); } .red:hover { color: rgb(138, 9, 0); background:rgb(181, 83, 68); }
As the general dimension and display of that element already pre-exists within it's original element, adding a Tailwind tag can help make your CSS files more DRY. On the other hand, you are separating your styling for one element into two different documents so it could deter the feasibility in someone reviewing your code.
From experience I know all too well how challenging and time consuming it can be to get your web application responsive when using only CSS.
Maybe combine CSS with other libraries such as SASS or Tailwind. SASS is like writing JavaScript which helps a great deal when managing and organizing media queries using features like variables and mixins.
My group and I used it for the design of our Project 2 application and it helped with handling responsive design, maintainability and readability of the stylesheet. So I would suggest getting familiar with it and see if it's something you would want to use.
Here is a link to a youtube video I watched to learn SASS last unit : https://www.youtube.com/watch?v=_a5j7KoflTs
On our front end documentation page, our design was not responsive and the layout could be improved. These steps could have be made into components.
JSX snippet
CSS