- Organization and Readability: Well organized code using SCSS features mixins and variables
- Responsive Design: Ensured that the site looks great on various devices by implementing responsive design techniques, allowing for a seamless user experience across desktop and mobile.
- Overcoming Challenges: Using overlay for hover effects and z-index content.
- Responsive Design
- Media Queries: Implementing responsive design required careful planning and testing to ensure that the layout adapts well across various screen sizes. Faced difficulties in achieving the desired look and feel for both desktop and mobile views.
- JavaScript Functionality
- Menu Toggle: Implementing the mobile navigation toggle functionality presented challenges, particularly in ensuring that the menu overlays correctly and does not interfere with other elements on the page.
- Event Handling: Managing event listeners and ensuring they trigger the correct actions without causing any conflicts or unintended behavior might have been a learning curve.
- CSS Styling
- Z-Index Management: Managing the stacking order of elements, especially with fixed or absolute positioning, led to unexpected overlaps or visibility issues.