Adjust styling of submenu.

src/ui/elements/ui_radio.cpp

@@ -9,13 +9,16 @@ namespace recompui {
 
         set_text(name);
         set_cursor(Cursor::Pointer);
-        set_font_size(28.0f);
-        set_letter_spacing(3.08f);
-        set_line_height(28.0f);
-        set_font_weight(700);
+        set_font_size(20.0f);
+        set_letter_spacing(2.8f);
+        set_line_height(20.0f);
+        set_font_weight(400);
+        set_font_style(FontStyle::Normal);
         set_border_color(Color{ 242, 242, 242, 255 });
         set_border_bottom_width(0.0f);
         set_color(Color{ 255, 255, 255, 153 });
+        set_padding_bottom(8.0f);
+        set_text_transform(TextTransform::Uppercase);
         hover_style.set_color(Color{ 255, 255, 255, 204 });
         checked_style.set_color(Color{ 255, 255, 255, 255 });
         checked_style.set_border_bottom_width(1.0f);
@@ -69,7 +72,8 @@ namespace recompui {
     }
 
     Radio::Radio(Element *parent) : Container(parent, FlexDirection::Row, JustifyContent::FlexStart) {
-        set_gap(12.0f);
+        set_gap(24.0f);
+        set_flex_grow(0.0f);
     }
 
     Radio::~Radio() {

src/ui/elements/ui_style.cpp

@@ -67,6 +67,22 @@ namespace recompui {
         }
     }
 
+    static Rml::Style::TextTransform to_rml(TextTransform text_transform) {
+        switch (text_transform) {
+        case TextTransform::None:
+            return Rml::Style::TextTransform::None;
+        case TextTransform::Capitalize:
+            return Rml::Style::TextTransform::Capitalize;
+        case TextTransform::Uppercase:
+            return Rml::Style::TextTransform::Uppercase;
+        case TextTransform::Lowercase:
+            return Rml::Style::TextTransform::Lowercase;
+        default:
+            assert(false && "Unknown text transform.");
+            return Rml::Style::TextTransform::None;
+        }
+    }
+
     static Rml::Style::Drag to_rml(Drag drag) {
         switch (drag) {
         case Drag::None:
@@ -478,6 +494,10 @@ namespace recompui {
         set_property(Rml::PropertyId::TextAlign, to_rml(text_align), Animation());
     }
 
+    void Style::set_text_transform(TextTransform text_transform) {
+        set_property(Rml::PropertyId::TextTransform, to_rml(text_transform), Animation());
+    }
+
     void Style::set_gap(float size, Unit unit, Animation animation) {
         set_row_gap(size, unit, animation);
         set_column_gap(size, unit, animation);

src/ui/elements/ui_style.h

@@ -81,6 +81,7 @@ namespace recompui {
         void set_font_style(FontStyle style);
         void set_font_weight(uint32_t weight, Animation animation = Animation());
         void set_text_align(TextAlign text_align);
+        void set_text_transform(TextTransform text_transform);
         void set_gap(float size, Unit unit = Unit::Dp, Animation animation = Animation());
         void set_row_gap(float size, Unit unit = Unit::Dp, Animation animation = Animation());
         void set_column_gap(float size, Unit unit = Unit::Dp, Animation animation = Animation());

src/ui/elements/ui_toggle.cpp

@@ -63,7 +63,7 @@ namespace recompui {
     }
 
     float Toggle::floater_left_target() const {
-        return checked ? 4.0f : 78.0f;
+        return checked ? 78.0f : 4.0f;
     }
 
     void Toggle::process_event(const Event &e) {

src/ui/elements/ui_types.h

@@ -201,6 +201,13 @@ namespace recompui {
         Justify
     };
 
+    enum class TextTransform {
+        None,
+        Capitalize,
+        Uppercase,
+        Lowercase
+    };
+
     enum class Drag {
         None,
         Drag,

src/ui/ui_config_sub_menu.cpp

@@ -22,8 +22,10 @@ void ConfigOptionElement::process_event(const Event &e) {
 }
 
 ConfigOptionElement::ConfigOptionElement(Element *parent) : Element(parent, Events(EventType::Hover)) {
-    set_gap(8.0f);
-    set_min_height(100.0f);
+    set_display(Display::Flex);
+    set_flex_direction(FlexDirection::Column);
+    set_gap(16.0f);
+    set_height(100.0f);
 
     name_label = get_current_context().create_element<Label>(this, LabelStyle::Normal);
 }
@@ -141,6 +143,10 @@ ConfigSubMenu::ConfigSubMenu(Element *parent) : Element(parent) {
 
     recompui::ContextId context = get_current_context();
     header_container = context.create_element<Container>(this, FlexDirection::Row, JustifyContent::FlexStart);
+    header_container->set_flex_grow(0.0f);
+    header_container->set_align_items(AlignItems::Center);
+    header_container->set_padding_left(12.0f);
+    header_container->set_gap(24.0f);
 
     {
         back_button = context.create_element<Button>(header_container, "Back", ButtonStyle::Secondary);
@@ -149,6 +155,7 @@ ConfigSubMenu::ConfigSubMenu(Element *parent) : Element(parent) {
     }
 
     body_container = context.create_element<Container>(this, FlexDirection::Row, JustifyContent::SpaceEvenly);
+    body_container->set_padding(32.0f);
     {
         config_container = context.create_element<Container>(body_container, FlexDirection::Column, JustifyContent::Center);
         config_container->set_display(Display::Block);