Merge pull request #3517 from wowsims/ui-high-res-scaling

Fix scaling on larger screens
wowsims · Aug 21, 2023 · f8b540c · f8b540c
2 parents cfda677 + 9263c8e
commit f8b540c
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 22 deletions.
diff --git a/ui/scss/core/components/detailed_results/_log_runner.scss b/ui/scss/core/components/detailed_results/_log_runner.scss
@@ -3,10 +3,6 @@
 	flex-direction: column;
 }
 
-.log-runner-control-bar {
-	margin-bottom: calc(var(--bs-gap) / 2);
-}
-
 .log-runner-logs > span {
 	display: block;
 }
diff --git a/ui/scss/shared/_global.scss b/ui/scss/shared/_global.scss
@@ -1,7 +1,9 @@
 @use "sass:map";
 
 :root {
+  --bs-body-font-size: 14px;
   --container-padding: #{$gap-width-sm};
+  font-size: var(--bs-body-font-size);
 }
 
 @include media-breakpoint-up(lg) {
@@ -18,27 +20,20 @@
 
 @include media-breakpoint-up(1080p) {
   :root {
-    --bs-body-font-size: 16px !important;
+    --bs-body-font-size: 16px;
   }
 }
 
-// // We want to apply only to 1440p monitors, NOT 1080p Ultrawide
-// @media (min-width: map.get($grid-breakpoints, 1440p)) and (max-aspect-ratio: 16/9) {
-//   :root {
-//     --bs-body-font-size: 20px !important;
-//   }
-// }
-
-// @include media-breakpoint-up(4k) {
-//   :root {
-//     --bs-body-font-size: 32px !important;
-//   }
-// }
+// We want to apply only to 1440p monitors, NOT 1080p Ultrawide
+@media (min-width: map.get($grid-breakpoints, 1440p)) and (max-aspect-ratio: 16/9) {
+  :root {
+    --bs-body-font-size: 24px;
+  }
+}
 
-// Use larger padding on 1080p+ ultrawide monitors
-@media (min-width: map.get($grid-breakpoints, 1080p)) and (min-aspect-ratio: 17/9) {
+@include media-breakpoint-up(4k) {
   :root {
-    --container-padding: 6rem;
+    --bs-body-font-size: 32px;
   }
 }
 

diff --git a/ui/scss/shared/_global_old.scss b/ui/scss/shared/_global_old.scss
@@ -1,6 +1,4 @@
 :root {
-	--bs-body-font-size: 14px;
-	--bs-gap: 1vw;
 	--theme-background-color: DarkSlateGrey;
 	--theme-background-image: linear-gradient(black, black);
 	--theme-background-opacity: 0.9;