diff options
| author | Jordan Wiens <jordan@psifertex.com> | 2016-07-24 19:13:40 -0400 |
|---|---|---|
| committer | Jordan Wiens <jordan@psifertex.com> | 2016-07-24 19:13:40 -0400 |
| commit | b1900d6ebcc39738885f90fa9f18b28206a74947 (patch) | |
| tree | 2d4975fe0a347af7101200c48e4a8df82ca780ae /mkdocs-material/src/assets/stylesheets/modules/drawer/_layout.scss | |
| parent | 754ea372c66afad144988fcab2d7cf1fdbb3f2fc (diff) | |
very early checkin of template for user-docs, only a few pages filled out
Diffstat (limited to 'mkdocs-material/src/assets/stylesheets/modules/drawer/_layout.scss')
| -rw-r--r-- | mkdocs-material/src/assets/stylesheets/modules/drawer/_layout.scss | 305 |
1 files changed, 305 insertions, 0 deletions
diff --git a/mkdocs-material/src/assets/stylesheets/modules/drawer/_layout.scss b/mkdocs-material/src/assets/stylesheets/modules/drawer/_layout.scss new file mode 100644 index 00000000..d6e1df28 --- /dev/null +++ b/mkdocs-material/src/assets/stylesheets/modules/drawer/_layout.scss @@ -0,0 +1,305 @@ +/* + * Copyright (c) 2016 Martin Donath <martin.donath@squidfunk.com> + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to + * deal in the Software without restriction, including without limitation the + * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or + * sell copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in + * all copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING + * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS + * IN THE SOFTWARE. + */ + +/* ---------------------------------------------------------------------------- + * Drawer layout + * ------------------------------------------------------------------------- */ + +/* + * Drawer container + */ +.drawer { + width: 262px; + font-size: 13px; + line-height: 1.0em; + + /* [tablet landscape-]: Fixed positioning */ + @include break-to-device(tablet landscape) { + position: fixed; + z-index: 5; + height: 100%; + } + + /* [tablet landscape+]: Inline with content */ + @include break-from-device(tablet landscape) { + position: static; + float: left; + height: auto; + margin-bottom: 96px; + padding-top: 80px; + } + + /* Hack [iOS]: Mitigate scrolling of parent container on boundaries */ + .ios & { + overflow: scroll; + -webkit-overflow-scrolling: touch; + } + + /* + * Links to articles + */ + .toc li a { + display: block; + padding: 14.5px 24px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + + /* + * Links to anchors + */ + .toc li.anchor a { + margin-left: 12px; + padding: 10px 24px 10px 12px; + } + + /* + * Nested links and anchors + */ + .toc li ul { + margin-left: 12px; + } + + /* + * Nested anchors + */ + .current + ul { + margin-bottom: 9px; + } + + /* + * Main sections + */ + .section { + display: block; + padding: 14.5px 24px; + } + + /* + * Scrollable container + */ + .scrollable { + top: 104px; + z-index: -1; + + /* [tablet landscape+]: Revert fixed positioning */ + @include break-from-device(tablet landscape) { + position: static; + } + + /* + * Leave room for status bar in iOS web application + */ + .ios.standalone & { + + /* [orientation: portrait]: Account for status bar in portrait mode */ + @include break-at-orientation(portrait) { + top: (104px + 20px); + } + } + + /* + * Content wrapper + */ + .wrapper { + height: auto; + min-height: 100%; + + /* + * Add spacing at top and bottom of separator + */ + hr { + margin: 12px 0; + + /* [screen+]: Shorten separator */ + @include break-from-device(screen) { + width: 48px; + } + + /* Hack [IE]: Left-align horizontal rule */ + margin-right: auto; + } + + /* + * Add spacing at top and bottom of top level navigation + */ + .toc { + margin: 12px 0; + } + } + } +} + +/* + * Project information + */ +.project { + display: block; + + /* + * Leave room for status bar in iOS web application + */ + .ios.standalone & { + + /* [orientation: portrait]: Account for status bar in portrait mode */ + @include break-at-orientation(portrait) { + padding-top: 20px; + + /* + * Add status bar overlay + */ + &:before { + content: " "; + position: absolute; + top: 0; + left: 0; + z-index: 4; + width: 100%; + height: 20px; + } + } + } + + /* + * Project banner + */ + .banner { + display: table; + width: 100%; + height: 104px; + padding: 20px; + } + + /* + * Project logo + */ + .logo { + display: table-cell; + width: 64px; + padding-right: 12px; + + /* + * Project logo image + */ + img { + display: block; + width: 64px; + height: 64px; + } + } + + /* + * Project name + */ + .name { + display: table-cell; + padding-left: 4px; + font-size: 14px; + line-height: 1.25em; + vertical-align: middle; + + /* [tablet portait+]: Slightly larger project name */ + @include break-from-device(tablet portrait) { + margin: 26px 0 0 5px; + } + } + + /* + * Shrink font, if a logo is given. + */ + .logo + .name { + font-size: 12px; + } +} + +/* + * Repository + */ +.repo { + margin: 24px 0; + text-align: center; + + /* + * Inline buttons + */ + li { + display: inline-block; + padding-right: 12px; + white-space: nowrap; + + /* + * No padding on last button + */ + &:last-child { + padding-right: 0; + } + } + + /* + * Buttons + */ + a { + display: inline-block; + padding: 0px 10px 0px 6px; + font-size: 12px; + line-height: 30px; + height: 30px; + + /* + * Slightly larger icons + */ + .icon { + font-size: 18px; + vertical-align: -3px; + } + + /* + * Stars + */ + .count { + display: inline-block; + position: relative; + padding: 0px 8px 0 4px; + margin: 0 -10px 0 8px; + font-size: 12px; + + /* + * Star bubble + */ + &:before { + content: " "; + display: block; + position: absolute; + top: 0px; + left: -5px; + } + + /* + * Hide count, in case javascript is not available. + */ + .no-js & { + display: none; + } + } + } +}
\ No newline at end of file |
