feat(list, list-item, list-item-group, filter)!: add scales, update padding and spacing, update font sizes #10853
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
github-actions
bot
added
the
enhancement
…adding from the content and custom-content divs in favor of setting those per scale on the content-container.
…e the inline padding with a flex gap instead.
…content-container, removing actions-content-container
…m and large according to design specs
…to the actions-start container because we don't want there to be extra padding to account for when there's no slotted start action. Also adding left padding rules for drag-handle with no selection and with border appearance and no drag handle
…hese rules need to always take precedence over others that conflict since drag handles are always rendered first on the left.
…lharper/7100-list-scale-and-updates
…same order as the Figma summary
…es that map to Aaron's logic
…order when the content-bottom slot is being used
…n. not sure why this was also applied to content-bottom because it doesn't seem to affect it
jcfranco
approved these changes
Nov 27, 2024
There was a problem hiding this comment.
Aside from a few comments, this is looking great! I'll defer to @ashetland for the visual review.
@eriklharper LMK if this needs another review.
packages/calcite-components/src/components/list-item/list-item.tsx
Outdated
Show resolved
Hide resolved
packages/calcite-components/src/components/list-item-group/list-item-group.tsx
Show resolved
Hide resolved
packages/calcite-components/src/components/list-item-group/list-item-group.scss
Show resolved
Hide resolved
eriklharper
changed the title
eriklharper
changed the title
eriklharper
added
the
pr ready for visual snapshots
geospatialem
modified the milestones:
2024-12-17 - Dec Milestone,
2024-11-26 - 3.0.0 Nov Breaking Change Milestone
driskull
reviewed
Dec 2, 2024
packages/calcite-components/src/components/list-item-group/list-item-group.tsx
Show resolved
Hide resolved
|
@eriklharper I also noticed if you change the scale on the list it isn't updating the child items. There should be something in |
Good call, this is something that should be supported. I can get on that issue today, it should be just a matter of setting it up to watch the changes on |
6 tasks
This was referenced Dec 2, 2024
benelan
pushed a commit
that referenced
this pull request
Feb 8, 2025
…adding and spacing, update font sizes (#10853) **Related Issue:** #7100 ## Summary This PR adds scales, updates padding and spacing and updates font sizes based on the latest designs for `calcite-list-item`, `calcite-list-item-group`, `calcite-list` and `calcite-filter`. BREAKING CHANGE: The spacing changes affect content in the `actions-start` slot in addition to other rendered elements. Some styling updates may need to be applied to slotted actions or other adjustments based on the new scales. --------- Co-authored-by: JC Franco <[email protected]>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Related Issue: #7100
Summary
This PR adds scales, updates padding and spacing and updates font sizes based on the latest designs for
calcite-list-item,calcite-list-item-group,calcite-listandcalcite-filter.BREAKING CHANGE: The spacing changes affect content in the
actions-startslot in addition to other rendered elements. Some styling updates may need to be applied to slotted actions or other adjustments based on the new scales.