Navigation flex magic
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
This commit is contained in:
parent
d85781d5f4
commit
0a67e0e2a8
|
@ -101,7 +101,7 @@ kbd {
|
|||
box-sizing: border-box;
|
||||
> li {
|
||||
display: inline-flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
&:focus,
|
||||
&:hover,
|
||||
&.active,
|
||||
|
@ -112,6 +112,15 @@ kbd {
|
|||
box-shadow: inset 2px 0 $color-primary;
|
||||
}
|
||||
}
|
||||
/* Second level nesting for lists */
|
||||
> ul {
|
||||
display: none;
|
||||
flex: 1 0 100%;
|
||||
> li {
|
||||
display: inline-flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
li {
|
||||
|
@ -134,6 +143,7 @@ kbd {
|
|||
text-overflow: ellipsis;
|
||||
color: $color-main-text;
|
||||
opacity: .57;
|
||||
flex: 1 1 0;
|
||||
&:first-child img {
|
||||
margin-bottom: -3px;
|
||||
margin-right: 11px;
|
||||
|
@ -149,22 +159,6 @@ kbd {
|
|||
}
|
||||
}
|
||||
}
|
||||
> {
|
||||
/* Second level nesting for lists */
|
||||
ul ul {
|
||||
display: none;
|
||||
li > a {
|
||||
padding-left: 32px;
|
||||
}
|
||||
}
|
||||
.with-icon ul li {
|
||||
> a,
|
||||
&.app-navigation-entry-loading > a {
|
||||
padding-left: 68px;
|
||||
background-position: 44px center;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
@ -289,7 +283,7 @@ kbd {
|
|||
* App navigation utils, buttons and counters for drop down menu
|
||||
*/
|
||||
.app-navigation-entry-utils {
|
||||
flex-shrink: 0;
|
||||
flex: 0 1 auto;
|
||||
ul {
|
||||
display: flex !important;
|
||||
align-items: center;
|
||||
|
@ -322,10 +316,8 @@ kbd {
|
|||
}
|
||||
.app-navigation-entry-utils-counter {
|
||||
overflow: hidden;
|
||||
text-overflow: hidden;
|
||||
text-align: right;
|
||||
font-size: 9pt;
|
||||
width: 38px;
|
||||
line-height: 44px;
|
||||
padding: 0 12px; /* Same padding as all li > a in the app-navigation */
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue