github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2024-11-24 02:09:26 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Extract .side-nav into a common file

Browse Source
This commit is contained in:
Toby Zerner 2015-03-30 12:45:48 +10:30
parent a43957e1e2
commit d64ca6bce3
3 changed files with 77 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
less/common/side-nav.less Normal file
View File

@ -0,0 +1,76 @@
.side-nav > ul {
margin: 0;
padding: 0;
list-style: none;
}
// On phones, the index sidebar will pretty much take care of itself. The
// navigation list is a .dropdown-select and will be shown as the title-
// 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
// .dropdown-select into a plain list.
@media @tablet, @desktop, @desktop-hd {
.side-nav {
// Expand the dropdown-select component into a normal nav list.
& .dropdown-select {
display: block;
.expand-dropdown();
& .dropdown-menu {
.nav-list();
}
}
}
}
@media @tablet {
.side-nav {
padding: 15px 0;
white-space: nowrap;
overflow: auto;
-webkit-overflow-scrolling: touch;
&:after {
content: " ";
position: absolute;
left: 0;
right: 0;
margin-top: 15px;
border-bottom: 1px solid @fl-body-secondary-color;
}
& > ul > li, & .dropdown-menu > li {
display: inline-block;
margin-right: 25px;
}
& .dropdown-select .dropdown-menu > li > a .fa {
margin-right: 3px;
}
& .affix {
position: static;
}
}
}
@media @desktop, @desktop-hd {
.side-nav {
float: left;
&, & > ul {
width: 175px;
}
& > ul {
margin-top: 30px;
&.affix {
top: 56px;
}
& > li {
margin-bottom: 10px;
}
}
}
}

1
less/forum/app.less
View File

@ -21,6 +21,7 @@
@import "@{common-path}/alerts.less";
@import "@{common-path}/modals.less";
@import "@{common-path}/layout.less";
@import "@{common-path}/side-nav.less";
@import "composer.less";
@import "notifications.less";

74
less/forum/index.less
View File

@ -1,81 +1,7 @@
// ------------------------------------
// Sidebar
.side-nav > ul {
margin: 0;
padding: 0;
list-style: none;
}
// On phones, the index sidebar will pretty much take care of itself. The
// navigation list is a .dropdown-select and will be shown as the title-
// 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
// .dropdown-select into a plain list.
@media @tablet, @desktop, @desktop-hd {
.side-nav {
// Expand the dropdown-select component into a normal nav list.
& .dropdown-select {
display: block;
.expand-dropdown();
& .dropdown-menu {
.nav-list();
}
}
}
}
@media @tablet {
.side-nav {
padding: 15px 0;
white-space: nowrap;
overflow: auto;
-webkit-overflow-scrolling: touch;
&:after {
content: " ";
position: absolute;
left: 0;
right: 0;
margin-top: 15px;
border-bottom: 1px solid @fl-body-secondary-color;
}
& > ul > li, & .dropdown-menu > li {
display: inline-block;
margin-right: 25px;
}
& .dropdown-select .dropdown-menu > li > a .fa {
margin-right: 3px;
}
& .affix {
position: static;
}
}
}
@media @desktop, @desktop-hd {
.side-nav {
float: left;
&, & > ul {
width: 175px;
}
& > ul {
margin-top: 30px;
&.affix {
top: 56px;
}
& > li {
margin-bottom: 10px;
}
}
}
.index-nav {
& .new-discussion {
display: block;