Skip to content
Snippets Groups Projects
Commit dc24b4d7 authored by Dmitriy Zaporozhets's avatar Dmitriy Zaporozhets
Browse files

Merge branch 'sidebar-nav' into 'master' 

Sidebar navigation

This MR changes layout of the GitLab to sidebar navigation.

Layouts:

- [x] Project layout
- [x] Project settings layout
- [x] Dashboard layout
- [x] Profile layout
- [x] Group layout
- [x] Snippets layout
- [x] Admin layout

Pages:

- [x] Activity pages
- [x] Issue/mr pages
- [x] Issues/merge requests pages

Common:

- [x] Fix tests

See merge request !1329
parents 2dece41b 35eec009
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 180 additions and 310 deletions
app/assets/javascripts/activities.js.coffee
+ 1
− 1
View file @ dc24b4d7
@@ -12,7 +12,7 @@ class @Activities
 
 
toggleFilter: (sender) ->
sender.parent().toggleClass "inactive"
sender.parent().toggleClass "active"
event_filters = $.cookie("event_filter")
filter = sender.attr("id").split("_")[0]
if event_filters
app/assets/javascripts/issue.js.coffee
+ 2
− 2
View file @ dc24b4d7
class @Issue
constructor: ->
$('.edit-issue.inline-update input[type="submit"]').hide()
$(".issue-box .inline-update").on "change", "select", ->
$(".context .inline-update").on "change", "select", ->
$(this).submit()
$(".issue-box .inline-update").on "change", "#issue_assignee_id", ->
$(".context .inline-update").on "change", "#issue_assignee_id", ->
$(this).submit()
 
if $("a.btn-close").length
app/assets/javascripts/merge_request.js.coffee
+ 2
− 2
View file @ dc24b4d7
@@ -26,9 +26,9 @@ class @MergeRequest
 
initContextWidget: ->
$('.edit-merge_request.inline-update input[type="submit"]').hide()
$(".issue-box .inline-update").on "change", "select", ->
$(".context .inline-update").on "change", "select", ->
$(this).submit()
$(".issue-box .inline-update").on "change", "#merge_request_assignee_id", ->
$(".context .inline-update").on "change", "#merge_request_assignee_id", ->
$(this).submit()
 
initMergeWidget: ->
app/assets/javascripts/notes.js.coffee
+ 1
− 1
View file @ dc24b4d7
@@ -375,7 +375,7 @@ class @Notes
###
addDiffNote: (e) =>
e.preventDefault()
link = e.target
link = e.currentTarget
form = $(".js-new-note-form")
row = $(link).closest("tr")
nextRow = row.next()
app/assets/javascripts/stat_graph_contributors_graph.js.coffee
+ 2
− 2
View file @ dc24b4d7
@@ -46,7 +46,7 @@ class @ContributorsGraph
 
class @ContributorsMasterGraph extends ContributorsGraph
constructor: (@data) ->
@width = $('.container').width() - 70
@width = $('.container').width() - 345
@height = 200
@x = null
@y = null
@@ -119,7 +119,7 @@ class @ContributorsMasterGraph extends ContributorsGraph
 
class @ContributorsAuthorGraph extends ContributorsGraph
constructor: (@data) ->
@width = $('.container').width()/2 - 100
@width = $('.container').width()/2 - 225
@height = 200
@x = null
@y = null
app/assets/stylesheets/generic/issue_box.scss
+ 11
− 109
View file @ dc24b4d7
/**
* Issue box:
* Huge block (one per page) for storing title, descripion and other information.
* Issue box for showing Open/Closed state:
* Used for Issue#show page, MergeRequest#show page etc
*
* CLasses:
* .issue-box - Regular box
*/
 
.issue-box {
color: #555;
margin:20px 0;
background: $box_bg;
@include box-shadow(0 1px 1px rgba(0, 0, 0, 0.09));
display: inline-block;
padding: 0 10px;
 
&.issue-box-closed {
.state {
background-color: #F3CECE;
border-color: $border_danger;
}
.state-label {
background-color: $bg_danger;
color: #FFF;
}
background-color: $bg_danger;
color: #FFF;
}
 
&.issue-box-merged {
.state {
background-color: #B7CEE7;
border-color: $border_primary;
}
.state-label {
background-color: $bg_primary;
color: #FFF;
}
background-color: $bg_primary;
color: #FFF;
}
 
&.issue-box-open {
.state {
background-color: #D6F1D7;
border-color: $bg_success;
}
.state-label {
background-color: $bg_success;
color: #FFF;
}
background-color: $bg_success;
color: #FFF;
}
 
&.issue-box-expired {
.state {
background-color: #EEE9B3;
border-color: #faebcc;
}
.state-label {
background: #cea61b;
color: #FFF;
}
}
.control-group {
margin-bottom: 0;
}
.state {
background-color: #f9f9f9;
}
.title {
font-size: 28px;
font-weight: normal;
line-height: 1.5;
margin: 0;
color: #333;
padding: 10px 15px;
}
.context {
border: none;
border-top: 1px solid #eee;
padding: 10px 15px;
// Reset text align for children
.text-right > * { text-align: left; }
@media (max-width: $screen-xs-max) {
// Don't right align on mobile
.text-right { text-align: left; }
.row .col-md-6 {
padding-top: 5px;
}
}
}
.description {
padding: 0 15px 10px 15px;
code {
white-space: pre-wrap;
}
}
.title, .context, .description {
.clearfix {
margin: 0;
}
}
.state-label {
font-size: 14px;
float: left;
font-weight: bold;
padding: 10px 15px;
}
.cross-project-ref {
float: left;
padding: 10px 15px;
}
.creator {
float: right;
padding: 10px 15px;
a {
text-decoration: underline;
}
background: #cea61b;
color: #FFF;
}
}
app/assets/stylesheets/gl_bootstrap.scss
+ 4
− 0
View file @ dc24b4d7
@@ -148,6 +148,10 @@ $list-group-active-bg: $bg_primary;
color: #666;
}
 
.nav-compact > li > a {
padding: 6px 12px;
}
.nav-small > li > a {
padding: 3px 5px;
font-size: 12px;
app/assets/stylesheets/main/layout.scss
+ 0
− 4
View file @ dc24b4d7
@@ -4,10 +4,6 @@ html {
&.touch .tooltip { display: none !important; }
}
 
body {
padding-bottom: 20px;
}
.container {
padding-top: 0;
z-index: 5;
app/assets/stylesheets/sections/dashboard.scss
+ 0
− 14
View file @ dc24b4d7
@@ -23,20 +23,6 @@
}
}
 
.dashboard {
.dash-filter {
width: 205px;
float: left;
height: inherit;
}
}
@media (max-width: 1200px) {
.dashboard .dash-filter {
width: 140px;
}
}
.dash-sidebar-tabs {
margin-bottom: 2px;
border: none;
app/assets/stylesheets/sections/events.scss
+ 4
− 30
View file @ dc24b4d7
@@ -140,36 +140,6 @@
}
}
 
/**
* Event filter
*
*/
.event_filter {
position: absolute;
width: 40px;
margin-left: -55px;
.filter_icon {
a {
text-align:center;
background: $bg_primary;
margin-bottom: 10px;
float: left;
padding: 9px 6px;
font-size: 18px;
width: 40px;
color: #FFF;
@include border-radius(3px);
}
&.inactive {
a {
color: #DDD;
background: #f9f9f9;
}
}
}
}
 
/*
* Last push widget
@@ -203,3 +173,7 @@
}
}
}
.event_filter li a {
padding: 5px 10px;
}
app/assets/stylesheets/sections/header.scss
+ 5
− 17
View file @ dc24b4d7
@@ -52,8 +52,6 @@ header {
border-width: 0;
font-size: 18px;
 
.app_logo { margin-left: -15px; }
.title {
@include str-truncated(70%);
}
@@ -86,6 +84,11 @@ header {
 
z-index: 10;
 
.container {
width: 100% !important;
padding-left: 0px;
}
/**
*
* Logo holder
@@ -232,21 +235,6 @@ header {
color: #fff;
}
}
.app_logo {
.separator {
margin-left: 0;
margin-right: 0;
}
}
.separator {
float: left;
height: 46px;
width: 2px;
margin-left: 10px;
margin-right: 10px;
}
}
 
.search .search-input {
app/assets/stylesheets/sections/issues.scss
+ 4
− 0
View file @ dc24b4d7
@@ -162,3 +162,7 @@ form.edit-issue {
}
}
}
.issue-title {
margin-top: 0;
}
app/assets/stylesheets/sections/merge_requests.scss
+ 0
− 4
View file @ dc24b4d7
@@ -20,16 +20,12 @@
}
 
.merge-request .merge-request-tabs{
border-bottom: 2px solid $border_primary;
margin: 20px 0;
 
li {
a {
padding: 15px 40px;
font-size: 14px;
margin-bottom: -2px;
border-bottom: 2px solid $border_primary;
@include border-radius(0px);
}
}
}
app/assets/stylesheets/sections/nav.scss deleted 100644 → 0
+ 0
− 96
View file @ 2dece41b
.main-nav {
background: #f5f5f5;
margin: 20px 0;
margin-top: 0;
padding-top: 4px;
border-bottom: 1px solid #E9E9E9;
ul {
padding: 0;
margin: auto;
.count {
font-weight: normal;
display: inline-block;
height: 15px;
padding: 1px 6px;
height: auto;
font-size: 0.82em;
line-height: 14px;
text-align: center;
color: #777;
background: #eee;
@include border-radius(8px);
}
.label {
background: $hover;
text-shadow: none;
color: $style_color;
}
li {
list-style-type: none;
margin: 0;
display: table-cell;
width: 1%;
&.active {
a {
color: $link_color;
font-weight: bold;
border-bottom: 3px solid $link_color;
}
}
&:hover {
a {
color: $link_hover_color;
border-bottom: 3px solid $link_hover_color;
}
}
}
a {
display: block;
text-align: center;
font-weight: bold;
height: 42px;
line-height: 39px;
color: #777;
text-shadow: 0 1px 1px white;
text-decoration: none;
overflow: hidden;
margin-bottom: -1px;
}
}
@media (max-width: $screen-xs-max) {
font-size: 18px;
margin: 0;
max-height: none;
&, .container {
padding: 0;
border-top: 0;
}
ul {
height: auto;
li {
display: list-item;
width: auto;
padding: 5px 0;
&.active {
background-color: $link_hover_color;
a {
color: #fff;
font-weight: normal;
text-shadow: none;
border: none;
&:after { display: none; }
}
}
}
}
}
}
app/assets/stylesheets/sections/notes.scss
+ 12
− 5
View file @ dc24b4d7
@@ -155,19 +155,26 @@ ul.notes {
}
 
.add-diff-note {
background: image-url("diff_note_add.png") no-repeat left 0;
border: none;
height: 22px;
margin-left: -65px;
margin-top: -4px;
@include border-radius(40px);
background: #FFF;
padding: 4px;
font-size: 16px;
color: $link_color;
margin-left: -60px;
position: absolute;
width: 22px;
z-index: 10;
 
transition: all 0.2s ease;
// "hide" it by default
opacity: 0.0;
filter: alpha(opacity=0);
 
&:hover {
font-size: 24px;
background: $bg_primary;
color: #FFF;
@include show-add-diff-note;
}
}
app/assets/stylesheets/sections/sidebar.scss 0 → 100644
+ 123
− 0
View file @ dc24b4d7
.page-with-sidebar {
background: #F5F5F5;
}
.sidebar-wrapper {
overflow-y: auto;
background: #F5F5F5;
}
.content-wrapper {
width: 100%;
padding: 15px;
background: #FFF;
}
.nav-sidebar {
margin: 0;
list-style: none;
&.navbar-collapse {
padding: 0px !important;
}
}
.nav-sidebar li a .count {
float: right;
background: #eee;
padding: 0px 8px;
@include border-radius(6px);
}
.nav-sidebar li {
&.active a {
color: #111;
background: #EEE;
font-weight: bold;
&.no-highlight {
background: none;
}
i {
color: #444;
}
}
}
.nav-sidebar li {
&.separate-item {
border-top: 1px solid #ddd;
padding-top: 10px;
margin-top: 10px;
}
a {
color: #555;
display: block;
text-decoration: none;
padding: 6px 15px;
font-size: 13px;
line-height: 20px;
text-shadow: 0 1px 2px #FFF;
padding-left: 67px;
&:hover {
text-decoration: none;
color: #333;
background: #DDD;
}
&:active, &:focus {
text-decoration: none;
}
i {
width: 20px;
color: #888;
}
}
}
.sidebar-subnav {
margin-left: 0px;
padding-left: 0px;
li {
line-height: 28px;
font-size: 12px;
list-style: none;
a {
padding: 5px 15px;
font-size: 12px;
padding-left: 67px;
}
}
}
@media(min-width:768px) {
.page-with-sidebar {
padding-left: 250px;
}
.sidebar-wrapper {
width: 250px;
position: absolute;
left: 250px;
height: 100%;
margin-left: -250px;
.nav-sidebar {
margin-top: 20px;
position: fixed;
top: 45px;
width: 250px;
}
}
.content-wrapper {
padding: 20px;
border-left: 1px solid #EAEAEA;
}
}
app/assets/stylesheets/sections/votes.scss
+ 0
− 10
View file @ dc24b4d7
@@ -37,13 +37,3 @@
margin: 0 8px;
}
 
.votes-holder {
float: right;
width: 250px;
@media (max-width: $screen-xs-max) {
width: 100%;
margin-top: 5px;
margin-bottom: 10px;
}
}
app/assets/stylesheets/themes/ui_basic.scss
+ 5
− 7
View file @ dc24b4d7
@@ -9,17 +9,15 @@
.navbar-inner {
background: #F1F1F1;
border-bottom: 1px solid #DDD;
.app_logo {
background-color: #DDD;
}
.nav > li > a {
color: $style_color;
}
.separator {
background: #F9F9F9;
border-left: 1px solid #DDD;
}
}
}
}
.main-nav {
background: #FFF;
}
}
app/assets/stylesheets/themes/ui_color.scss
+ 2
− 3
View file @ dc24b4d7
@@ -23,9 +23,8 @@
background-color: #436;
}
}
.separator {
background: #436;
border-left: 1px solid #659;
.app_logo {
background-color: #325;
}
.nav > li > a {
color: #98C;
app/assets/stylesheets/themes/ui_gray.scss
+ 2
− 3
View file @ dc24b4d7
@@ -23,9 +23,8 @@
background-color: #272727;
}
}
.separator {
background: #272727;
border-left: 1px solid #474747;
.app_logo {
background-color: #222;
}
}
}
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment