Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Avatar: css variable to adjust round corner #7651

Closed
3 tasks done
Tracked by #7180
yannikmesserli opened this issue Sep 1, 2023 · 5 comments
Closed
3 tasks done
Tracked by #7180

Avatar: css variable to adjust round corner #7651

yannikmesserli opened this issue Sep 1, 2023 · 5 comments
Assignees
@geospatialem @DitwanP
Labels
4 - verified Issues that have been released and confirmed resolved. ArcGIS Urban Issues logged by ArcGIS Urban team members. calcite-components Issues specific to the @esri/calcite-components package. calcite-components-react Issues specific to the @esri/calcite-components-react package. design-tokens Issues requiring design tokens. enhancement Issues tied to a new feature or request. estimate - 3 A day or two of work, likely requires updates to tests. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive p - high Issue should be addressed in the current milestone, impacts component or core functionality
Milestone
2024-09-30 - 2.13...

Comments

@yannikmesserli
Copy link

Check existing issues

Description

Add a css variable to set the border radius of the avatar so that developer can adjust it to their need

Acceptance Criteria

border radius is settable using css varaible

Relevant Info

No response

Which Component

Calcite Avatar

Example Use Case

Urban is using the avatar to display user's avatar or initial. We would like to have it square in our search results:
image-2023-07-03-21-05-15-851

Priority impact

p4 - not time sensitive

Calcite package

  • @esri/calcite-components
  • @esri/calcite-components-react

Esri team

ArcGIS Urban
@yannikmesserli yannikmesserli added 0 - new New issues that need assignment. enhancement Issues tied to a new feature or request. needs triage Planning workflow - pending design/dev review. labels Sep 1, 2023
@github-actions github-actions bot added calcite-components Issues specific to the @esri/calcite-components package. calcite-components-react Issues specific to the @esri/calcite-components-react package. ArcGIS Urban Issues logged by ArcGIS Urban team members. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive labels Sep 1, 2023
@macandcheese
Copy link
Contributor

This should be addressed with #7180

@macandcheese macandcheese added the design-tokens Issues requiring design tokens. label Sep 5, 2023
@geospatialem geospatialem mentioned this issue Dec 21, 2023
Open
@geospatialem geospatialem added this to the 2024-07-30 - Jul Release milestone Jun 25, 2024
@geospatialem geospatialem self-assigned this Jun 25, 2024
@geospatialem geospatialem added 1 - assigned Issues that are assigned to a sprint and a team member. and removed 0 - new New issues that need assignment. needs triage Planning workflow - pending design/dev review. labels Jun 25, 2024
@geospatialem
Copy link
Member

This is part of the design token epic mentioned here, will verify once implemented.

@alisonailea alisonailea mentioned this issue Sep 12, 2024
Merged
@geospatialem geospatialem added 2 - in development Issues that are actively being worked on. and removed 1 - assigned Issues that are assigned to a sprint and a team member. labels Sep 13, 2024
@geospatialem geospatialem added the estimate - 3 A day or two of work, likely requires updates to tests. label Sep 13, 2024
@geospatialem geospatialem added the p - high Issue should be addressed in the current milestone, impacts component or core functionality label Sep 13, 2024
@alisonailea
Copy link
Contributor

--calcite-avatar-corner-radius has been added to #10280

alisonailea added a commit that referenced this issue Sep 20, 2024
@alisonailea
feat(avatar): add component tokens (#10280)
f8f881b 
**Related Issue:** #7180 #7651 #4900

## Summary

### Tokens

--calcite-avatar-corner-radius: defines the corner radius of the
component.
--calcite-avatar-color: defines the icon or initial color in the
component.
--calcite-avatar-background-color: defines the background color of the
component.
@alisonailea alisonailea added 3 - installed Issues that have been merged to master branch and are ready for final confirmation. and removed 2 - in development Issues that are actively being worked on. labels Sep 20, 2024
@github-actions github-actions bot assigned geospatialem and DitwanP and unassigned alisonailea Sep 20, 2024
@github-actions GitHub Actions
Copy link
Contributor

Installed and assigned for verification.

@DitwanP
Copy link
Contributor

DitwanP commented Sep 20, 2024

🍠 Verified locally on dev
image

@DitwanP DitwanP closed this as completed Sep 20, 2024
@DitwanP DitwanP added 4 - verified Issues that have been released and confirmed resolved. and removed 3 - installed Issues that have been merged to master branch and are ready for final confirmation. labels Sep 20, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@geospatialem geospatialem

@DitwanP DitwanP

Labels
4 - verified Issues that have been released and confirmed resolved. ArcGIS Urban Issues logged by ArcGIS Urban team members. calcite-components Issues specific to the @esri/calcite-components package. calcite-components-react Issues specific to the @esri/calcite-components-react package. design-tokens Issues requiring design tokens. enhancement Issues tied to a new feature or request. estimate - 3 A day or two of work, likely requires updates to tests. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive p - high Issue should be addressed in the current milestone, impacts component or core functionality
Projects
None yet
Milestone
2024-09-30 - 2.13.0 Sep Main release
Development

No branches or pull requests
5 participants
@yannikmesserli @alisonailea @macandcheese @geospatialem @DitwanP