diff options
Diffstat (limited to 'src/styles/base/_animations.scss')
| -rw-r--r-- | src/styles/base/_animations.scss | 43 |
1 files changed, 20 insertions, 23 deletions
diff --git a/src/styles/base/_animations.scss b/src/styles/base/_animations.scss index 7dc0d25..3e8f6f2 100644 --- a/src/styles/base/_animations.scss +++ b/src/styles/base/_animations.scss @@ -17,42 +17,39 @@ @keyframes draw-borders { 0% { background-position: top left, top right, bottom right, bottom left; - background-size: 0% var(--draw-border-width, fun.convert-px(3)), - var(--draw-border-width, fun.convert-px(3)) 0%, - 0% var(--draw-border-width, fun.convert-px(3)), - var(--draw-border-width, fun.convert-px(3)) 0%; + background-size: 0% var(--draw-border-thickness, fun.convert-px(3)), + var(--draw-border-thickness, fun.convert-px(3)) 0%, + 0% var(--draw-border-thickness, fun.convert-px(3)), + var(--draw-border-thickness, fun.convert-px(3)) 0%; } 25% { - background-position: top left, top right, bottom right, bottom left; - background-size: 0% var(--draw-border-width, fun.convert-px(3)), - var(--draw-border-width, fun.convert-px(3)) 0%, - 100% var(--draw-border-width, fun.convert-px(3)), - var(--draw-border-width, fun.convert-px(3)) 0%; + background-size: 0% var(--draw-border-thickness, fun.convert-px(3)), + var(--draw-border-thickness, fun.convert-px(3)) 0%, + 100% var(--draw-border-thickness, fun.convert-px(3)), + var(--draw-border-thickness, fun.convert-px(3)) 0%; } 50% { - background-position: top left, top right, bottom right, bottom left; - background-size: 0% var(--draw-border-width, fun.convert-px(3)), - var(--draw-border-width, fun.convert-px(3)) 0%, - 100% var(--draw-border-width, fun.convert-px(3)), - var(--draw-border-width, fun.convert-px(3)) 100%; + background-size: 0% var(--draw-border-thickness, fun.convert-px(3)), + var(--draw-border-thickness, fun.convert-px(3)) 0%, + 100% var(--draw-border-thickness, fun.convert-px(3)), + var(--draw-border-thickness, fun.convert-px(3)) 100%; } 75% { - background-position: top left, top right, bottom right, bottom left; - background-size: 100% var(--draw-border-width, fun.convert-px(3)), - var(--draw-border-width, fun.convert-px(3)) 0%, - 100% var(--draw-border-width, fun.convert-px(3)), - var(--draw-border-width, fun.convert-px(3)) 100%; + background-size: 100% var(--draw-border-thickness, fun.convert-px(3)), + var(--draw-border-thickness, fun.convert-px(3)) 0%, + 100% var(--draw-border-thickness, fun.convert-px(3)), + var(--draw-border-thickness, fun.convert-px(3)) 100%; } 100% { background-position: top left, top right, bottom right, bottom left; - background-size: 100% var(--draw-border-width, fun.convert-px(3)), - var(--draw-border-width, fun.convert-px(3)) 100%, - 100% var(--draw-border-width, fun.convert-px(3)), - var(--draw-border-width, fun.convert-px(3)) 100%; + background-size: 100% var(--draw-border-thickness, fun.convert-px(3)), + var(--draw-border-thickness, fun.convert-px(3)) 100%, + 100% var(--draw-border-thickness, fun.convert-px(3)), + var(--draw-border-thickness, fun.convert-px(3)) 100%; } } |