From 7d6f42296ad9012cc73c95554954f1c845cde041 Mon Sep 17 00:00:00 2001
From: Douglas Barone <douglasvbarone@gmail.com>
Date: Fri, 14 Jul 2023 10:51:53 -0400
Subject: [PATCH] Added solo toner bar

---
 web/src/components/PrinterCard.vue   | 1 +
 web/src/components/TonerLevelBar.vue | 9 +++++++--
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/web/src/components/PrinterCard.vue b/web/src/components/PrinterCard.vue
index ee84e17..764f731 100644
--- a/web/src/components/PrinterCard.vue
+++ b/web/src/components/PrinterCard.vue
@@ -64,6 +64,7 @@
           :level="printer.status[0].tonerBlackLevel"
           :model="printer.blackTonerModel"
           color="black"
+          :solo="!printer.status[0].tonerCyanLevel"
         />
         <toner-level-bar
           v-if="printer.status[0].tonerCyanLevel"
diff --git a/web/src/components/TonerLevelBar.vue b/web/src/components/TonerLevelBar.vue
index 9fe409e..9eeb3b5 100644
--- a/web/src/components/TonerLevelBar.vue
+++ b/web/src/components/TonerLevelBar.vue
@@ -4,7 +4,7 @@
       <div class="flex-grow-1 align-self-center">
         <v-progress-linear
           :title="`${level}%`"
-          :height="8"
+          :height="solo ? 30 : 12"
           :color="bgColor"
           :model-value="level"
         />
@@ -23,7 +23,11 @@
     </div>
     <code
       class="text-grey-darken-1"
-      style="font-size: 14px; top: -12px; position: relative"
+      :style="{
+        fontSize: '14px',
+        top: solo ? 0 : '-8px',
+        position: 'relative'
+      }"
     >
       {{ model }}
     </code>
@@ -37,6 +41,7 @@ const props = defineProps<{
   level: number
   color: 'black' | 'cyan' | 'magenta' | 'yellow'
   model: string
+  solo?: boolean
 }>()
 
 const bgColor = computed(() => {