123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164 |
- @media only screen and (max-width: 768px) {
- #body-login #header {
- padding-top: 10px;
- }
- #body-login .wrapper {
- display: -webkit-box;
- -webkit-box-orient: horizontal;
- -webkit-box-pack: center;
- -webkit-box-align: center;
- display: -moz-box;
- -moz-box-orient: horizontal;
- -moz-box-pack: center;
- -moz-box-align: center;
- display: box;
- box-orient: horizontal;
- box-pack: center;
- box-align: center;
- }
- /* on mobile public share, show only the icon of the logo, hide the text */
- #body-public #header .header-appname-container {
- display: none;
- }
- /* do not show display name on mobile when profile picture is present */
- #header .avatardiv.avatardiv-shown + #expandDisplayName {
- display: none;
- }
- #header #expand {
- display: block;
- }
- /* do not show update notification on mobile */
- #update-notification {
- display: none !important;
- }
- /* position share dropdown */
- #dropdown {
- margin-right: 10% !important;
- width: 80% !important;
- }
- /* fix error display on smaller screens */
- .error-wide {
- width: 100%;
- margin-left: 0 !important;
- -moz-box-sizing: border-box;
- box-sizing: border-box;
- }
- /* APP SIDEBAR TOGGLE and SWIPE ----------------------------------------------*/
- #app-navigation,
- #app-content {
- position: absolute !important;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- }
- #app-navigation {
- width: 250px !important;
- }
- #app-content {
- width: 100% !important;
- left: 0 !important;
- background-color: #fff;
- overflow-x: hidden !important;
- z-index: 1000;
- }
- #app-sidebar{
- width: 100%;
- }
- /* allow horizontal scrollbar in settings
- otherwise user management is not usable on mobile */
- #body-settings #app-content {
- overflow-x: auto !important;
- }
- #app-navigation-toggle {
- position: fixed;
- display: inline-block !important;
- top: 45px;
- left: 0;
- width: 44px;
- height: 44px;
- z-index: 149;
- background-color: rgba(255, 255, 255, .7);
- cursor: pointer;
- opacity: .6;
- }
- #app-navigation-toggle:hover,
- #app-navigation-toggle:focus {
- opacity: 1;
- }
- /* controls bar for mobile */
- #controls {
- min-width: initial !important;
- left: 0 !important;
- padding-left: 0;
- }
- /* position controls for apps with app-navigation */
- #app-navigation+#app-content #controls {
- padding-left: 44px;
- }
- /* .viewer-mode is when text editor, PDF viewer, etc is open */
- #body-user .app-files.viewer-mode #controls {
- padding-left: 0 !important;
- }
- .app-files.viewer-mode #app-navigation-toggle {
- display: none !important;
- }
- table.multiselect thead {
- left: 0 !important;
- }
- /* prevent overflow in user management controls bar */
- #usersearchform {
- display: none;
- }
- #body-settings #controls {
- min-width: 768px !important;
- }
- /* do not show dates in filepicker */
- #oc-dialog-filepicker-content .filelist .date {
- display: none;
- }
- #oc-dialog-filepicker-content .filelist .filename {
- max-width: 80%;
- }
- /* fix controls bar jumping when navigation is slid out */
- .snapjs-left #app-navigation-toggle,
- .snapjs-left #controls {
- top: 0;
- }
- .snapjs-left table.multiselect thead {
- top: 44px;
- }
- /* end of media query */
- }
|