From 58d1eb3b899b730877299be6635adceb127fe6a9 Mon Sep 17 00:00:00 2001
From: Anna Tsyganova <ATSyganova@IBS.RU>
Date: Fri, 10 Jun 2022 10:08:22 +0300
Subject: Fix inventory page Id task: SILABMC-155

---
 src/components/Global/PageSection.vue | 14 +++++++++++++-
 src/components/Global/StatusIcon.vue  | 16 ++++++++++------
 2 files changed, 23 insertions(+), 7 deletions(-)

(limited to 'src/components')

diff --git a/src/components/Global/PageSection.vue b/src/components/Global/PageSection.vue
index dd39ddd5..0521dc06 100644
--- a/src/components/Global/PageSection.vue
+++ b/src/components/Global/PageSection.vue
@@ -1,6 +1,9 @@
 <template>
   <div class="page-section">
     <h2 v-if="sectionTitle">{{ sectionTitle }}</h2>
+    <span v-if="sectionSmallTitle" class="bold-16px">
+      {{ sectionSmallTitle }}
+    </span>
     <slot />
   </div>
 </template>
@@ -13,17 +16,26 @@ export default {
       type: String,
       default: '',
     },
+    sectionSmallTitle: {
+      type: String,
+      default: '',
+    },
   },
 };
 </script>
 
 <style lang="scss" scoped>
 .page-section {
-  margin-bottom: $spacer * 4;
+  margin-bottom: $spacer * 1;
 }
 
 h2 {
   @include font-size($h3-font-size);
   margin-bottom: $spacer;
 }
+
+.bold-16px {
+  display: block;
+  margin: 25px 0 16px 0;
+}
 </style>
diff --git a/src/components/Global/StatusIcon.vue b/src/components/Global/StatusIcon.vue
index 4552633e..fb818451 100644
--- a/src/components/Global/StatusIcon.vue
+++ b/src/components/Global/StatusIcon.vue
@@ -1,26 +1,30 @@
 <template>
   <span :class="['status-icon', status]">
     <icon-info v-if="status === 'info'" />
-    <icon-success v-else-if="status === 'success'" />
+    <img
+      v-else-if="status === 'success'"
+      class="status__img"
+      src="@/assets/images/status/on.svg"
+    />
     <icon-warning v-else-if="status === 'warning'" />
-    <icon-danger v-else-if="status === 'danger'" />
+    <img
+      v-else-if="status === 'danger'"
+      class="status__img"
+      src="@/assets/images/status/off.svg"
+    />
     <icon-secondary v-else />
   </span>
 </template>
 
 <script>
 import IconInfo from '@carbon/icons-vue/es/information--filled/20';
-import IconCheckmark from '@carbon/icons-vue/es/checkmark--filled/20';
 import IconWarning from '@carbon/icons-vue/es/warning--filled/20';
 import IconError from '@carbon/icons-vue/es/error--filled/20';
-import IconMisuse from '@carbon/icons-vue/es/misuse/20';
 
 export default {
   name: 'StatusIcon',
   components: {
     IconInfo: IconInfo,
-    iconSuccess: IconCheckmark,
-    iconDanger: IconMisuse,
     iconSecondary: IconError,
     iconWarning: IconWarning,
   },
-- 
cgit v1.2.3