From: Stephanie Leary <stephanie.leary@equinoxoli.org>
Date: Fri, 14 Apr 2023 19:37:50 +0000 (+0000)
Subject: LP1984007 Acq warning/stop percentage styles
X-Git-Url: https://old-git.evergreen-ils.org/?a=commitdiff_plain;h=5d3301341e2bb9a5e1f60041f96ddb5b9c5fb3e3;p=working%2FEvergreen.git

LP1984007 Acq warning/stop percentage styles

Styles the background and font color of warning and stop percentages and
adds an icon prefix, in both the dropdown options and the PO summary
table. These colors are in keeping with the less intense badges in my
branch for bug 1999282.

The margin/padding styles for the dropdown buttons are not ideal; it
would be better to have the warning/stop classes applied to the parent
button rather than the inner span. We should revisit this when the CSS
:has() selector has full support in Firefox.

Signed-off-by: Stephanie Leary <stephanie.leary@equinoxoli.org>
---

diff --git a/Open-ILS/src/eg2/src/app/staff/acq/lineitem/copy-attrs.component.css b/Open-ILS/src/eg2/src/app/staff/acq/lineitem/copy-attrs.component.css
index ca6cb05f1a..3065883727 100644
--- a/Open-ILS/src/eg2/src/app/staff/acq/lineitem/copy-attrs.component.css
+++ b/Open-ILS/src/eg2/src/app/staff/acq/lineitem/copy-attrs.component.css
@@ -1,7 +1,46 @@
-.fund-balance-state-stop {
-    color: #c00;
-    font-weight: bold;
+button.dropdown-item {
+    padding: 0;
 }
-.fund-balance-state-warning {
-    color: #c93;
+
+button.dropdown-item span {
+    display: block;
+    padding: .25rem 1.5rem;
+}
+
+button.dropdown-item .fund-balance-state-stop {
+    background: #f8d7da;
+    color: #58151c;
+    font-weight: 600;
+    padding-left: .2rem;
+}
+
+button.dropdown-item.active .fund-balance-state-stop {
+    background-color: #F1AFB5;
+}
+
+/* show octagon/stop ! ("report") icon */
+.fund-balance-state-stop::before {
+    content: "\e160";
+    font-family: "Material Icons";
+    font-weight: normal;
+    margin-right: .3ch;
+}
+
+button.dropdown-item .fund-balance-state-warning {
+    background-color: #ffe69c;
+    color: #723809;
+    font-weight: 600;
+    padding-left: .2rem;
+}
+
+button.dropdown-item.active .fund-balance-state-warning {
+    background-color: #FFDA6A;
+}
+
+/* show triangle ! ("warning") icon */
+.fund-balance-state-warning::before {
+    content: "\e002";
+    font-family: "Material Icons";
+    font-weight: normal;
+    margin-right: .3ch;
 }
diff --git a/Open-ILS/src/eg2/src/app/staff/acq/po/summary.component.css b/Open-ILS/src/eg2/src/app/staff/acq/po/summary.component.css
new file mode 100644
index 0000000000..363536b9e1
--- /dev/null
+++ b/Open-ILS/src/eg2/src/app/staff/acq/po/summary.component.css
@@ -0,0 +1,26 @@
+.text-danger {
+  background-color: #f8d7da;
+  color: #58151c !important;
+  font-weight: 600;
+  padding: 0 .25rem;
+}
+
+.text-danger::before {
+  content: "\e160";
+  font-family: "Material Icons";
+  font-weight: normal;
+  vertical-align: sub;
+}
+
+.bg-warning {
+  background-color: #ffe69c !important;
+  color: #723809;
+  font-weight: 600;
+}
+
+.bg-warning::before {
+  content: "\e002";
+  font-family: "Material Icons";
+  font-weight: normal;
+  vertical-align: sub;
+}
diff --git a/Open-ILS/src/eg2/src/app/staff/acq/po/summary.component.ts b/Open-ILS/src/eg2/src/app/staff/acq/po/summary.component.ts
index 8484cf0693..db1e66c0ed 100644
--- a/Open-ILS/src/eg2/src/app/staff/acq/po/summary.component.ts
+++ b/Open-ILS/src/eg2/src/app/staff/acq/po/summary.component.ts
@@ -23,6 +23,7 @@ const PO_ACTIVATION_WARNINGS = [
 
 @Component({
   templateUrl: 'summary.component.html',
+  styleUrls: ['./summary.component.css'],
   selector: 'eg-acq-po-summary'
 })
 export class PoSummaryComponent implements OnInit, OnDestroy {