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

A Glow Up for Dialogs That Pop Up (#1927)

Browse Source 
* adding visual divider + padding to wa-dialog footers

* adding `wa-button`-focused `.shush` to `utils.css`
This commit is contained in:
Brian Talbot
2026-01-09 14:52:23 -05:00
committed by GitHub
parent f3de45803f
commit 09ace44c17
1 changed files with 14 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
packages/webawesome/docs/assets/styles/utils.css
View File

@@ -130,6 +130,13 @@
} }
} }
/* dialogs */
wa-dialog:has([slot='footer']) [slot='footer'] {
border-block-start: var(--wa-border-width-s) solid var(--wa-color-surface-border);
flex-grow: 1; /* make footer contents span entire width of dialog */
padding-block-start: var(--wa-space-l);
}
/* anchor headings */ /* anchor headings */
.anchor-heading a { .anchor-heading a {
opacity: 0; opacity: 0;
@@ -250,7 +257,6 @@
z-index: 0; z-index: 0;
} }
} }
/* #endregion */
/* buttons with icon toggle on hover */ /* buttons with icon toggle on hover */
wa-button .icon-hover { wa-button .icon-hover {
@@ -262,6 +268,13 @@
wa-button:hover .icon-hover { wa-button:hover .icon-hover {
display: inline-flex; display: inline-flex;
} }
/* buttons that are "shushed" (visually muted) by default, but have their full presentation otherwise */
wa-button.shush {
&:not(:hover):not(active)::part(base) {
color: var(--wa-color-text-quiet);
}
}
/* #endregion */ /* #endregion */
/* #region resets */ /* #region resets */