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

[Tile] apply center alignment to only x axis #9252

Closed
2 of 6 tasks
SkyeSeitz opened this issue May 3, 2024 · 2 comments
Closed
2 of 6 tasks

[Tile] apply center alignment to only x axis #9252

SkyeSeitz opened this issue May 3, 2024 · 2 comments
Assignees
@geospatialem @DitwanP
Labels
4 - verified Issues that have been released and confirmed resolved. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. Calcite (design) Issues logged by Calcite designers. 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 visual changes Issues with visual changes that are added for consistency, but are not backwards compatible

Comments

@SkyeSeitz
Copy link

SkyeSeitz commented May 3, 2024 •
edited by jcfranco
Loading

Check existing issues

Actual Behavior

alignment="center" middle aligns Tile's content on the y axis in addition to center aligning on the x axis causing misalignment of headers in Tile Group.
image

I am also seeing some off center Tiles on `alignment="center" (see codepen below)
image

Expected Behavior

alignment="center" only centers Tile's content on the x axis, but keeps it top aligned on the y axis.
image

Reproduction Sample

https://codepen.io/skyeseitz/pen/RwOzVoP?editors=1000

Reproduction Steps

See codepen provided.

Reproduction Version

2.8.0

Relevant Info

cc @eriklharper @ashetland @macandcheese

Regression?

No response

Priority impact

p4 - not time sensitive

Impact

No response

Calcite package

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

Esri team

Calcite (design)
@SkyeSeitz SkyeSeitz added bug Bug reports for broken functionality. Issues should include a reproduction of the bug. 0 - new New issues that need assignment. needs triage Planning workflow - pending design/dev review. labels May 3, 2024
@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 May 3, 2024
@eriklharper eriklharper self-assigned this May 6, 2024
@eriklharper eriklharper added 1 - assigned Issues that are assigned to a sprint and a team member. estimate - 1 Very small fix or change (potentially a single line), doesn't require updates to tests. and removed 0 - new New issues that need assignment. needs triage Planning workflow - pending design/dev review. labels May 6, 2024
@eriklharper eriklharper changed the title [Tile] apply center alignment to only y axis [Tile] apply center alignment to only x axis May 8, 2024
@eriklharper eriklharper mentioned this issue May 8, 2024
Merged
@eriklharper eriklharper added 2 - in development Issues that are actively being worked on. visual changes Issues with visual changes that are added for consistency, but are not backwards compatible and removed 1 - assigned Issues that are assigned to a sprint and a team member. labels May 8, 2024
eriklharper added a commit that referenced this issue May 10, 2024
@eriklharper @geospatialem
fix(tile): apply center alignment only to x-axis (#9288)
75df0ba 
**Related Issue:** #9252

## Summary

This PR fixes Tile's `alignment="center"` option to only horizontally
center the primary icon, heading and description.

<img width="1042" alt="image"
src="https://github.com/Esri/calcite-design-system/assets/821864/2c4f19f3-6497-47ea-af45-02f8fb07bfee">

---------

Co-authored-by: Kitty Hurley <khurley@esri.com>
@eriklharper eriklharper 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 May 17, 2024
@github-actions github-actions bot assigned geospatialem and DitwanP and unassigned eriklharper May 17, 2024
@github-actions GitHub Actions
Copy link
Contributor

Installed and assigned for verification.

@DitwanP
Copy link
Contributor

DitwanP commented May 21, 2024

🍭 Verified on 2.9.0-next.18

@DitwanP DitwanP closed this as completed May 21, 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 May 21, 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. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. Calcite (design) Issues logged by Calcite designers. 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 visual changes Issues with visual changes that are added for consistency, but are not backwards compatible
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@eriklharper @geospatialem @SkyeSeitz @DitwanP