Skip to content

[Panel] action-bar slot should have the same background color as header #6865

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
Closed
macandcheese opened this issue Apr 26, 2023 · 6 comments
Closed

[Panel] action-bar slot should have the same background color as header #6865

macandcheese opened this issue Apr 26, 2023 · 6 comments
Assignees
@geospatialem
Labels
4 - verified Issues that have been tested, confirmed as mitigated, and are ready to close. Calcite (design) Issues logged by Calcite designers. enhancement Issues tied to a new feature or request. estimate - 1 Very small fix or change (potentially a single line), doesn't require updates to tests. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive
Milestone
2023 May Priorities

Comments

@macandcheese
Copy link
Contributor

macandcheese commented Apr 26, 2023 •
edited
Loading

Description

Since Action Bar are not full width - they can show the Panel background behind, leading to undesired appearance:

Screen Shot 2023-04-26 at 12 11 47 PM

Acceptance Criteria

I'd expect the slot to have a container with background that matched that of header, to better match the default color of action bg:

Screen Shot 2023-04-26 at 12 11 14 PM

Relevant Info

No response

Which Component

Panel

Example Use Case

No response

Priority impact

p4 - not time sensitive

Esri team

Calcite (design)
@macandcheese macandcheese added enhancement Issues tied to a new feature or request. 0 - new New issues that need assignment. needs triage Planning workflow - pending design/dev review. labels Apr 26, 2023
@github-actions github-actions bot added Calcite (design) Issues logged by Calcite designers. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive labels Apr 26, 2023
@jcfranco jcfranco added the estimate - 1 Very small fix or change (potentially a single line), doesn't require updates to tests. label Apr 27, 2023
@driskull
Copy link
Member

Seems like the action bar should always be full width when slotted here right?

@macandcheese
Copy link
Contributor Author

Yeah, that would also solve 👍

@driskull
Copy link
Member

driskull commented May 3, 2023

@macandcheese do you have a codepen for this one? I think it could be fixed?

@geospatialem
Copy link
Member

@driskull I observed it when expand-disabled is true and few actions are added: https://codepen.io/geospatialem/pen/LYgOOPK.

Possibly associated with the container?

driskull added a commit that referenced this issue May 3, 2023
@driskull
fix(action-bar): Set background color on action-bar. #6865
f90d575
@driskull driskull self-assigned this May 3, 2023
@driskull driskull added 1 - assigned Issues that are assigned to a sprint and a team member. and removed 0 - new New issues that need assignment. labels May 3, 2023
@driskull driskull mentioned this issue May 3, 2023
Merged
driskull added a commit that referenced this issue May 4, 2023
@driskull
fix(action-bar): Set background color on action-bar (#6917)
0062cbf 
**Related Issue:** #6865

## Summary

- Removes `transparent` bg color on action-bar.
- Adds screenshot test.
@driskull driskull added 3 - installed Issues that have been merged to the "dev" branch and/or are ready for QA/QC. and removed 1 - assigned Issues that are assigned to a sprint and a team member. labels May 4, 2023
@github-actions
Copy link
Contributor

github-actions bot commented May 4, 2023

Installed and assigned for verification.

@geospatialem geospatialem added this to the 2023 May Priorities milestone May 4, 2023
@geospatialem geospatialem added 4 - verified Issues that have been tested, confirmed as mitigated, and are ready to close. and removed needs triage Planning workflow - pending design/dev review. 3 - installed Issues that have been merged to the "dev" branch and/or are ready for QA/QC. labels May 4, 2023
@geospatialem
Copy link
Member

Verified in 1.4.0-next.8 with panel and flow.

image

image

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

@geospatialem geospatialem

Labels
4 - verified Issues that have been tested, confirmed as mitigated, and are ready to close. Calcite (design) Issues logged by Calcite designers. enhancement Issues tied to a new feature or request. estimate - 1 Very small fix or change (potentially a single line), doesn't require updates to tests. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive
Projects
None yet
Milestone
2023 May Priorities
Development

No branches or pull requests
4 participants
@jcfranco @driskull @macandcheese @geospatialem