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

calcite tab icon coloring support #10497

Closed
2 of 6 tasks
sam11927 opened this issue Oct 7, 2024 · 3 comments
Closed
2 of 6 tasks

calcite tab icon coloring support #10497

sam11927 opened this issue Oct 7, 2024 · 3 comments
Assignees
@geospatialem @DitwanP
Labels
4 - verified Issues that have been released and confirmed resolved. ArcGIS Map Viewer Issues logged by ArcGIS Map Viewer team members. calcite-components Issues specific to the @esri/calcite-components package. design-tokens Issues requiring design tokens. enhancement Issues tied to a new feature or request. estimate - 2 Small fix or update, may require updates to tests. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive p - low Issue is non core or affecting less that 10% of people using the library
Milestone
2024-11-26 - 3.0....

Comments

@sam11927
Copy link

sam11927 commented Oct 7, 2024

Check existing issues

Description

It would be great if the iconStart and iconEnd properties for the calcite tab-title both had different css tokens so that they could be colored differently.

Acceptance Criteria

Should be able to create a tab title with a start and end icon with different colors.

Relevant Info

No response

Which Component

calcite-tab-title

Example Use Case

image

Priority impact

impact - p3 - not time sensitive

Calcite package

  • @esri/calcite-components
  • @esri/calcite-components-angular
  • @esri/calcite-components-react
  • @esri/calcite-design-tokens
  • @esri/eslint-plugin-calcite-components

Esri team

ArcGIS Map Viewer
@sam11927 sam11927 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 Oct 7, 2024
@github-actions github-actions bot added ArcGIS Map Viewer Issues logged by ArcGIS Map Viewer team members. calcite-components Issues specific to the @esri/calcite-components package. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive labels Oct 7, 2024
@geospatialem geospatialem added design-tokens Issues requiring design tokens. p - low Issue is non core or affecting less that 10% of people using the library estimate - 2 Small fix or update, may require updates to tests. needs milestone Planning workflow - pending milestone assignment, has priority and/or estimate. and removed needs triage Planning workflow - pending design/dev review. labels Oct 7, 2024
@geospatialem geospatialem added 2 - in development Issues that are actively being worked on. and removed 0 - new New issues that need assignment. needs milestone Planning workflow - pending milestone assignment, has priority and/or estimate. labels Oct 9, 2024
@jcfranco jcfranco mentioned this issue Oct 18, 2024
Open
@jcfranco
Copy link
Member

@geospatialem We'll have to push this to the November milestone. I missed that #10358 needs to land before the tabs component tokens can be installed. I still have to make some follow-up changes to the PR, but it's very close.

@jcfranco jcfranco mentioned this issue Nov 25, 2024
Merged
jcfranco added a commit that referenced this issue Nov 27, 2024
@jcfranco
feat(tab-title): add icon start/end custom CSS prop (#10871)
c988ad1 
**Related Issue:** #10497 

## Summary

Adds the following component tokens (CSS props):

```scss
--calcite-tab-icon-color-end – Specifies the component's `iconEnd` color. Fallback to `--calcite-icon-color`.
--calcite-tab-icon-color-start – Specifies the component's `iconStart` color. Fallback to `--calcite-icon-color`.
```
@jcfranco jcfranco 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 Nov 27, 2024
@github-actions github-actions bot assigned geospatialem and DitwanP and unassigned jcfranco Nov 27, 2024
@github-actions GitHub Actions
Copy link
Contributor

Installed and assigned for verification.

@geospatialem geospatialem 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 Nov 27, 2024
@geospatialem
Copy link
Member

Verified in 3.0.0-next.36 with the tab tokens:

.holiday {
  --calcite-tab-icon-color-start: Chartreuse;
  --calcite-tab-icon-color-end: Crimson;
}

image

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 Map Viewer Issues logged by ArcGIS Map Viewer team members. calcite-components Issues specific to the @esri/calcite-components package. design-tokens Issues requiring design tokens. enhancement Issues tied to a new feature or request. estimate - 2 Small fix or update, may require updates to tests. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive p - low Issue is non core or affecting less that 10% of people using the library
Projects
None yet
Milestone
2024-11-26 - 3.0.0 Nov Breaking Chang...
Development

No branches or pull requests
4 participants
@jcfranco @geospatialem @DitwanP @sam11927