From 15085a7c26fee62351a28ff5a4737f3213e1ecf9 Mon Sep 17 00:00:00 2001 From: kolaente Date: Sat, 17 Jul 2021 19:14:26 +0200 Subject: [PATCH] Fix sass division --- src/styles/components/kanban.scss | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/styles/components/kanban.scss b/src/styles/components/kanban.scss index 2f2c9908..c63cb3f8 100644 --- a/src/styles/components/kanban.scss +++ b/src/styles/components/kanban.scss @@ -1,3 +1,5 @@ +@use 'sass:math'; + $bucket-background: $grey-100; $task-background: $white; $ease-out: all .3s cubic-bezier(0.23, 1, 0.32, 1); @@ -237,10 +239,10 @@ $filter-container-height: '1rem - #{$switch-view-height}'; } &.is-collapsed { - transform: rotate(90deg) translateX($bucket-width / 2 - $bucket-header-height / 2); + transform: rotate(90deg) translateX(math.div($bucket-width, 2) - math.div($bucket-header-height, 2)); // Using negative margins instead of translateY here to make all other buckets fill the empty space - margin-left: ($bucket-width / 2 - $bucket-header-height / 2) * -1; - margin-right: calc(#{($bucket-width / 2 - $bucket-header-height / 2) * -1} + #{$bucket-right-margin}); + margin-left: (math.div($bucket-width, 2) - math.div($bucket-header-height, 2)) * -1; + margin-right: calc(#{(math.div($bucket-width, 2) - math.div($bucket-header-height, 2)) * -1} + #{$bucket-right-margin}); cursor: pointer; .tasks, .bucket-footer {