Avatars
Avatars are used to represent users.
Avatars house an image that represent the user (profile picture or user's initials).
Image avatars are used to represent pros and customers, if they have a profile image.
1. Body: The image that represents the user.
max-width: 64px
max-height: 64px
2. Customer app only - When a pro is favorited, the status will be represented by a heart.
max-width: 14px
max-height: 14px
Default Avatars are used when a pro does not have a profile picture.
1. Body
max-width: 64px
max-height: 64px
background-color: blue-light
2. Status: When a pro is favorited, the status will be represented by a heart.
max-width: 14px
max-height: 14px
Default Avatars are used when a customer does not have a profile picture.
1. Customer Initials (a-text-avatar)
font-size: 24px
font-weight: book
font-color: text-black
2. Body
max-width: 64px
max-height: 64px
background-color: slate-light
Booking avatars are used in card-bookings to represent the service. The icon in the avatar will correspond with the service and will take on the two-tone styling.
1. Body
max-width: 64px
max-height: 64px
background-color: blue-light
Last modified 3yr ago