mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-04-23 18:06:14 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fixes header and footer in modal when form is direct child of the article, and if the form would be between the header and footer tags.

Browse source 
Modals with the size classes on the dialog were not sizing correctly when form was a child of the modal, and this has been corrected.
This commit is contained in:
Yohn 2025-01-18 19:31:23 -05:00
parent 389e319c1e
commit 6bc6d79caf
6 changed files with 35 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

36
scss/components/_modal.scss
View file

@ -11,6 +11,25 @@
#{$css-var-prefix}scrollbar-width: 0px;
}
#{$parent-selector} dialog:not(.modal-fs, .modal-xlg, .modal-lg, .modal-md, .modal-sm) {
> article:not(:has(> form:first-child)),
> article > form:first-child {
width: 100%;
@if map.get($breakpoints, "sm") {
@media (min-width: map.get(map.get($breakpoints, "sm"), "breakpoint")) {
max-width: map.get(map.get($breakpoints, "sm"), "viewport");
}
}
@if map.get($breakpoints, "md") {
@media (min-width: map.get(map.get($breakpoints, "md"), "breakpoint")) {
max-width: map.get(map.get($breakpoints, "md"), "viewport");
}
}
}
}
#{$parent-selector} dialog {
display: grid;
z-index: 999;
@ -37,26 +56,13 @@
}
// Content
> article:not(:has(> form)),
> article > form {
> article:not(:has(> form:first-child)),
> article > form:first-child {
$close-selector: if(
$enable-classes,
".close, :is(a, button)[rel=prev]",
":is(a, button)[rel=prev]"
);
width: 100%;
@if map.get($breakpoints, "sm") {
@media (min-width: map.get(map.get($breakpoints, "sm"), "breakpoint")) {
max-width: map.get(map.get($breakpoints, "sm"), "viewport");
}
}
@if map.get($breakpoints, "md") {
@media (min-width: map.get(map.get($breakpoints, "md"), "breakpoint")) {
max-width: map.get(map.get($breakpoints, "md"), "viewport");
}
}
> header {
> * {