diff options
Diffstat (limited to 'core/css')
-rw-r--r-- | core/css/apps.css | 36 | ||||
-rw-r--r-- | core/css/mobile.css | 8 |
2 files changed, 44 insertions, 0 deletions
diff --git a/core/css/apps.css b/core/css/apps.css index 57133729f15..d3b9c0e7095 100644 --- a/core/css/apps.css +++ b/core/css/apps.css @@ -417,7 +417,43 @@ min-height: 100%; } +/* APP-SIDEBAR ----------------------------------------------------------------*/ + +/* + Sidebar: a sidebar to be used within #app-content + have it as first element within app-content in order to shrink other + sibling containers properly. Compare Files app for example. +*/ +#app-sidebar { + position: absolute; + top: 0; + right: 0; + left: auto; + bottom: 0; + width: 30%; + min-width: 300px; + display: block; + background: #eee; + -webkit-transition: margin-right 300ms; + -moz-transition: margin-right 300ms; + -o-transition: margin-right 300ms; + transition: margin-right 300ms; + overflow-x: hidden; + overflow-y: auto; + visibility: visible; + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + box-shadow: 0 2px 3px rgba(50, 50, 50, .4); + z-index: 500; +} +#app-sidebar ~ .with-app-sidebar { + width: 70%; +} + +#app-sidebar.disappear { + visibility: hidden; +} /* APP-SETTINGS ---------------------------------------------------------------*/ diff --git a/core/css/mobile.css b/core/css/mobile.css index 80217d7069c..e38d9756d95 100644 --- a/core/css/mobile.css +++ b/core/css/mobile.css @@ -103,6 +103,14 @@ z-index: 1000; } +#app-sidebar { + width: 250px; +} + +#app-sidebar ~ .with-app-sidebar { + width: 100%; +} + /* allow horizontal scrollbar in settings otherwise user management is not usable on mobile */ #body-settings #app-content { |