mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-04-24 02:16:15 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor: update $css-var-prefix name

Browse source
This commit is contained in:
Lucas Larroche 2023-12-28 13:21:52 +07:00
parent 2c97dc3ae5
commit 3c96e6043b
41 changed files with 866 additions and 759 deletions
Download patch file Download diff file Expand all files Collapse all files

29
scss/components/_modal.scss
View file

@ -7,7 +7,7 @@
*/
:root {
#{$✨}scrollbar-width: 0px;
#{$css-var-prefix}scrollbar-width: 0px;
}
dialog {
@ -25,15 +25,15 @@
height: inherit;
min-height: 100%;
border: 0;
backdrop-filter: var(#{$✨}modal-overlay-backdrop-filter);
background-color: var(#{$✨}modal-overlay-background-color);
color: var(#{$✨}color);
backdrop-filter: var(#{$css-var-prefix}modal-overlay-backdrop-filter);
background-color: var(#{$css-var-prefix}modal-overlay-background-color);
color: var(#{$css-var-prefix}color);
// Content
article {
width: 100%;
max-height: calc(100vh - var(#{$✨}spacing) * 2);
margin: var(#{$✨}spacing);
max-height: calc(100vh - var(#{$css-var-prefix}spacing) * 2);
margin: var(#{$css-var-prefix}spacing);
overflow: auto;
@if map.get($breakpoints, "sm") {
@ -50,13 +50,14 @@
> header,
> footer {
padding: calc(var(#{$✨}block-spacing-vertical) * 0.5) var(#{$✨}block-spacing-horizontal);
padding: calc(var(#{$css-var-prefix}block-spacing-vertical) * 0.5)
var(#{$css-var-prefix}block-spacing-horizontal);
}
> header {
.close {
margin: 0;
margin-left: var(#{$✨}spacing);
margin-left: var(#{$css-var-prefix}spacing);
float: right;
}
}
@ -69,7 +70,7 @@
margin-bottom: 0;
&:not(:first-of-type) {
margin-left: calc(var(#{$✨}spacing) * 0.5);
margin-left: calc(var(#{$css-var-prefix}spacing) * 0.5);
}
}
}
@ -80,17 +81,17 @@
display: block;
width: 1rem;
height: 1rem;
margin-top: calc(var(#{$✨}spacing) * -1);
margin-bottom: var(#{$✨}spacing);
margin-top: calc(var(#{$css-var-prefix}spacing) * -1);
margin-bottom: var(#{$css-var-prefix}spacing);
margin-left: auto;
background-image: var(#{$✨}icon-close);
background-image: var(#{$css-var-prefix}icon-close);
background-position: center;
background-size: auto 1rem;
background-repeat: no-repeat;
opacity: 0.5;
@if $enable-transitions {
transition: opacity var(#{$✨}transition);
transition: opacity var(#{$css-var-prefix}transition);
}
&:is([aria-current]:not([aria-current="false"]), :hover, :active, :focus) {
@ -110,7 +111,7 @@
// Utilities
@if $enable-classes {
.modal-is-open {
padding-right: var(#{$✨}scrollbar-width, 0px);
padding-right: var(#{$css-var-prefix}scrollbar-width, 0px);
overflow: hidden;
pointer-events: none;
touch-action: none;