Skip to content

Add cover photo upload UI and enhance popover positioning#2677

Open
sazedul-haque wants to merge 4 commits into4.0.0-devfrom
cover-photo-change-option
Open

Add cover photo upload UI and enhance popover positioning#2677
sazedul-haque wants to merge 4 commits into4.0.0-devfrom
cover-photo-change-option

Conversation

@sazedul-haque
Copy link
Copy Markdown
Collaborator

No description provided.

Introduce left-top/left-bottom and right-top/right-bottom placement variants across TS and PHP. Update RTL mapping and placement resolution so side sub-positions flip correctly, and extend calculatePosition with cases for the new placements. Add convertViewportPositionToContentPosition, getFixedContainingBlock and createsFixedContainingBlock helpers to account for scaled/fixed containing blocks when converting viewport coordinates to element coordinates. PHP Popover updated: add new position constants, include them in allowed placements and mapping, and fix placement class/attribute formatting. These changes improve positioning accuracy for popovers inside transformed or container-type elements and enable more granular side placements.
Introduce cover photo support and refactor user photo handling. Added a new camera SVG and registered the icon in types and Icon.php. Updated settings.ts to unify upload/remove endpoints (uploadUserPhoto/removeUserPhoto), add separate mutations/handlers for cover and profile photos, and pass photo_type with requests. Updated account.php template to render a cover photo uploader, reposition the avatar and provide dedicated controls for editing/removing cover and profile photos. Added SCSS for cover photo styling, loading states, and adjusted avatar visuals and positioning.
@sazedul-haque sazedul-haque requested review from b-l-i-n-d and shewa12 May 7, 2026 11:40
@sazedul-haque sazedul-haque added the 4.0.0 Tutor v4.w0w label May 7, 2026
Introduce a medium tooltip variant across the codebase: add .tutor-tooltip-medium SCSS rules (max-width 226px, padding), add TOOLTIP_SIZES.MEDIUM and class handling in the tooltip TypeScript so the medium class is applied, and update the Tooltip PHP component to accept Size::MEDIUM and update the docblock. This ensures consistent frontend and backend support for a medium-sized tooltip.
Rearrange the cover photo action markup to move the edit button outside the popover content and attach the Alpine popover behavior to the content block. Add a Tooltip component (imported Tutor\Components\Tooltip) that renders a small info button with profile/cover size guidance. Update SCSS for .tutor-account-cover-photo-action to use tutor-flex and add spacing (gap) so the action buttons align correctly.
@include tutor-loading-spinner($tutor-surface-l1, $tutor-surface-l1-hover, 44px);

&::before {
z-index: 1;
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Use tokens

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

4.0.0 Tutor v4.w0w

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants