mdbook/src/theme/stylus/page.styl

@require 'variables'

.page-wrapper {
    padding-left: $sidebar-width
    box-sizing: border-box

    min-height: 100%

    // Animation: slide away
    transition: padding-left 0.5s, margin-right 0.5s

    @media only screen and (max-width: $max-page-width-with-hidden-sidebar) {
        padding-left: 0
    }
}

.sidebar-hidden .page-wrapper {
    padding-left: 0
}

.sidebar-visible .page-wrapper {
    padding-left: $sidebar-width
    margin-right: - $sidebar-width
}

.page {
    outline: 0
    padding: 0 $page-padding
}

.content {
    margin-left: auto
    margin-right:auto
    max-width: $content-max-width
    padding-bottom: 50px

    a {
        text-decoration: none;
        &:hover { text-decoration: underline; }
    }

    img { max-width: 100%; }
}
Fix #47 sidebar stays hidden even after page change 2015-09-24 16:47:33 +02:00			`@require 'variables'`

Converted all css to stylus 2015-09-18 22:13:55 +02:00			`.page-wrapper {`
On iOS, allow scrolling to the top of the page by tapping the top of the screen * This is a built-in function of iOS Safari that didn't work because the page content was inside absolutely-positioned, scrollable divs. * The fix is to stop using absolute positioning on `.page-wrapper` and `.page`, so that the content uses static positioning and flows naturally down the page. * Consequently, `.sidebar` and `.nav-chapter` now have to use `position: fixed` in order to be positioned relative to the viewport. * This fix also enables Safari's built-in behavior of automatically hiding the top and bottom toolbars when scrolling down the page. 2017-06-04 19:58:51 -07:00			`padding-left: $sidebar-width`
Converted all css to stylus 2015-09-18 22:13:55 +02:00			`box-sizing: border-box`

			`min-height: 100%`

			`// Animation: slide away`
Optimized the stylesheet for better performance 2017-12-06 16:20:22 +08:00			`transition: padding-left 0.5s, margin-right 0.5s`
Converted all css to stylus 2015-09-18 22:13:55 +02:00
On iOS, allow scrolling to the top of the page by tapping the top of the screen * This is a built-in function of iOS Safari that didn't work because the page content was inside absolutely-positioned, scrollable divs. * The fix is to stop using absolute positioning on `.page-wrapper` and `.page`, so that the content uses static positioning and flows naturally down the page. * Consequently, `.sidebar` and `.nav-chapter` now have to use `position: fixed` in order to be positioned relative to the viewport. * This fix also enables Safari's built-in behavior of automatically hiding the top and bottom toolbars when scrolling down the page. 2017-06-04 19:58:51 -07:00			`@media only screen and (max-width: $max-page-width-with-hidden-sidebar) {`
			`padding-left: 0`
Converted all css to stylus 2015-09-18 22:13:55 +02:00			`}`
			`}`

Fix #47 sidebar stays hidden even after page change 2015-09-24 16:47:33 +02:00			`.sidebar-hidden .page-wrapper {`
On iOS, allow scrolling to the top of the page by tapping the top of the screen * This is a built-in function of iOS Safari that didn't work because the page content was inside absolutely-positioned, scrollable divs. * The fix is to stop using absolute positioning on `.page-wrapper` and `.page`, so that the content uses static positioning and flows naturally down the page. * Consequently, `.sidebar` and `.nav-chapter` now have to use `position: fixed` in order to be positioned relative to the viewport. * This fix also enables Safari's built-in behavior of automatically hiding the top and bottom toolbars when scrolling down the page. 2017-06-04 19:58:51 -07:00			`padding-left: 0`
Fix #47 sidebar stays hidden even after page change 2015-09-24 16:47:33 +02:00			`}`

			`.sidebar-visible .page-wrapper {`
On iOS, allow scrolling to the top of the page by tapping the top of the screen * This is a built-in function of iOS Safari that didn't work because the page content was inside absolutely-positioned, scrollable divs. * The fix is to stop using absolute positioning on `.page-wrapper` and `.page`, so that the content uses static positioning and flows naturally down the page. * Consequently, `.sidebar` and `.nav-chapter` now have to use `position: fixed` in order to be positioned relative to the viewport. * This fix also enables Safari's built-in behavior of automatically hiding the top and bottom toolbars when scrolling down the page. 2017-06-04 19:58:51 -07:00			`padding-left: $sidebar-width`
Optimized the stylesheet for better performance 2017-12-06 16:20:22 +08:00			`margin-right: - $sidebar-width`
Fix #47 sidebar stays hidden even after page change 2015-09-24 16:47:33 +02:00			`}`

Converted all css to stylus 2015-09-18 22:13:55 +02:00			`.page {`
Auto focus on content to allow keyboard navigation 2017-06-15 21:12:28 +02:00			`outline: 0`
On iOS, allow scrolling to the top of the page by tapping the top of the screen * This is a built-in function of iOS Safari that didn't work because the page content was inside absolutely-positioned, scrollable divs. * The fix is to stop using absolute positioning on `.page-wrapper` and `.page`, so that the content uses static positioning and flows naturally down the page. * Consequently, `.sidebar` and `.nav-chapter` now have to use `position: fixed` in order to be positioned relative to the viewport. * This fix also enables Safari's built-in behavior of automatically hiding the top and bottom toolbars when scrolling down the page. 2017-06-04 19:58:51 -07:00			`padding: 0 $page-padding`
Converted all css to stylus 2015-09-18 22:13:55 +02:00			`}`

			`.content {`
			`margin-left: auto`
			`margin-right:auto`
Optimized the stylesheet for better performance 2017-12-06 16:20:22 +08:00			`max-width: $content-max-width`
Converted all css to stylus 2015-09-18 22:13:55 +02:00			`padding-bottom: 50px`

			`a {`
			`text-decoration: none;`
			`&:hover { text-decoration: underline; }`
			`}`

			`img { max-width: 100%; }`
			`}`