1 files changed, 187 insertions, 0 deletions
diff --git a/meta-ibs/meta-cp2-5422/recipes-phosphor/webui/webui-vue/0073-IBS-custom-styles-_buttons.scss.patch b/meta-ibs/meta-cp2-5422/recipes-phosphor/webui/webui-vue/0073-IBS-custom-styles-_buttons.scss.patch
new file mode 100644
index 0000000000..0ff4344c10
--- /dev/null
+++ b/meta-ibs/meta-cp2-5422/recipes-phosphor/webui/webui-vue/0073-IBS-custom-styles-_buttons.scss.patch
@@ -0,0 +1,187 @@
+From 990924d19a56b5dace9ca596bb55fa407e698715 Mon Sep 17 00:00:00 2001
+From: "Andrey V.Kosteltsev" <AKosteltsev@IBS.RU>
+Date: Tue, 28 Jun 2022 05:02:55 +0300
+Subject: [PATCH] IBS: custom styles _buttons.scss
+
+---
+ src/assets/styles/bmc/custom/_buttons.scss | 132 +++++++++++++++++----
+ 1 file changed, 112 insertions(+), 20 deletions(-)
+
+diff --git a/src/assets/styles/bmc/custom/_buttons.scss b/src/assets/styles/bmc/custom/_buttons.scss
+index 2a7b8169..b3a69757 100644
+--- a/src/assets/styles/bmc/custom/_buttons.scss
++++ b/src/assets/styles/bmc/custom/_buttons.scss
+@@ -10,7 +10,7 @@
+     margin-right: $spacer / 4;
+   }
+   &:disabled {
+-    color: gray("600");
++    color: $red;
+     fill: currentColor;
+     box-shadow: none !important;
+     &:not(.btn-link) {
+@@ -21,27 +21,114 @@
+ }
+ 
+ .btn-primary {
+-  fill: currentColor;
+-  &:focus,
+-  &:not(:disabled):not(.disabled):active:focus {
+-    border-color: $white;
+-    box-shadow: inset 0 0 0 3px theme-color('primary'), inset 0 0 0 5px $white;
++  background-color: $red;
++  border-radius: $border-radius;
++  border: none;
++  box-shadow: 1px 2px 2px -1px #4f252566 inset;
++  &:hover {
++    background-color: $red-hover;
++  }
++  &:not(:disabled):not(.disabled):active:focus,
++  &:focus-visible {
++    border: none;
++    box-shadow: none;
++    background-color: $red-click;
++  }
++  &:focus {
++    border: none;
++    box-shadow: 0px 0px 0px 4px $red-shadow;
++    background-color: $red;
++  }
++  &:active {
++    border: none;
++    box-shadow: none;
++    background-color: $red;
+   }
+ }
+ 
+ .btn-secondary {
+-  fill: currentColor;
+-  &:focus,
+-  &:not(:disabled):not(.disabled):active:focus {
+-    border-color: $white;
+-    box-shadow: inset 0 0 0 3px theme-color('secondary'), inset 0 0 0 5px $white;
++  background-color: $dark;
++  color: $gray-2;
++  border-radius: $border-radius;
++  border: none;
++  box-shadow: 1px 2px 4px -1px rgb(79 37 37 / 10%) inset;
++  font-style: normal;
++  font-weight: 600;
++  font-size: 16px;
++  line-height: 20px;
++  &:hover {
++    background-color: $dark-hover;
++    color: $gray-2;
++  }
++  &:focus {
++    border: none;
++    box-shadow: 0px 0px 0px 4px $red-shadow;
++    color: $gray-2;
++    background-color: $dark;
++  }
++  &:not(:disabled):not(.disabled):active:focus,
++  &:focus-visible {
++    border: none;
++    box-shadow: none;
++    color: $gray-2;
++    background-color: $dark;
++  }
++}
++
++.btn-unstiled {
++  border: none;
++  &:focus {
++    box-shadow: none;
++  }
++  &:active {
++    box-shadow: none;
++  }
++}
++
++.btn-popover {
++  border: none;
++  color: $red;
++  height: 28px;
++  border-radius: $border-radius;
++  font-weight: 500;
++  font-size: 12px;
++  transition: ease-in 0.2s;
++  &:hover {
++    color: $white;
++    transition: ease-in 0.2s;
++  }
++  &:focus {
++    box-shadow: none;
++  }
++  &:active {
++    box-shadow: none;
++  }
++  &.selected-unit-button {
++    transition: ease-in 0.2s;
++    color: $white;
++  }
++  &.selected-choice-button {
++    transition: ease-in 0.2s;
++    color: $white;
++  }
++}
++
++.btn-toogle-popover {
++  justify-content: flex-start;
++  width: 25px;
++  height: 16px;
++  padding: 0;
++  &:focus {
++    box-shadow: none;
++  }
++  &:active {
++    box-shadow: none;
+   }
+ }
+ 
+ // Global style for all button link
+ .btn-link {
+-  font-weight: $headings-font-weight;
+-  fill: theme-color("primary");
++  color: $text-primary;
+   text-decoration: none !important;
+   &:hover {
+     background-color: gray("200");
+@@ -50,14 +137,19 @@
+   &:active {
+     background-color: gray("300");
+   }
+-  &:focus {
+-    box-shadow: inset 0 0 0 2px theme-color("primary");
+-    color: theme-color("primary");
+-    outline: none;
+-  }
+   &:disabled {
+     box-shadow: $btn-focus-box-shadow;
+   }
++  &.collapsed {
++    .icon-expand {
++      transform: rotate(180deg);
++      transition: 0.3s linear;
++    }
++    .icon-expand-right {
++      transform: rotate(180deg);
++      transition: 0.3s linear;
++    }
++  }
+ }
+ 
+ // Icon only buttons
+@@ -77,6 +169,6 @@
+ // Contain input buttons within input
+ .btn-datepicker .dropdown-toggle,
+ .input-action-btn {
+-  padding: 7px;
++  padding: 6px;
+   margin: 1px;
+-}
+\ No newline at end of file
++}
+-- 
+2.35.1
+