Conversation
docs/ELEMENTS.md
Outdated
| * **Layout:** `Grid`, `Column`, `Row`, `Cell` | ||
| * **Text:** `Title`, `Paragraph`, `Text`, `List` | ||
| * **Interaction:** `Button`, `Clickarea`, `Link` | ||
| * **Interaction:** `Button`, `ClickArea`, `Collapsible`, `Link` |
There was a problem hiding this comment.
Food for thought: its role is more a container than an interaction element?
There was a problem hiding this comment.
I agree that's more like a container
docs/ELEMENTS.md
Outdated
| - `--padding-medium` (default: `var(--input-padding-medium)`) | ||
| - `--padding-large` (default: `var(--input-padding-large)`) | ||
|
|
||
| ### Collapsible |
There was a problem hiding this comment.
Food for thought: since its is a wrapper of the HTML details element, renaming the element to Details would align with web standards.
docs/ELEMENTS.md
Outdated
|
|
||
| A widget that can expand and collapse its content. | ||
|
|
||
| Properties: |
There was a problem hiding this comment.
Food for thought: should we add an option to stet the open state?
Example use-case: routing to details.
There was a problem hiding this comment.
Valid scenario, prop added. Also added a prop for name, so the details can be grouped together.
| { | ||
| .collapsible | ||
| { | ||
| --padding-small: var(--container-padding-small) 0 0 0; |
There was a problem hiding this comment.
| --padding-small: var(--container-padding-small) 0 0 0; | |
| --padding: var(--container-padding-small) 0 0 0; |
Since there's only one padding, it's nor small, medium or large.
| .details | ||
| { | ||
| --padding: var(--container-padding-small) 0 0 0; | ||
|
|
There was a problem hiding this comment.
| summary | |
| { | |
| cursor: pointer; | |
| } | |
Currently, everything clickable has a pointer indicator. It feels logical to add it here too.
2 participants
Fixes #20
Changes proposed in this pull request:
detailselement