Projects #1

Component Structure

  • PR1 COMPONENT (section): Applies pr1__section for vertical centering and full viewport height.

  • PR1 CONTAINER (container): Holds project items, marked with pr1__container.

  • PR1 WRAPPER (block): Groups project items using pr1__wrapper.

  • PR1 ITEM (block): Displays individual projects. Styled with pr1__item for padding, border, and hover interaction.

  • PR1 HEADING (heading): Project title in H2, styled with pr1__headline.

  • PR1 IMAGE (image): Project image with pr1__image, positioned absolutely to the right.

Animation Structure

PR1 - HOVER: Activated on hover over .pr1__item:

  • Scales .pr1__image.

  • Changes .pr1__item background color.

  • Shifts .pr1__headline to the right.

Last updated