Cleanup & debug .nav-stacked styles
This commit is contained in:
parent
950c9e50ac
commit
38eef177d4
|
@ -5,8 +5,7 @@
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
{{#link-to 'userNotifications.responses'}}
|
{{#link-to 'userNotifications.responses'}}
|
||||||
{{d-icon "reply" class="glyph"}}
|
{{d-icon "reply" class="glyph"}}{{i18n 'user_action_groups.6'}}
|
||||||
{{i18n 'user_action_groups.6'}}
|
|
||||||
{{/link-to}}
|
{{/link-to}}
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
|
|
|
@ -374,23 +374,18 @@ td.flaggers td {
|
||||||
.admin-nav {
|
.admin-nav {
|
||||||
width: 18.018%;
|
width: 18.018%;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
|
li a.active {
|
||||||
|
color: $secondary;
|
||||||
|
background-color: $quaternary;
|
||||||
|
}
|
||||||
|
|
||||||
// The admin-nav becomes a slide-out menu at the mobile-nav breakpoint
|
// The admin-nav becomes a slide-out menu at the mobile-nav breakpoint
|
||||||
@media (max-width: $mobile-breakpoint) {
|
@media (max-width: $mobile-breakpoint) {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
width: 50%;
|
width: 50%;
|
||||||
}
|
}
|
||||||
margin-top: 30px;
|
|
||||||
.nav-stacked {
|
|
||||||
border-right: none;
|
|
||||||
@media (max-width: $mobile-breakpoint) {
|
|
||||||
//margin-right: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
li a.active {
|
|
||||||
color: $secondary;
|
|
||||||
background-color: $quaternary;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.admin-detail {
|
.admin-detail {
|
||||||
|
@ -1447,14 +1442,6 @@ button.ru {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media all
|
|
||||||
and (max-width : 850px) {
|
|
||||||
html:not(.mobile-view) .admin-content .nav-stacked {
|
|
||||||
.glyph {width: auto; position: relative;}
|
|
||||||
> li > a {padding: 13px}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media all
|
@media all
|
||||||
and (min-width : 320px)
|
and (min-width : 320px)
|
||||||
and (max-width : 500px) {
|
and (max-width : 500px) {
|
||||||
|
|
|
@ -50,38 +50,42 @@
|
||||||
padding: 0;
|
padding: 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
background: $primary-low;
|
background: $primary-low;
|
||||||
|
|
||||||
li {
|
li {
|
||||||
border-bottom: 1px solid $primary-low;
|
border-bottom: 1px solid $primary-low;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
&:last-of-type {
|
&:last-of-type {
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.indent {
|
||||||
|
padding-left: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 13px 13px 13px 30px;
|
padding: 13px;
|
||||||
font-size: 1.143em;
|
font-size: 1.143em;
|
||||||
line-height: 20px;
|
line-height: 20px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
color: $primary;
|
color: $primary;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
> li.indent {
|
|
||||||
padding-left: 15px;
|
.active > a,
|
||||||
}
|
li > a.active {
|
||||||
.active > a, & li > a.active
|
|
||||||
{
|
|
||||||
color: $secondary;
|
color: $secondary;
|
||||||
background-color: $quaternary;
|
background-color: $quaternary;
|
||||||
}
|
|
||||||
|
|
||||||
.active > a::after, & li > a.active::after
|
&:after {
|
||||||
{
|
left: 90%;
|
||||||
left: 90%;
|
top: 33%;
|
||||||
top: 33%;
|
content: " ";
|
||||||
content: " ";
|
position: absolute;
|
||||||
position: absolute;
|
border: 8px solid transparent;
|
||||||
border: 8px solid transparent;
|
border-left-color: $secondary;
|
||||||
border-left-color: $secondary;
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.count {
|
.count {
|
||||||
|
@ -91,10 +95,9 @@
|
||||||
|
|
||||||
.glyph {
|
.glyph {
|
||||||
font-size: 0.857em;
|
font-size: 0.857em;
|
||||||
width: 30px;
|
width: 1.25em;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
position: absolute;
|
margin-right: .5em;
|
||||||
left: 2px;
|
|
||||||
line-height: 20px;
|
line-height: 20px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -107,24 +107,34 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-navigation .nav-stacked .glyph {
|
|
||||||
display: none;
|
|
||||||
// float: right;
|
|
||||||
// display: block;
|
|
||||||
// position: static;
|
|
||||||
}
|
|
||||||
|
|
||||||
.user-navigation {
|
.user-navigation {
|
||||||
display: table-cell;
|
display: table-cell;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
width: 170px;
|
width: 170px;
|
||||||
padding-left: 30px;
|
|
||||||
|
|
||||||
h3 {
|
.nav-stacked {
|
||||||
color: $primary;
|
background-color: transparent;
|
||||||
margin: 20px 0 10px 0;
|
li {
|
||||||
|
border-bottom: none;
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 40%));
|
||||||
|
}
|
||||||
|
|
||||||
|
a.active {
|
||||||
|
color: $primary;
|
||||||
|
font-weight: bold;
|
||||||
|
background-color: transparent;
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.archive {
|
||||||
|
padding-left: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.viewing-self .user-main .about.collapsed-info {
|
.viewing-self .user-main .about.collapsed-info {
|
||||||
|
@ -637,31 +647,3 @@
|
||||||
float: right;
|
float: right;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-main .nav-stacked {
|
|
||||||
&.activity-list {
|
|
||||||
padding-top: 20px;
|
|
||||||
}
|
|
||||||
background-color: transparent;
|
|
||||||
|
|
||||||
li {
|
|
||||||
border-bottom: none;
|
|
||||||
> a {
|
|
||||||
padding: 8px 13px;
|
|
||||||
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 40%));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
li > a.active {
|
|
||||||
color: $primary;
|
|
||||||
font-weight: bold;
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
li > a.active:after {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
li.archive {
|
|
||||||
padding-left: 15px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
Loading…
Reference in New Issue