Skip to content

Commit

Permalink
fix(action-group): Honor flex-grow on slotted actions (#7690)
Browse files Browse the repository at this point in the history
**Related Issue:** #7687

## Summary

- Add flex grow to container
- Add screenshot test
  • Loading branch information
driskull authored Sep 6, 2023
1 parent df1d71b commit 0777234
Show file tree
Hide file tree
Showing 2 changed files with 12 additions and 1 deletion.
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
}

.container {
@apply flex flex-col;
@apply flex flex-col flex-grow;
}

:host([columns="1"]) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,17 @@ export default {
...storyFilters(),
};

export const honorsFlexGrow = (): string => html`<style>
calcite-action {
flex-grow: 1;
}
</style>
<calcite-action-group style="width:600px" layout="horizontal">
<calcite-action icon="bell" alignment="center"></calcite-action>
<calcite-action icon="biking" alignment="center"></calcite-action>
<calcite-action icon="bluetooth" alignment="center"></calcite-action>
</calcite-action-group>`;

export const gridCenteringOfActionsInAGroup = (): string => html`
<div style="width:400px">
<calcite-action-group layout="${select("layout", ["horizontal", "vertical", "grid"], "grid")}">
Expand Down

0 comments on commit 0777234

Please sign in to comment.