From cd1c0651eb384e25c601b5f7d3069de5d8b146a4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tom=C3=A1=C5=A1=20Ml=C3=A1dek?= <t@mldk.cz>
Date: Tue, 11 Feb 2025 21:35:10 +0100
Subject: [PATCH] feat: add DPR

---
 src/lib/ScreenInfo.svelte | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/lib/ScreenInfo.svelte b/src/lib/ScreenInfo.svelte
index d502e2f..a7366d7 100644
--- a/src/lib/ScreenInfo.svelte
+++ b/src/lib/ScreenInfo.svelte
@@ -5,14 +5,16 @@
 
 	let screenResolution = '... x ...';
 	let windowResolution = '';
+	let dpr = "1";
 
 	function updateResolution() {
-		const realWidth = Math.round(screen.width);
-		const realHeight = Math.round(screen.height);
+		const realWidth = Math.round(screen.width) * window.devicePixelRatio;
+		const realHeight = Math.round(screen.height) * window.devicePixelRatio;
 		const windowWidth = Math.round(window.innerWidth * window.devicePixelRatio);
 		const windowHeight = Math.round(window.innerHeight * window.devicePixelRatio);
 		screenResolution = `${realWidth} x ${realHeight}`;
 		windowResolution = `${windowWidth} x ${windowHeight}`;
+		dpr = String(Math.round(window.devicePixelRatio * 100) / 100);
 	}
 
 	onMount(() => {
@@ -33,6 +35,9 @@
 				<div class="value">{windowResolution}</div>
 			</div>
 		{/if}
+		{#if dpr !== "1"}
+			<div class="dpr">{$i18n.t("Device Pixel Ratio")}: {dpr}</div>
+		{/if}
 	</div>
 </div>
 
@@ -45,7 +50,7 @@
 		font-weight: bold;
 	}
 
-	.window {
+	.window, .dpr {
 		margin-top: calc(1em / 0.8);
 		font-size: 0.8em;
 	}