You are here: DAMASK>System>Category>AdminDocumentationCategory>Skins>PatternSkin>PatternSkinCssCookbook>PatternSkinCssCookbookSidebarToggle

Edit Wiki text (w) Attach an image or document to this topic; manage existing attachments (a) View sequential topic history View without formatting (v) Create new topic Printable version of this topic (p) More: delete or rename this topic; set parent topic; view and compare revisions (m)

PatternSkinCssCookbook Recipe: Left Sidebar Toggle

The Sidebar is hidden for screens with width < 870px. This makes the main page content more readable on small devices, but blocks access to some important links, such as the Login link. This cookbook shows how to add a button that will toggle the sidebar when it is hidden on small screen.

This button is configured in any of SitePreferences, in WebPreferences (for a single web), in your WikiGuest topic, or on a single page.

This line loads the extra style definition: 
   * Set USERSTYLEURL = %PUBURLPATH{topic="%SYSTEMWEB%.PatternSkinCssCookbookSidebarToggle" "SidebarToggle.css"}%

To activate the button in the sidebar, override the viewsidebar.pattern.tmpl using the supplied viewsidebar.sidetoggle.tmpl by adding it to the front of the SKIN setting.

Your current SKIN setting is damask,famfamfam,pattern Change it to 
    * Set SKIN=sidetoggle,damask,famfamfam,pattern

The formating and positioning is done in the css. When the sidebar is hidden, the button will appear in the lower left corner of the screen, appearing as the "hamburg" icon: ... .
Topic attachments
I Attachment Action Size Date Who Comment
SidebarToggle.csscss SidebarToggle.css manage 784 bytes 29 Nov 2016 - 02:36 ProjectContributor StyleSheet to toggle left Sidebar in the PatternSkin
Edit  | Attach | Print version | History: r1 | Backlinks | View wiki text | Edit wiki text | More topic actions
Topic revision: r1 - 02 Mar 2018, UnknownUser
This site is powered by FoswikiCopyright © by the contributing authors. All material on this site is the property of the contributing authors.
Ideas, requests, problems regarding DAMASK? Send feedback