Breadcrumb - Design System
@fermarinsanchez ci sta già lavorando.
Dal 8/6/2025.
Valutazione
Questa issue non è ancora stata valutata.
Descrizione
Breadcrumb - Design System
1 - Prerequisites
- Host element will have the
.dcx-breadcrumbclass name. - It will have sub-element with the
.dcx-breadcrumb-itemclass name. - It will have sub-element with the
.dcx-breadcrumb-item--selectedclass name when the item is selected.
2 - Overview
2.1 - Possible states
| Name | Description |
|---|---|
| Default | Instance without selected prop or falsy value |
| Selected | Instance with selected prop and true value |
2.2 - Variants
- NONE
2.3 - Structure
- Breadcrumb
| Element | Description | Token Name |
|---|---|---|
| Box | The breadcrumb ol container itself | breadcrumb |
- BreadcrumbItem
Element Description Token Name Box The container li item box breadcrumb_item
2.4 - Tokens definition
Considerations:
- ❗ Take a close look to the Card component. It is a form element as well, the tokens and styling approach should be similar.
- Add the tokens to
src/design-system/tokens.json - Define all styles in
src/design-system/card.css - Add import to the new CSS file in
src/design-system/index.css
Possible tokens:
- spacing-x-breadcrumb
- border-color-breadcrumb
- spacing-y-breadcrumb_item
- spacing-x-breadcrumb
- border-width-breadcrumb
- etc.
Follow the naming pattern
3 - Storybook
Create the pages for:
- Playground
- Default
- AccessibleTheme
- DarkTheme
- MaterialTheme
On each MDX page make examples for each possible variant
4 - Initial setup
Please follow these steps to create your branch:
git checkout release/1.1.0
git pull
git checkout -b 'feature/breadcrumb-design-system'
- Lingua principale
- TypeScript
- Stelle
- 120
- Fork
- 6
- Metriche di merge delle PR
- Nessuna PR unita negli ultimi 30g
Preparare l'ambiente
- Nessun Dockerfile né file Docker Compose
- Nessun modello di pull request
- Leggi la guida per i contributori
Come iniziare
- Leggi tutta la issue e poi la guida ai contributi del progetto.
- Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
- Fai un fork del repository e lavora su un branch.
- Apri una pull request che faccia riferimento al numero della issue.
Altre issue di Capgemini/dcx-react-library
-
`Autocomplete` — hardcoded inline styles cannot be overridden by external CSSForse di nuovo libera @Ibabalola l’ha presa 97 giorni fa e non c’è nessuna pull request aperta. Apertaenhancement
Capgemini/dcx-react-library#707 · 1 assegnatario ·
-
Tabs - State and A11y errorsForse di nuovo libera @fermarinsanchez l’ha presa 477 giorni fa e non c’è nessuna pull request aperta. Apertaa11y bug
Capgemini/dcx-react-library#705 · 1 assegnatario ·
-
design-system
Difficoltà 5/5 Più di una settimana Idoneità per principianti 10/100
Capgemini/dcx-react-library#686 ·
-
Tabs - Design SystemForse di nuovo libera @jgonza16 l’ha presa 779 giorni fa e non c’è nessuna pull request aperta. Apertadesign-system
Capgemini/dcx-react-library#685 · 1 assegnatario ·
-
Details - Design SystemApertadesign-system
Difficoltà 4/5 3-5 giorni Idoneità per principianti 35/100
Capgemini/dcx-react-library#684 ·
Tutte le issue di Capgemini/dcx-react-library
Issue simili
-
Difficoltà 2/5 1-3 ore Idoneità per principianti 88/100
Effect-TS/effect#8881 · 1 commento ·
I maintainer di solito rispondono entro 1 giorno
-
Discover carries headerEdges that nothing reads since #1914 moved E0507/E0517 to the compiler graphApertatech-debt
Difficoltà 2/5 1-3 ore Idoneità per principianti 84/100
I maintainer di solito rispondono entro 1 giorno
-
mail processing verified
Difficoltà 2/5 1-3 ore Idoneità per principianti 88/100
I maintainer di solito rispondono entro 7 giorni
-
check:passed streams:add
Difficoltà 1/5 Meno di un'ora Idoneità per principianti 86/100
I maintainer di solito rispondono entro 1 giorno
-
bug
Difficoltà 2/5 1-3 ore Idoneità per principianti 74/100
OpenSlides/OpenSlides#7180 ·