forks
/
amnezia-wg-easy
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix charts on mobile

This commit is contained in:
Sergei Birukov 2024-03-13 13:24:24 +03:00 committed by Philip H
parent 71c208133d
commit 98a5daf458
3 changed files with 17 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/www/css/app.css
View File

@ -1141,11 +1141,6 @@ video {
padding-bottom: 0.75rem;
}
.py-5 {
padding-top: 1.25rem;
padding-bottom: 1.25rem;
}
.pb-1 {
padding-bottom: 0.25rem;
}
@ -1597,6 +1592,11 @@ video {
padding-right: 0px;
}
.md\:py-5 {
padding-top: 1.25rem;
padding-bottom: 1.25rem;
}
.md\:pb-0 {
padding-bottom: 0px;
}

6
src/www/index.html
View File

@ -77,17 +77,17 @@
class="relative overflow-hidden border-b last:border-b-0 border-gray-100 dark:border-neutral-600 border-solid">
<!-- Chart -->
<div v-if="uiChartType" class="absolute z-0 bottom-0 left-0 right-0" style="top: 60%;">
<div v-if="uiChartType" class="absolute z-0 bottom-0 left-0 right-0 h-6" >
<apexchart width="100%" height="100%" :options="chartOptionsTX" :series="client.transferTxSeries">
</apexchart>
</div>
<div v-if="uiChartType" class="absolute z-0 top-0 left-0 right-0" style="bottom: 60%;">
<div v-if="uiChartType" class="absolute z-0 top-0 left-0 right-0 h-6" >
<apexchart width="100%" height="100%" :options="chartOptionsRX" :series="client.transferRxSeries"
style="transform: scaleY(-1);">
</apexchart>
</div>
<div class="relative py-5 px-3 z-10 flex flex-col sm:flex-row justify-between gap-3">
<div class="relative py-3 md:py-5 px-3 z-10 flex flex-col sm:flex-row justify-between gap-3">
<div class="flex gap-3 md:gap-4 w-full items-center ">
<!-- Avatar -->

13
src/www/js/app.js
View File

@ -86,6 +86,10 @@ new Vue({
animations: {
enabled: false,
},
parentHeightOffset: 0,
sparkline: {
enabled: true,
}
},
colors: [],
stroke: {
@ -117,10 +121,10 @@ new Vue({
show: false,
},
axisTicks: {
show: true,
show: false,
},
axisBorder: {
show: true,
show: false,
},
},
yaxis: {
@ -184,8 +188,9 @@ new Vue({
}
// Debug
// client.transferRx = this.clientsPersist[client.id].transferRxPrevious + Math.random() * 1000;
// client.transferTx = this.clientsPersist[client.id].transferTxPrevious + Math.random() * 1000;
client.transferRx = this.clientsPersist[client.id].transferRxPrevious + Math.random() * 1000;
client.transferTx = this.clientsPersist[client.id].transferTxPrevious + Math.random() * 1000;
client.latestHandshakeAt = new Date();
this.clientsPersist[client.id].transferRxCurrent = client.transferRx - this.clientsPersist[client.id].transferRxPrevious;
this.clientsPersist[client.id].transferRxPrevious = client.transferRx;