github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2025-06-07 17:24:33 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add LESS variable to configure expansion of sideNav dropdowns

Browse Source
This commit is contained in:
Toby Zerner
2017-10-25 12:36:09 +10:30
parent f3b4d35587
commit 2754a8c867
2 changed files with 40 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
less/lib/sideNav.less
View File

@ -9,7 +9,7 @@
// control; the new discussion button is the primary-control. On anything // control; the new discussion button is the primary-control. On anything
// larger than a phone, however, we need to affix the sidebar and expand the // larger than a phone, however, we need to affix the sidebar and expand the
// .dropdown-select into a plain list. // .dropdown-select into a plain list.
@media @tablet-up { @media @expand-side-nav {
.sideNav { .sideNav {
// Expand the dropdown-select component into a normal nav list. // Expand the dropdown-select component into a normal nav list.
& .Dropdown--select { & .Dropdown--select {
@ -48,45 +48,50 @@
} }
} }
.sideNav--horizontal { .sideNav--horizontal {}
padding: 15px 0;
white-space: nowrap;
overflow: auto;
-webkit-overflow-scrolling: touch;
&:after { @media @expand-side-nav {
content: " "; .sideNav--horizontal {
position: absolute; padding: 15px 0;
left: 0; white-space: nowrap;
right: 0; overflow: auto;
margin-top: 15px; -webkit-overflow-scrolling: touch;
border-bottom: 1px solid @control-bg;
}
> ul > li, .Dropdown-menu > li { &:after {
display: inline-block; content: " ";
margin: 0 20px 0 0; position: absolute;
vertical-align: top; left: 0;
} right: 0;
.Dropdown-separator { margin-top: 15px;
display: none; border-bottom: 1px solid @control-bg;
} }
.Dropdown--select .Dropdown-menu > li > a { > ul > li, .Dropdown-menu > li {
padding-left: 25px; display: inline-block;
margin: 0 20px 0 0;
vertical-align: top;
}
.Dropdown-separator {
display: none;
}
.icon { .Dropdown--select .Dropdown-menu > li > a {
margin-left: -25px; padding-left: 25px;
.icon {
margin-left: -25px;
}
}
.affix {
position: static;
} }
} }
.affix { @media @tablet {
position: static; .sideNav {
} .sideNav--horizontal();
} }
@media @tablet {
.sideNav {
.sideNav--horizontal();
} }
} }

2
less/lib/variables.less
View File

@ -110,6 +110,8 @@
@zindex-alerts: 1060; @zindex-alerts: 1060;
@zindex-tooltip: 1070; @zindex-tooltip: 1070;
@expand-side-nav: @tablet-up;
// --------------------------------- // ---------------------------------
// BREAKPOINTS // BREAKPOINTS