From c7822fde35539866d79e42cc0cf1aef942f65c20 Mon Sep 17 00:00:00 2001
From: Juan Martin <martinmuda@gmail.com>
Date: Thu, 8 Jun 2023 20:56:27 -0300
Subject: [PATCH] optimice sass

---
 src/components/_label.scss | 32 +++++++++++++++++++++-----------
 1 file changed, 21 insertions(+), 11 deletions(-)

diff --git a/src/components/_label.scss b/src/components/_label.scss
index 0d4f614..40db32a 100644
--- a/src/components/_label.scss
+++ b/src/components/_label.scss
@@ -31,26 +31,36 @@
    @include alignment;
  }
 
- @each $size,
- $var in $sizes {
+ .item>.label {
+  transform: rotate(var(--label-angle)) translate(var(--x), 0);
+}
 
-   @each $pos,
-   $angle in $position {
-     .item.#{$size}>.label.#{$pos} {
-       transform: rotate(calc(#{$angle} * 1deg)) translate(calc(#{$var} / 1.8), 0);
-     }
-   }
- }
+.label>.label__text {
+  transform: translate(calc(var(--connector-width) - 5px), var(--label-box)) rotate(var(--label-angle-invert));
+}
+
+@each $size,
+$var in $sizes {
+
+  @each $pos,
+  $angle in $position {
+    .item.#{$size}>.label.#{$pos} {
+      --label-angle: calc(#{$angle} * 1deg);
+       --x: calc(#{$var} / 1.8);
+    }
+  }
+}
 
  @each $pos,
  $angle in $position {
    .label.#{$pos}>.label__text {
+    --label-angle-invert: calc(#{$angle} * -1deg);
      @if $pos !="pos-180" {
-       transform: translate(calc(var(--connector-width) - 5px), -5px) rotate(calc(#{$angle} * -1deg));
+       --label-box: -5px;
      }
 
      @else {
-       transform: translate(calc(var(--connector-width) + var(--label-width)), +5px) rotate(calc(#{$angle} * -1deg));
+      --label-box: -5px;
      }
 
    }