nextcloud/apps/files/css/mobile.css

84 lines
1.9 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

@media only screen and (max-width: 768px) {
/* dont require a minimum width for files table */
#body-user #filestable {
min-width: initial !important;
}
/* hide size and date columns */
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;
}
/* and accordingly fix left margin of file list summary on mobile */
.summary .info {
margin-left: 105px;
}
/* remove shift for multiselect bar to account for missing navigation */
table.multiselect thead {
padding-left: 0;
}
/* restrict length of displayed filename to prevent overflow */
table td.filename .nametext {
width: 100%;
}
/* always show actions on mobile, not only on hover */
#fileList a.action,
#fileList a.action.action-menu.permanent {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)" !important;
filter: alpha(opacity=20) !important;
opacity: .2 !important;
display: inline !important;
}
/* show share action of shared items darker to distinguish from non-shared */
#fileList a.action.permanent {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)" !important;
filter: alpha(opacity=70) !important;
opacity: .7 !important;
}
#fileList a.action.action-menu img {
padding-left: 2px;
}
#fileList .fileActionsMenu {
margin-right: 5px;
}
/* some padding for better clickability */
#fileList a.action img {
padding: 0 6px 0 12px;
}
/* hide text of the share action on mobile */
#fileList a.action-share span {
display: none;
}
/* ellipsis on file names */
table td.filename .nametext .innernametext {
max-width: 50%;
}
/* proper notification area for multi line messages */
#notification-container {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}
/* shorten elements for mobile */
#uploadprogressbar {
width: 50px;
}
}