nextcloud-server/core/css/mobile.css

106 lines
2.0 KiB
CSS

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

@media only screen and (max-width: 768px) {
/* show caret indicator next to logo to make clear it is tappable */
#owncloud.menutoggle {
background-image: url('../img/actions/caret.svg');
background-repeat: no-repeat;
background-position: right 26px;
padding-right: 16px !important;
}
/* compress search box on mobile, expand when focused */
.searchbox input[type="search"] {
width: 15%;
-webkit-transition: width 100ms;
-moz-transition: width 100ms;
-o-transition: width 100ms;
transition: width 100ms;
}
.searchbox input[type="search"]:focus,
.searchbox input[type="search"]:active {
width: 155px;
}
/* do not show display name on mobile when profile picture is present */
#header .avatardiv.avatardiv-shown + #expandDisplayName {
display: none;
}
/* toggle navigation */
#content-wrapper {
padding-left: 0;
}
#navigation {
top: 45px;
bottom: initial;
width: 255px;
max-height: 90%;
margin-top: 0;
top: 45px;
background-color: rgba(36, 40, 47, .97);
overflow-x: initial;
border-bottom-right-radius: 7px;
border-bottom: 1px #333 solid;
border-right: 1px #333 solid;
box-shadow: 0 0 7px rgba(29,45,68,.97);
display: none;
}
#navigation, #navigation * {
box-sizing:border-box; -moz-box-sizing:border-box;
}
#navigation li {
display: inline-block;
}
#navigation a {
width: 80px;
height: 80px;
display: inline-block;
text-align: center;
padding: 20px 0;
}
#navigation a span {
display: inline-block;
font-size: 13px;
padding-bottom: 0;
padding-left: 0;
width: 80px;
}
#navigation .icon {
margin: 0 auto;
padding: 0;
}
#navigation li:first-child .icon {
padding-top: 0;
}
/* Apps management as sticky footer */
#navigation .wrapper {
min-height: initial;
margin: 0;
}
#apps-management, #navigation .push {
height: initial;
}
/* shift to account for missing navigation */
#body-user #controls,
#body-settings #controls {
padding-left: 0;
}
/* dont require a minimum width for controls bar */
#controls {
min-width: initial !important;
}
/* position share dropdown */
#dropdown {
margin-right: 10% !important;
width: 80% !important;
}
}