js/webawesome
1
0
Fork 0
mirror of https://github.com/shoelace-style/webawesome.git synced 2026-01-12 04:09:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

upated filled-outlined attribute for cards

Browse Source
This commit is contained in:
Kelsey Jackson
2025-10-30 13:38:12 -05:00
parent eb2410ff88
commit 997141aadb
3 changed files with 7 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
packages/webawesome/docs/docs/resources/changelog.md
View File

@@ -16,6 +16,7 @@ Components with the <wa-badge variant="warning">Experimental</wa-badge> badge sh
- `<wa-badge>`
- `<wa-button>`
- `<wa-callout>`
- `<wa-card>`
- `<wa-details>`
- `<wa-input>`
- `<wa-select>`

9
packages/webawesome/src/components/card/card.css
View File

@@ -22,18 +22,19 @@
box-shadow: none;
}
:host([appearance~='outlined']) {
:host([appearance='outlined']) {
background-color: var(--wa-color-surface-default);
border-color: var(--wa-color-surface-border);
}
:host([appearance~='filled']) {
:host([appearance='filled']) {
background-color: var(--wa-color-neutral-fill-quiet);
border-color: transparent;
}
:host([appearance~='filled'][appearance~='outlined']) {
border-color: var(--wa-color-neutral-border-quiet);
:host([appearance='filled-outlined']) {
background-color: var(--wa-color-neutral-fill-quiet);
border-color: var(--wa-color-surface-border);
}
:host([appearance~='accent']) {

2
packages/webawesome/src/components/card/card.ts
View File

@@ -34,7 +34,7 @@ export default class WaCard extends WebAwesomeElement {
/** The card's visual appearance. */
@property({ reflect: true })
appearance: 'accent' | 'filled' | 'outlined' | 'plain' = 'outlined';
appearance: 'accent' | 'filled' | 'outlined' | 'filled-outlined' | 'plain' = 'outlined';
/** Renders the card with a header. Only needed for SSR, otherwise is automatically added. */
@property({ attribute: 'with-header', type: Boolean, reflect: true }) withHeader = false;