kotovalexarian-likes-gitlab/gitlab-org--gitlab-foss
1
0
Fork 0
Code Releases Activity

Fixed failing tests

Browse source 
Moved the scss out of a mixin as it was really confusing the hell out of the CSS
This commit is contained in:
Phil Hughes 2016-03-21 11:09:55 +00:00
parent e94482d149
commit 2d7183bbe8
2 changed files with 64 additions and 79 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
app/assets/javascripts/sidebar.js.coffee
View file

@ -4,7 +4,6 @@ expanded = 'page-sidebar-expanded'
toggleSidebar = ->
$('.page-with-sidebar').toggleClass("#{collapsed} #{expanded}")
$('header').toggleClass("header-collapsed header-expanded")
$('.sidebar-wrapper').toggleClass("sidebar-collapsed sidebar-expanded")
$('.toggle-nav-collapse i').toggleClass("fa-angle-right fa-angle-left")
$.cookie("collapsed_nav", $('.page-with-sidebar').hasClass(collapsed), { path: '/' })

142
app/assets/stylesheets/framework/sidebar.scss
View file

@ -1,3 +1,10 @@
#logo {
z-index: 2;
position: absolute;
width: 58px;
cursor: pointer;
}
.page-with-sidebar {
padding-top: $header-height;
transition-duration: .3s;
@ -18,25 +25,6 @@
position: absolute;
left: 0;
}
#logo {
z-index: 2;
position: absolute;
width: 58px;
cursor: pointer;
}
&.right-sidebar-expanded {
padding-right: 0;
@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
padding-right: $sidebar_collapsed_width;
}
@media (min-width: $screen-md-min) {
padding-right: $gutter_width;
}
}
}
.sidebar-wrapper {
@ -203,43 +191,28 @@
}
}
@mixin expanded-sidebar {
padding-left: $sidebar_collapsed_width;
@media (min-width: $screen-md-min) {
padding-left: $sidebar_width;
}
.sidebar-wrapper {
width: $sidebar_width;
.nav-sidebar {
width: $sidebar_width;
}
.nav-sidebar li a{
width: 230px;
&.back-link {
i {
opacity: 0;
}
}
}
}
.collapse-nav a {
width: $sidebar_width;
position: fixed;
bottom: 0;
left: 0;
font-size: 13px;
background: transparent;
height: 40px;
text-align: center;
line-height: 40px;
transition-duration: .3s;
outline: none;
}
@mixin collapsed-sidebar {
.collapse-nav a:hover {
text-decoration: none;
background: #f2f6f7;
}
.page-sidebar-collapsed {
padding-left: $sidebar_collapsed_width;
&.right-sidebar-collapsed {
padding-right: 0;
@media (min-width: $screen-sm-min) {
padding-right: $sidebar_collapsed_width;
}
}
.sidebar-wrapper {
width: $sidebar_collapsed_width;
@ -284,35 +257,48 @@
}
}
.collapse-nav a {
width: $sidebar_width;
position: fixed;
bottom: 0;
left: 0;
font-size: 13px;
background: transparent;
height: 40px;
text-align: center;
line-height: 40px;
transition-duration: .3s;
outline: none;
}
.page-sidebar-expanded {
padding-left: $sidebar_collapsed_width;
.collapse-nav a:hover {
text-decoration: none;
background: #f2f6f7;
}
@media (min-width: $screen-md-min) {
padding-left: $sidebar_width;
}
.page-sidebar-collapsed {
/* Extra small devices (phones, less than 768px) */
@include collapsed-sidebar;
padding-right: 0;
/* Small devices (tablets, 768px and up) */
@media (min-width: $screen-sm-min) {
@include collapsed-sidebar;
.sidebar-wrapper {
width: $sidebar_width;
.nav-sidebar {
width: $sidebar_width;
}
.nav-sidebar li a {
width: 230px;
&.back-link {
i {
opacity: 0;
}
}
}
}
}
.page-sidebar-expanded {
@include expanded-sidebar;
.right-sidebar-collapsed {
padding-right: 0;
@media (min-width: $screen-sm-min) {
padding-right: $sidebar_collapsed_width;
}
}
.right-sidebar-expanded {
padding-right: 0;
@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
padding-right: $sidebar_collapsed_width;
}
@media (min-width: $screen-md-min) {
padding-right: $gutter_width;
}
}