ui: Redesign settings dialog with modern layout and improved UX

- Reorganize tabs in logical order (General first, UI, System, etc.)
- Implement single-row dynamic tab layout for cleaner appearance
- Shorten tab labels for better fit ("UI", "Graphics (Adv)")
- Fix Graphics tab layout with proper scrolling and spacing
- Remove redundant reset settings checkbox (use General tab instead)
- Apply modern dark theme styling with improved colors and spacing
- Enhance tab button sizing and responsiveness
- Update copyright headers for 2025

Signed-off-by: Zephyron <zephyron@citron-emu.org>

src/citron/configuration/configure.ui

@@ -6,72 +6,718 @@
    <rect>
     <x>0</x>
     <y>0</y>
-    <width>650</width>
+    <width>1400</width>
-    <height>650</height>
+    <height>900</height>
    </rect>
   </property>
   <property name="minimumSize">
    <size>
-    <width>0</width>
+    <width>1200</width>
-    <height>650</height>
+    <height>800</height>
    </size>
   </property>
   <property name="windowTitle">
    <string>citron Configuration</string>
   </property>
-  <layout class="QVBoxLayout" name="verticalLayout">
+  <property name="sizePolicy">
-   <item>
+   <sizepolicy hsizetype="Expanding" vsizetype="Expanding">
-    <layout class="QHBoxLayout" name="horizontalLayout">
+    <horstretch>0</horstretch>
-     <item>
+    <verstretch>0</verstretch>
-      <widget class="QListWidget" name="selectorList">
+   </sizepolicy>
-       <property name="minimumSize">
-        <size>
-         <width>120</width>
-         <height>0</height>
-        </size>
   </property>
-       <property name="maximumSize">
+  <property name="styleSheet">
-        <size>
+   <string>QDialog {
-         <width>120</width>
+    background-color: #2b2b2b;
-         <height>16777215</height>
+    color: #ffffff;
-        </size>
+}
+
+QWidget {
+    background-color: #2b2b2b;
+    color: #ffffff;
+}
+
+QStackedWidget {
+    background-color: #2b2b2b;
+    border: 1px solid #3d3d3d;
+    border-radius: 8px;
+    margin: 0px;
+    padding: 0px;
+}
+
+QScrollArea {
+    background-color: #2b2b2b;
+    border: none;
+    border-radius: 8px;
+}
+
+QScrollArea > QWidget > QWidget {
+    background-color: #2b2b2b;
+}
+
+QScrollBar:vertical {
+    background-color: #3d3d3d;
+    width: 14px;
+    border-radius: 7px;
+    margin: 2px;
+}
+
+QScrollBar::handle:vertical {
+    background-color: #5d5d5d;
+    border-radius: 6px;
+    min-height: 30px;
+    margin: 1px;
+}
+
+QScrollBar::handle:vertical:hover {
+    background-color: #4a9eff;
+}
+
+QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical {
+    border: none;
+    background: none;
+    height: 0px;
+}
+
+QScrollBar:horizontal {
+    background-color: #3d3d3d;
+    height: 14px;
+    border-radius: 7px;
+    margin: 2px;
+}
+
+QScrollBar::handle:horizontal {
+    background-color: #5d5d5d;
+    border-radius: 6px;
+    min-width: 30px;
+    margin: 1px;
+}
+
+QScrollBar::handle:horizontal:hover {
+    background-color: #4a9eff;
+}
+
+QScrollBar::add-line:horizontal, QScrollBar::sub-line:horizontal {
+    border: none;
+    background: none;
+    width: 0px;
+}
+
+QPushButton.tabButton {
+    background-color: #383838;
+    color: #ffffff;
+    padding: 10px 14px;
+    margin: 2px;
+    border-top-left-radius: 8px;
+    border-top-right-radius: 8px;
+    border-bottom-left-radius: 8px;
+    border-bottom-right-radius: 8px;
+    min-width: 85px;
+    max-width: 160px;
+    font-weight: 500;
+    border: 1px solid #3d3d3d;
+    text-align: center;
+}
+
+QPushButton.tabButton:checked {
+    background-color: #4a9eff;
+    color: #ffffff;
+    font-weight: bold;
+    border-color: #4a9eff;
+}
+
+QPushButton.tabButton:hover:!checked {
+    background-color: #4d4d4d;
+    border-color: #5d5d5d;
+}
+
+QPushButton.tabButton:pressed {
+    background-color: #2980b9;
+}
+
+QTabWidget {
+    background-color: #2b2b2b;
+    border: none;
+}
+
+QTabWidget::pane {
+    border: 1px solid #3d3d3d;
+    background-color: #2b2b2b;
+    border-radius: 8px;
+    margin: 0px;
+    padding: 0px;
+}
+
+QTabWidget::tab-bar {
+    alignment: left;
+}
+
+QTabBar {
+    background-color: #2b2b2b;
+    border: none;
+}
+
+QTabBar::tab {
+    background-color: #383838;
+    color: #ffffff;
+    padding: 12px 20px;
+    margin-right: 2px;
+    margin-bottom: 2px;
+    border-top-left-radius: 8px;
+    border-top-right-radius: 8px;
+    min-width: 100px;
+    font-weight: 500;
+    border: 1px solid #3d3d3d;
+    border-bottom: none;
+}
+
+QTabBar::tab:selected {
+    background-color: #4a9eff;
+    color: #ffffff;
+    font-weight: bold;
+    border-color: #4a9eff;
+}
+
+QTabBar::tab:hover:!selected {
+    background-color: #4d4d4d;
+    border-color: #5d5d5d;
+}
+
+QTabBar QToolButton {
+    background-color: #383838;
+    border: 1px solid #3d3d3d;
+    border-radius: 4px;
+    padding: 4px;
+    margin: 2px;
+}
+
+QTabBar QToolButton:hover {
+    background-color: #4d4d4d;
+    border-color: #4a9eff;
+}
+
+QTabBar::scroller {
+    width: 30px;
+}
+
+QGroupBox {
+    font-weight: bold;
+    border: 1px solid #3d3d3d;
+    border-radius: 8px;
+    margin-top: 12px;
+    padding-top: 12px;
+    background-color: #2b2b2b;
+    color: #ffffff;
+}
+
+QGroupBox::title {
+    subcontrol-origin: margin;
+    left: 12px;
+    padding: 0 8px 0 8px;
+    color: #ffffff;
+    font-weight: bold;
+}
+
+QCheckBox {
+    color: #ffffff;
+    spacing: 10px;
+    padding: 4px;
+    background-color: transparent;
+}
+
+QCheckBox::indicator {
+    width: 18px;
+    height: 18px;
+    border: 2px solid #5d5d5d;
+    border-radius: 4px;
+    background-color: #3d3d3d;
+}
+
+QCheckBox::indicator:checked {
+    background-color: #4a9eff;
+    border-color: #4a9eff;
+}
+
+QCheckBox::indicator:hover {
+    border-color: #4a9eff;
+}
+
+QComboBox {
+    background-color: #3d3d3d;
+    border: 1px solid #5d5d5d;
+    border-radius: 6px;
+    padding: 8px 12px;
+    color: #ffffff;
+    min-width: 120px;
+    min-height: 28px;
+    selection-background-color: #4a9eff;
+}
+
+QComboBox:hover {
+    border-color: #4a9eff;
+    background-color: #404040;
+}
+
+QComboBox:focus {
+    border-color: #4a9eff;
+    background-color: #404040;
+}
+
+QComboBox::drop-down {
+    border: none;
+    width: 25px;
+    subcontrol-origin: padding;
+    subcontrol-position: top right;
+    background-color: transparent;
+}
+
+QComboBox::down-arrow {
+    width: 12px;
+    height: 12px;
+    background-color: #ffffff;
+}
+
+QComboBox QAbstractItemView {
+    background-color: #3d3d3d;
+    border: 1px solid #4a9eff;
+    selection-background-color: #4a9eff;
+    color: #ffffff;
+    outline: none;
+}
+
+QComboBox QAbstractItemView::item {
+    padding: 8px;
+    border: none;
+    background-color: transparent;
+}
+
+QComboBox QAbstractItemView::item:selected {
+    background-color: #4a9eff;
+    color: #ffffff;
+}
+
+QComboBox QAbstractItemView::item:hover {
+    background-color: #5dafff;
+    color: #ffffff;
+}
+
+QLineEdit {
+    background-color: #3d3d3d;
+    border: 1px solid #5d5d5d;
+    border-radius: 6px;
+    padding: 8px 12px;
+    color: #ffffff;
+    min-height: 20px;
+    selection-background-color: #4a9eff;
+}
+
+QLineEdit:focus {
+    border-color: #4a9eff;
+    background-color: #404040;
+}
+
+QPushButton {
+    background-color: #4a9eff;
+    color: #ffffff;
+    border: none;
+    padding: 10px 20px;
+    border-radius: 6px;
+    font-weight: bold;
+    min-height: 20px;
+}
+
+QPushButton:hover {
+    background-color: #5dafff;
+}
+
+QPushButton:pressed {
+    background-color: #2980b9;
+}
+
+QPushButton:disabled {
+    background-color: #5d5d5d;
+    color: #8d8d8d;
+}
+
+QToolButton {
+    background-color: #4a9eff;
+    color: #ffffff;
+    border: none;
+    padding: 8px 12px;
+    border-radius: 6px;
+    font-weight: bold;
+    min-width: 32px;
+    min-height: 24px;
+}
+
+QToolButton:hover {
+    background-color: #5dafff;
+}
+
+QToolButton:pressed {
+    background-color: #2980b9;
+}
+
+QLabel {
+    color: #ffffff;
+    background-color: transparent;
+    padding: 2px;
+}
+
+QListWidget {
+    background-color: #3d3d3d;
+    border: 1px solid #5d5d5d;
+    border-radius: 6px;
+    color: #ffffff;
+    padding: 4px;
+}
+
+QListWidget::item {
+    padding: 8px;
+    border-radius: 4px;
+    margin: 1px;
+}
+
+QListWidget::item:selected {
+    background-color: #4a9eff;
+    color: #ffffff;
+}
+
+QListWidget::item:hover:!selected {
+    background-color: #4d4d4d;
+}
+
+QSlider::groove:horizontal {
+    border: 1px solid #5d5d5d;
+    height: 8px;
+    background-color: #3d3d3d;
+    border-radius: 4px;
+}
+
+QSlider::handle:horizontal {
+    background-color: #4a9eff;
+    border: 1px solid #4a9eff;
+    width: 18px;
+    margin: -5px 0;
+    border-radius: 9px;
+}
+
+QSlider::handle:horizontal:hover {
+    background-color: #5dafff;
+}
+
+QSpinBox, QDoubleSpinBox {
+    background-color: #3d3d3d;
+    border: 1px solid #5d5d5d;
+    border-radius: 6px;
+    padding: 6px;
+    color: #ffffff;
+    min-height: 20px;
+}
+
+QSpinBox:focus, QDoubleSpinBox:focus {
+    border-color: #4a9eff;
+    background-color: #404040;
+}
+
+QRadioButton {
+    color: #ffffff;
+    spacing: 8px;
+    padding: 4px;
+}
+
+QRadioButton::indicator {
+    width: 16px;
+    height: 16px;
+    border: 2px solid #5d5d5d;
+    border-radius: 8px;
+    background-color: #3d3d3d;
+}
+
+QRadioButton::indicator:checked {
+    background-color: #4a9eff;
+    border-color: #4a9eff;
+}
+
+QRadioButton::indicator:hover {
+    border-color: #4a9eff;
+}
+</string>
+  </property>
+  <layout class="QVBoxLayout" name="verticalLayout">
+   <property name="spacing">
+    <number>8</number>
+   </property>
+   <property name="leftMargin">
+    <number>12</number>
+   </property>
+   <property name="topMargin">
+    <number>12</number>
+   </property>
+   <property name="rightMargin">
+    <number>12</number>
+   </property>
+   <property name="bottomMargin">
+    <number>12</number>
+   </property>
+   <item>
+    <layout class="QVBoxLayout" name="tabContainer">
+     <property name="spacing">
+      <number>8</number>
+     </property>
+     <item>
+      <layout class="QGridLayout" name="tabButtonsLayout">
+       <property name="spacing">
+        <number>4</number>
+       </property>
+       <item row="0" column="0">
+        <widget class="QPushButton" name="generalTabButton">
+         <property name="text">
+          <string>General</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="checked">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
          </property>
         </widget>
        </item>
+       <item row="0" column="1">
+        <widget class="QPushButton" name="uiTabButton">
+         <property name="text">
+          <string>UI</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
+         </property>
+        </widget>
+       </item>
+       <item row="0" column="2">
+        <widget class="QPushButton" name="systemTabButton">
+         <property name="text">
+          <string>System</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
+         </property>
+        </widget>
+       </item>
+       <item row="0" column="3">
+        <widget class="QPushButton" name="cpuTabButton">
+         <property name="text">
+          <string>CPU</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
+         </property>
+        </widget>
+       </item>
+       <item row="0" column="4">
+        <widget class="QPushButton" name="graphicsTabButton">
+         <property name="text">
+          <string>Graphics</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
+         </property>
+        </widget>
+       </item>
+       <item row="0" column="5">
+        <widget class="QPushButton" name="graphicsAdvancedTabButton">
+         <property name="text">
+          <string>Graphics (Adv)</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
+         </property>
+        </widget>
+       </item>
+       <item row="0" column="6">
+        <widget class="QPushButton" name="audioTabButton">
+         <property name="text">
+          <string>Audio</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
+         </property>
+        </widget>
+       </item>
+       <item row="0" column="7">
+        <widget class="QPushButton" name="inputTabButton">
+         <property name="text">
+          <string>Input</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
+         </property>
+        </widget>
+       </item>
+       <item row="0" column="8">
+        <widget class="QPushButton" name="hotkeysTabButton">
+         <property name="text">
+          <string>Hotkeys</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
+         </property>
+        </widget>
+       </item>
+       <item row="0" column="9">
+        <widget class="QPushButton" name="networkTabButton">
+         <property name="text">
+          <string>Network</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
+         </property>
+        </widget>
+       </item>
+       <item row="0" column="10">
+        <widget class="QPushButton" name="webTabButton">
+         <property name="text">
+          <string>Web</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
+         </property>
+        </widget>
+       </item>
+       <item row="0" column="11">
+        <widget class="QPushButton" name="filesystemTabButton">
+         <property name="text">
+          <string>Filesystem</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
+         </property>
+        </widget>
+       </item>
+       <item row="0" column="12">
+        <widget class="QPushButton" name="profilesTabButton">
+         <property name="text">
+          <string>Profiles</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
+         </property>
+        </widget>
+       </item>
+       <item row="0" column="13">
+        <widget class="QPushButton" name="appletsTabButton">
+         <property name="text">
+          <string>Applets</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
+         </property>
+        </widget>
+       </item>
+       <item row="0" column="14">
+        <widget class="QPushButton" name="loggingTabButton">
+         <property name="text">
+          <string>Logging</string>
+         </property>
+         <property name="checkable">
+          <bool>true</bool>
+         </property>
+         <property name="class" stdset="0">
+          <string>tabButton</string>
+         </property>
+        </widget>
+       </item>
+       <item row="0" column="15">
+        <spacer name="tabButtonsSpacer">
+         <property name="orientation">
+          <enum>Qt::Horizontal</enum>
+         </property>
+         <property name="sizeHint" stdset="0">
+          <size>
+           <width>40</width>
+           <height>20</height>
+          </size>
+         </property>
+        </spacer>
+       </item>
+      </layout>
+     </item>
      <item>
-      <widget class="QTabWidget" name="tabWidget">
+      <widget class="QStackedWidget" name="stackedWidget">
+       <property name="sizePolicy">
+        <sizepolicy hsizetype="Expanding" vsizetype="Expanding">
+         <horstretch>0</horstretch>
+         <verstretch>0</verstretch>
+        </sizepolicy>
+       </property>
        <property name="currentIndex">
-        <number>-1</number>
+        <number>0</number>
        </property>
       </widget>
      </item>
     </layout>
    </item>
    <item>
-    <layout class="QHBoxLayout" name="horizontalLayout_2">
+    <layout class="QHBoxLayout" name="bottomLayout">
+     <property name="spacing">
+      <number>12</number>
+     </property>
      <property name="leftMargin">
-      <number>0</number>
+      <number>8</number>
      </property>
      <property name="topMargin">
-      <number>0</number>
+      <number>8</number>
      </property>
      <property name="rightMargin">
-      <number>0</number>
+      <number>8</number>
      </property>
      <property name="bottomMargin">
       <number>0</number>
      </property>
-     <item>
-      <widget class="QLabel" name="label">
-       <property name="text">
-        <string>Some settings are only available when a game is not running.</string>
-       </property>
-      </widget>
-     </item>
      <item>
       <widget class="QDialogButtonBox" name="buttonBox">
        <property name="standardButtons">
-        <set>QDialogButtonBox::Cancel|QDialogButtonBox::Ok</set>
+        <set>QDialogButtonBox::Apply|QDialogButtonBox::Cancel|QDialogButtonBox::Ok</set>
        </property>
       </widget>
      </item>

src/citron/configuration/configure_dialog.cpp

@@ -1,7 +1,14 @@
 // SPDX-FileCopyrightText: 2016 Citra Emulator Project
+// SPDX-FileCopyrightText: 2025 citron Emulator Project
 // SPDX-License-Identifier: GPL-2.0-or-later
 
 #include <memory>
+#include <QMessageBox>
+#include <QPushButton>
+#include <QScreen>
+#include <QApplication>
+#include <QButtonGroup>
+#include <QScrollArea>
 #include "common/logging/log.h"
 #include "common/settings.h"
 #include "common/settings_enums.h"
@@ -28,6 +35,18 @@
 #include "citron/hotkeys.h"
 #include "citron/uisettings.h"
 
+// Helper function to create a scroll area for a widget
+QScrollArea* CreateScrollArea(QWidget* widget) {
+    auto* scroll_area = new QScrollArea();
+    scroll_area->setWidget(widget);
+    scroll_area->setWidgetResizable(true);
+    scroll_area->setFrameShape(QFrame::NoFrame);
+    scroll_area->setHorizontalScrollBarPolicy(Qt::ScrollBarAsNeeded);
+    scroll_area->setVerticalScrollBarPolicy(Qt::ScrollBarAsNeeded);
+    scroll_area->setStyleSheet(QLatin1String("QScrollArea { border: none; background-color: #2b2b2b; }"));
+    return scroll_area;
+}
+
 ConfigureDialog::ConfigureDialog(QWidget* parent, HotkeyRegistry& registry_,
                                  InputCommon::InputSubsystem* input_subsystem,
                                  std::vector<VkDeviceInfo::Record>& vk_device_records,
@@ -58,23 +77,69 @@ ConfigureDialog::ConfigureDialog(QWidget* parent, HotkeyRegistry& registry_,
       web_tab{std::make_unique<ConfigureWeb>(this)} {
     Settings::SetConfiguringGlobal(true);
 
+    // Set window flags to include maximize button and make it resizable
+    setWindowFlags(Qt::Dialog | Qt::WindowTitleHint | Qt::WindowSystemMenuHint |
+                   Qt::WindowMinMaxButtonsHint | Qt::WindowCloseButtonHint);
+
     ui->setupUi(this);
 
-    ui->tabWidget->addTab(applets_tab.get(), tr("Applets"));
+    // Set size policy and enable resizing
-    ui->tabWidget->addTab(audio_tab.get(), tr("Audio"));
+    setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
-    ui->tabWidget->addTab(cpu_tab.get(), tr("CPU"));
+
-    ui->tabWidget->addTab(debug_tab_tab.get(), tr("Debug"));
+    // Get screen geometry and set to fullscreen
-    ui->tabWidget->addTab(filesystem_tab.get(), tr("Filesystem"));
+    QScreen* screen = QApplication::primaryScreen();
-    ui->tabWidget->addTab(general_tab.get(), tr("General"));
+    if (screen) {
-    ui->tabWidget->addTab(graphics_tab.get(), tr("Graphics"));
+        QRect screenGeometry = screen->availableGeometry();
-    ui->tabWidget->addTab(graphics_advanced_tab.get(), tr("GraphicsAdvanced"));
+        setGeometry(screenGeometry);
-    ui->tabWidget->addTab(hotkeys_tab.get(), tr("Hotkeys"));
+        showMaximized(); // Start maximized/fullscreen
-    ui->tabWidget->addTab(input_tab.get(), tr("Controls"));
+    }
-    ui->tabWidget->addTab(profile_tab.get(), tr("Profiles"));
+
-    ui->tabWidget->addTab(network_tab.get(), tr("Network"));
+    // Create button group for exclusive tab selection
-    ui->tabWidget->addTab(system_tab.get(), tr("System"));
+    tab_button_group = std::make_unique<QButtonGroup>(this);
-    ui->tabWidget->addTab(ui_tab.get(), tr("Game List"));
+    tab_button_group->setExclusive(true);
-    ui->tabWidget->addTab(web_tab.get(), tr("Web"));
+
+    // Add tab buttons to the button group and connect to stacked widget
+    tab_button_group->addButton(ui->generalTabButton, 0);
+    tab_button_group->addButton(ui->uiTabButton, 1);
+    tab_button_group->addButton(ui->systemTabButton, 2);
+    tab_button_group->addButton(ui->cpuTabButton, 3);
+    tab_button_group->addButton(ui->graphicsTabButton, 4);
+    tab_button_group->addButton(ui->graphicsAdvancedTabButton, 5);
+    tab_button_group->addButton(ui->audioTabButton, 6);
+    tab_button_group->addButton(ui->inputTabButton, 7);
+    tab_button_group->addButton(ui->hotkeysTabButton, 8);
+    tab_button_group->addButton(ui->networkTabButton, 9);
+    tab_button_group->addButton(ui->webTabButton, 10);
+    tab_button_group->addButton(ui->filesystemTabButton, 11);
+    tab_button_group->addButton(ui->profilesTabButton, 12);
+    tab_button_group->addButton(ui->appletsTabButton, 13);
+    tab_button_group->addButton(ui->loggingTabButton, 14);
+
+    // Add pages to stacked widget wrapped in scroll areas in the same order as button group
+    ui->stackedWidget->addWidget(CreateScrollArea(general_tab.get()));   // 0
+    ui->stackedWidget->addWidget(CreateScrollArea(ui_tab.get()));        // 1
+    ui->stackedWidget->addWidget(CreateScrollArea(system_tab.get()));    // 2
+    ui->stackedWidget->addWidget(CreateScrollArea(cpu_tab.get()));       // 3
+    ui->stackedWidget->addWidget(CreateScrollArea(graphics_tab.get()));  // 4
+    ui->stackedWidget->addWidget(CreateScrollArea(graphics_advanced_tab.get())); // 5
+    ui->stackedWidget->addWidget(CreateScrollArea(audio_tab.get()));     // 6
+    ui->stackedWidget->addWidget(CreateScrollArea(input_tab.get()));     // 7
+    ui->stackedWidget->addWidget(CreateScrollArea(hotkeys_tab.get()));   // 8
+    ui->stackedWidget->addWidget(CreateScrollArea(network_tab.get()));   // 9
+    ui->stackedWidget->addWidget(CreateScrollArea(web_tab.get()));       // 10
+    ui->stackedWidget->addWidget(CreateScrollArea(filesystem_tab.get()));// 11
+    ui->stackedWidget->addWidget(CreateScrollArea(profile_tab.get()));   // 12
+    ui->stackedWidget->addWidget(CreateScrollArea(applets_tab.get()));   // 13
+    ui->stackedWidget->addWidget(CreateScrollArea(debug_tab_tab.get())); // 14
+
+    // Connect button group to stacked widget
+    connect(tab_button_group.get(), QOverload<int>::of(&QButtonGroup::idClicked),
+            [this](int id) {
+                ui->stackedWidget->setCurrentIndex(id);
+                if (id == 14) { // Logging tab
+                    debug_tab_tab->SetCurrentIndex(0);
+                }
+            });
 
     web_tab->SetWebServiceConfigEnabled(enable_web_config);
     hotkeys_tab->Populate(registry);
@@ -84,27 +149,22 @@ ConfigureDialog::ConfigureDialog(QWidget* parent, HotkeyRegistry& registry_,
     general_tab->SetResetCallback([&] { this->close(); });
 
     SetConfiguration();
-    PopulateSelectionList();
 
-    connect(ui->tabWidget, &QTabWidget::currentChanged, this, [this](int index) {
-        if (index != -1) {
-            debug_tab_tab->SetCurrentIndex(0);
-        }
-    });
     connect(ui_tab.get(), &ConfigureUi::LanguageChanged, this, &ConfigureDialog::OnLanguageChanged);
-    connect(ui->selectorList, &QListWidget::itemSelectionChanged, this,
-            &ConfigureDialog::UpdateVisibleTabs);
 
     if (system.IsPoweredOn()) {
-        QPushButton* apply_button = ui->buttonBox->addButton(QDialogButtonBox::Apply);
+        QPushButton* apply_button = ui->buttonBox->button(QDialogButtonBox::Apply);
+        if (apply_button) {
             connect(apply_button, &QAbstractButton::clicked, this,
                     &ConfigureDialog::HandleApplyButtonClicked);
         }
+    }
 
-    adjustSize();
+    // Set initial tab to General (index 0)
-    ui->selectorList->setCurrentRow(0);
+    ui->stackedWidget->setCurrentIndex(0);
+    ui->generalTabButton->setChecked(true);
 
-    // Selects the leftmost button on the bottom bar (Cancel as of writing)
+    // Focus on the OK button by default
     ui->buttonBox->setFocus();
 }
 
@@ -141,16 +201,12 @@ void ConfigureDialog::changeEvent(QEvent* event) {
 }
 
 void ConfigureDialog::RetranslateUI() {
-    const int old_row = ui->selectorList->currentRow();
+    const int old_index = ui->stackedWidget->currentIndex();
-    const int old_index = ui->tabWidget->currentIndex();
 
     ui->retranslateUi(this);
 
-    PopulateSelectionList();
+    SetConfiguration();
-    ui->selectorList->setCurrentRow(old_row);
+    ui->stackedWidget->setCurrentIndex(old_index);
-
-    UpdateVisibleTabs();
-    ui->tabWidget->setCurrentIndex(old_index);
 }
 
 void ConfigureDialog::HandleApplyButtonClicked() {
@@ -158,32 +214,6 @@ void ConfigureDialog::HandleApplyButtonClicked() {
     ApplyConfiguration();
 }
 
-Q_DECLARE_METATYPE(QList<QWidget*>);
-
-void ConfigureDialog::PopulateSelectionList() {
-    const std::array<std::pair<QString, QList<QWidget*>>, 6> items{
-        {{tr("General"),
-          {general_tab.get(), hotkeys_tab.get(), ui_tab.get(), web_tab.get(), debug_tab_tab.get()}},
-         {tr("System"),
-          {system_tab.get(), profile_tab.get(), network_tab.get(), filesystem_tab.get(),
-           applets_tab.get()}},
-         {tr("CPU"), {cpu_tab.get()}},
-         {tr("Graphics"), {graphics_tab.get(), graphics_advanced_tab.get()}},
-         {tr("Audio"), {audio_tab.get()}},
-         {tr("Controls"), input_tab->GetSubTabs()}},
-    };
-
-    [[maybe_unused]] const QSignalBlocker blocker(ui->selectorList);
-
-    ui->selectorList->clear();
-    for (const auto& entry : items) {
-        auto* const item = new QListWidgetItem(entry.first);
-        item->setData(Qt::UserRole, QVariant::fromValue(entry.second));
-
-        ui->selectorList->addItem(item);
-    }
-}
-
 void ConfigureDialog::OnLanguageChanged(const QString& locale) {
     emit LanguageChanged(locale);
     // Reloading the game list is needed to force retranslation.
@@ -193,21 +223,3 @@ void ConfigureDialog::OnLanguageChanged(const QString& locale) {
     RetranslateUI();
     SetConfiguration();
 }
-
-void ConfigureDialog::UpdateVisibleTabs() {
-    const auto items = ui->selectorList->selectedItems();
-    if (items.isEmpty()) {
-        return;
-    }
-
-    [[maybe_unused]] const QSignalBlocker blocker(ui->tabWidget);
-
-    ui->tabWidget->clear();
-
-    const auto tabs = qvariant_cast<QList<QWidget*>>(items[0]->data(Qt::UserRole));
-
-    for (auto* const tab : tabs) {
-        LOG_DEBUG(Frontend, "{}", tab->accessibleName().toStdString());
-        ui->tabWidget->addTab(tab, tab->accessibleName());
-    }
-}

src/citron/configuration/configure_dialog.h

@@ -1,4 +1,5 @@
 // SPDX-FileCopyrightText: 2016 Citra Emulator Project
+// SPDX-FileCopyrightText: 2025 citron Emulator Project
 // SPDX-License-Identifier: GPL-2.0-or-later
 
 #pragma once
@@ -6,6 +7,7 @@
 #include <memory>
 #include <vector>
 #include <QDialog>
+#include <QButtonGroup>
 #include "configuration/shared_widget.h"
 #include "citron/configuration/configuration_shared.h"
 #include "citron/configuration/shared_translation.h"
@@ -66,8 +68,6 @@ private:
     void HandleApplyButtonClicked();
 
     void SetConfiguration();
-    void UpdateVisibleTabs();
-    void PopulateSelectionList();
 
     std::unique_ptr<Ui::ConfigureDialog> ui;
     HotkeyRegistry& registry;
@@ -75,6 +75,7 @@ private:
     Core::System& system;
     std::unique_ptr<ConfigurationShared::Builder> builder;
     std::vector<ConfigurationShared::Tab*> tab_group;
+    std::unique_ptr<QButtonGroup> tab_button_group;
 
     std::unique_ptr<ConfigureApplets> applets_tab;
     std::unique_ptr<ConfigureAudio> audio_tab;

src/citron/configuration/configure_graphics.ui

@@ -6,8 +6,8 @@
    <rect>
     <x>0</x>
     <y>0</y>
-    <width>541</width>
+    <width>800</width>
-    <height>759</height>
+    <height>600</height>
    </rect>
   </property>
   <property name="windowTitle">
@@ -16,18 +16,218 @@
   <property name="accessibleName">
    <string>Graphics</string>
   </property>
+  <property name="styleSheet">
+   <string>QWidget {
+    background-color: #2b2b2b;
+    color: #ffffff;
+}
+
+QGroupBox {
+    font-weight: bold;
+    border: 1px solid #3d3d3d;
+    border-radius: 8px;
+    margin-top: 12px;
+    padding-top: 12px;
+    background-color: #2b2b2b;
+    color: #ffffff;
+}
+
+QGroupBox::title {
+    subcontrol-origin: margin;
+    left: 12px;
+    padding: 0 8px 0 8px;
+    color: #ffffff;
+    font-weight: bold;
+}
+
+QComboBox {
+    background-color: #3d3d3d;
+    border: 1px solid #5d5d5d;
+    border-radius: 6px;
+    padding: 8px 12px;
+    color: #ffffff;
+    min-width: 200px;
+    min-height: 28px;
+    selection-background-color: #4a9eff;
+}
+
+QComboBox:hover {
+    border-color: #4a9eff;
+    background-color: #404040;
+}
+
+QComboBox:focus {
+    border-color: #4a9eff;
+    background-color: #404040;
+}
+
+QComboBox::drop-down {
+    border: none;
+    width: 25px;
+    subcontrol-origin: padding;
+    subcontrol-position: top right;
+    background-color: transparent;
+}
+
+QComboBox::down-arrow {
+    width: 12px;
+    height: 12px;
+    background-color: #ffffff;
+}
+
+QComboBox QAbstractItemView {
+    background-color: #3d3d3d;
+    border: 1px solid #4a9eff;
+    selection-background-color: #4a9eff;
+    color: #ffffff;
+    outline: none;
+    padding: 4px;
+}
+
+QComboBox QAbstractItemView::item {
+    padding: 8px;
+    border: none;
+    background-color: transparent;
+    min-height: 20px;
+}
+
+QComboBox QAbstractItemView::item:selected {
+    background-color: #4a9eff;
+    color: #ffffff;
+}
+
+QComboBox QAbstractItemView::item:hover {
+    background-color: #5dafff;
+    color: #ffffff;
+}
+
+QCheckBox {
+    color: #ffffff;
+    spacing: 12px;
+    padding: 6px;
+    background-color: transparent;
+    min-height: 24px;
+}
+
+QCheckBox::indicator {
+    width: 18px;
+    height: 18px;
+    border: 2px solid #5d5d5d;
+    border-radius: 4px;
+    background-color: #3d3d3d;
+}
+
+QCheckBox::indicator:checked {
+    background-color: #4a9eff;
+    border-color: #4a9eff;
+}
+
+QCheckBox::indicator:hover {
+    border-color: #4a9eff;
+}
+
+QPushButton {
+    background-color: #4a9eff;
+    color: #ffffff;
+    border: none;
+    padding: 10px 20px;
+    border-radius: 6px;
+    font-weight: bold;
+    min-height: 20px;
+}
+
+QPushButton:hover {
+    background-color: #5dafff;
+}
+
+QPushButton:pressed {
+    background-color: #2980b9;
+}
+
+QLabel {
+    color: #ffffff;
+    background-color: transparent;
+    padding: 4px;
+    min-width: 120px;
+}
+
+QSlider::groove:horizontal {
+    border: 1px solid #5d5d5d;
+    height: 8px;
+    background-color: #3d3d3d;
+    border-radius: 4px;
+}
+
+QSlider::handle:horizontal {
+    background-color: #4a9eff;
+    border: 1px solid #4a9eff;
+    width: 18px;
+    margin: -5px 0;
+    border-radius: 9px;
+}
+
+QSlider::handle:horizontal:hover {
+    background-color: #5dafff;
+}
+
+QSpinBox, QDoubleSpinBox {
+    background-color: #3d3d3d;
+    border: 1px solid #5d5d5d;
+    border-radius: 6px;
+    padding: 6px;
+    color: #ffffff;
+    min-height: 20px;
+}
+
+QSpinBox:focus, QDoubleSpinBox:focus {
+    border-color: #4a9eff;
+    background-color: #404040;
+}
+</string>
+  </property>
   <layout class="QVBoxLayout" name="verticalLayout_1">
-   <item>
+   <property name="spacing">
-    <layout class="QVBoxLayout" name="verticalLayout_2">
+    <number>20</number>
+   </property>
+   <property name="leftMargin">
+    <number>24</number>
+   </property>
+   <property name="topMargin">
+    <number>24</number>
+   </property>
+   <property name="rightMargin">
+    <number>24</number>
+   </property>
+   <property name="bottomMargin">
+    <number>24</number>
+   </property>
    <item>
     <widget class="QGroupBox" name="groupBox_2">
      <property name="title">
       <string>API Settings</string>
      </property>
      <layout class="QVBoxLayout" name="verticalLayout_3">
+      <property name="spacing">
+       <number>16</number>
+      </property>
+      <property name="leftMargin">
+       <number>20</number>
+      </property>
+      <property name="topMargin">
+       <number>20</number>
+      </property>
+      <property name="rightMargin">
+       <number>20</number>
+      </property>
+      <property name="bottomMargin">
+       <number>20</number>
+      </property>
       <item>
        <widget class="QWidget" name="api_widget" native="true">
         <layout class="QHBoxLayout" name="horizontalLayout">
+         <property name="spacing">
+          <number>16</number>
+         </property>
          <property name="leftMargin">
           <number>0</number>
          </property>
@@ -48,19 +248,31 @@
    </item>
    <item>
     <widget class="QGroupBox" name="groupBox">
-       <property name="maximumSize">
-        <size>
-         <width>16777215</width>
-         <height>16777215</height>
-        </size>
-       </property>
      <property name="title">
       <string>Graphics Settings</string>
      </property>
      <layout class="QVBoxLayout" name="verticalLayout_4">
+      <property name="spacing">
+       <number>16</number>
+      </property>
+      <property name="leftMargin">
+       <number>20</number>
+      </property>
+      <property name="topMargin">
+       <number>20</number>
+      </property>
+      <property name="rightMargin">
+       <number>20</number>
+      </property>
+      <property name="bottomMargin">
+       <number>20</number>
+      </property>
       <item>
        <widget class="QWidget" name="graphics_widget" native="true">
         <layout class="QVBoxLayout" name="verticalLayout">
+         <property name="spacing">
+          <number>12</number>
+         </property>
          <property name="leftMargin">
           <number>0</number>
          </property>
@@ -79,6 +291,9 @@
       <item>
        <widget class="QWidget" name="bg_widget" native="true">
         <layout class="QHBoxLayout" name="bg_layout">
+         <property name="spacing">
+          <number>16</number>
+         </property>
          <property name="leftMargin">
           <number>0</number>
          </property>
@@ -102,6 +317,12 @@
            <property name="text">
             <string>Background Color:</string>
            </property>
+           <property name="minimumSize">
+            <size>
+             <width>120</width>
+             <height>0</height>
+            </size>
+           </property>
           </widget>
          </item>
          <item>
@@ -114,8 +335,14 @@
            </property>
            <property name="maximumSize">
             <size>
-               <width>40</width>
+             <width>80</width>
-               <height>16777215</height>
+             <height>40</height>
+            </size>
+           </property>
+           <property name="minimumSize">
+            <size>
+             <width>80</width>
+             <height>40</height>
             </size>
            </property>
            <property name="text">
@@ -129,8 +356,6 @@
      </layout>
     </widget>
    </item>
-    </layout>
-   </item>
    <item>
     <spacer name="verticalSpacer">
      <property name="orientation">

src/citron/configuration/configure_ui.cpp

@@ -1,4 +1,5 @@
 // SPDX-FileCopyrightText: 2016 Citra Emulator Project
+// SPDX-FileCopyrightText: 2025 citron Emulator Project
 // SPDX-License-Identifier: GPL-2.0-or-later
 
 #include "citron/configuration/configure_ui.h"
@@ -18,6 +19,8 @@
 #include <QString>
 #include <QToolButton>
 #include <QVariant>
+#include <QListWidget>
+#include <QMessageBox>
 
 #include "common/common_types.h"
 #include "common/fs/path_util.h"

src/citron/configuration/configure_ui.ui

@@ -6,25 +6,197 @@
    <rect>
     <x>0</x>
     <y>0</y>
-    <width>363</width>
+    <width>1200</width>
-    <height>603</height>
+    <height>800</height>
    </rect>
   </property>
+  <property name="minimumSize">
+   <size>
+    <width>1000</width>
+    <height>600</height>
+   </size>
+  </property>
   <property name="windowTitle">
    <string>Form</string>
   </property>
   <property name="accessibleName">
    <string>UI</string>
   </property>
-  <layout class="QVBoxLayout" name="verticalLayout">
+  <property name="styleSheet">
+   <string>QWidget {
+    background-color: #2b2b2b;
+    color: #ffffff;
+}
+
+QGroupBox {
+    font-weight: bold;
+    border: 1px solid #3d3d3d;
+    border-radius: 8px;
+    margin-top: 12px;
+    padding-top: 12px;
+    background-color: #2b2b2b;
+}
+
+QGroupBox::title {
+    subcontrol-origin: margin;
+    left: 12px;
+    padding: 0 8px 0 8px;
+    color: #ffffff;
+}
+
+QCheckBox {
+    color: #ffffff;
+    spacing: 12px;
+    padding: 6px;
+    background-color: transparent;
+    min-height: 24px;
+}
+
+QCheckBox::indicator {
+    width: 18px;
+    height: 18px;
+    border: 2px solid #5d5d5d;
+    border-radius: 4px;
+    background-color: #3d3d3d;
+}
+
+QCheckBox::indicator:checked {
+    background-color: #4a9eff;
+    border-color: #4a9eff;
+}
+
+QCheckBox::indicator:hover {
+    border-color: #4a9eff;
+}
+
+QComboBox {
+    background-color: #3d3d3d;
+    border: 1px solid #5d5d5d;
+    border-radius: 6px;
+    padding: 8px 12px;
+    color: #ffffff;
+    min-width: 160px;
+    min-height: 28px;
+}
+
+QComboBox:hover {
+    border-color: #4a9eff;
+    background-color: #404040;
+}
+
+QComboBox:focus {
+    border-color: #4a9eff;
+    background-color: #404040;
+}
+
+QComboBox::drop-down {
+    border: none;
+    width: 24px;
+    subcontrol-origin: padding;
+    subcontrol-position: top right;
+}
+
+QComboBox::down-arrow {
+    width: 12px;
+    height: 12px;
+}
+
+QComboBox QAbstractItemView {
+    background-color: #3d3d3d;
+    border: 1px solid #4a9eff;
+    selection-background-color: #4a9eff;
+    color: #ffffff;
+}
+
+QLineEdit {
+    background-color: #3d3d3d;
+    border: 1px solid #5d5d5d;
+    border-radius: 6px;
+    padding: 8px 12px;
+    color: #ffffff;
+    min-height: 28px;
+}
+
+QLineEdit:focus {
+    border-color: #4a9eff;
+    background-color: #404040;
+}
+
+QToolButton {
+    background-color: #4a9eff;
+    color: #ffffff;
+    border: none;
+    padding: 8px 12px;
+    border-radius: 6px;
+    font-weight: bold;
+    min-width: 40px;
+    min-height: 32px;
+}
+
+QToolButton:hover {
+    background-color: #5dafff;
+}
+
+QToolButton:pressed {
+    background-color: #2980b9;
+}
+
+QLabel {
+    color: #ffffff;
+    background-color: transparent;
+    padding: 4px;
+    min-width: 140px;
+}
+</string>
+  </property>
+  <layout class="QHBoxLayout" name="mainHorizontalLayout">
+   <property name="spacing">
+    <number>32</number>
+   </property>
+   <property name="leftMargin">
+    <number>32</number>
+   </property>
+   <property name="topMargin">
+    <number>32</number>
+   </property>
+   <property name="rightMargin">
+    <number>32</number>
+   </property>
+   <property name="bottomMargin">
+    <number>32</number>
+   </property>
+   <item>
+    <layout class="QVBoxLayout" name="leftColumnLayout">
+     <property name="spacing">
+      <number>20</number>
+     </property>
      <item>
       <widget class="QGroupBox" name="general_groupBox">
        <property name="title">
         <string>General</string>
        </property>
-     <layout class="QHBoxLayout" name="horizontalLayout">
+       <property name="minimumSize">
-      <item>
+        <size>
-       <layout class="QVBoxLayout" name="verticalLayout_2">
+         <width>500</width>
+         <height>0</height>
+        </size>
+       </property>
+       <layout class="QVBoxLayout" name="generalVerticalLayout">
+        <property name="spacing">
+         <number>12</number>
+        </property>
+        <property name="leftMargin">
+         <number>20</number>
+        </property>
+        <property name="topMargin">
+         <number>20</number>
+        </property>
+        <property name="rightMargin">
+         <number>20</number>
+        </property>
+        <property name="bottomMargin">
+         <number>20</number>
+        </property>
         <item>
          <widget class="QLabel" name="label_change_language_info">
           <property name="text">
@@ -33,35 +205,68 @@
           <property name="wordWrap">
            <bool>true</bool>
           </property>
+          <property name="styleSheet">
+           <string>color: #cccccc; font-size: 11px;</string>
+          </property>
          </widget>
         </item>
         <item>
-         <layout class="QHBoxLayout" name="horizontalLayout_2">
+         <layout class="QHBoxLayout" name="languageLayout">
+          <property name="spacing">
+           <number>16</number>
+          </property>
           <item>
            <widget class="QLabel" name="language_label">
             <property name="text">
              <string>Interface language:</string>
             </property>
+            <property name="minimumSize">
+             <size>
+              <width>140</width>
+              <height>0</height>
+             </size>
+            </property>
            </widget>
           </item>
           <item>
-           <widget class="QComboBox" name="language_combobox"/>
+           <widget class="QComboBox" name="language_combobox">
+            <property name="sizePolicy">
+             <sizepolicy hsizetype="Expanding" vsizetype="Fixed">
+              <horstretch>0</horstretch>
+              <verstretch>0</verstretch>
+             </sizepolicy>
+            </property>
+           </widget>
           </item>
          </layout>
         </item>
         <item>
-         <layout class="QHBoxLayout" name="horizontalLayout_3">
+         <layout class="QHBoxLayout" name="themeLayout">
+          <property name="spacing">
+           <number>16</number>
+          </property>
           <item>
            <widget class="QLabel" name="theme_label">
             <property name="text">
              <string>Theme:</string>
             </property>
+            <property name="minimumSize">
+             <size>
+              <width>140</width>
+              <height>0</height>
+             </size>
+            </property>
            </widget>
           </item>
           <item>
-           <widget class="QComboBox" name="theme_combobox"/>
+           <widget class="QComboBox" name="theme_combobox">
-          </item>
+            <property name="sizePolicy">
-         </layout>
+             <sizepolicy hsizetype="Expanding" vsizetype="Fixed">
+              <horstretch>0</horstretch>
+              <verstretch>0</verstretch>
+             </sizepolicy>
+            </property>
+           </widget>
           </item>
          </layout>
         </item>
@@ -73,14 +278,39 @@
        <property name="title">
         <string>Game List</string>
        </property>
-     <layout class="QHBoxLayout" name="GameListHorizontalLayout">
+       <property name="minimumSize">
-      <item>
+        <size>
-       <layout class="QVBoxLayout" name="GeneralVerticalLayout">
+         <width>500</width>
+         <height>0</height>
+        </size>
+       </property>
+       <layout class="QVBoxLayout" name="gameListVerticalLayout">
+        <property name="spacing">
+         <number>12</number>
+        </property>
+        <property name="leftMargin">
+         <number>20</number>
+        </property>
+        <property name="topMargin">
+         <number>20</number>
+        </property>
+        <property name="rightMargin">
+         <number>20</number>
+        </property>
+        <property name="bottomMargin">
+         <number>20</number>
+        </property>
         <item>
          <widget class="QCheckBox" name="show_compat">
           <property name="text">
            <string>Show Compatibility List</string>
           </property>
+          <property name="minimumSize">
+           <size>
+            <width>0</width>
+            <height>32</height>
+           </size>
+          </property>
          </widget>
         </item>
         <item>
@@ -88,6 +318,12 @@
           <property name="text">
            <string>Show Add-Ons Column</string>
           </property>
+          <property name="minimumSize">
+           <size>
+            <width>0</width>
+            <height>32</height>
+           </size>
+          </property>
          </widget>
         </item>
         <item>
@@ -95,6 +331,12 @@
           <property name="text">
            <string>Show Size Column</string>
           </property>
+          <property name="minimumSize">
+           <size>
+            <width>0</width>
+            <height>32</height>
+           </size>
+          </property>
          </widget>
         </item>
         <item>
@@ -102,6 +344,12 @@
           <property name="text">
            <string>Show File Types Column</string>
           </property>
+          <property name="minimumSize">
+           <size>
+            <width>0</width>
+            <height>32</height>
+           </size>
+          </property>
          </widget>
         </item>
         <item>
@@ -109,147 +357,139 @@
           <property name="text">
            <string>Show Play Time Column</string>
           </property>
+          <property name="minimumSize">
+           <size>
+            <width>0</width>
+            <height>32</height>
+           </size>
+          </property>
          </widget>
         </item>
         <item>
-         <layout class="QHBoxLayout" name="game_icon_size_qhbox_layout_2">
+         <layout class="QHBoxLayout" name="game_icon_size_layout">
+          <property name="spacing">
+           <number>16</number>
+          </property>
           <item>
            <widget class="QLabel" name="game_icon_size_label">
             <property name="text">
              <string>Game Icon Size:</string>
             </property>
+            <property name="minimumSize">
+             <size>
+              <width>140</width>
+              <height>0</height>
+             </size>
+            </property>
            </widget>
           </item>
           <item>
-           <widget class="QComboBox" name="game_icon_size_combobox"/>
+           <widget class="QComboBox" name="game_icon_size_combobox">
+            <property name="sizePolicy">
+             <sizepolicy hsizetype="Expanding" vsizetype="Fixed">
+              <horstretch>0</horstretch>
+              <verstretch>0</verstretch>
+             </sizepolicy>
+            </property>
+           </widget>
           </item>
          </layout>
         </item>
         <item>
-         <layout class="QHBoxLayout" name="folder_icon_size_qhbox_layout_2">
+         <layout class="QHBoxLayout" name="folder_icon_size_layout">
+          <property name="spacing">
+           <number>16</number>
+          </property>
           <item>
            <widget class="QLabel" name="folder_icon_size_label">
             <property name="text">
              <string>Folder Icon Size:</string>
             </property>
+            <property name="minimumSize">
+             <size>
+              <width>140</width>
+              <height>0</height>
+             </size>
+            </property>
            </widget>
           </item>
           <item>
-           <widget class="QComboBox" name="folder_icon_size_combobox"/>
+           <widget class="QComboBox" name="folder_icon_size_combobox">
+            <property name="sizePolicy">
+             <sizepolicy hsizetype="Expanding" vsizetype="Fixed">
+              <horstretch>0</horstretch>
+              <verstretch>0</verstretch>
+             </sizepolicy>
+            </property>
+           </widget>
           </item>
          </layout>
         </item>
         <item>
-         <layout class="QHBoxLayout" name="row_1_qhbox_layout">
+         <layout class="QHBoxLayout" name="row_1_layout">
+          <property name="spacing">
+           <number>16</number>
+          </property>
           <item>
            <widget class="QLabel" name="row_1_label">
             <property name="text">
              <string>Row 1 Text:</string>
             </property>
+            <property name="minimumSize">
+             <size>
+              <width>140</width>
+              <height>0</height>
+             </size>
+            </property>
            </widget>
           </item>
           <item>
-           <widget class="QComboBox" name="row_1_text_combobox"/>
+           <widget class="QComboBox" name="row_1_text_combobox">
+            <property name="sizePolicy">
+             <sizepolicy hsizetype="Expanding" vsizetype="Fixed">
+              <horstretch>0</horstretch>
+              <verstretch>0</verstretch>
+             </sizepolicy>
+            </property>
+           </widget>
           </item>
          </layout>
         </item>
         <item>
-         <layout class="QHBoxLayout" name="row_2_qhbox_layout">
+         <layout class="QHBoxLayout" name="row_2_layout">
+          <property name="spacing">
+           <number>16</number>
+          </property>
           <item>
            <widget class="QLabel" name="row_2_label">
             <property name="text">
              <string>Row 2 Text:</string>
             </property>
-           </widget>
+            <property name="minimumSize">
-          </item>
+             <size>
-          <item>
+              <width>140</width>
-           <widget class="QComboBox" name="row_2_text_combobox"/>
+              <height>0</height>
-          </item>
+             </size>
-         </layout>
-        </item>
-       </layout>
-      </item>
-     </layout>
-    </widget>
-   </item>
-   <item>
-    <widget class="QGroupBox" name="screenshots_GroupBox">
-     <property name="title">
-      <string>Screenshots</string>
-     </property>
-     <layout class="QVBoxLayout" name="verticalLayout_4">
-      <item>
-       <layout class="QVBoxLayout" name="verticalLayout_3">
-        <item>
-         <widget class="QCheckBox" name="enable_screenshot_save_as">
-          <property name="text">
-           <string>Ask Where To Save Screenshots (Windows Only)</string>
             </property>
            </widget>
           </item>
           <item>
-         <layout class="QHBoxLayout" name="horizontalLayout_4">
+           <widget class="QComboBox" name="row_2_text_combobox">
-          <item>
+            <property name="sizePolicy">
-           <widget class="QLabel" name="label">
+             <sizepolicy hsizetype="Expanding" vsizetype="Fixed">
-            <property name="text">
+              <horstretch>0</horstretch>
-             <string>Screenshots Path: </string>
+              <verstretch>0</verstretch>
-            </property>
+             </sizepolicy>
-           </widget>
-          </item>
-          <item>
-           <widget class="QLineEdit" name="screenshot_path_edit"/>
-          </item>
-          <item>
-           <widget class="QToolButton" name="screenshot_path_button">
-            <property name="text">
-             <string>...</string>
-            </property>
-           </widget>
-          </item>
-         </layout>
-        </item>
-        <item>
-         <layout class="QGridLayout" name="gridLayout">
-          <property name="spacing">
-           <number>6</number>
-          </property>
-          <item row="0" column="1">
-           <layout class="QHBoxLayout" name="horizontalLayout_5">
-            <item>
-             <widget class="QLabel" name="screenshot_width">
-              <property name="text">
-               <string>TextLabel</string>
-              </property>
-              <property name="alignment">
-               <set>Qt::AlignRight|Qt::AlignTrailing|Qt::AlignVCenter</set>
-              </property>
-             </widget>
-            </item>
-            <item>
-             <widget class="QComboBox" name="screenshot_height">
-              <property name="editable">
-               <bool>true</bool>
-              </property>
-             </widget>
-            </item>
-           </layout>
-          </item>
-          <item row="0" column="0">
-           <widget class="QLabel" name="label_3">
-            <property name="text">
-             <string>Resolution:</string>
             </property>
            </widget>
           </item>
          </layout>
         </item>
        </layout>
-      </item>
-     </layout>
       </widget>
      </item>
      <item>
-    <spacer name="verticalSpacer">
+      <spacer name="leftVerticalSpacer">
        <property name="orientation">
         <enum>Qt::Vertical</enum>
        </property>
@@ -262,6 +502,157 @@
       </spacer>
      </item>
     </layout>
+   </item>
+   <item>
+    <layout class="QVBoxLayout" name="rightColumnLayout">
+     <property name="spacing">
+      <number>20</number>
+     </property>
+     <item>
+      <widget class="QGroupBox" name="screenshots_GroupBox">
+       <property name="title">
+        <string>Screenshots</string>
+       </property>
+       <property name="minimumSize">
+        <size>
+         <width>500</width>
+         <height>0</height>
+        </size>
+       </property>
+       <layout class="QVBoxLayout" name="screenshotsVerticalLayout">
+        <property name="spacing">
+         <number>16</number>
+        </property>
+        <property name="leftMargin">
+         <number>20</number>
+        </property>
+        <property name="topMargin">
+         <number>20</number>
+        </property>
+        <property name="rightMargin">
+         <number>20</number>
+        </property>
+        <property name="bottomMargin">
+         <number>20</number>
+        </property>
+        <item>
+         <widget class="QCheckBox" name="enable_screenshot_save_as">
+          <property name="text">
+           <string>Ask Where To Save Screenshots (Windows Only)</string>
+          </property>
+          <property name="minimumSize">
+           <size>
+            <width>0</width>
+            <height>32</height>
+           </size>
+          </property>
+         </widget>
+        </item>
+        <item>
+         <layout class="QHBoxLayout" name="screenshotPathLayout">
+          <property name="spacing">
+           <number>12</number>
+          </property>
+          <item>
+           <widget class="QLabel" name="screenshot_path_label">
+            <property name="text">
+             <string>Screenshots Path:</string>
+            </property>
+            <property name="minimumSize">
+             <size>
+              <width>140</width>
+              <height>0</height>
+             </size>
+            </property>
+           </widget>
+          </item>
+          <item>
+           <widget class="QLineEdit" name="screenshot_path_edit">
+            <property name="sizePolicy">
+             <sizepolicy hsizetype="Expanding" vsizetype="Fixed">
+              <horstretch>0</horstretch>
+              <verstretch>0</verstretch>
+             </sizepolicy>
+            </property>
+           </widget>
+          </item>
+          <item>
+           <widget class="QToolButton" name="screenshot_path_button">
+            <property name="text">
+             <string>...</string>
+            </property>
+           </widget>
+          </item>
+         </layout>
+        </item>
+        <item>
+         <layout class="QHBoxLayout" name="resolutionLayout">
+          <property name="spacing">
+           <number>12</number>
+          </property>
+          <item>
+           <widget class="QLabel" name="resolution_label">
+            <property name="text">
+             <string>Resolution:</string>
+            </property>
+            <property name="minimumSize">
+             <size>
+              <width>80</width>
+              <height>0</height>
+             </size>
+            </property>
+           </widget>
+          </item>
+          <item>
+           <widget class="QLabel" name="screenshot_width">
+            <property name="text">
+             <string>TextLabel</string>
+            </property>
+            <property name="alignment">
+             <set>Qt::AlignRight|Qt::AlignTrailing|Qt::AlignVCenter</set>
+            </property>
+            <property name="minimumSize">
+             <size>
+              <width>120</width>
+              <height>0</height>
+             </size>
+            </property>
+           </widget>
+          </item>
+          <item>
+           <widget class="QComboBox" name="screenshot_height">
+            <property name="editable">
+             <bool>true</bool>
+            </property>
+            <property name="sizePolicy">
+             <sizepolicy hsizetype="Expanding" vsizetype="Fixed">
+              <horstretch>0</horstretch>
+              <verstretch>0</verstretch>
+             </sizepolicy>
+            </property>
+           </widget>
+          </item>
+         </layout>
+        </item>
+       </layout>
+      </widget>
+     </item>
+     <item>
+      <spacer name="rightVerticalSpacer">
+       <property name="orientation">
+        <enum>Qt::Vertical</enum>
+       </property>
+       <property name="sizeHint" stdset="0">
+        <size>
+         <width>20</width>
+         <height>40</height>
+        </size>
+       </property>
+      </spacer>
+     </item>
+    </layout>
+   </item>
+  </layout>
  </widget>
  <resources/>
  <connections/>