Skip to content

fix(alert): add public --calcite-alert-offset-size css token #10872

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.

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

Merged
merged 4 commits into from
Nov 26, 2024

Conversation

aPreciado88
Copy link
Contributor

Related Issue: #10520

Summary

Rename internal --calcite-internal-alert-edge-distance css token to --calcite-alert-offset-size and make it public.

@github-actions github-actions bot added the bug Bug reports for broken functionality. Issues should include a reproduction of the bug. label Nov 25, 2024
@aPreciado88 aPreciado88 added the pr ready for visual snapshots Adding this label will run visual snapshot testing. label Nov 25, 2024
@jcfranco
Copy link
Member

@aPreciado88 Can you revisit the PR title to mention the prop that was added instead of focusing on exposing an internal prop?

@aPreciado88 aPreciado88 changed the title fix(alert): change internal css token to be public fix(alert): add public --calcite-alert-offset-size css token Nov 26, 2024
Copy link
Contributor

@alisonailea alisonailea left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚀

@@ -7,12 +7,12 @@
* @prop --calcite-alert-background-color: Specifies the component's background color.
* @prop --calcite-alert-corner-radius: Specifies the component's corner radius.
* @prop --calcite-alert-shadow: Specifies the component's shadow.
* @prop --calcite-alert-offset-size: Specifies the component's bottom spacing
Copy link
Contributor

@macandcheese macandcheese Nov 26, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we change this description to be a bit more descriptive now that the name is less specific? It may not be bottom spacing - it could be top, top-right, bottom, bottom-left, etc, depending on placement.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@macandcheese I can update this! What would be a more appropriate description?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

cc @geospatialem / @DitwanP but something like:

"Specifies the component's "placement" offset" or something?

@aPreciado88 aPreciado88 added pr ready for visual snapshots Adding this label will run visual snapshot testing. skip visual snapshots Pull requests that do not need visual regression testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. skip visual snapshots Pull requests that do not need visual regression testing. labels Nov 26, 2024
@aPreciado88
Copy link
Contributor Author

@ashetland @SkyeSeitz Could you please confirm that these are the usual chromatic false positives?

@@ -7,12 +7,12 @@
* @prop --calcite-alert-background-color: Specifies the component's background color.
* @prop --calcite-alert-corner-radius: Specifies the component's corner radius.
* @prop --calcite-alert-shadow: Specifies the component's shadow.
* @prop --calcite-alert-offset-size: Specifies the component's placement offset.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

+1 for Adam's comment.

WRT the styling, can you add backticks so the prop is displayed in our docs?

Suggested change
* @prop --calcite-alert-offset-size: Specifies the component's placement offset.
* @prop --calcite-alert-offset-size: Specifies the component's `placement` offset.

@aPreciado88 aPreciado88 added pr ready for visual snapshots Adding this label will run visual snapshot testing. skip visual snapshots Pull requests that do not need visual regression testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels Nov 26, 2024
@aPreciado88 aPreciado88 merged commit 4278981 into dev Nov 26, 2024
15 checks passed
@aPreciado88 aPreciado88 deleted the aPreciado88/10520-alert-token-rename branch November 26, 2024 23:19
benelan pushed a commit that referenced this pull request Feb 8, 2025
**Related Issue:**
[#10520](#10520)

## Summary
Rename internal `--calcite-internal-alert-edge-distance` css token to
`--calcite-alert-offset-size` and make it public.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Bug reports for broken functionality. Issues should include a reproduction of the bug. skip visual snapshots Pull requests that do not need visual regression testing.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants