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

refactor: modal

Browse source
This commit is contained in:
Lucas Larroche 2022-09-11 15:52:10 +07:00
parent be457e33f7
commit 4117841598
23 changed files with 23 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

4
css/pico.classless.css
View file

@ -28,6 +28,7 @@
--nav-link-spacing-horizontal: 0.5rem; --nav-link-spacing-horizontal: 0.5rem;
--form-label-font-weight: var(--font-weight); --form-label-font-weight: var(--font-weight);
--transition: 0.2s ease-in-out; --transition: 0.2s ease-in-out;
--modal-overlay-backdrop-filter: blur(0.25rem);
} }
@media (min-width: 576px) { @media (min-width: 576px) {
:root { :root {
@ -283,7 +284,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: hsl(205deg, 20%, 94%); --dropdown-hover-background-color: hsl(205deg, 20%, 94%);
--modal-overlay-background-color: rgba(213, 220, 226, 0.7); --modal-overlay-background-color: rgba(213, 220, 226, 0.7);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: hsl(205deg, 18%, 86%); --progress-background-color: hsl(205deg, 18%, 86%);
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 0.5;
@ -391,7 +391,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: rgba(36, 51, 62, 0.75); --dropdown-hover-background-color: rgba(36, 51, 62, 0.75);
--modal-overlay-background-color: rgba(36, 51, 62, 0.8); --modal-overlay-background-color: rgba(36, 51, 62, 0.8);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: #24333e; --progress-background-color: #24333e;
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 0.5;
@ -498,7 +497,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: rgba(36, 51, 62, 0.75); --dropdown-hover-background-color: rgba(36, 51, 62, 0.75);
--modal-overlay-background-color: rgba(36, 51, 62, 0.8); --modal-overlay-background-color: rgba(36, 51, 62, 0.8);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: #24333e; --progress-background-color: #24333e;
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 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

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

File diff suppressed because one or more lines are too long

4
css/pico.css
View file

@ -30,6 +30,7 @@
--nav-link-spacing-horizontal: 0.5rem; --nav-link-spacing-horizontal: 0.5rem;
--form-label-font-weight: var(--font-weight); --form-label-font-weight: var(--font-weight);
--transition: 0.2s ease-in-out; --transition: 0.2s ease-in-out;
--modal-overlay-backdrop-filter: blur(0.25rem);
} }
@media (min-width: 576px) { @media (min-width: 576px) {
:root { :root {
@ -288,7 +289,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: hsl(205deg, 20%, 94%); --dropdown-hover-background-color: hsl(205deg, 20%, 94%);
--modal-overlay-background-color: rgba(213, 220, 226, 0.7); --modal-overlay-background-color: rgba(213, 220, 226, 0.7);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: hsl(205deg, 18%, 86%); --progress-background-color: hsl(205deg, 18%, 86%);
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 0.5;
@ -396,7 +396,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: rgba(36, 51, 62, 0.75); --dropdown-hover-background-color: rgba(36, 51, 62, 0.75);
--modal-overlay-background-color: rgba(36, 51, 62, 0.8); --modal-overlay-background-color: rgba(36, 51, 62, 0.8);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: #24333e; --progress-background-color: #24333e;
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 0.5;
@ -503,7 +502,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: rgba(36, 51, 62, 0.75); --dropdown-hover-background-color: rgba(36, 51, 62, 0.75);
--modal-overlay-background-color: rgba(36, 51, 62, 0.8); --modal-overlay-background-color: rgba(36, 51, 62, 0.8);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: #24333e; --progress-background-color: #24333e;
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 0.5;

2
css/pico.css.map
View file

File diff suppressed because one or more lines are too long

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

@ -28,6 +28,7 @@
--nav-link-spacing-horizontal: 0.5rem; --nav-link-spacing-horizontal: 0.5rem;
--form-label-font-weight: var(--font-weight); --form-label-font-weight: var(--font-weight);
--transition: 0.2s ease-in-out; --transition: 0.2s ease-in-out;
--modal-overlay-backdrop-filter: blur(0.25rem);
} }
@media (min-width: 576px) { @media (min-width: 576px) {
:root { :root {
@ -283,7 +284,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: hsl(205deg, 20%, 94%); --dropdown-hover-background-color: hsl(205deg, 20%, 94%);
--modal-overlay-background-color: rgba(213, 220, 226, 0.7); --modal-overlay-background-color: rgba(213, 220, 226, 0.7);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: hsl(205deg, 18%, 86%); --progress-background-color: hsl(205deg, 18%, 86%);
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 0.5;
@ -391,7 +391,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: rgba(36, 51, 62, 0.75); --dropdown-hover-background-color: rgba(36, 51, 62, 0.75);
--modal-overlay-background-color: rgba(36, 51, 62, 0.8); --modal-overlay-background-color: rgba(36, 51, 62, 0.8);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: #24333e; --progress-background-color: #24333e;
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 0.5;
@ -498,7 +497,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: rgba(36, 51, 62, 0.75); --dropdown-hover-background-color: rgba(36, 51, 62, 0.75);
--modal-overlay-background-color: rgba(36, 51, 62, 0.8); --modal-overlay-background-color: rgba(36, 51, 62, 0.8);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: #24333e; --progress-background-color: #24333e;
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 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.fluid.classless.min.css.map
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

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

File diff suppressed because one or more lines are too long

4
css/pico.slim.css
View file

@ -32,6 +32,7 @@
--nav-link-spacing-horizontal: 0.5rem; --nav-link-spacing-horizontal: 0.5rem;
--form-label-font-weight: var(--font-weight); --form-label-font-weight: var(--font-weight);
--transition: 0.2s ease-in-out; --transition: 0.2s ease-in-out;
--modal-overlay-backdrop-filter: blur(0.25rem);
} }
@media (min-width: 576px) { @media (min-width: 576px) {
:root { :root {
@ -219,7 +220,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: hsl(205deg, 20%, 94%); --dropdown-hover-background-color: hsl(205deg, 20%, 94%);
--modal-overlay-background-color: rgba(213, 220, 226, 0.7); --modal-overlay-background-color: rgba(213, 220, 226, 0.7);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: hsl(205deg, 18%, 86%); --progress-background-color: hsl(205deg, 18%, 86%);
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 0.5;
@ -327,7 +327,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: rgba(36, 51, 62, 0.75); --dropdown-hover-background-color: rgba(36, 51, 62, 0.75);
--modal-overlay-background-color: rgba(36, 51, 62, 0.8); --modal-overlay-background-color: rgba(36, 51, 62, 0.8);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: #24333e; --progress-background-color: #24333e;
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 0.5;
@ -434,7 +433,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: rgba(36, 51, 62, 0.75); --dropdown-hover-background-color: rgba(36, 51, 62, 0.75);
--modal-overlay-background-color: rgba(36, 51, 62, 0.8); --modal-overlay-background-color: rgba(36, 51, 62, 0.8);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: #24333e; --progress-background-color: #24333e;
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 0.5;

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

File diff suppressed because one or more lines are too long

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

File diff suppressed because one or more lines are too long

2
css/pico.slim.min.css.map
View file

File diff suppressed because one or more lines are too long

4
css/themes/default.css
View file

@ -25,6 +25,7 @@
--nav-link-spacing-horizontal: 0.5rem; --nav-link-spacing-horizontal: 0.5rem;
--form-label-font-weight: var(--font-weight); --form-label-font-weight: var(--font-weight);
--transition: 0.2s ease-in-out; --transition: 0.2s ease-in-out;
--modal-overlay-backdrop-filter: blur(0.25rem);
} }
@media (min-width: 576px) { @media (min-width: 576px) {
:root { :root {
@ -283,7 +284,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: hsl(205deg, 20%, 94%); --dropdown-hover-background-color: hsl(205deg, 20%, 94%);
--modal-overlay-background-color: rgba(213, 220, 226, 0.7); --modal-overlay-background-color: rgba(213, 220, 226, 0.7);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: hsl(205deg, 18%, 86%); --progress-background-color: hsl(205deg, 18%, 86%);
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 0.5;
@ -391,7 +391,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: rgba(36, 51, 62, 0.75); --dropdown-hover-background-color: rgba(36, 51, 62, 0.75);
--modal-overlay-background-color: rgba(36, 51, 62, 0.8); --modal-overlay-background-color: rgba(36, 51, 62, 0.8);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: #24333e; --progress-background-color: #24333e;
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 0.5;
@ -498,7 +497,6 @@ kbd {
--dropdown-color: var(--color); --dropdown-color: var(--color);
--dropdown-hover-background-color: rgba(36, 51, 62, 0.75); --dropdown-hover-background-color: rgba(36, 51, 62, 0.75);
--modal-overlay-background-color: rgba(36, 51, 62, 0.8); --modal-overlay-background-color: rgba(36, 51, 62, 0.8);
--modal-overlay-backdrop-filter: blur(0.25rem);
--progress-background-color: #24333e; --progress-background-color: #24333e;
--progress-color: var(--primary); --progress-color: var(--primary);
--loading-spinner-opacity: 0.5; --loading-spinner-opacity: 0.5;

2
css/themes/default.css.map
View file

File diff suppressed because one or more lines are too long

2
css/themes/default.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/themes/default.min.css.map
View file

File diff suppressed because one or more lines are too long

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

@ -127,7 +127,6 @@
// Modal (<dialog>) // Modal (<dialog>)
--modal-overlay-background-color: #{rgba(mix($grey-900, $grey-800), 0.8)}; --modal-overlay-background-color: #{rgba(mix($grey-900, $grey-800), 0.8)};
--modal-overlay-backdrop-filter: blur(0.25rem);
// Progress // Progress
--progress-background-color: #{mix($grey-900, $grey-800)}; --progress-background-color: #{mix($grey-900, $grey-800)};

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

@ -127,7 +127,6 @@
// Modal (<dialog>) // Modal (<dialog>)
--modal-overlay-background-color: #{rgba($grey-100, 0.7)}; --modal-overlay-background-color: #{rgba($grey-100, 0.7)};
--modal-overlay-backdrop-filter: blur(0.25rem);
// Progress // Progress
--progress-background-color: #{$grey-100}; --progress-background-color: #{$grey-100};

3
scss/themes/default/_styles.scss
View file

@ -70,6 +70,9 @@
// Transitions // Transitions
--transition: 0.2s ease-in-out; --transition: 0.2s ease-in-out;
// Modal (<dialog>)
--modal-overlay-backdrop-filter: blur(0.25rem);
} }
// Responsives spacings // Responsives spacings