mirror of
https://github.com/picocss/pico.git
synced 2025-04-25 02:36:15 -04:00
Use sass division function instead of deprecated operator
This effectively make the SCSS code processable only by dart-sass because neither libsass (and node-sass in consequence) nor ruby-sass supports new syntax. See https://sass-lang.com/documentation/breaking-changes/slash-div for more information. This fixes #27
This commit is contained in:
parent
cc164857b9
commit
cb5b746bbb
10 changed files with 30 additions and 26 deletions
|
@ -6,7 +6,7 @@
|
|||
details {
|
||||
display: block;
|
||||
margin-bottom: var(--spacing);
|
||||
padding-bottom: calc(var(--spacing) / 2);
|
||||
padding-bottom: calc(var(--spacing) * 0.5);
|
||||
border-bottom: var(--border-width) solid var(--accordion-border-color);
|
||||
|
||||
summary {
|
||||
|
@ -57,7 +57,7 @@ details {
|
|||
}
|
||||
|
||||
~ * {
|
||||
margin-top: calc(var(--spacing) / 2);
|
||||
margin-top: calc(var(--spacing) * 0.5);
|
||||
|
||||
~ * {
|
||||
margin-top: 0;
|
||||
|
@ -69,7 +69,7 @@ details {
|
|||
&[open] {
|
||||
|
||||
> summary {
|
||||
margin-bottom: calc(var(--spacing) / 4);
|
||||
margin-bottom: calc(var(--spacing) * 0.25);
|
||||
|
||||
&:not(:focus) {
|
||||
color: var(--accordion-open-summary-color);
|
||||
|
|
|
@ -1,3 +1,5 @@
|
|||
@use "sass:math";
|
||||
|
||||
/**
|
||||
* Card (<article>)
|
||||
*/
|
||||
|
@ -15,7 +17,7 @@ article {
|
|||
> pre {
|
||||
margin-right: calc(var(--block-spacing-horizontal) * -1);
|
||||
margin-left: calc(var(--block-spacing-horizontal) * -1);
|
||||
padding: calc(var(--block-spacing-vertical) / 1.5) var(--block-spacing-horizontal);
|
||||
padding: calc(math.div(var(--block-spacing-vertical), 1.5)) var(--block-spacing-horizontal);
|
||||
background-color: var(--card-sectionning-background-color);
|
||||
}
|
||||
|
||||
|
|
|
@ -1,3 +1,5 @@
|
|||
@use "sass:math";
|
||||
|
||||
/**
|
||||
* Nav
|
||||
*/
|
||||
|
@ -19,17 +21,17 @@ nav {
|
|||
list-style: none;
|
||||
|
||||
&:first-of-type {
|
||||
margin-left: calc(var(--spacing) * -0.5);
|
||||
margin-left: calc(math.div(var(--spacing), -0.5));
|
||||
}
|
||||
&:last-of-type {
|
||||
margin-right: calc(var(--spacing) * -0.5);
|
||||
margin-right: calc(math.div(var(--spacing), -0.5));
|
||||
}
|
||||
}
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
padding: var(--spacing) calc(var(--spacing) / 2);
|
||||
padding: var(--spacing) calc(var(--spacing) * 0.5);
|
||||
|
||||
// HACK: Input & Button inside Nav
|
||||
> *,
|
||||
|
@ -40,8 +42,8 @@ nav {
|
|||
|
||||
a {
|
||||
display: block;
|
||||
margin: calc(var(--spacing) * -1) calc(var(--spacing) * -0.5);
|
||||
padding: var(--spacing) calc(var(--spacing) / 2);
|
||||
margin: calc(var(--spacing) * -1) calc(math.div(var(--spacing), -0.5));
|
||||
padding: var(--spacing) calc(var(--spacing) * 0.5);
|
||||
border-radius: var(--border-radius);
|
||||
text-decoration: none;
|
||||
|
||||
|
@ -64,11 +66,11 @@ aside {
|
|||
}
|
||||
|
||||
li {
|
||||
padding: calc(var(--spacing) / 2);
|
||||
padding: calc(var(--spacing) * 0.5);
|
||||
|
||||
a {
|
||||
margin: calc(var(--spacing) * -0.5);
|
||||
padding: calc(var(--spacing) / 2);
|
||||
padding: calc(var(--spacing) * 0.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -30,7 +30,7 @@ progress {
|
|||
display: inline-block;
|
||||
width: 100%;
|
||||
height: .5rem;
|
||||
margin-bottom: calc(var(--spacing) / 2);
|
||||
margin-bottom: calc(var(--spacing) * 0.5);
|
||||
overflow: hidden;
|
||||
|
||||
// Remove Firefox and Opera border
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue