feat(avatar): add styles for default (round) shape in ionic theme (#29550)

Issue number: internal

---------

## What is the current behavior?
Avatar does not have styles for the `"round"` shape in the ionic theme.

## What is the new behavior?
- Adds the styles for the default (round) shape (border radius)
- Adds e2e test for the round shape
- Updates the screenshots for the avatar `size` due to the new default
shape

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

## Other information

[Preview](https://ionic-framework-git-rou-10738-ionic1.vercel.app/src/components/avatar/test/shape?ionic:theme=ionic)
This commit is contained in:
Brandy Carney
2024-05-28 13:25:54 -04:00
committed by GitHub
parent 01c1b4fef2
commit d4971581cc
63 changed files with 159 additions and 6 deletions

View File

@ -210,14 +210,14 @@ export declare interface IonApp extends Components.IonApp {}
@ProxyCmp({
inputs: ['mode', 'size', 'theme']
inputs: ['mode', 'shape', 'size', 'theme']
})
@Component({
selector: 'ion-avatar',
changeDetection: ChangeDetectionStrategy.OnPush,
template: '<ng-content></ng-content>',
// eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
inputs: ['mode', 'size', 'theme'],
inputs: ['mode', 'shape', 'size', 'theme'],
})
export class IonAvatar {
protected el: HTMLElement;

View File

@ -290,14 +290,14 @@ export declare interface IonApp extends Components.IonApp {}
@ProxyCmp({
defineCustomElementFn: defineIonAvatar,
inputs: ['mode', 'size', 'theme']
inputs: ['mode', 'shape', 'size', 'theme']
})
@Component({
selector: 'ion-avatar',
changeDetection: ChangeDetectionStrategy.OnPush,
template: '<ng-content></ng-content>',
// eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
inputs: ['mode', 'size', 'theme'],
inputs: ['mode', 'shape', 'size', 'theme'],
standalone: true
})
export class IonAvatar {