You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
[< 768px] In order for the CMS to be usable on smaller screen sizes, the main menu within the CMS will need to be collapsible to allow the main content panels to take pride of place. This will include:
Menu should animate out from the hamburger area in the top left.
Width of the menu should be 100% - 60px so the following CSS might be good to use, you can use platform.silverstripe.com for a very similar example. mockups marked with for Beta1 https://invis.io/V6BW0ZNFH#/235742840_Navigation_Mobile_Start [~3pt]
Width: calc(100% - 60px);
Margin-left: calc(-100% + 60px);
Position: relative;
[All screen sizes] Move logout icon to the right of the profile name and reduce its size slightly, a new icon takes the logout icon positioned on the left of the user's name. [~1pt]
Excludes: Moving the SilverStripe branding and help link in the menu (this will be a seperate issue, so there will be no branding at the moment)
Need to update viewport as it is constrained to 720px:
Swap <meta name="viewport" content="width=720, maximum-scale=1.0" /> for <meta name="viewport" content="width=device-width, maximum-scale=1.0" />
Main toolbar also needs to be improved to allow for [<] back arrow, header/breadcrumb and right tabs. I recommend to swap tab titles for icons and drop tabs below title.
Note this issue is no.2 on the list below but also the central reference of the other responsive type issues for Beta1.
WIP acceptance criteria
Recommendations for implementation in order of most important (up to 8pts worth)
MERGED Remove constrained viewport see issue Remove constrained viewport size silverstripe-admin#100
[< 768px] In order for the CMS to be usable on smaller screen sizes, the main menu within the CMS will need to be collapsible to allow the main content panels to take pride of place. This will include:
Drop ModalAdmin tabs at smaller viewport sizes see Drop main modalAdmin tabs for smaller screens silverstripe-admin#99
More options dropdown see More options dropdown label change to icon silverstripe-admin#101
ModelAdmin toolbar actions to fall back to just icons for smaller screens see ModalAdmin actions to fallback to just icons silverstripe-admin#102
Related issues if time permits
[< 768px] Reduce sort dropdown in assets to icon so that it fits on smaller screens. see Reduce the sort dropdown label to an icon for smaller screens silverstripe-asset-admin#496 [1pt]
[< 768px] Add a publish button to draft preview so the user can publish directly after. see Add publish button to page preview on smaller screens and preview only view silverstripe-cms#1843
Increase spacing of site tree items vertically to ensure clickability by fingers [3pt] see Add responsive padding to Site Tree silverstripe-cms#1832 (comment)
[All sizes] Tabs to have an overflow dropdown when there isn't enough space. Responsive tabs see Replace CMS tabs with dropdown toggle on pages that have long tabs #1943 [5pt]
[All sizes] The history section within Pages will not work on mobile in its current state. See Enhancement: History section doesn't make sense silverstripe-cms#1493 for a possible interaction [8pt]
[ All sizes] Move CMS help to new area within the main menu along with SilverStripe brand [add link] [3pt]
Tasks
Pull requests
The text was updated successfully, but these errors were encountered: