From 88aad8501eb775dbc8cef9caad4f375c42016ba8 Mon Sep 17 00:00:00 2001
From: Vivacious Box <jon@rouillard.org>
Date: Sun, 21 Jun 2026 23:59:46 +0200
Subject: [PATCH] Change css to preview the graphics settings live (#4372)

<img width="1152" height="866" alt="settings"
src="https://github.com/user-attachments/assets/dff00f2e-775d-4b7e-8590-855813dcff7d"
/>


## Description:

Small qol change to be able to preview graphics settings changes

## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [x] I have added relevant tests to the test directory

## Please put your Discord username so you can be contacted if a bug or
regression is found:

Mr. Box
---
 src/client/hud/layers/GraphicsSettingsModal.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/client/hud/layers/GraphicsSettingsModal.ts b/src/client/hud/layers/GraphicsSettingsModal.ts
index bf423453d..8b2102aa3 100644
--- a/src/client/hud/layers/GraphicsSettingsModal.ts
+++ b/src/client/hud/layers/GraphicsSettingsModal.ts
@@ -609,11 +609,11 @@ export class GraphicsSettingsModal extends LitElement implements Controller {
 
     return html`
       <div
-        class="modal-overlay fixed inset-0 bg-black/60 backdrop-blur-xs z-2000 flex items-center justify-center p-4"
+        class="modal-overlay fixed inset-0 z-2000 flex items-center p-4 left-0 top-0 h-full w-fit"
         @contextmenu=${(e: Event) => e.preventDefault()}
       >
         <div
-          class="bg-slate-800 border border-slate-600 rounded-lg max-w-md w-full max-h-[80vh] overflow-y-auto"
+          class="bg-slate-800 border border-slate-600 rounded-lg max-w-md h-full overflow-y-auto"
         >
           <div
             class="flex items-center justify-between p-4 border-b border-slate-600"