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.

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

[#779] Add some layout primitives (stack) #781

Merged
merged 6 commits into from
Dec 11, 2023

Conversation

planktonic
Copy link
Member

@planktonic planktonic commented May 22, 2023

Part of #779

Changes

  • Stack component CSS
  • Adds a Stack JS component, stories, and docs to go with it

📸 Looks like

Screenshot 2023-05-22 at 16 28 35

How to QA

👀 Visual changes

  • git fetch
  • git checkout feature/779-add-some-layout-primitives
  • yarn
  • yarn storybook
  • navigate to atoms/ component

Check:

  • The documentation for this component is correct, understandable, and up-to-date.

👾 Code changes

Check:

  • The documentation for this component is correct, understandable, and up-to-date.
  • The component makes good use of CSS custom properties to simplify creating variants (or doesn’t have variants).
  • Everything that should be a variable, is.

Preflight checks

  • Storybook documentation has been updated
  • Fixtures in test/scss/ have been updated
  • Your changes have been added to the unreleased section of CHANGELOG.md

@planktonic planktonic marked this pull request as ready for review May 22, 2023 14:52
@planktonic planktonic changed the title [#779] Add some layout primitives [#779] Add some layout primitives (stack) May 23, 2023
Base automatically changed from feature/769-refactor-getters-for-design-tokens to main June 7, 2023 14:43
@planktonic planktonic force-pushed the feature/779-add-some-layout-primitives branch from 6f104cb to e31f5cb Compare June 7, 2023 15:00
@ArinzeJeffrey-droid
Copy link
Contributor

How is this different from a-content?

@planktonic
Copy link
Member Author

How is this different from a-content?

@ArinzeJeffrey-droid the content atom is for restricting the width of the element, and applying padding at the sides. The stack atom doesn’t do that, it applies vertical space between each child element (it looks like it “applies space below each child element”, but technically it’s above). Both could be used together, and would probably be great for a main layout area! Perhaps we should add some docs for the layout primitives — I’ve added an issue for that: #791

@planktonic planktonic force-pushed the feature/779-add-some-layout-primitives branch from e31f5cb to 3ba5ac2 Compare December 11, 2023 10:31
@planktonic planktonic merged commit 304140e into main Dec 11, 2023
1 check passed
@planktonic planktonic deleted the feature/779-add-some-layout-primitives branch December 11, 2023 10:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants