mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-04-22 01:26:13 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

style: modal

Browse source
This commit is contained in:
Lucas Larroche 2023-03-25 12:35:22 +07:00
parent d7d11308af
commit 32f65f1f64
12 changed files with 24 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

8
css/pico.classless.css
View file

@ -103,7 +103,7 @@
--pico-dropdown-color: var(--pico-color); --pico-dropdown-color: var(--pico-color);
--pico-dropdown-hover-background-color: #eff1f4; --pico-dropdown-hover-background-color: #eff1f4;
--pico-loading-spinner-opacity: 0.5; --pico-loading-spinner-opacity: 0.5;
--pico-modal-overlay-background-color: rgba(239, 241, 244, 0.7); --pico-modal-overlay-background-color: rgba(232, 234, 237, 0.75);
--pico-progress-background-color: #dfe3eb; --pico-progress-background-color: #dfe3eb;
--pico-progress-color: var(--pico-primary-background); --pico-progress-color: var(--pico-primary-background);
--pico-tooltip-background-color: var(--pico-contrast-background); --pico-tooltip-background-color: var(--pico-contrast-background);
@ -233,7 +233,7 @@
--pico-dropdown-color: var(--pico-color); --pico-dropdown-color: var(--pico-color);
--pico-dropdown-hover-background-color: #202632; --pico-dropdown-hover-background-color: #202632;
--pico-loading-spinner-opacity: 0.5; --pico-loading-spinner-opacity: 0.5;
--pico-modal-overlay-background-color: rgba(8, 9, 10, 0.85); --pico-modal-overlay-background-color: rgba(8, 9, 10, 0.75);
--pico-progress-background-color: #202632; --pico-progress-background-color: #202632;
--pico-progress-color: var(--pico-primary-background); --pico-progress-color: var(--pico-primary-background);
--pico-tooltip-background-color: var(--pico-contrast-background); --pico-tooltip-background-color: var(--pico-contrast-background);
@ -356,7 +356,7 @@
--pico-dropdown-color: var(--pico-color); --pico-dropdown-color: var(--pico-color);
--pico-dropdown-hover-background-color: #202632; --pico-dropdown-hover-background-color: #202632;
--pico-loading-spinner-opacity: 0.5; --pico-loading-spinner-opacity: 0.5;
--pico-modal-overlay-background-color: rgba(8, 9, 10, 0.85); --pico-modal-overlay-background-color: rgba(8, 9, 10, 0.75);
--pico-progress-background-color: #202632; --pico-progress-background-color: #202632;
--pico-progress-color: var(--pico-primary-background); --pico-progress-color: var(--pico-primary-background);
--pico-tooltip-background-color: var(--pico-contrast-background); --pico-tooltip-background-color: var(--pico-contrast-background);
@ -2164,9 +2164,11 @@ dialog article > header .close {
dialog article > footer { dialog article > footer {
text-align: right; text-align: right;
} }
dialog article > footer button,
dialog article > footer [role=button] { dialog article > footer [role=button] {
margin-bottom: 0; margin-bottom: 0;
} }
dialog article > footer button:not(:first-of-type),
dialog article > footer [role=button]:not(:first-of-type) { dialog article > footer [role=button]:not(:first-of-type) {
margin-left: calc(var(--pico-spacing) * 0.5); margin-left: calc(var(--pico-spacing) * 0.5);
} }

2
css/pico.classless.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.classless.min.css vendored
View file

File diff suppressed because one or more lines are too long

8
css/pico.css
View file

@ -103,7 +103,7 @@
--pico-dropdown-color: var(--pico-color); --pico-dropdown-color: var(--pico-color);
--pico-dropdown-hover-background-color: #eff1f4; --pico-dropdown-hover-background-color: #eff1f4;
--pico-loading-spinner-opacity: 0.5; --pico-loading-spinner-opacity: 0.5;
--pico-modal-overlay-background-color: rgba(239, 241, 244, 0.7); --pico-modal-overlay-background-color: rgba(232, 234, 237, 0.75);
--pico-progress-background-color: #dfe3eb; --pico-progress-background-color: #dfe3eb;
--pico-progress-color: var(--pico-primary-background); --pico-progress-color: var(--pico-primary-background);
--pico-tooltip-background-color: var(--pico-contrast-background); --pico-tooltip-background-color: var(--pico-contrast-background);
@ -233,7 +233,7 @@
--pico-dropdown-color: var(--pico-color); --pico-dropdown-color: var(--pico-color);
--pico-dropdown-hover-background-color: #202632; --pico-dropdown-hover-background-color: #202632;
--pico-loading-spinner-opacity: 0.5; --pico-loading-spinner-opacity: 0.5;
--pico-modal-overlay-background-color: rgba(8, 9, 10, 0.85); --pico-modal-overlay-background-color: rgba(8, 9, 10, 0.75);
--pico-progress-background-color: #202632; --pico-progress-background-color: #202632;
--pico-progress-color: var(--pico-primary-background); --pico-progress-color: var(--pico-primary-background);
--pico-tooltip-background-color: var(--pico-contrast-background); --pico-tooltip-background-color: var(--pico-contrast-background);
@ -356,7 +356,7 @@
--pico-dropdown-color: var(--pico-color); --pico-dropdown-color: var(--pico-color);
--pico-dropdown-hover-background-color: #202632; --pico-dropdown-hover-background-color: #202632;
--pico-loading-spinner-opacity: 0.5; --pico-loading-spinner-opacity: 0.5;
--pico-modal-overlay-background-color: rgba(8, 9, 10, 0.85); --pico-modal-overlay-background-color: rgba(8, 9, 10, 0.75);
--pico-progress-background-color: #202632; --pico-progress-background-color: #202632;
--pico-progress-color: var(--pico-primary-background); --pico-progress-color: var(--pico-primary-background);
--pico-tooltip-background-color: var(--pico-contrast-background); --pico-tooltip-background-color: var(--pico-contrast-background);
@ -2267,9 +2267,11 @@ dialog article > header .close {
dialog article > footer { dialog article > footer {
text-align: right; text-align: right;
} }
dialog article > footer button,
dialog article > footer [role=button] { dialog article > footer [role=button] {
margin-bottom: 0; margin-bottom: 0;
} }
dialog article > footer button:not(:first-of-type),
dialog article > footer [role=button]:not(:first-of-type) { dialog article > footer [role=button]:not(:first-of-type) {
margin-left: calc(var(--pico-spacing) * 0.5); margin-left: calc(var(--pico-spacing) * 0.5);
} }

2
css/pico.css.map
View file

File diff suppressed because one or more lines are too long

8
css/pico.fluid.classless.css
View file

@ -103,7 +103,7 @@
--pico-dropdown-color: var(--pico-color); --pico-dropdown-color: var(--pico-color);
--pico-dropdown-hover-background-color: #eff1f4; --pico-dropdown-hover-background-color: #eff1f4;
--pico-loading-spinner-opacity: 0.5; --pico-loading-spinner-opacity: 0.5;
--pico-modal-overlay-background-color: rgba(239, 241, 244, 0.7); --pico-modal-overlay-background-color: rgba(232, 234, 237, 0.75);
--pico-progress-background-color: #dfe3eb; --pico-progress-background-color: #dfe3eb;
--pico-progress-color: var(--pico-primary-background); --pico-progress-color: var(--pico-primary-background);
--pico-tooltip-background-color: var(--pico-contrast-background); --pico-tooltip-background-color: var(--pico-contrast-background);
@ -233,7 +233,7 @@
--pico-dropdown-color: var(--pico-color); --pico-dropdown-color: var(--pico-color);
--pico-dropdown-hover-background-color: #202632; --pico-dropdown-hover-background-color: #202632;
--pico-loading-spinner-opacity: 0.5; --pico-loading-spinner-opacity: 0.5;
--pico-modal-overlay-background-color: rgba(8, 9, 10, 0.85); --pico-modal-overlay-background-color: rgba(8, 9, 10, 0.75);
--pico-progress-background-color: #202632; --pico-progress-background-color: #202632;
--pico-progress-color: var(--pico-primary-background); --pico-progress-color: var(--pico-primary-background);
--pico-tooltip-background-color: var(--pico-contrast-background); --pico-tooltip-background-color: var(--pico-contrast-background);
@ -356,7 +356,7 @@
--pico-dropdown-color: var(--pico-color); --pico-dropdown-color: var(--pico-color);
--pico-dropdown-hover-background-color: #202632; --pico-dropdown-hover-background-color: #202632;
--pico-loading-spinner-opacity: 0.5; --pico-loading-spinner-opacity: 0.5;
--pico-modal-overlay-background-color: rgba(8, 9, 10, 0.85); --pico-modal-overlay-background-color: rgba(8, 9, 10, 0.75);
--pico-progress-background-color: #202632; --pico-progress-background-color: #202632;
--pico-progress-color: var(--pico-primary-background); --pico-progress-color: var(--pico-primary-background);
--pico-tooltip-background-color: var(--pico-contrast-background); --pico-tooltip-background-color: var(--pico-contrast-background);
@ -2127,9 +2127,11 @@ dialog article > header .close {
dialog article > footer { dialog article > footer {
text-align: right; text-align: right;
} }
dialog article > footer button,
dialog article > footer [role=button] { dialog article > footer [role=button] {
margin-bottom: 0; margin-bottom: 0;
} }
dialog article > footer button:not(:first-of-type),
dialog article > footer [role=button]:not(:first-of-type) { dialog article > footer [role=button]:not(:first-of-type) {
margin-left: calc(var(--pico-spacing) * 0.5); margin-left: calc(var(--pico-spacing) * 0.5);
} }

2
css/pico.fluid.classless.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.fluid.classless.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.min.css vendored
View file

File diff suppressed because one or more lines are too long

1
scss/components/_modal.scss
View file

@ -64,6 +64,7 @@
> footer { > footer {
text-align: right; text-align: right;
button,
[role="button"] { [role="button"] {
margin-bottom: 0; margin-bottom: 0;

2
scss/themes/default/_dark.scss
View file

@ -183,7 +183,7 @@
// Modal (<dialog>) // Modal (<dialog>)
@if map.get($modules, "components/modal") { @if map.get($modules, "components/modal") {
#{$✨}modal-overlay-background-color: #{rgba(mix($black, $zinc-950), 0.85)}; #{$✨}modal-overlay-background-color: #{rgba(mix($black, $zinc-950), 0.75)};
} }
// Progress // Progress

2
scss/themes/default/_light.scss
View file

@ -183,7 +183,7 @@
// Modal (<dialog>) // Modal (<dialog>)
@if map.get($modules, "components/modal") { @if map.get($modules, "components/modal") {
#{$✨}modal-overlay-background-color: #{rgba($slate-50, 0.7)}; #{$✨}modal-overlay-background-color: #{rgba(mix($zinc-100, $zinc-50), 0.75)};
} }
// Progress // Progress