10 files changed, 426 insertions, 92 deletions

diff --git a/src/gmdocument.h b/src/gmdocument.h
index 9f8ee2ef..332c3e00 100644
--- a/src/gmdocument.h
+++ b/src/gmdocument.h
@@ -59,6 +59,7 @@ enum iGmDocumentTheme {
     white_GmDocumentTheme,
     sepia_GmDocumentTheme,
     highContrast_GmDocumentTheme,
+    max_GmDocumentTheme
 };
 
 iBool isDark_GmDocumentTheme(enum iGmDocumentTheme);
diff --git a/src/ui/documentwidget.c b/src/ui/documentwidget.c
index e280bc84..6ca4fd8d 100644
--- a/src/ui/documentwidget.c
+++ b/src/ui/documentwidget.c
@@ -1010,6 +1010,9 @@ static void documentRunsInvalidated_DocumentWidget_(iDocumentWidget *d) {
 }
 
 iBool isPinned_DocumentWidget_(const iDocumentWidget *d) {
+    if (deviceType_App() == phone_AppDeviceType) {
+        return iFalse;
+    }
     if (d->flags & otherRootByDefault_DocumentWidgetFlag) {
         return iTrue;
     }
diff --git a/src/ui/labelwidget.c b/src/ui/labelwidget.c
index 3bfa600b..b84e17f4 100644
--- a/src/ui/labelwidget.c
+++ b/src/ui/labelwidget.c
@@ -44,11 +44,13 @@ struct Impl_LabelWidget {
     iString command;
     iClick  click;
     struct {
-        uint8_t alignVisual     : 1; /* align according to visible bounds, not font metrics */
-        uint8_t noAutoMinHeight : 1; /* minimum height is not set automatically */
-        uint8_t drawAsOutline   : 1; /* draw as outline, filled with background color */
-        uint8_t noTopFrame      : 1;
-        uint8_t wrap            : 1;
+        uint8_t alignVisual         : 1; /* align according to visible bounds, not font metrics */
+        uint8_t noAutoMinHeight     : 1; /* minimum height is not set automatically */
+        uint8_t drawAsOutline       : 1; /* draw as outline, filled with background color */
+        uint8_t noTopFrame          : 1;
+        uint8_t wrap                : 1;
+        uint8_t allCaps             : 1;
+        uint8_t removeTrailingColon : 1;
     } flags;
 };
 
@@ -442,11 +444,18 @@ void updateSize_LabelWidget(iLabelWidget *d) {
 
 static void replaceVariables_LabelWidget_(iLabelWidget *d) {
     translate_Lang(&d->label);
+    if (d->flags.allCaps) {
+        set_String(&d->label, collect_String(upper_String(&d->label)));
+    }
+    if (d->flags.removeTrailingColon && endsWith_String(&d->label, ":")) {
+        removeEnd_String(&d->label, 1);
+    }
 }
 
 void init_LabelWidget(iLabelWidget *d, const char *label, const char *cmd) {
     iWidget *w = &d->widget;
     init_Widget(w);
+    iZap(d->flags);
     d->font = uiLabel_FontId;
     d->forceFg = none_ColorId;
     d->icon = 0;
@@ -464,11 +473,6 @@ void init_LabelWidget(iLabelWidget *d, const char *label, const char *cmd) {
     d->kmods = 0;
     init_Click(&d->click, d, !isEmpty_String(&d->command) ? SDL_BUTTON_LEFT : 0);
     setFlags_Widget(w, hover_WidgetFlag, d->click.button != 0);
-    d->flags.alignVisual     = iFalse;
-    d->flags.noAutoMinHeight = iFalse;
-    d->flags.drawAsOutline   = iFalse;
-    d->flags.noTopFrame      = iFalse;
-    d->flags.wrap            = iFalse;
     updateSize_LabelWidget(d);
     updateKey_LabelWidget_(d); /* could be bound to another key */
 }
@@ -525,6 +529,20 @@ void setOutline_LabelWidget(iLabelWidget *d, iBool drawAsOutline) {
     }
 }
 
+void setAllCaps_LabelWidget(iLabelWidget *d, iBool allCaps) {
+    if (d) {
+        d->flags.allCaps = allCaps;
+        replaceVariables_LabelWidget_(d);
+    }
+}
+
+void setRemoveTrailingColon_LabelWidget(iLabelWidget *d, iBool removeTrailingColon) {
+    if (d) {
+        d->flags.removeTrailingColon = removeTrailingColon;
+        replaceVariables_LabelWidget_(d);
+    }
+}
+
 void updateText_LabelWidget(iLabelWidget *d, const iString *text) {
     set_String(&d->label, text);
     set_String(&d->srcLabel, text);
diff --git a/src/ui/labelwidget.h b/src/ui/labelwidget.h
index b8b6fd87..6275d2c8 100644
--- a/src/ui/labelwidget.h
+++ b/src/ui/labelwidget.h
@@ -30,10 +30,12 @@ iDeclareWidgetClass(LabelWidget)
 iDeclareObjectConstructionArgs(LabelWidget, const char *label, const char *command)
 
 void    setAlignVisually_LabelWidget(iLabelWidget *, iBool alignVisual);
-void    setNoAutoMinHeight_LabelWidget(iLabelWidget *, iBool noAutoMinHeight);
+void    setNoAutoMinHeight_LabelWidget  (iLabelWidget *, iBool noAutoMinHeight);
 void    setNoTopFrame_LabelWidget   (iLabelWidget *, iBool noTopFrame);
 void    setWrap_LabelWidget         (iLabelWidget *, iBool wrap);
 void    setOutline_LabelWidget      (iLabelWidget *, iBool drawAsOutline);
+void    setAllCaps_LabelWidget      (iLabelWidget *, iBool allCaps);
+void    setRemoveTrailingColon_LabelWidget  (iLabelWidget *, iBool removeTrailingColon);
 void    setFont_LabelWidget         (iLabelWidget *, int fontId);
 void    setTextColor_LabelWidget    (iLabelWidget *, int color);
 void    setText_LabelWidget         (iLabelWidget *, const iString *text); /* resizes widget */
diff --git a/src/ui/mobile.c b/src/ui/mobile.c
index 168a92b8..4ccbb0cb 100644
--- a/src/ui/mobile.c
+++ b/src/ui/mobile.c
@@ -57,7 +57,6 @@ static enum iFontId labelBoldFont_(void) {
 
 static void updatePanelSheetMetrics_(iWidget *sheet) {
     iWidget *navi       = findChild_Widget(sheet, "panel.navi");
-//    iWidget *naviPad    = child_Widget(navi, 0);
     int      naviHeight = lineHeight_Text(labelFont_()) + 4 * gap_UI;
 #if defined (iPlatformMobile)
     float left = 0.0f, right = 0.0f, top = 0.0f, bottom = 0.0f;
@@ -339,7 +338,7 @@ static iWidget *makeValuePaddingWithHeading_(iLabelWidget *heading, iWidget *val
         addChildFlags_Widget(div, iClob(new_Widget()), expand_WidgetFlag);
         addChild_Widget(div, iClob(value));
     }
-    printTree_Widget(div);
+//    printTree_Widget(div);
     return div;
 }
 
@@ -369,6 +368,205 @@ static iWidget *addChildPanel_(iWidget *parent, iLabelWidget *panelButton,
 }
 
 void finalizeSheet_Mobile(iWidget *sheet) {
+    arrange_Widget(sheet);
+//    postRefresh_App();
+}
+
+static size_t countItems_(const iMenuItem *itemsNullTerminated) {
+    size_t num = 0;
+    for (; itemsNullTerminated->label; num++, itemsNullTerminated++) {}
+    return num;
+}
+
+void makePanelItem_Mobile(iWidget *panel, const iMenuItem *item) {
+    const char *  spec    = item->label;
+    const char *  id      = cstr_Rangecc(range_Command(spec, "id"));
+    const char *  label   = format_CStr("${%s}", id);
+    iWidget *     widget  = NULL;
+    iLabelWidget *heading = NULL;
+    if (hasLabel_Command(spec, "device") && deviceType_App() != argLabel_Command(spec, "device")) {
+        return;
+    }
+    if (equal_Command(spec, "title")) {
+        iLabelWidget *title = addChildFlags_Widget(panel,
+                                                   iClob(new_LabelWidget(label, NULL)),
+                                                   alignLeft_WidgetFlag | frameless_WidgetFlag);
+        setFont_LabelWidget(title, uiLabelLargeBold_FontId);
+        setTextColor_LabelWidget(title, uiHeading_ColorId);
+        setAllCaps_LabelWidget(title, iTrue);
+    }
+    else if (equal_Command(spec, "heading")) {
+        addChild_Widget(panel, iClob(makePadding_Widget(lineHeight_Text(labelFont_()))));
+        heading = makeHeading_Widget(label);
+        setAllCaps_LabelWidget(heading, iTrue);
+        setRemoveTrailingColon_LabelWidget(heading, iTrue);
+        addChild_Widget(panel, iClob(heading));
+    }    
+    else if (equal_Command(spec, "toggle")) {
+        iLabelWidget *toggle = (iLabelWidget *) makeToggle_Widget(id);
+        setFont_LabelWidget(toggle, labelFont_());
+        widget = makeValuePaddingWithHeading_(heading = makeHeading_Widget(label),
+                                              as_Widget(toggle));
+    }
+    else if (equal_Command(spec, "dropdown")) {
+        const iMenuItem *dropItems = item->data;
+        iLabelWidget *drop = makeMenuButton_LabelWidget("", dropItems, countItems_(dropItems));
+        setFont_LabelWidget(drop, labelFont_());
+        setFlags_Widget(as_Widget(drop),
+                        alignRight_WidgetFlag | noBackground_WidgetFlag |
+                            frameless_WidgetFlag, iTrue);
+        setId_Widget(as_Widget(drop), id);
+        widget = makeValuePaddingWithHeading_(heading = makeHeading_Widget(label), as_Widget(drop));
+    }
+    else if (equal_Command(spec, "radio")) {
+        addChild_Widget(panel, iClob(makePadding_Widget(lineHeight_Text(labelFont_()))));
+        iLabelWidget *head = makeHeading_Widget(label);
+        setAllCaps_LabelWidget(head, iTrue);
+        setRemoveTrailingColon_LabelWidget(head, iTrue);
+        addChild_Widget(panel, iClob(head));
+        widget = new_Widget();
+        setBackgroundColor_Widget(widget, uiBackgroundSidebar_ColorId);
+        setPadding_Widget(widget, 4 * gap_UI, 2 * gap_UI, 4 * gap_UI, 2 * gap_UI);
+//        setFlags_Widget(widget, arrangeWidth_WidgetFlag, iFalse);
+        setFlags_Widget(widget,
+                        borderBottom_WidgetFlag |
+                            arrangeHorizontal_WidgetFlag |
+                            arrangeHeight_WidgetFlag |
+                            resizeToParentWidth_WidgetFlag |
+                            resizeWidthOfChildren_WidgetFlag,
+                        iTrue);
+        setId_Widget(widget, id);
+        for (const iMenuItem *radioItem = item->data; radioItem->label; radioItem++) {
+            const char *  radId     = cstr_Rangecc(range_Command(radioItem->label, "id"));
+            const char *  radLabel  = hasLabel_Command(radioItem->label, "label")
+                                          ? format_CStr("${%s}", cstr_Rangecc(range_Command(radioItem->label, "label")))
+                                          : suffixPtr_Command(radioItem->label, "text");
+            iLabelWidget *radButton = new_LabelWidget(radLabel, radioItem->command);
+            setId_Widget(as_Widget(radButton), radId);
+            setFont_LabelWidget(radButton, defaultMedium_FontId);
+            addChildFlags_Widget(widget, iClob(radButton), radio_WidgetFlag | noBackground_WidgetFlag);
+        }
+    }
+    else if (equal_Command(spec, "input")) {
+        iInputWidget *input = new_InputWidget(argU32Label_Command(spec, "maxlen"));
+        setId_Widget(as_Widget(input), id);
+        setFont_InputWidget(input, labelFont_());
+        setContentPadding_InputWidget(input, 3 * gap_UI, 0);
+        setUrlContent_InputWidget(input, argLabel_Command(spec, "url"));
+        widget = makeValuePaddingWithHeading_(heading = makeHeading_Widget(label),
+                                              as_Widget(input));        
+    }
+    else if (equal_Command(spec, "padding")) {
+        widget = makePadding_Widget(lineHeight_Text(labelFont_()) * 1.5f);
+    }
+    if (heading) {
+        setRemoveTrailingColon_LabelWidget(heading, iTrue);
+        const iChar icon = toInt_String(string_Command(item->label, "icon"));
+        if (icon) {
+            setIcon_LabelWidget(heading, icon);
+        }
+    }
+    if (widget) {
+        addChild_Widget(panel, iClob(widget));
+    }
+}
+
+void makePanelItems_Mobile(iWidget *panel, const iMenuItem *itemsNullTerminated) {
+    for (const iMenuItem *item = itemsNullTerminated; item->label; item++) {
+        makePanelItem_Mobile(panel, item);
+    }
+}
+
+iWidget *makeSplitMultiPanel_Mobile(const iMenuItem *itemsNullTerminated) {
+    /* A multipanel widget has a top panel and one or more detail panels. In a horizontal layout,
+       the detail panels slide in from the right and cover the top panel. In a landscape layout,
+       the detail panels are always visible on the side. */
+    iWidget *sheet = new_Widget();
+    setBackgroundColor_Widget(sheet, uiBackground_ColorId);
+    setFlags_Widget(sheet,
+                    resizeToParentWidth_WidgetFlag |
+                    resizeToParentHeight_WidgetFlag |
+                    frameless_WidgetFlag | focusRoot_WidgetFlag | commandOnClick_WidgetFlag |
+                        overflowScrollable_WidgetFlag | leftEdgeDraggable_WidgetFlag,
+                    iTrue);
+    /* The top-level split between main and detail panels. */
+    iWidget *mainDetailSplit = makeHDiv_Widget(); {
+        setCommandHandler_Widget(mainDetailSplit, mainDetailSplitHandler_);
+        setFlags_Widget(mainDetailSplit, resizeHeightOfChildren_WidgetFlag, iFalse);
+        setId_Widget(mainDetailSplit, "mdsplit");
+        addChild_Widget(sheet, iClob(mainDetailSplit));
+    }
+    /* The panel roots. */
+    iWidget *topPanel = new_Widget(); {
+        setId_Widget(topPanel, "panel.top");
+        setCommandHandler_Widget(topPanel, topPanelHandler_);
+        setFlags_Widget(topPanel,
+                        arrangeVertical_WidgetFlag | resizeWidthOfChildren_WidgetFlag |
+                            arrangeHeight_WidgetFlag | overflowScrollable_WidgetFlag |
+                            commandOnClick_WidgetFlag,
+                        iTrue);
+        addChild_Widget(mainDetailSplit, iClob(topPanel));
+        setId_Widget(addChild_Widget(topPanel, iClob(makePadding_Widget(0))), "panel.toppad");
+    }
+    iWidget *detailStack = new_Widget(); {
+        setId_Widget(detailStack, "detailstack");
+        setFlags_Widget(detailStack, collapse_WidgetFlag | resizeWidthOfChildren_WidgetFlag, iTrue);
+        addChild_Widget(mainDetailSplit, iClob(detailStack));
+    }
+    addChild_Widget(topPanel, iClob(makePadding_Widget(lineHeight_Text(labelFont_()))));
+    /* Slide top panel with detail panels. */ {
+        setFlags_Widget(topPanel, refChildrenOffset_WidgetFlag, iTrue);
+        topPanel->offsetRef = detailStack;
+    }
+    /* Navigation bar at the top. */
+    iWidget *navi = new_Widget(); {
+        setId_Widget(navi, "panel.navi");
+        setBackgroundColor_Widget(navi, uiBackground_ColorId);
+        addChild_Widget(navi, iClob(makePadding_Widget(0)));
+        iLabelWidget *back = addChildFlags_Widget(
+            navi,
+            iClob(new_LabelWidget(leftAngle_Icon " ${panel.back}", "panel.close")),
+            noBackground_WidgetFlag | frameless_WidgetFlag | alignLeft_WidgetFlag |
+                extraPadding_WidgetFlag);
+        checkIcon_LabelWidget(back);
+        setId_Widget(as_Widget(back), "panel.back");
+        setFont_LabelWidget(back, labelFont_());
+        addChildFlags_Widget(sheet, iClob(navi),
+                             drawBackgroundToVerticalSafeArea_WidgetFlag |
+                                 arrangeHeight_WidgetFlag | resizeWidthOfChildren_WidgetFlag |
+                                 resizeToParentWidth_WidgetFlag | arrangeVertical_WidgetFlag);        
+    }
+    /* Create panel contents based on provided items. */
+    for (size_t i = 0; itemsNullTerminated[i].label; i++) {
+        const iMenuItem *item = &itemsNullTerminated[i];
+        if (equal_Command(item->label, "panel")) {
+            const char *id = cstr_Rangecc(range_Command(item->label, "id"));
+            const iString *label = collectNewFormat_String("${%s}", id);
+            iLabelWidget *button =
+                addChildFlags_Widget(topPanel,
+                                     iClob(makePanelButton_(cstr_String(label), "panel.open")),
+                                     chevron_WidgetFlag | borderTop_WidgetFlag);
+            const iChar icon = toInt_String(string_Command(item->label, "icon"));
+            if (icon) {
+                setIcon_LabelWidget(button, icon);
+            }
+            iWidget *panel = addChildPanel_(detailStack, button, NULL);
+            makePanelItems_Mobile(panel, item->data);
+        }
+        else {
+            makePanelItem_Mobile(topPanel, item);
+        }
+    }
+    /* Finalize the layout. */
+    addChild_Widget(sheet->root->widget, iClob(sheet));
+    mainDetailSplitHandler_(mainDetailSplit, "window.resized"); /* make it resize the split */
+    updatePanelSheetMetrics_(sheet);
+    arrange_Widget(sheet);
+    postCommand_App("widget.overflow"); /* with the correct dimensions */    
+    return sheet;
+}
+
+#if 0
     /* The sheet contents are completely rearranged and restyled on a phone.
        We'll set up a linear fullscreen arrangement of the widgets. Sheets are already
        scrollable so they can be taller than the display. In hindsight, it may have been
@@ -399,7 +597,7 @@ void finalizeSheet_Mobile(iWidget *sheet) {
         │         │ └┤                   ││    │         │└┤      ││
         │         │  └───────────────────┘│    │         │ └──────┘
         └─────────┴───────────────────────┘    └─────────┴ ─ ─ ─ ─ ┘
-                                                          offscreen
+                                                          underneath
         */
         /* Modify the top sheet to act as a fullscreen background. */
         setPadding1_Widget(sheet, 0);
@@ -774,6 +972,7 @@ void finalizeSheet_Mobile(iWidget *sheet) {
     }
     postRefresh_App();
 }
+#endif
 
 void setupMenuTransition_Mobile(iWidget *sheet, iBool isIncoming) {
     if (!useMobileSheetLayout_()) {
diff --git a/src/ui/mobile.h b/src/ui/mobile.h
index 44134389..50b89e32 100644
--- a/src/ui/mobile.h
+++ b/src/ui/mobile.h
@@ -22,11 +22,14 @@ SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. */
 
 #pragma once
 
-#include <the_Foundation/defs.h>
+#include <the_Foundation/rect.h>
 
 iDeclareType(Widget)
-
-void        setupMenuTransition_Mobile          (iWidget *menu, iBool isIncoming);
-void        setupSheetTransition_Mobile         (iWidget *sheet, iBool isIncoming);
+iDeclareType(MenuItem)
+    
+iWidget *   makeSplitMultiPanel_Mobile  (const iMenuItem *itemsNullTerminated);
+    
+void        setupMenuTransition_Mobile  (iWidget *menu, iBool isIncoming);
+void        setupSheetTransition_Mobile (iWidget *sheet, iBool isIncoming);
 
 void        finalizeSheet_Mobile        (iWidget *sheet);
diff --git a/src/ui/util.c b/src/ui/util.c
index 906d30ae..995b730e 100644
--- a/src/ui/util.c
+++ b/src/ui/util.c
@@ -707,6 +707,9 @@ iWidget *makeMenu_Widget(iWidget *parent, const iMenuItem *items, size_t n) {
     iBool haveIcons = iFalse;
     for (size_t i = 0; i < n; ++i) {
         const iMenuItem *item = &items[i];
+        if (!item->label) {
+            break;
+        }
         if (equal_CStr(item->label, "---")) {
             addChild_Widget(menu, iClob(makeMenuSeparator_()));
         }
@@ -1506,7 +1509,7 @@ static void addRadioButton_(iWidget *parent, const char *id, const char *label,
         id);
 }
 
-static void addFontButtons_(iWidget *parent, const char *id) {
+static const iArray *makeFontItems_(const char *id) {
     const struct {
         const char *   name;
         enum iTextFont cfgId;
@@ -1518,7 +1521,7 @@ static void addFontButtons_(iWidget *parent, const char *id) {
                   { "Tinos", tinos_TextFont },
                   { "---", -1 },
                   { "Iosevka", iosevka_TextFont } };
-    iArray *items = new_Array(sizeof(iMenuItem));
+    iArray *items = collectNew_Array(sizeof(iMenuItem));
     iForIndices(i, fonts) {
         pushBack_Array(items,
                        &(iMenuItem){ fonts[i].name,
@@ -1528,11 +1531,18 @@ static void addFontButtons_(iWidget *parent, const char *id) {
                                          ? format_CStr("!%s.set arg:%d", id, fonts[i].cfgId)
                                          : NULL });
     }
-    iLabelWidget *button = makeMenuButton_LabelWidget("Source Sans 3", data_Array(items), size_Array(items));
-    setBackgroundColor_Widget(findChild_Widget(as_Widget(button), "menu"), uiBackgroundMenu_ColorId);
+    pushBack_Array(items, &(iMenuItem){ NULL }); /* terminator */
+    return items;
+}
+
+static void addFontButtons_(iWidget *parent, const char *id) {
+    const iArray *items = makeFontItems_(id);
+    iLabelWidget *button = makeMenuButton_LabelWidget("Source Sans 3",
+                                                      constData_Array(items), size_Array(items));
+    setBackgroundColor_Widget(findChild_Widget(as_Widget(button), "menu"),
+                              uiBackgroundMenu_ColorId);
     setId_Widget(as_Widget(button), format_CStr("prefs.%s", id));
     addChildFlags_Widget(parent, iClob(button), alignLeft_WidgetFlag);
-    delete_Array(items);
 }
 
 #if 0
@@ -1615,7 +1625,7 @@ static void addPrefsInputWithHeading_(iWidget *headings, iWidget *values,
 static size_t findWidestItemLabel_(const iMenuItem *items, size_t num) {
     int widest = 0;
     size_t widestPos = iInvalidPos;
-    for (size_t i = 0; i < num; i++) {
+    for (size_t i = 0; i < num && items[i].label; i++) {
         const int width =
             measure_Text(uiLabel_FontId,
                          translateCStr_Lang(items[i].label))
@@ -1629,6 +1639,153 @@ static size_t findWidestItemLabel_(const iMenuItem *items, size_t num) {
 }
 
 iWidget *makePreferences_Widget(void) {
+    /* Common items. */
+    const iMenuItem langItems[] = { { "${lang.de} - de", 0, 0, "uilang id:de" },
+                                    { "${lang.en} - en", 0, 0, "uilang id:en" },
+                                    { "${lang.es} - es", 0, 0, "uilang id:es" },
+                                    { "${lang.fi} - fi", 0, 0, "uilang id:fi" },
+                                    { "${lang.fr} - fr", 0, 0, "uilang id:fr" },
+                                    { "${lang.ia} - ia", 0, 0, "uilang id:ia" },
+                                    { "${lang.ie} - ie", 0, 0, "uilang id:ie" },
+                                    { "${lang.pl} - pl", 0, 0, "uilang id:pl" },
+                                    { "${lang.ru} - ru", 0, 0, "uilang id:ru" },
+                                    { "${lang.sr} - sr", 0, 0, "uilang id:sr" },
+                                    { "${lang.tok} - tok", 0, 0, "uilang id:tok" },
+                                    { "${lang.zh.hans} - zh", 0, 0, "uilang id:zh_Hans" },
+                                    { "${lang.zh.hant} - zh", 0, 0, "uilang id:zh_Hant" },
+                                    { NULL } };
+    const iMenuItem returnKeyBehaviors[] = {
+        { "${prefs.returnkey.linebreak} " uiTextAction_ColorEscape shift_Icon return_Icon
+                                                                    restore_ColorEscape
+          "    ${prefs.returnkey.accept} " uiTextAction_ColorEscape return_Icon,
+          0,
+          0,
+          format_CStr("returnkey.set arg:%d", default_ReturnKeyBehavior) },
+        { "${prefs.returnkey.linebreak} " uiTextAction_ColorEscape return_Icon restore_ColorEscape
+          "    ${prefs.returnkey.accept} " uiTextAction_ColorEscape shift_Icon return_Icon,
+          0,
+          0,
+          format_CStr("returnkey.set arg:%d", acceptWithShift_ReturnKeyBehavior) },
+        { "${prefs.returnkey.linebreak} " uiTextAction_ColorEscape return_Icon restore_ColorEscape
+          "    ${prefs.returnkey.accept} " uiTextAction_ColorEscape
+#if defined (iPlatformApple)
+          "\u2318" return_Icon,
+#else
+          "Ctrl" return_Icon,
+#endif
+          0,
+          0,
+          format_CStr("returnkey.set arg:%d", acceptWithPrimaryMod_ReturnKeyBehavior) },
+        { NULL }
+    };
+    iMenuItem docThemes[2][max_GmDocumentTheme + 1];
+    for (int i = 0; i < 2; ++i) {
+        const iBool isDark = (i == 0);
+        const char *mode = isDark ? "dark" : "light";
+        const iMenuItem items[max_GmDocumentTheme + 1] = {
+            { "${prefs.doctheme.name.colorfuldark}", 0, 0, format_CStr("doctheme.%s.set arg:%d", mode, colorfulDark_GmDocumentTheme) },
+            { "${prefs.doctheme.name.colorfullight}", 0, 0, format_CStr("doctheme.%s.set arg:%d", mode, colorfulLight_GmDocumentTheme) },
+            { "${prefs.doctheme.name.black}", 0, 0, format_CStr("doctheme.%s.set arg:%d", mode, black_GmDocumentTheme) },
+            { "${prefs.doctheme.name.gray}", 0, 0, format_CStr("doctheme.%s.set arg:%d", mode, gray_GmDocumentTheme) },
+            { "${prefs.doctheme.name.white}", 0, 0, format_CStr("doctheme.%s.set arg:%d", mode, white_GmDocumentTheme) },
+            { "${prefs.doctheme.name.sepia}", 0, 0, format_CStr("doctheme.%s.set arg:%d", mode, sepia_GmDocumentTheme) },
+            { "${prefs.doctheme.name.highcontrast}", 0, 0, format_CStr("doctheme.%s.set arg:%d", mode, highContrast_GmDocumentTheme) },
+            { NULL }
+        };
+        memcpy(docThemes[i], items, sizeof(items));
+    }
+    const iMenuItem imgStyles[] = {
+        { "${prefs.imagestyle.original}",  0, 0, format_CStr("imagestyle.set arg:%d", original_ImageStyle) },
+        { "${prefs.imagestyle.grayscale}", 0, 0, format_CStr("imagestyle.set arg:%d", grayscale_ImageStyle) },
+        { "${prefs.imagestyle.bgfg}",      0, 0, format_CStr("imagestyle.set arg:%d", bgFg_ImageStyle) },
+        { "${prefs.imagestyle.text}",      0, 0, format_CStr("imagestyle.set arg:%d", textColorized_ImageStyle) },
+        { "${prefs.imagestyle.preformat}", 0, 0, format_CStr("imagestyle.set arg:%d", preformatColorized_ImageStyle) },
+        { NULL }
+    };
+    /* Create the Preferences UI. */
+    if (deviceType_App() != desktop_AppDeviceType) {
+        const iMenuItem pinSplit[] = {
+            { "button id:prefs.pinsplit.0 label:prefs.pinsplit.none",  0, 0, "pinsplit.set arg:0" },
+            { "button id:prefs.pinsplit.1 label:prefs.pinsplit.left",  0, 0, "pinsplit.set arg:1" },
+            { "button id:prefs.pinsplit.2 label:prefs.pinsplit.right", 0, 0, "pinsplit.set arg:2" },
+            { NULL }
+        };
+        const iMenuItem themeItems[] = {
+            { "button id:prefs.theme.0 label:prefs.theme.black", 0, 0, "theme.set arg:0" },
+            { "button id:prefs.theme.1 label:prefs.theme.dark",  0, 0, "theme.set arg:1" },
+            { "button id:prefs.theme.2 label:prefs.theme.light", 0, 0, "theme.set arg:2" },
+            { "button id:prefs.theme.3 label:prefs.theme.white", 0, 0, "theme.set arg:3" },
+            { NULL }  
+        };
+        const iMenuItem accentItems[] = {
+            { "button id:prefs.accent.0 label:prefs.accent.teal", 0, 0, "accent.set arg:0" },
+            { "button id:prefs.accent.1 label:prefs.accent.orange", 0, 0, "accent.set arg:1" },
+            { NULL }
+        };
+        const iMenuItem satItems[] = {
+            { "button id:prefs.saturation.3 text:100 %", 0, 0, "saturation.set arg:100" },
+            { "button id:prefs.saturation.2 text:66 %", 0, 0, "saturation.set arg:66" },
+            { "button id:prefs.saturation.1 text:33 %", 0, 0, "saturation.set arg:33" },
+            { "button id:prefs.saturation.0 text:0 %", 0, 0, "saturation.set arg:0" },
+            { NULL }  
+        };
+        const iMenuItem generalItems[] = {
+            { "title id:heading.prefs.general", 0, 0, NULL },
+            { "input id:prefs.searchurl url:1", 0, 0, NULL },
+            { "padding", 0, 0, NULL },
+            { "toggle id:prefs.hoverlink", 0, 0, NULL },
+            { "toggle id:prefs.archive.openindex", 0, 0, NULL },
+            { "radio device:1 id:prefs.pinsplit", 0, 0, (const void *) pinSplit },
+            { "padding", 0, 0, NULL },
+            { "dropdown id:prefs.uilang", 0, 0, (const void *) langItems },
+            { NULL }
+        };
+        const iMenuItem uiItems[] = {
+            { "title id:heading.prefs.interface", 0, 0, NULL },
+            { "dropdown device:1 id:prefs.returnkey", 0, 0, (const void *) returnKeyBehaviors },
+            { "padding device:1", 0, 0, NULL },
+            { "toggle device:2 id:prefs.hidetoolbarscroll", 0, 0, NULL },
+            { "heading id:heading.prefs.sizing", 0, 0, NULL },
+            { "input id:prefs.uiscale maxlen:8", 0, 0, NULL },
+            { NULL }
+        };
+        const iMenuItem colorItems[] = {
+            { "title id:heading.prefs.colors", 0, 0, NULL },
+            { "heading id:heading.prefs.uitheme", 0, 0, NULL },
+            { "toggle id:prefs.ostheme", 0, 0, NULL },
+            { "radio id:prefs.theme", 0, 0, (const void *) themeItems },
+            { "radio id:prefs.accent", 0, 0, (const void *) accentItems },
+            { "heading id:heading.prefs.pagecontent", 0, 0, NULL },
+            { "dropdown id:prefs.doctheme.dark", 0, 0, (const void *) docThemes[0] },
+            { "dropdown id:prefs.doctheme.light", 0, 0, (const void *) docThemes[1] },
+            { "radio id:prefs.saturation", 0, 0, (const void *) satItems },
+            { "padding", 0, 0, NULL },
+            { "dropdown id:prefs.imagestyle", 0, 0, (const void *) imgStyles },
+            { NULL }  
+        };
+        const iMenuItem fontItems[] = {
+            { "title id:heading.prefs.fonts", 0, 0, NULL },
+            { "dropdown id:prefs.headingfont", 0, 0, (const void *) constData_Array(makeFontItems_("headingfont")) },
+            { "dropdown id:prefs.font", 0, 0, (const void *) constData_Array(makeFontItems_("font")) },
+            { NULL }  
+        };
+        const iMenuItem items[] = { { "panel icon:0x2699 id:heading.prefs.general",
+                                      '1', 0,
+                                      (const void *) generalItems },
+                                    { "panel icon:0x1f4f1 id:heading.prefs.interface",
+                                      '2', 0,
+                                      (const void *) uiItems },
+                                    { "panel icon:0x1f3a8 id:heading.prefs.colors",
+                                      '3', 0,
+                                      (const void *) colorItems },
+                                    { "panel icon:0x1f5da id:heading.prefs.fonts",
+                                      '4', 0,
+                                      (const void *) fontItems },
+                                    { NULL } };
+        iWidget *dlg = makeSplitMultiPanel_Mobile(items);
+        setupSheetTransition_Mobile(dlg, iTrue);
+        return dlg;
+    }
     iWidget *dlg = makeSheet_Widget("prefs");
     addChildFlags_Widget(dlg,
                          iClob(new_LabelWidget(uiHeading_ColorEscape "${heading.prefs}", NULL)),
@@ -1666,22 +1823,7 @@ iWidget *makePreferences_Widget(void) {
         addChild_Widget(values, iClob(makePadding_Widget(bigGap)));
         /* UI languages. */ {
             iArray *uiLangs = collectNew_Array(sizeof(iMenuItem));
-            const iMenuItem langItems[] = {
-                { "${lang.de} - de", 0, 0, "uilang id:de" },
-                { "${lang.en} - en", 0, 0, "uilang id:en" },
-                { "${lang.es} - es", 0, 0, "uilang id:es" },
-                { "${lang.fi} - fi", 0, 0, "uilang id:fi" },
-                { "${lang.fr} - fr", 0, 0, "uilang id:fr" },
-                { "${lang.ia} - ia", 0, 0, "uilang id:ia" },
-                { "${lang.ie} - ie", 0, 0, "uilang id:ie" },
-                { "${lang.pl} - pl", 0, 0, "uilang id:pl" },
-                { "${lang.ru} - ru", 0, 0, "uilang id:ru" },
-                { "${lang.sr} - sr", 0, 0, "uilang id:sr" },
-                { "${lang.tok} - tok", 0, 0, "uilang id:tok" },
-                { "${lang.zh.hans} - zh", 0, 0, "uilang id:zh_Hans" },
-                { "${lang.zh.hant} - zh", 0, 0, "uilang id:zh_Hant" },
-            };
-            pushBackN_Array(uiLangs, langItems, iElemCount(langItems));
+            pushBackN_Array(uiLangs, langItems, iElemCount(langItems) - 1);
             /* TODO: Add an arrange flag for resizing parent to widest child. */
             size_t widestPos = findWidestItemLabel_(data_Array(uiLangs), size_Array(uiLangs));
             addChild_Widget(headings, iClob(makeHeading_Widget("${prefs.uilang}")));
@@ -1702,39 +1844,12 @@ iWidget *makePreferences_Widget(void) {
 #endif
         addChild_Widget(headings, iClob(makeHeading_Widget("${prefs.returnkey}")));
         /* Return key behaviors. */ {
-            const iMenuItem returnKeyBehaviors[] = {
-                { "${prefs.returnkey.linebreak} "
-                  uiTextAction_ColorEscape shift_Icon return_Icon restore_ColorEscape
-                  "    ${prefs.returnkey.accept} "
-                  uiTextAction_ColorEscape return_Icon,
-                  0,
-                  0,
-                  format_CStr("returnkey.set arg:%d", default_ReturnKeyBehavior) },
-                { "${prefs.returnkey.linebreak} "
-                  uiTextAction_ColorEscape return_Icon restore_ColorEscape
-                  "    ${prefs.returnkey.accept} "
-                  uiTextAction_ColorEscape shift_Icon return_Icon,
-                  0,
-                  0,
-                  format_CStr("returnkey.set arg:%d", acceptWithShift_ReturnKeyBehavior) },
-                { "${prefs.returnkey.linebreak} "
-                   uiTextAction_ColorEscape return_Icon restore_ColorEscape
-                   "    ${prefs.returnkey.accept} " uiTextAction_ColorEscape
-#if defined (iPlatformApple)
-                    "\u2318" return_Icon,
-#else
-                     "Ctrl" return_Icon,
-#endif
-                    0,
-                    0,
-                    format_CStr("returnkey.set arg:%d", acceptWithPrimaryMod_ReturnKeyBehavior) },
-            };
             iLabelWidget *returnKey = makeMenuButton_LabelWidget(
                 returnKeyBehaviors[findWidestItemLabel_(returnKeyBehaviors,
-                                                        iElemCount(returnKeyBehaviors))]
+                                                        iElemCount(returnKeyBehaviors) - 1)]
                     .label,
                 returnKeyBehaviors,
-                iElemCount(returnKeyBehaviors));
+                iElemCount(returnKeyBehaviors) - 1);
             setBackgroundColor_Widget(findChild_Widget(as_Widget(returnKey), "menu"),
                                       uiBackgroundMenu_ColorId);
             setId_Widget(addChildFlags_Widget(values, iClob(returnKey), alignLeft_WidgetFlag),
@@ -1804,20 +1919,13 @@ iWidget *makePreferences_Widget(void) {
         for (int i = 0; i < 2; ++i) {
             const iBool isDark = (i == 0);
             const char *mode = isDark ? "dark" : "light";
-            const iMenuItem themes[] = {
-                { "${prefs.doctheme.name.colorfuldark}", 0, 0, format_CStr("doctheme.%s.set arg:%d", mode, colorfulDark_GmDocumentTheme) },
-                { "${prefs.doctheme.name.colorfullight}", 0, 0, format_CStr("doctheme.%s.set arg:%d", mode, colorfulLight_GmDocumentTheme) },
-                { "${prefs.doctheme.name.black}", 0, 0, format_CStr("doctheme.%s.set arg:%d", mode, black_GmDocumentTheme) },
-                { "${prefs.doctheme.name.gray}", 0, 0, format_CStr("doctheme.%s.set arg:%d", mode, gray_GmDocumentTheme) },
-                { "${prefs.doctheme.name.white}", 0, 0, format_CStr("doctheme.%s.set arg:%d", mode, white_GmDocumentTheme) },
-                { "${prefs.doctheme.name.sepia}", 0, 0, format_CStr("doctheme.%s.set arg:%d", mode, sepia_GmDocumentTheme) },
-                { "${prefs.doctheme.name.highcontrast}", 0, 0, format_CStr("doctheme.%s.set arg:%d", mode, highContrast_GmDocumentTheme) },
-            };
             addChild_Widget(headings, iClob(makeHeading_Widget(isDark ? "${prefs.doctheme.dark}" : "${prefs.doctheme.light}")));
-            iLabelWidget *button =
-                makeMenuButton_LabelWidget(themes[1].label, themes, iElemCount(themes));
-//            setFrameColor_Widget(findChild_Widget(as_Widget(button), "menu"),
-//                                 uiBackgroundSelected_ColorId);
+            iLabelWidget *button = makeMenuButton_LabelWidget(
+                docThemes[i][findWidestItemLabel_(docThemes[i], max_GmDocumentTheme)].label,
+                docThemes[i],
+                max_GmDocumentTheme);
+            //            setFrameColor_Widget(findChild_Widget(as_Widget(button), "menu"),
+            //                                 uiBackgroundSelected_ColorId);
             setBackgroundColor_Widget(findChild_Widget(as_Widget(button), "menu"), uiBackgroundMenu_ColorId);
             setId_Widget(addChildFlags_Widget(values, iClob(button), alignLeft_WidgetFlag),
                          format_CStr("prefs.doctheme.%s", mode));
@@ -1833,17 +1941,10 @@ iWidget *makePreferences_Widget(void) {
         addChildFlags_Widget(values, iClob(sats), arrangeHorizontal_WidgetFlag | arrangeSize_WidgetFlag);
         /* Colorize images. */ {
             addChild_Widget(headings, iClob(makeHeading_Widget("${prefs.imagestyle}")));
-            const iMenuItem imgStyles[] = {
-                { "${prefs.imagestyle.original}",  0, 0, format_CStr("imagestyle.set arg:%d", original_ImageStyle) },
-                { "${prefs.imagestyle.grayscale}", 0, 0, format_CStr("imagestyle.set arg:%d", grayscale_ImageStyle) },
-                { "${prefs.imagestyle.bgfg}",      0, 0, format_CStr("imagestyle.set arg:%d", bgFg_ImageStyle) },
-                { "${prefs.imagestyle.text}",      0, 0, format_CStr("imagestyle.set arg:%d", textColorized_ImageStyle) },
-                { "${prefs.imagestyle.preformat}", 0, 0, format_CStr("imagestyle.set arg:%d", preformatColorized_ImageStyle) },   
-            };
             iLabelWidget *button = makeMenuButton_LabelWidget(
-                imgStyles[findWidestItemLabel_(imgStyles, iElemCount(imgStyles))].label,
+                imgStyles[findWidestItemLabel_(imgStyles, iElemCount(imgStyles) - 1)].label,
                 imgStyles,
-                iElemCount(imgStyles));
+                iElemCount(imgStyles) - 1);
             setBackgroundColor_Widget(findChild_Widget(as_Widget(button), "menu"),
                                       uiBackgroundMenu_ColorId);
             setId_Widget(addChildFlags_Widget(values, iClob(button), alignLeft_WidgetFlag),
diff --git a/src/ui/util.h b/src/ui/util.h
index 2423f834..87b72394 100644
--- a/src/ui/util.h
+++ b/src/ui/util.h
@@ -220,7 +220,10 @@ struct Impl_MenuItem {
     const char *label;
     int key;
     int kmods;
-    const char *command;
+    union {
+        const char *command;
+        const void *data;
+    };
 };
 
 iWidget *   makeMenu_Widget     (iWidget *parent, const iMenuItem *items, size_t n); /* returns no ref */
diff --git a/src/ui/widget.c b/src/ui/widget.c
index 4f567989..0d6787ce 100644
--- a/src/ui/widget.c
+++ b/src/ui/widget.c
@@ -1402,6 +1402,7 @@ iAny *hitChild_Widget(const iWidget *d, iInt2 coord) {
 }
 
 iAny *findChild_Widget(const iWidget *d, const char *id) {
+    if (!d) return NULL;
     if (cmp_String(id_Widget(d), id) == 0) {
         return iConstCast(iAny *, d);
     }
diff --git a/src/ui/window.c b/src/ui/window.c
index 3ac02495..096853cc 100644
--- a/src/ui/window.c
+++ b/src/ui/window.c
@@ -1136,6 +1136,9 @@ void setTitle_Window(iWindow *d, const iString *title) {
 }
 
 void setUiScale_Window(iWindow *d, float uiScale) {
+    if (uiScale <= 0.0f) {
+        uiScale = 1.0f;
+    }
     uiScale = iClamp(uiScale, 0.5f, 4.0f);
     if (d) {
         if (iAbs(d->uiScale - uiScale) > 0.0001f) {