The Format Chooser dialog in GNOME Settings has been entirely revamped with merge request !2778,1 which implements Allan Day's mockup.2 The dialog was ported from AdwWindow3 to AdwDialog,4 as well as from the deprecated AdwLeaflet5 to AdwOverlaySplitView,6 making it adapt better on mobile form factors. The style should look less heavy thanks to the flat design in the format previewer pane.

Screen recording link: https://fedora.ems.host/_matrix/media/v3/download/fedora.im/02348294b629111613edaae2ab29e9ef401a89441857103268140810240?allow_redirect=true

1: https://gitlab.gnome.org/GNOME/gnome-control-center/-/merge_requests/2778
2: https://gitlab.gnome.org/Teams/Design/settings-mockups/-/blob/master/region-and-language/region-and-language.png?ref_type=heads
3: https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.Window.html
4: https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.Dialog.html
5: https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.Leaflet.html
6: https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.OverlaySplitView.html

Visual transcription:

The Format Chooser dialog is opened on demand from GNOME Settings, under the System panel → Region & Language page → Formats button. The dialog contains a headerbar with the title "Formats", the main view on the left with the search entry at the top and the format list below, and the preview pane on the right as a sidebar. The parent window is briefly resized to a mobile-adjacent form factor, where the preview pane is collapsed and the preview button with an eye icon appears on each format in the list; and resized back to a desktop form factor, which restores the previous layout.

In the format list, the scrollbar is dragged to the middle of the list, which displays an undershoot indicator at the top. Some formats are selected, and the preview pane updates as the format changes. The parent window is resized to a mobile-adjacent form factor. The preview button is pressed on a format that displays the preview pane as an overlay. The style is changed to dark and the process is repeated.

#GNOME #GTK #GTK4 #libadwaita