Commit 9c843041faf000a76bd2b542f594c061dab45c3a

Authored by Job van der Voort
1 parent d718209b

add responsive sidebar to issues, milestones and MRs

app/assets/javascripts/sidebar.js.coffee
@@ -2,8 +2,10 @@ responsive_resize = -> @@ -2,8 +2,10 @@ responsive_resize = ->
2 current_width = $(window).width() 2 current_width = $(window).width()
3 if current_width < 985 3 if current_width < 985
4 $('.responsive-side').addClass("ui right wide sidebar") 4 $('.responsive-side').addClass("ui right wide sidebar")
  5 + $('.responsive-side-left').addClass("ui left sidebar")
5 else 6 else
6 $('.responsive-side').removeClass("ui right wide sidebar") 7 $('.responsive-side').removeClass("ui right wide sidebar")
  8 + $('.responsive-side-left').removeClass("ui left sidebar")
7 9
8 $ -> 10 $ ->
9 # Depending on window size, set the sidebar offscreen. 11 # Depending on window size, set the sidebar offscreen.
app/assets/stylesheets/generic/sidebar.scss
@@ -2,10 +2,19 @@ @@ -2,10 +2,19 @@
2 z-index: 1000 !important; 2 z-index: 1000 !important;
3 background: #fff; 3 background: #fff;
4 padding: 10px; 4 padding: 10px;
5 - border-left: 1px solid #e1e1e1;  
6 width: 285px; 5 width: 285px;
7 } 6 }
8 7
  8 +.ui.left.sidebar {
  9 + border-right: 1px solid #e1e1e1;
  10 + border-left: 0;
  11 +}
  12 +
  13 +.ui.right.sidebar {
  14 + border-left: 1px solid #e1e1e1;
  15 + border-right: 0;
  16 +}
  17 +
9 .sidebar-expand-button { 18 .sidebar-expand-button {
10 background: #f9f9f9; 19 background: #f9f9f9;
11 color: #555; 20 color: #555;
@@ -27,3 +36,14 @@ @@ -27,3 +36,14 @@
27 padding-right: 25px; 36 padding-right: 25px;
28 } 37 }
29 } 38 }
  39 +
  40 +.left.sidebar-expand-button {
  41 + left: 0px;
  42 + right: auto;
  43 + border: 1px solid #E1E1E1;
  44 + border-left: 0;
  45 + &:hover {
  46 + padding-right: 14px;
  47 + padding-left: 25px;
  48 + }
  49 +}
app/views/dashboard/issues.html.haml
@@ -7,7 +7,9 @@ @@ -7,7 +7,9 @@
7 %hr 7 %hr
8 8
9 .row 9 .row
10 - .col-md-3 10 + .left.sidebar-expand-button.hidden-lg.hidden-md
  11 + %i.icon-list.icon-2x
  12 + .col-md-3.responsive-side-left
11 = render 'shared/filter', entity: 'issue' 13 = render 'shared/filter', entity: 'issue'
12 .col-md-9 14 .col-md-9
13 = render 'shared/issues' 15 = render 'shared/issues'
app/views/dashboard/merge_requests.html.haml
@@ -7,7 +7,9 @@ @@ -7,7 +7,9 @@
7 List all merge requests from all projects you have access to. 7 List all merge requests from all projects you have access to.
8 %hr 8 %hr
9 .row 9 .row
10 - .col-md-3 10 + .left.sidebar-expand-button.hidden-lg.hidden-md
  11 + %i.icon-list.icon-2x
  12 + .col-md-3.responsive-side-left
11 = render 'shared/filter', entity: 'merge_request' 13 = render 'shared/filter', entity: 'merge_request'
12 .col-md-9 14 .col-md-9
13 = render 'shared/merge_requests' 15 = render 'shared/merge_requests'
app/views/dashboard/show.html.haml
@@ -2,7 +2,7 @@ @@ -2,7 +2,7 @@
2 .dashboard.row 2 .dashboard.row
3 .activities.col-md-8 3 .activities.col-md-8
4 = render 'activities' 4 = render 'activities'
5 - .side.col-md-4.responsive-side 5 + .side.col-md-4.left.responsive-side
6 = render 'sidebar' 6 = render 'sidebar'
7 7
8 .sidebar-expand-button.hidden-lg.hidden-md 8 .sidebar-expand-button.hidden-lg.hidden-md
app/views/groups/issues.html.haml
@@ -11,7 +11,9 @@ @@ -11,7 +11,9 @@
11 %hr 11 %hr
12 12
13 .row 13 .row
14 - .col-md-3 14 + .left.sidebar-expand-button.hidden-lg.hidden-md
  15 + %i.icon-list.icon-2x
  16 + .col-md-3.responsive-side-left
15 = render 'shared/filter', entity: 'issue' 17 = render 'shared/filter', entity: 'issue'
16 .col-md-9 18 .col-md-9
17 = render 'shared/issues' 19 = render 'shared/issues'
app/views/groups/merge_requests.html.haml
@@ -10,7 +10,9 @@ @@ -10,7 +10,9 @@
10 To see all merge requests you should visit #{link_to 'dashboard', merge_requests_dashboard_path} page. 10 To see all merge requests you should visit #{link_to 'dashboard', merge_requests_dashboard_path} page.
11 %hr 11 %hr
12 .row 12 .row
13 - .col-md-3 13 + .left.sidebar-expand-button.hidden-lg.hidden-md
  14 + %i.icon-list.icon-2x
  15 + .col-md-3.responsive-side-left
14 = render 'shared/filter', entity: 'merge_request' 16 = render 'shared/filter', entity: 'merge_request'
15 .col-md-9 17 .col-md-9
16 = render 'shared/merge_requests' 18 = render 'shared/merge_requests'
app/views/projects/issues/index.html.haml
1 = render "head" 1 = render "head"
2 .row 2 .row
3 - .col-md-3 3 + .left.sidebar-expand-button.hidden-lg.hidden-md
  4 + %i.icon-list.icon-2x
  5 + .col-md-3.responsive-side-left
4 = render 'shared/project_filter', project_entities_path: project_issues_path(@project), 6 = render 'shared/project_filter', project_entities_path: project_issues_path(@project),
5 labels: true, redirect: 'issues' 7 labels: true, redirect: 'issues'
6 .col-md-9.issues-holder 8 .col-md-9.issues-holder
app/views/projects/merge_requests/index.html.haml
@@ -7,7 +7,9 @@ @@ -7,7 +7,9 @@
7 %span (#{@merge_requests.total_count}) 7 %span (#{@merge_requests.total_count})
8 %hr 8 %hr
9 .row 9 .row
10 - .col-md-3 10 + .left.sidebar-expand-button.hidden-lg.hidden-md
  11 + %i.icon-list.icon-2x
  12 + .col-md-3.responsive-side-left
11 = render 'shared/project_filter', project_entities_path: project_merge_requests_path(@project), 13 = render 'shared/project_filter', project_entities_path: project_merge_requests_path(@project),
12 labels: true, redirect: 'merge_requests' 14 labels: true, redirect: 'merge_requests'
13 .col-md-9 15 .col-md-9
app/views/projects/milestones/index.html.haml
@@ -8,7 +8,9 @@ @@ -8,7 +8,9 @@
8 New Milestone 8 New Milestone
9 9
10 .row 10 .row
11 - .col-md-3.hidden-sm 11 + .left.sidebar-expand-button.hidden-lg.hidden-md
  12 + %i.icon-list.icon-2x
  13 + .col-md-3.responsive-side-left
12 %ul.nav.nav-pills.nav-stacked 14 %ul.nav.nav-pills.nav-stacked
13 %li{class: ("active" if (params[:f] == "active" || !params[:f]))} 15 %li{class: ("active" if (params[:f] == "active" || !params[:f]))}
14 = link_to project_milestones_path(@project, f: "active") do 16 = link_to project_milestones_path(@project, f: "active") do
app/views/shared/_filter.html.haml
1 -.side-filters.hidden-xs.hidden-sm 1 +.side-filters
2 = form_tag filter_path(entity), method: 'get' do 2 = form_tag filter_path(entity), method: 'get' do
3 - if current_user 3 - if current_user
4 %fieldset.scope-filter 4 %fieldset.scope-filter
app/views/shared/_project_filter.html.haml
1 -.side-filters.hidden-xs.hidden-sm 1 +.side-filters
2 = form_tag project_entities_path, method: 'get' do 2 = form_tag project_entities_path, method: 'get' do
3 - if current_user 3 - if current_user
4 %fieldset 4 %fieldset