12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788 |
- /* 938 = table min-width(688) + app-navigation width: 250\
- $breakpoint-mobile +1 = size where app-navigation is hidden +1
- 688 = table min-width */
- $min-table-width: 688px;
- @media only screen and (max-width: $min-table-width + $navigation-width) and (min-width: $breakpoint-mobile + 1), only screen and (max-width: $min-table-width) {
- .app-files #app-content.dir-drop{
- background-color: rgba(255, 255, 255, 1)!important;
- }
- table th#headerSize,
- table td.filesize,
- table th#headerDate,
- table td.date {
- display: none;
- }
- /* remove padding to let border bottom fill the whole width*/
- table td {
- padding: 0;
- }
- /* remove shift for multiselect bar to account for missing navigation */
- table.multiselect thead {
- padding-left: 0;
- }
- #fileList a.action.action-menu img {
- padding-left: 0;
- }
- #fileList .fileActionsMenu {
- margin-right: 6px;
- }
- /* hide text of the share action on mobile */
- /* .hidden-visually for accessbility */
- #fileList a.action-share span:not(.icon):not(.avatar) {
- position: absolute;
- left:-10000px;
- top: auto;
- width: 1px;
- height: 1px;
- overflow: hidden;
- }
- /* proper notification area for multi line messages */
- #notification-container {
- display: flex;
- }
- /* shorten elements for mobile */
- #uploadprogressbar, #uploadprogressbar .label.inner {
- width: 50px;
- }
- /* hide desktop-only parts */
- #uploadprogressbar .desktop {
- display: none !important;
- }
- #uploadprogressbar .mobile {
- display: block !important;
- }
- /* ensure that it is visible over #app-content */
- table.dragshadow {
- z-index: 1000;
- }
- }
- @media only screen and (max-width: 480px) {
- /* Only show icons */
- table th .selectedActions {
- float: right;
- }
- table th .selectedActions > a span:not(.icon) {
- display: none;
- }
- /* Increase touch area for the icons */
- table th .selectedActions a {
- padding: 17px 14px;
- }
- /* Remove the margin to reduce the overlap between the name and the icons */
- table.multiselect th .columntitle.name {
- margin-left: 0;
- }
- }
|