From 07a775c32d3290babcd1ed242ded50ddc0b30b95 Mon Sep 17 00:00:00 2001
From: Alex Andreev <alex.andreev.email@gmail.com>
Date: Fri, 14 Oct 2022 16:56:54 +0300
Subject: [PATCH] Fix scss compilation warning by removing flex.box dependency
 (#6411)

* Save only used selectors from flex.box library

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Remove flex.box dependency

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
---
 package.json                         |   1 -
 src/renderer/components/app.scss     |   2 +-
 src/renderer/components/flexbox.scss | 114 +++++++++++++++++++++++++++
 yarn.lock                            |   5 --
 4 files changed, 115 insertions(+), 7 deletions(-)
 create mode 100644 src/renderer/components/flexbox.scss

diff --git a/package.json b/package.json
index 15e0310fea..e3e6301163 100644
--- a/package.json
+++ b/package.json
@@ -385,7 +385,6 @@
     "eslint-plugin-react": "7.31.10",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-unused-imports": "^2.0.0",
-    "flex.box": "^3.4.4",
     "fork-ts-checker-webpack-plugin": "^6.5.2",
     "gunzip-maybe": "^1.4.2",
     "html-webpack-plugin": "^5.5.0",
diff --git a/src/renderer/components/app.scss b/src/renderer/components/app.scss
index 19c7b53d6f..434159eee0 100755
--- a/src/renderer/components/app.scss
+++ b/src/renderer/components/app.scss
@@ -7,7 +7,7 @@
 @tailwind components;
 @tailwind utilities;
 
-@import "~flex.box";
+@import "./flexbox";
 @import "../themes/theme-vars";
 @import "./fonts";
 
diff --git a/src/renderer/components/flexbox.scss b/src/renderer/components/flexbox.scss
new file mode 100644
index 0000000000..5ebad45641
--- /dev/null
+++ b/src/renderer/components/flexbox.scss
@@ -0,0 +1,114 @@
+//-- Flexbox
+.flex {
+  display: flex;
+
+  &.inline {
+    display: inline-flex;
+  }
+
+  &.fullsize {
+    width: 100vw;
+    height: 100vh;
+  }
+
+  &.column {
+    flex-direction: column;
+    &.reverse {
+      flex-direction: column-reverse;
+    }
+  }
+
+  &.reverse {
+    flex-direction: row-reverse;
+  }
+
+  &.wrap {
+    flex-wrap: wrap;
+    &-reverse {
+      flex-wrap: wrap-reverse;
+    }
+  }
+
+  &.auto {
+    > * {
+      flex: 1 1 0%;
+    }
+  }
+
+  &.center {
+    > * {
+      margin: auto;
+    }
+  }
+
+  $flex: flex-start flex-end center;
+  $justifyContent: join($flex, space-around space-between);
+  $alignContent: join($justifyContent, stretch);
+  $alignItems: join($flex, stretch baseline);
+
+  // align items in x-axis for flex=row (default) and in y-axis when flex=column mode
+  @each $mod in $justifyContent {
+    &.justify-#{$mod} {
+      justify-content: $mod;
+    }
+  }
+
+  @each $mod in $alignItems {
+    &.align-#{$mod} {
+      align-items: $mod;
+    }
+  }
+  @each $mod in $alignContent {
+    &.content-#{$mod} {
+      align-content: $mod;
+    }
+  }
+
+  // gaps
+  &.gaps {
+    $gap: var(--flex-gap, 1em);
+    &.column {
+      &:not(.reverse) > :not(:last-child) {
+        margin-bottom: $gap;
+      }
+      &.reverse > :not(:last-child) {
+        margin-top: $gap;
+      }
+    }
+    &:not(.column) {
+      &:not(.reverse) > :not(:last-child) {
+        margin-right: $gap;
+      }
+      &.reverse > :not(:last-child) {
+        margin-left: $gap;
+      }
+    }
+  }
+
+  // children
+  > .box {
+    &.grow {
+      flex: 1 0;
+      &-fixed {
+        flex: 1 0 0;
+      }
+    }
+    &.center {
+      margin: auto;
+    }
+    &.left {
+      margin-left: 0;
+      margin-right: auto;
+    }
+    &.right {
+      margin-right: 0;
+      margin-left: auto;
+    }
+
+    @each $mod in $alignItems {
+      &.self-#{$mod} {
+        align-self: $mod;
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/yarn.lock b/yarn.lock
index f321690ab1..17d4651ff1 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6098,11 +6098,6 @@ flatted@^3.1.0:
   resolved "https://registry.yarnpkg.com/flatted/-/flatted-3.2.5.tgz#76c8584f4fc843db64702a6bd04ab7a8bd666da3"
   integrity sha512-WIWGi2L3DyTUvUrwRKgGi9TwxQMUEqPOPQBVi71R96jZXJdFskXEmf54BoZaS1kknGODoIGASGEzBUYdyMCBJg==
 
-flex.box@^3.4.4:
-  version "3.4.4"
-  resolved "https://registry.yarnpkg.com/flex.box/-/flex.box-3.4.4.tgz#cef28a542458f4668c5d499bcd7fa97aa82b8413"
-  integrity sha512-PG0rguh20zXyBuWmMmDCR0JjW9rtxK48OGMSzpLyGSRioTKeMNs9nbn1Dun+EsIp3wZozSpChbqMsU8a3IgHXg==
-
 fn.name@1.x.x:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/fn.name/-/fn.name-1.1.0.tgz#26cad8017967aea8731bc42961d04a3d5988accc"