From 78e97bdbb76ec09b18342e91dfe221acb375ae19 Mon Sep 17 00:00:00 2001 From: Fazri Gading Date: Sat, 31 Jan 2026 01:42:20 +0800 Subject: [PATCH] feat: create two columns for settings page --- GUI/index.html | 1647 ++++++++++++++++++++++++------------------------ GUI/style.css | 31 + 2 files changed, 856 insertions(+), 822 deletions(-) diff --git a/GUI/index.html b/GUI/index.html index 20c7fc4..f571002 100644 --- a/GUI/index.html +++ b/GUI/index.html @@ -1,823 +1,826 @@ - - - - - - - Hytale F2P Launcher - - - - - - - -
- Background -
-
-
- -
- - -
-
-
- - Players: - 0 -
- -
- -
-
- -
-
-
- - Manage Profiles -
-
-
- -
- - - -
-
- -
-

- HYTALE -

-
- -
-
-
-
-

- HYTALE -

-

UNOFFICIAL HYTALE LAUNCHER

-
- -
-
- - -
- -
- -
- - -
-
- -
- - -
-
- -
- - -
-
-
-
- - -
-
-
- - - -
-
-
-

- - SYSTEM LOGS -

-
- - - -
-
-
-
Loading - logs...
-
-
-
-
-
-
- -
-
-
-

- - MY MODS -

- -
-
-
-
-
-
-
- - - - - - - - - -
- - Loading... -
- - - - - - - - - - - - - - - + + + + + + + Hytale F2P Launcher + + + + + + + +
+ Background +
+
+
+ +
+ + +
+
+
+ + Players: + 0 +
+ +
+ +
+
+ +
+
+
+ + Manage Profiles +
+
+
+ +
+ + + +
+
+ +
+

+ HYTALE +

+
+ +
+
+
+
+

+ HYTALE +

+

UNOFFICIAL HYTALE LAUNCHER

+
+ +
+
+ + +
+ +
+ +
+ + +
+
+ +
+ + +
+
+ +
+ + +
+
+
+
+ + +
+
+
+ + + +
+
+
+

+ + SYSTEM LOGS +

+
+ + + +
+
+
+
Loading + logs...
+
+
+
+
+
+
+ +
+
+
+

+ + MY MODS +

+ +
+
+
+
+
+
+
+ + + + + + + + + +
+ + Loading... +
+ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/GUI/style.css b/GUI/style.css index 2c77598..ae53c72 100644 --- a/GUI/style.css +++ b/GUI/style.css @@ -1398,6 +1398,26 @@ body { max-width: 600px; margin: 0 auto; padding-top: 2rem; + padding-bottom: 4rem; + display: flex; + flex-direction: column; + gap: 1.5rem; +} + +@media (min-width: 1024px) { + .settings-content { + max-width: 1000px; + flex-direction: row; + align-items: start; + } +} + +.settings-column { + flex: 1; + display: flex; + flex-direction: column; + gap: 1.5rem; + min-width: 0; } .setting-group { @@ -4466,6 +4486,12 @@ body { overflow-y: auto; } +@media (min-width: 1024px) { + .settings-container { + max-width: 1200px; + } +} + .settings-header { margin-bottom: 1rem; text-align: center; @@ -4495,6 +4521,11 @@ body { transition: all 0.3s ease; } +.settings-content .settings-section, +.settings-column .settings-section { + margin-bottom: 0; +} + .settings-section:hover { border-color: rgba(147, 51, 234, 0.3); box-shadow: 0 8px 32px rgba(147, 51, 234, 0.1);