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

Update search dialog styles to new simpler structure, closes #331

Browse Source
This commit is contained in:
Lea Verou
2024-12-19 19:48:38 -05:00
parent 107f074f99
commit 1a1847eeb5
2 changed files with 14 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/assets/styles/hydration-errors.css
View File

@@ -18,7 +18,7 @@
.diff-grid > * {
height: 100%;
}
.diff-dialog::part(dialog) {
.diff-dialog {
max-width: 90vw;
width: 90vw;
}

31
docs/assets/styles/search.css
View File

@@ -1,14 +1,11 @@
#site-search {
--width: 38rem;
&::part(dialog) {
position: absolute;
top: 0;
border-radius: var(--wa-border-radius-m);
padding: 0;
margin: 10rem auto;
overflow: hidden;
}
width: 38rem;
position: absolute;
top: 0;
border-radius: var(--wa-border-radius-m);
padding: 0;
margin: 10rem auto;
overflow: hidden;
&::part(body) {
padding: 0;
@@ -18,21 +15,19 @@
justify-content: center;
gap: 0.5rem;
}
@media screen and (max-width: 900px) {
max-width: calc(100% - 2rem);
margin-block: 1rem;
}
}
#site-search-container {
display: flex;
flex-direction: column;
max-height: calc(100vh - 20rem);
}
@media screen and (max-width: 900px) {
#site-search::part(dialog) {
max-width: calc(100% - 2rem);
margin-block: 1rem;
}
#site-search-container {
@media screen and (max-width: 900px) {
max-height: calc(100dvh - 2rem);
}
}