Browse Source

fix dashboard radial bar issue

0xJacky 3 years ago
parent
commit
9f7ad4a936
1 changed files with 9 additions and 1 deletions
  1. 9 1
      frontend/src/components/Chart/RadialBarChart.vue

+ 9 - 1
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);