design-system icon indicating copy to clipboard operation
design-system copied to clipboard
verified publisher icon swisspost

[component]: Grid

Open Cian77 opened this issue 1 year ago • 1 comments

Description

Description

Open issues:

Design:

  • [ ] New font
  • [ ] Spacing

Tokens:

  • [ ] Typography tokens

Design

https://www.figma.com/design/JIT5AdGYqv6bDRpfBPV8XR/Foundations-%26-Components-Next-Level?node-id=26-51

Tokens

  • [ ] Tokens for this component are ready

Tasks

### 💻 Tasks
- [ ] Create a POC to discover any possible issues with the breakpoints and/or tokens
- [ ] CSS implementation
- [ ] Documentation in Storybook
- [ ] End to end tests
- [ ] Visual regression tests
- [ ] Design review

Cian77 avatar Jul 16 '24 07:07 Cian77

Should we copy over the bootstrap grid and use tokens to override the bootstrap vars? Should we do a custom implementation that is close enough to bootstrap for minimal breaking changes?

  • Could be challenging to merge the bootstrap styles/mixins with tokens
  • Copy bootstrap grid into codebase would be the best approach
  • Mobile uses only 6 columns
  • There are 5 breakpoints instead of 3

gfellerph avatar Jul 22 '24 13:07 gfellerph

As discussed today, implement breakpoints component tokens that have separate breakpoints for grid (XS, SM, MD, LG, XL) and components (Mobile, Tablet, Desktop).

gfellerph avatar Sep 02 '24 11:09 gfellerph

New resolution: https://github.com/orgs/swisspost/projects/3/views/47?pane=issue&itemId=81612717

alizedebray avatar Oct 02 '24 09:10 alizedebray