f392e78d5b
The selection column is not only a visual column, but also a real column of the file list table. Unlike other columns whose width is reduced in space constrained screens the selection column must stay the same so the tapping area is large enough to be easily usable The selection column does not appear in the search results table, so its contents have to be explicitly aligned with those of the main table based on whether the main table has a selection column or not (using the "has-selection" CSS class in the same way as the "has-favorite" CSS class was being used when there was a column for favorite actions). In the tests the ":visible" selector can no longer be used. That selector matches elements with a width or height that is greater than zero, but the dimensions calculated in the unit tests are not reliable; the width of the link was zero before these changes, and now moving the checkbox to its own column causes the height of the link to become zero too, so it no longer matches the ":visible" selector even if it is not hidden. As hidding and showing the link is based on its "display" CSS property its value is the one checked now. Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
105 lines
1.9 KiB
CSS
105 lines
1.9 KiB
CSS
/* Copyright (c) 2011, Jan-Christoph Borchardt, http://jancborchardt.net
|
|
This file is licensed under the Affero General Public License version 3 or later.
|
|
See the COPYING-README file. */
|
|
|
|
#searchresults {
|
|
background-color: #fff;
|
|
overflow-x: hidden;
|
|
text-overflow: ellipsis;
|
|
padding-top: 65px;
|
|
box-sizing: border-box;
|
|
z-index: 75;
|
|
/* account for margin-bottom in files list */
|
|
margin-top: -250px;
|
|
}
|
|
#searchresults.filter-empty {
|
|
/* remove whitespace on bottom when no search results, to fix layout */
|
|
margin-top: 0 !important;
|
|
}
|
|
|
|
#searchresults.hidden {
|
|
display: none;
|
|
}
|
|
#searchresults * {
|
|
box-sizing: content-box;
|
|
}
|
|
|
|
#searchresults .status {
|
|
background-color: rgba(255, 255, 255, .85);
|
|
height: 12px;
|
|
padding: 28px 0 28px 56px;
|
|
font-size: 18px;
|
|
}
|
|
.has-selection:not(.hidden) ~ #searchresults .status {
|
|
padding-left: 105px;
|
|
}
|
|
#searchresults .status.fixed {
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 100%;
|
|
z-index: 10;
|
|
}
|
|
|
|
#searchresults .status .spinner {
|
|
height: 16px;
|
|
width: 16px;
|
|
vertical-align: middle;
|
|
margin-left: 10px;
|
|
}
|
|
#searchresults table {
|
|
border-spacing:0;
|
|
table-layout:fixed;
|
|
top:0;
|
|
width:100%;
|
|
}
|
|
|
|
#searchresults td {
|
|
padding: 5px 14px;
|
|
font-style: normal;
|
|
vertical-align: middle;
|
|
border-bottom: none;
|
|
}
|
|
#searchresults td.icon {
|
|
text-align: right;
|
|
width: 40px;
|
|
height: 40px;
|
|
padding: 5px 0;
|
|
background-position: right center;
|
|
background-repeat: no-repeat;
|
|
}
|
|
.has-selection:not(.hidden) ~ #searchresults td.icon {
|
|
width: 91px;
|
|
background-size: 32px;
|
|
}
|
|
|
|
#searchresults tr.template {
|
|
display: none;
|
|
}
|
|
|
|
#searchresults .name,
|
|
#searchresults .text,
|
|
#searchresults .path {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
#searchresults .text {
|
|
white-space: normal;
|
|
color: #545454;
|
|
}
|
|
#searchresults .path {
|
|
opacity: .5;
|
|
}
|
|
#searchresults .text em {
|
|
color: #545454;
|
|
font-weight: bold;
|
|
opacity: 1;
|
|
}
|
|
|
|
#searchresults tr.result * {
|
|
cursor:pointer;
|
|
}
|
|
|
|
#searchresults tr.current {
|
|
background-color:#ddd;
|
|
}
|