fraport/fradrive
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

moved sort-handles back to the side of the th

Browse Source
This commit is contained in:
Felix Hamann 2018-06-17 22:29:38 +02:00
parent e2f37699d9
commit 0c91bb83d8
1 changed files with 13 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
templates/table/colonnade.lucius
View File

@ -7,14 +7,14 @@
.table--striped {
.table__row:not(.no-stripe):nth-child(even) {
background-color: rgba(0, 0, 0, 0.07);
background-color: rgba(0, 0, 0, 0.03);
}
}
.table--hover {
.table__row:not(.no-hover):not(.table__row--head):hover {
background-color: rgba(0, 0, 0, 0.15);
background-color: rgba(0, 0, 0, 0.07);
}
}
@ -76,17 +76,18 @@
/* TODO: move outside of table as soon as tds and ths get their own class */
th.sortable {
position: relative;
padding-right: 24px;
cursor: pointer;
}
th.sortable::after,
th.sortable::before {
content: '';
position: absolute;
right: 0;
top: 50%;
right: 4px;
width: 0;
height: 0;
left: 50%;
transform: translate(-50%, -100%);
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-bottom: 8px solid rgba(255, 255, 255, 0.4);
@ -95,20 +96,21 @@
th.sortable::before {
/* magic numbers to move arrow back in the right position after flipping it.
this allows us to use the same border for the up and the down arrow */
bottom: -3px;
transform: translateX(-8px) scale(1, -1);
transform: translateY(150%) scale(1, -1);
transform-origin: top;
}
th.sortable::after {
top: 15px;
transform: translateY(-150%);
}
th.sortable:hover::before,
th.sorted-asc:hover::after,
th.sortable:hover::after {
border-bottom-color: rgba(255, 255, 255, 0.7);
}
th.sorted-asc::before,
th.sorted-desc:hover::after,
th.sorted-desc::after {
border-bottom-color: white;
border-bottom-color: white !important;
}
}