mudhorn/uptime-kuma
1
0
Fork 0
mirror of https://github.com/louislam/uptime-kuma.git synced 2024-11-11 08:04:17 -08:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

improve heartbeat bar rendering in different dpi

Browse source
This commit is contained in:
LouisLam 2021-09-04 23:32:46 +08:00
parent 17453a8812
commit cc25787878
1 changed files with 21 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
src/components/HeartbeatBar.vue
View file

@ -124,9 +124,27 @@ export default {
}, },
mounted() { mounted() {
if (this.size === "small") { if (this.size === "small") {
this.beatHeight = 16;
// Handle strange render problem in different DPI.
if (window.devicePixelRatio === 1.25) {
this.beatWidth = 5.6; this.beatWidth = 5.6;
this.beatMargin = 2.4; this.beatMargin = 2.4;
this.beatHeight = 16
} else if (window.devicePixelRatio === 1.75) {
this.beatWidth = 5.7;
this.beatMargin = 2.4;
} else if (window.devicePixelRatio === 2.25) {
this.beatWidth = 5.8;
this.beatMargin = 2.4;
} else {
// 100%, 150%, 200% ...
this.beatWidth = 6;
this.beatMargin = 2;
}
} }
window.addEventListener("resize", this.resize); window.addEventListener("resize", this.resize);