# Projects #2

### Component Structure

* **PR2 COMPONENT**: The main container for the portfolio items, setting the visual and functional context.
* **PR2 CONTAINER**: Organizes the portfolio items within a user-friendly layout.
* **PR2 CURSOR & ICON**: Custom cursor elements that enhance the interactive experience, changing in appearance based on user actions.
* **PR2 ITEM**: Individual project display blocks containing images, titles, and interactive elements.

### Animation and Interaction Details

* **PR2 - Item Hover**: Engages users with scale animations and font size adjustments for project titles upon hover, visually emphasizing the hovered item.

### Events

1. **CURSOR - MOUSEENTER** : Triggers the custom cursor's appearance within the project container, ensuring it's visible and ready for interaction.
2. **CURSOR - MOUSELEAVE**: Hides the custom cursor and optionally modifies its scale when the user's mouse leaves the project container, ensuring the cursor is only visible during direct interaction.
3. **CURSOR - MOUSEMOVE** : Moves the custom cursor in accordance with the user's mouse movements, providing a fluid and responsive interaction within the project container.
4. **TOGGLE CLASS - MOUSEENTER**: Applies a class to project items upon mouse entry, highlighting the current item for a more dynamic interaction.
5. **TOGGLE CLASS - MOUSELEAVE** : Removes a specified class from project items when the cursor leaves, reverting them to their default state and visually indicating they are no longer the focus of interaction.
6. **CURSOR - SET**: Sets the initial state of the custom cursor to hidden upon page load, ensuring it appears only during specific interactions for a cleaner user experience.
