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

CSS Vars refactoring

Browse source
This commit is contained in:
Lucas Larroche 2021-07-02 16:54:41 +07:00
parent 14460576bf
commit d12af72cab
64 changed files with 4878 additions and 4948 deletions
Download patch file Download diff file Expand all files Collapse all files

14
docs/scss/components/_nav.scss
View file

@ -10,8 +10,8 @@ body > nav {
right: 0;
left: 0;
backdrop-filter: saturate(180%) blur(20px);
background-color: var(--nav-background);
box-shadow: 0px 1px 0 var(--nav-border);
background-color: var(--nav-background-color);
box-shadow: 0px 1px 0 var(--nav-border-color);
a {
border-radius: 0;
@ -29,10 +29,10 @@ body > nav {
a {
width: 3.5rem;
height: 3.5rem;
margin-left: calc(var(--spacing-gutter) * -1);
margin-left: calc(var(--spacing) * -1);
padding: 0;
background: var(--h1);
color: var(--background);
background: var(--h1-color);
color: var(--nav-logo-color);
svg {
height: 3.5rem;
@ -43,8 +43,8 @@ body > nav {
// Title
&:nth-of-type(2) {
display: none;
margin-left: var(--spacing-gutter);
color: var(--h1);
margin-left: var(--spacing);
color: var(--h1-color);
@media (min-width: map-get($breakpoints, "lg")) {
display: inline;

13
docs/scss/components/_theme-switcher.scss
View file

@ -4,13 +4,13 @@
.switcher {
position: fixed;
right: calc(var(--spacing-gutter) / 2);
bottom: var(--spacing-gutter);
right: calc(var(--spacing) / 2);
bottom: var(--spacing);
width: auto;
margin-bottom: 0;
padding: .75rem;
border-radius: 2rem;
box-shadow: var(--card-shadow);
box-shadow: var(--card-box-shadow);
line-height: 1;
text-align: right;
@ -53,18 +53,17 @@
i {
max-width: 100%;
padding: 0 calc(var(--spacing-gutter) / 2) 0 calc(var(--spacing-gutter) / 4);
padding: 0 calc(var(--spacing) / 2) 0 calc(var(--spacing) / 4);
transition: max-width var(--transition),
padding var(--transition);
}
}
&:focus {
box-shadow: var(--card-shadow),
0 0 0 0.2rem var(--secondary-focus);
box-shadow: var(--card-box-shadow), 0 0 0 0.2rem var(--secondary-focus);
}
@media (min-width: map-get($breakpoints, "sm")) {
right: var(--spacing-gutter);
right: var(--spacing);
}
}