From 4c3515186bc0628c741319bacc058d0ee08cab11 Mon Sep 17 00:00:00 2001
From: alstjr7375 <alstjr7375@daum.net>
Date: Fri, 18 Mar 2022 12:19:03 +0900
Subject: [PATCH] Clean: SASS - dynamic separator

---
 .../unselected_tab/_dynamic_separator.scss    | 52 ++++++++-----------
 1 file changed, 21 insertions(+), 31 deletions(-)

diff --git a/src/tabbar/unselected_tab/_dynamic_separator.scss b/src/tabbar/unselected_tab/_dynamic_separator.scss
index 507a876..c145219 100644
--- a/src/tabbar/unselected_tab/_dynamic_separator.scss
+++ b/src/tabbar/unselected_tab/_dynamic_separator.scss
@@ -1,28 +1,32 @@
+@mixin separaorShape() {
+  /* Box Model */
+  content: "";
+  display: block;
+  position: absolute;
+
+  /* Position */
+  top: 50%;
+
+  /* Bar shape */
+  width: 1px;
+  height: 20px;
+
+  /* Bar Color */
+  opacity: 0;
+  background-color: var(--toolbarseparator-color);
+}
+
 @include Option("userChrome.tab.dynamic_separtor_contain_button") {
   #tabbrowser-arrowscrollbox {
     position: absolute;
   }
-}
 
-@include Option("userChrome.tab.dynamic_separtor_contain_button") {
   .tab-background::before,
   #tabs-newtab-button::before {
-    /* Box Model */
-    content: "";
-    display: block;
-    position: absolute;
+    @include separatorShape;
 
-    /* Position */
-    top: 50%;
+    /* More position */
     transform: translateX(-2.5px) translateY(calc(-50% + 1px));
-
-    /* Bar shape */
-    width: 1px;
-    height: 20px;
-
-    /* Bar Color */
-    opacity: 0;
-    background-color: var(--toolbarseparator-color);
   }
 }
 
@@ -31,23 +35,9 @@
   #tabbrowser-arrowscrollbox:not([overflowing])
     .tabbrowser-tab:not([visuallyselected], [multiselected], :hover)[last-visible-tab]
     .tab-background::after {
-    /* Box Model */
-    content: "";
-    display: block;
-    position: absolute;
-    top: 50%;
-
-    /* Bar shape */
-    width: 1px;
-    height: 20px;
-
-    /* Bar Color */
-    opacity: 0;
-    background-color: var(--toolbarseparator-color);
+    @include separatorShape;
   }
-}
 
-@include Option("userChrome.tab.dynamic_separtor_only_tab") {
   .tab-background::before {
     transform: translateX(-2.5px) translateY(calc(-50% + 1px)) !important;
   }