Yif
ee558c82d7
The page header wraps its action group onto another line when the title and the actions no longer fit together, so the title keeps its width and the actions keep their labels on one line. The information button follows the subtitle text instead of a flex row, which keeps it beside the copy at every width. Cover the header in the plugin-manager browser scenario: the action group stays inline when it fits, moves below when it does not, keeps its labels on one line, stays inside the header, and retains focus across the change.
1.6 KiB
Plugin header responsive layout
en 1680px: actions single-line and contained; heading separate; information follows subtitle; focus retained en 768px: actions single-line and contained; heading separate; information follows subtitle; focus retained en 520px: actions single-line and contained; heading separate; information follows subtitle; focus retained en 440px: actions single-line and contained; heading separate; information follows subtitle; focus retained en 390px: actions single-line and contained; heading separate; information follows subtitle; focus retained en 430px: actions single-line and contained; heading separate; information follows subtitle; focus retained en 1024px: actions single-line and contained; heading separate; information follows subtitle; focus retained zh 1680px: actions single-line and contained; heading separate; information follows subtitle; focus retained zh 768px: actions single-line and contained; heading separate; information follows subtitle; focus retained zh 520px: actions single-line and contained; heading separate; information follows subtitle; focus retained zh 440px: actions single-line and contained; heading separate; information follows subtitle; focus retained zh 390px: actions single-line and contained; heading separate; information follows subtitle; focus retained zh 430px: actions single-line and contained; heading separate; information follows subtitle; focus retained zh 1024px: actions single-line and contained; heading separate; information follows subtitle; focus retained
Add menu dismisses on Escape and returns focus in both locales.