You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
devdocs/assets/stylesheets/components/_mobile.scss

145 lines
2.2 KiB

//
// Mobile overrides
//
._mobile {
font-size: 100%;
background: $contentBackground;
._hide-on-mobile { display: none; }
// Layout
body { -ms-overflow-style: -ms-autohiding-scrollbar; }
._app, ._content { overflow: visible; }
._container {
margin: 0;
padding-top: $headerHeight;
}
._content {
position: static;
height: auto;
margin: 0;
padding: .75rem 1rem 1px;
&:before { content: none; }
}
._booting:before, ._content-loading:before { font-size: 3rem; }
._header { position: fixed; }
._header, ._list, ._sidebar-footer {
width: 100%;
border-right: 0;
box-shadow: none;
}
// Settings
._settings { position: relative; }
._settings-tabs { display: block; }
._header ._settings-btn { width: auto; }
// Header
._header-btn[hidden] { display: block; }
._search {
padding-right: .125rem;
padding-left: .125rem;
&:before { left: .625rem; }
}
._search-tag { left: .5rem; }
// Sidebar
._sidebar {
position: relative;
min-height: 100%;
overflow: visible;
}
._resizer { display: none; }
._list-item {
white-space: normal;
word-wrap: break-word;
overflow-wrap: break-word;
box-shadow: none;
}
._list-result {
padding-left: 2.375rem;
&:before {
position: absolute;
top: .25rem;
left: .75rem;
}
}
// Notice
._notice {
position: fixed;
left: 0;
padding: 0 .5rem;
}
._notice-text { font-size: .75em; }
// Notification
._notif { position: fixed; }
// Table of contents
._toc {
float: none;
max-width: none;
margin-left: 0;
}
}
//
// Fix viewport on Windows Phone
//
@-ms-viewport { width: device-width; }
@media (orientation: portrait) and (min-device-width: 720px) and (max-device-width: 768px),
(orientation: landscape) and (device-width: 1280px) and (max-device-height: 768px) {
@-ms-viewport { width: 50%; }
}
//
// Header buttons
//
._forward-btn {
margin-right: -.5rem;
> svg { margin-left: -.375rem; }
}
//
// Intro
//
._mobile-intro {
> ._intro-list { padding-left: 1.5rem; }
._intro-hide {
position: static;
float: none;
display: block;
margin-top: .75rem;
text-align: center;
}
}