From 9f7ad4a936fc28051f23d16ef80426e6f78edee2 Mon Sep 17 00:00:00 2001
From: 0xJacky <me@jackyu.cn>
Date: Tue, 14 Jun 2022 13:43:41 +0800
Subject: [PATCH] fix dashboard radial bar issue

---
 frontend/src/components/Chart/RadialBarChart.vue | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/Chart/RadialBarChart.vue b/frontend/src/components/Chart/RadialBarChart.vue
index 4299cd54..eff187f4 100644
--- a/frontend/src/components/Chart/RadialBarChart.vue
+++ b/frontend/src/components/Chart/RadialBarChart.vue
@@ -2,7 +2,7 @@
     <div class="container">
         <p class="text">{{ centerText }}</p>
         <p class="bottom_text">{{ bottomText }}</p>
-        <apexchart type="radialBar" height="205" :options="chartOptions" :series="series" ref="chart"/>
+        <apexchart class="radialBar" type="radialBar" height="205" :options="chartOptions" :series="series" ref="chart"/>
     </div>
 </template>
 
@@ -83,6 +83,14 @@ export default {
     position: relative;
     margin: 0 auto;
     height: 112px!important;
+    .radialBar {
+        position: absolute;
+        top: -30px;
+        @media(max-width: 768px) and (min-width: 290px) {
+            left: 50%;
+            transform: translateX(-50%);
+        }
+    }
     .text {
         position: absolute;
         top: calc(50% - 5px);