UI: Add fluid resolution-based scaling for WQHD and 4K displays in index.css

2026-06-26 13:44:20 +02:00
parent 77daa38cf0
commit 311f4d7b68
7 changed files with 29 additions and 7 deletions
@@ -210,3 +210,25 @@ input:focus, textarea:focus, select:focus {
  box-shadow: 0 0 0 2px hsl(var(--primary) / 0.15) !important;
  outline: none;
 }
+
+/* WQHD & 4K Monitor Responsive Scaling (Fluid Typography & UI Scaling) */
+@media (min-width: 1440px) {
+  html {
+    font-size: 16.5px;
+  }
+}
+@media (min-width: 1920px) {
+  html {
+    font-size: 17.5px;
+  }
+}
+@media (min-width: 2560px) {
+  html {
+    font-size: 19px;
+  }
+}
+@media (min-width: 3440px) {
+  html {
+    font-size: 20px;
+  }
+}