Fylo data storage component using html and css only

Hi AbdulRhman👋 Great job on completing this challenge! 🥳

Overall, you did a good job. However, there are a few areas where you can improve your code to make it more efficient and maintainable:

• In the CSS, you have several long and specific selectors that could be simplified. For example, instead of using .logo ul li img, you could use .logo li img to target the images inside the list items within the logo element. This will make your styles easier to read and understand.

• In the HTML, you are using the alt attribute for the images, but the values are all empty. The alt attribute should describe the image for screen readers and other assistive technologies, so it's important to provide meaningful values for this attribute.

• It's generally a good practice to group related styles together in your CSS. For example, you could define all the styles for the logo element in one block, rather than having them scattered throughout the stylesheet. This will make your code easier to navigate and maintain.

For example:

.logo {
   width: 350px;
   height: 200px;
   background-color: var(--Dark-Blue);

   ul {
   display: flex;
   justify-content: space-between;
   }

   li {
   width: 50px;
   height: 50px;
   background-color: var(--Very-Dark-Blue);
   }
}

Hope I'm 👍helpful!

Keep up the good work!😊❤️