controlling right sidebar behaviour on large screens

This commit is contained in:
Pablo Cuadrado 2015-06-22 20:35:12 -03:00 committed by augier
parent 754d8107a8
commit c38da4c787
3 changed files with 17 additions and 3 deletions

View file

@ -26,6 +26,7 @@ $blue: #3F8FBA;
$dark-blue: darken(#0984C8,10%); $dark-blue: darken(#0984C8,10%);
$right-sidebar-background: #f0f0f0; $right-sidebar-background: #f0f0f0;
$right-sidebar-sub-background: darken($right-sidebar-background, 12%);
/* colors : http://www.colourlovers.com/palette/2134203/Awezome_in_argyle */ /* colors : http://www.colourlovers.com/palette/2134203/Awezome_in_argyle */
$cyan : rgb(8,204,249); $cyan : rgb(8,204,249);

View file

@ -4,8 +4,14 @@
position: fixed; position: fixed;
right: 0; right: 0;
} }
#right-sidebar-fixed-sub-background {
height: 100%;
background: $right-sidebar-sub-background;
position: fixed;
right: 0;
}
.right-sidebar-padder { .right-sidebar-padder {
max-width: 300px; max-width: 400px;
} }
.rightBar { .rightBar {
padding-top: 20px; padding-top: 20px;
@ -78,3 +84,9 @@
} }
} }
} }
@media screen and (min-width: 1200px) {
#right-sidebar-fixed-background {
margin-right: 8.33333%; /* Only for LARGE screens, same as lg-offset-1 class, BS3 does not provide right side offsetting */
}
}

View file

@ -21,7 +21,8 @@
= link_to '×'.html_safe, getting_started_completed_path, id: "gs-skip-x", class: "close" = link_to '×'.html_safe, getting_started_completed_path, id: "gs-skip-x", class: "close"
%div.container-fluid %div.container-fluid
#right-sidebar-fixed-background.col-md-3.hidden-sm.hidden-xs #right-sidebar-fixed-sub-background.col-md-3.visible-lg
#right-sidebar-fixed-background.col-md-3.col-lg-2.hidden-sm.hidden-xs
.row .row
.col-md-offset-1.col-md-2#leftNavBar .col-md-offset-1.col-md-2#leftNavBar
#home_user_badge #home_user_badge
@ -45,7 +46,7 @@
#aspect_stream_container.stream_container #aspect_stream_container.stream_container
= render 'aspects/aspect_stream', stream: @stream = render 'aspects/aspect_stream', stream: @stream
.col-md-3.rightBar .col-md-3.col-lg-2.rightBar
#selected_aspect_contacts.section #selected_aspect_contacts.section
.title .title
%h5.stream_title %h5.stream_title