mirror of
https://github.com/explosion/spaCy.git
synced 2025-08-05 21:00:19 +03:00
Fix SASS deprecation
This is a super annoying breaking change in sass (it also happens in `node-sass`/`node-scss`), but there seems to be no way around it. context: https://sass-lang.com/documentation/breaking-changes/slash-div
This commit is contained in:
parent
379faa6fb8
commit
330c7e86a8
|
@ -1,3 +1,4 @@
|
||||||
|
@use 'sass:math'
|
||||||
@import base
|
@import base
|
||||||
|
|
||||||
$triangle-size: 2rem
|
$triangle-size: 2rem
|
||||||
|
@ -55,14 +56,14 @@ $border-radius: 6px
|
||||||
// Banner effect
|
// Banner effect
|
||||||
&:after
|
&:after
|
||||||
position: absolute
|
position: absolute
|
||||||
bottom: -$triangle-size / 2
|
bottom: math.div(-$triangle-size, 2)
|
||||||
left: $border-radius / 2
|
left: math.div($border-radius, 2)
|
||||||
width: 0
|
width: 0
|
||||||
height: 0
|
height: 0
|
||||||
border-color: transparent
|
border-color: transparent
|
||||||
border-style: solid
|
border-style: solid
|
||||||
border-top-color: var(--color-dark)
|
border-top-color: var(--color-dark)
|
||||||
border-width: $triangle-size / 2 0 0 calc(#{$triangle-size} - #{$border-radius / 2})
|
border-width: math.div($triangle-size, 2) 0 0 calc(#{$triangle-size} - #{math.div($border-radius, 2)})
|
||||||
content: ""
|
content: ""
|
||||||
|
|
||||||
@include breakpoint(max, sm)
|
@include breakpoint(max, sm)
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
|
@use 'sass:math'
|
||||||
|
|
||||||
.root
|
.root
|
||||||
margin-bottom: var(--spacing-md)
|
margin-bottom: var(--spacing-md)
|
||||||
|
|
||||||
|
@ -7,7 +9,7 @@
|
||||||
|
|
||||||
@each $ratio1, $ratio2 in (16, 9), (4, 3)
|
@each $ratio1, $ratio2 in (16, 9), (4, 3)
|
||||||
.ratio#{$ratio1}x#{$ratio2}
|
.ratio#{$ratio1}x#{$ratio2}
|
||||||
padding-bottom: (100% * $ratio2 / $ratio1)
|
padding-bottom: (100% * math.div($ratio2, $ratio1))
|
||||||
|
|
||||||
.iframe
|
.iframe
|
||||||
position: absolute
|
position: absolute
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
@use 'sass:math'
|
||||||
@import base
|
@import base
|
||||||
|
|
||||||
$grid-gap-wide: 5rem
|
$grid-gap-wide: 5rem
|
||||||
|
@ -9,7 +10,7 @@ $flex-gap: 2rem
|
||||||
@if $gap == 0
|
@if $gap == 0
|
||||||
flex: 0 0 100% / $cols
|
flex: 0 0 100% / $cols
|
||||||
@else
|
@else
|
||||||
flex: 0 0 calc(#{100% / $cols} - #{$gap * ($cols - 1)})
|
flex: 0 0 calc(#{math.div(100%, $cols)} - #{$gap * ($cols - 1)})
|
||||||
|
|
||||||
.root
|
.root
|
||||||
display: flex
|
display: flex
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
@use 'sass:math'
|
||||||
@import base
|
@import base
|
||||||
|
|
||||||
.root
|
.root
|
||||||
|
@ -82,7 +83,7 @@
|
||||||
vertical-align: middle
|
vertical-align: middle
|
||||||
margin-right: 0.5rem
|
margin-right: 0.5rem
|
||||||
cursor: pointer
|
cursor: pointer
|
||||||
border-radius: $size / 4
|
border-radius: math.div($size, 4)
|
||||||
background: var(--color-back)
|
background: var(--color-back)
|
||||||
position: relative
|
position: relative
|
||||||
top: -1px
|
top: -1px
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
@use 'sass:math'
|
||||||
@import base
|
@import base
|
||||||
|
|
||||||
$crumb-bullet: 14px
|
$crumb-bullet: 14px
|
||||||
|
@ -58,7 +59,7 @@ $crumb-bar: 2px
|
||||||
position: relative
|
position: relative
|
||||||
|
|
||||||
.crumb
|
.crumb
|
||||||
margin-bottom: $crumb-bullet / 2
|
margin-bottom: math.div($crumb-bullet, 2)
|
||||||
position: relative
|
position: relative
|
||||||
padding-left: 2rem
|
padding-left: 2rem
|
||||||
color: var(--color-theme)
|
color: var(--color-theme)
|
||||||
|
@ -71,7 +72,7 @@ $crumb-bar: 2px
|
||||||
width: $crumb-bullet
|
width: $crumb-bullet
|
||||||
height: $crumb-bullet
|
height: $crumb-bullet
|
||||||
position: absolute
|
position: absolute
|
||||||
top: $crumb-bullet / 4
|
top: math.div($crumb-bullet, 4)
|
||||||
left: 0
|
left: 0
|
||||||
content: ""
|
content: ""
|
||||||
border-radius: 50%
|
border-radius: 50%
|
||||||
|
@ -83,13 +84,13 @@ $crumb-bar: 2px
|
||||||
height: 100%
|
height: 100%
|
||||||
position: absolute
|
position: absolute
|
||||||
top: $crumb-bullet
|
top: $crumb-bullet
|
||||||
left: ($crumb-bullet - $crumb-bar) / 2
|
left: math.div(($crumb-bullet - $crumb-bar), 2)
|
||||||
content: ""
|
content: ""
|
||||||
background: var(--color-subtle)
|
background: var(--color-subtle)
|
||||||
|
|
||||||
&:first-child:before
|
&:first-child:before
|
||||||
height: calc(100% + #{$crumb-bullet * 2})
|
height: calc(100% + #{$crumb-bullet * 2})
|
||||||
top: -$crumb-bullet / 2
|
top: math.div(-$crumb-bullet, 2)
|
||||||
|
|
||||||
.crumb-active
|
.crumb-active
|
||||||
color: var(--color-dark)
|
color: var(--color-dark)
|
||||||
|
|
Loading…
Reference in New Issue
Block a user