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

make hover menu for SecondaryPageActions not right-aligned

Browse Source
This commit is contained in:
Felix Hamann 2019-02-08 22:07:01 +01:00
parent db780ecf00
commit b2ffb2f0c3
1 changed files with 36 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

73
templates/widgets/pageaction.lucius
View File

@ -1,20 +1,42 @@
.pagenav { .pagenav {
display: flex; display: flex;
justify-content: space-between;
align-items: flex-start; align-items: flex-start;
} }
.pagenav__list-item {
flex: 1;
position: relative;
display: inline-flex;
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.6);
margin: 10px 10px 0 0;
}
.pagenav__link-wrapper {
flex: 1;
padding: 10px 10px 12px;
&:hover {
background-color: var(--color-grey-light);
}
}
@media (max-width: 1024px) {
.pagenav {
flex-direction: column;
}
}
@media (min-width: 1025px) {
.pagenav-secondary { .pagenav-secondary {
position: relative; position: relative;
overflow: visible; overflow: visible;
padding-top: 10px; padding-top: 10px;
margin-left: auto;
&::after { &::after {
content: '\2807'; content: '\2026';
display: inline-block; display: inline-block;
font-size: 31px; padding: 10px 10px 12px;
padding: 4px 5px 2px 10px;
width: 40px; width: 40px;
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.6); box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.6);
box-sizing: border-box; box-sizing: border-box;
@ -31,22 +53,13 @@
.pagenav-secondary__list { .pagenav-secondary__list {
position: absolute; position: absolute;
display: none; display: none;
right: 0; left: 0;
top: 10px; top: 10px;
width: 250px; width: 250px;
text-align: right;
background-color: white; background-color: white;
box-shadow: 0 0 6px 3px var(--color-grey-light); box-shadow: 0 0 6px 3px var(--color-grey-light);
} }
.pagenav__list-item {
flex: 1;
position: relative;
display: inline-flex;
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.6);
margin: 10px 10px 0 0;
}
.pagenav__list-item--secondary { .pagenav__list-item--secondary {
display: flex; display: flex;
box-shadow: none; box-shadow: none;
@ -56,34 +69,4 @@
background-color: var(--color-grey-light); background-color: var(--color-grey-light);
} }
} }
.pagenav__link-wrapper {
flex: 1;
padding: 10px 10px 12px;
&:hover {
background-color: var(--color-grey-light);
}
}
@media (max-width: 768px) {
.pagenav {
flex-direction: column;
}
.pagenav-secondary {
width: 100%;
&::after {
content: none;
}
}
.pagenav-secondary__list {
display: block;
position: relative;
width: initial;
text-align: initial;
}
} }