Merge branch 'master' into dont-depend-on-appid-and-appsecret

* master: (238 commits)
  Version 6.5.1
  Fix selectbox when submit MR from fork to origin
  Fix HELP layout
  No need for code tag here.
  Spelling mistake and add links.
  Warn against RVM.
  Remove GitHub mention because we also have a GitLab issue tracker now.
  Replace 6.0-to-6.4.md with 6.0-to-6.5.md
  Add public assets to gitignore
  Version 6.5.0
  Use 6-5 branch in installation docs
  Remove deprecated twitter handle.
  Further explain userPrincipalName settings
  Update from 6.4 to 6.5 guide
  Explain how to use AD userPrincipalName for logins
  More entries to CHANGELOG. Version to rc1
  Rephrase LDAP check script output
  add O'Reilly sponsorship in CHANGELOG
  Fix select2 css for drop above style
  Rename "Website url" labels to "Website"
  ...

50 files changed, 876 insertions, 844 deletions

diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
index 0767b82032d..aa2db1fc93c 100644
--- a/app/assets/javascripts/application.js
+++ b/app/assets/javascripts/application.js
@@ -19,7 +19,6 @@
 //= require jquery.turbolinks
 //= require bootstrap
 //= require modernizr
-//= require chosen-jquery
 //= require select2
 //= require raphael
 //= require g.raphael-min
diff --git a/app/assets/javascripts/behaviors/toggler_behavior.coffee b/app/assets/javascripts/behaviors/toggler_behavior.coffee
index 7e438c51c1c..5afb656e696 100644
--- a/app/assets/javascripts/behaviors/toggler_behavior.coffee
+++ b/app/assets/javascripts/behaviors/toggler_behavior.coffee
@@ -3,7 +3,7 @@ $ ->
     container = $(@).closest(".js-toggler-container")
 
     container.toggleClass("on")
-  
+
   $("body").on "click", ".js-toggle-visibility-link", (e) ->
     $(@).find('i').
       toggleClass('icon-chevron-down').
@@ -11,7 +11,7 @@ $ ->
     container = $(".js-toggle-visibility-container")
     container.toggleClass("hide")
     e.preventDefault()
-  
+
   $("body").on "click", ".js-toggle-button", (e) ->
     $(@).closest(".js-toggle-container").find(".js-toggle-content").toggle()
     e.preventDefault()
diff --git a/app/assets/javascripts/branch-graph.js.coffee b/app/assets/javascripts/branch-graph.js.coffee
index 318538509a5..dd09ee51fe0 100644
--- a/app/assets/javascripts/branch-graph.js.coffee
+++ b/app/assets/javascripts/branch-graph.js.coffee
@@ -194,11 +194,14 @@ class BranchGraph
       fill: @colors[commit.space]
       stroke: "none"
     )
-    r.rect(@offsetX + @unitSpace * @mspace + 10, y - 10, 20, 20).attr(
-      fill: "url(#{commit.author.icon})"
+
+    avatar_box_x = @offsetX + @unitSpace * @mspace + 10
+    avatar_box_y = y - 10
+    r.rect(avatar_box_x, avatar_box_y, 20, 20).attr(
       stroke: @colors[commit.space]
       "stroke-width": 2
     )
+    r.image(commit.author.icon, avatar_box_x, avatar_box_y, 20, 20)
     r.text(@offsetX + @unitSpace * @mspace + 35, y, commit.message.split("\n")[0]).attr(
       "text-anchor": "start"
       font: "14px Monaco, monospace"
diff --git a/app/assets/javascripts/dispatcher.js.coffee b/app/assets/javascripts/dispatcher.js.coffee
index e264e281309..8ea302f256a 100644
--- a/app/assets/javascripts/dispatcher.js.coffee
+++ b/app/assets/javascripts/dispatcher.js.coffee
@@ -47,5 +47,9 @@ class Dispatcher
 
 
   initSearch: ->
-    autocomplete_json = $('.search-autocomplete-json').data('autocomplete-opts')
-    new SearchAutocomplete(autocomplete_json)
+    opts = $('.search-autocomplete-opts')
+    path = opts.data('autocomplete-path')
+    project_id = opts.data('autocomplete-project-id')
+    project_ref = opts.data('autocomplete-project-ref')
+
+    new SearchAutocomplete(path, project_id, project_ref)
diff --git a/app/assets/javascripts/issues.js.coffee b/app/assets/javascripts/issues.js.coffee
index 43571409bc5..6c239c66c0a 100644
--- a/app/assets/javascripts/issues.js.coffee
+++ b/app/assets/javascripts/issues.js.coffee
@@ -29,12 +29,10 @@
     $('#filter_issue_search').val($('#issue_search').val())
 
   initSelects: ->
-    $("#update_status").chosen()
-    $("#update_assignee_id").chosen()
-    $("#update_milestone_id").chosen()
-    $("#label_name").chosen()
-    $("#assignee_id").chosen()
-    $("#milestone_id").chosen()
+    $("select#update_status").select2(width: 'resolve', dropdownAutoWidth: true)
+    $("select#update_assignee_id").select2(width: 'resolve', dropdownAutoWidth: true)
+    $("select#update_milestone_id").select2(width: 'resolve', dropdownAutoWidth: true)
+    $("select#label_name").select2(width: 'resolve', dropdownAutoWidth: true)
     $("#milestone_id, #assignee_id, #label_name").on "change", ->
       $(this).closest("form").submit()
 
diff --git a/app/assets/javascripts/main.js.coffee b/app/assets/javascripts/main.js.coffee
index 10c40dff5fd..9cf4dba815b 100644
--- a/app/assets/javascripts/main.js.coffee
+++ b/app/assets/javascripts/main.js.coffee
@@ -67,8 +67,8 @@ $ ->
     $('.appear-data').fadeIn()
     e.preventDefault()
 
-  # Initialize chosen selects
-  $('select.chosen').chosen()
+  # Initialize select2 selects
+  $('select.select2').select2(width: 'resolve', dropdownAutoWidth: true)
 
   # Initialize tooltips
   $('.has_tooltip').tooltip()
@@ -81,6 +81,7 @@ $ ->
     $(@).parents('form').submit()
 
   $("abbr.timeago").timeago()
+  $('.js-timeago').timeago()
 
   # Flash
   if (flash = $(".flash-container")).length > 0
@@ -125,12 +126,6 @@ $ ->
     $(@).remove()
 
 (($) ->
-  _chosen = $.fn.chosen
-  $.fn.extend chosen: (options) ->
-    default_options = search_contains: "true"
-    $.extend default_options, options
-    _chosen.apply @, [default_options]
-
   # Disable an element and add the 'disabled' Bootstrap class
   $.fn.extend disable: ->
     $(@).attr('disabled', 'disabled').addClass('disabled')
diff --git a/app/assets/javascripts/merge_requests.js.coffee b/app/assets/javascripts/merge_requests.js.coffee
index 2eef7df1c64..ff843c68d68 100644
--- a/app/assets/javascripts/merge_requests.js.coffee
+++ b/app/assets/javascripts/merge_requests.js.coffee
@@ -2,8 +2,8 @@
 # * Filter merge requests
 #
 @merge_requestsPage = ->
-  $('#assignee_id').chosen()
-  $('#milestone_id').chosen()
+  $('#assignee_id').select2()
+  $('#milestone_id').select2()
   $('#milestone_id, #assignee_id').on 'change', ->
     $(this).closest('form').submit()
 
@@ -24,6 +24,8 @@ class MergeRequest
 
     modal = $('#modal_merge_info').modal(show: false)
 
+    disableButtonIfEmptyField '#merge_commit_message', '.accept_merge_request'
+
   # Local jQuery finder
   $: (selector) ->
     this.$el.find(selector)
diff --git a/app/assets/javascripts/notes.js.coffee b/app/assets/javascripts/notes.js.coffee
index 6501cf38a89..69e9e67f712 100644
--- a/app/assets/javascripts/notes.js.coffee
+++ b/app/assets/javascripts/notes.js.coffee
@@ -37,6 +37,9 @@ class Notes
     # attachment button
     $(document).on "click", ".js-choose-note-attachment-button", @chooseNoteAttachment
 
+    # update the file name when an attachment is selected
+    $(document).on "change", ".js-note-attachment-input", @updateFormAttachment
+
     # reply to diff/discussion notes
     $(document).on "click", ".js-discussion-reply-button", @replyToDiscussionNote
 
@@ -429,4 +432,16 @@ class Notes
   updateVotes: ->
     (new NotesVotes).updateVotes()
 
+  ###
+  Called after an attachment file has been selected.
+
+  Updates the file name for the selected attachment.
+  ###
+  updateFormAttachment: ->
+    form = $(this).closest("form")
+
+    # get only the basename
+    filename = $(this).val().replace(/^.*[\\\/]/, "")
+    form.find(".js-attachment-filename").text filename
+
 @Notes = Notes
diff --git a/app/assets/javascripts/project.js.coffee b/app/assets/javascripts/project.js.coffee
index 9a41ec7a0be..4262418fd5e 100644
--- a/app/assets/javascripts/project.js.coffee
+++ b/app/assets/javascripts/project.js.coffee
@@ -35,7 +35,7 @@ $ ->
       $('a, button', scope).removeClass 'active'
       $(@).addClass 'active'
       $('#project_clone', scope).val $(@).data 'clone'
-      $(".clone").text("").append 'git remote add origin ' + $(@).data 'clone'
+      $(".clone").text("").append $(@).data 'clone'
 
   # Ref switcher
   $('.project-refs-select').on 'change', ->
diff --git a/app/assets/javascripts/search_autocomplete.js.coffee b/app/assets/javascripts/search_autocomplete.js.coffee
index 3418690e109..e144dfa1d68 100644
--- a/app/assets/javascripts/search_autocomplete.js.coffee
+++ b/app/assets/javascripts/search_autocomplete.js.coffee
@@ -1,7 +1,12 @@
 class SearchAutocomplete
-  constructor: (json) ->
+  constructor: (search_autocomplete_path, project_id, project_ref) ->
+    project_id = '' unless project_id
+    project_ref = '' unless project_ref
+    query = "?project_id=" + project_id + "&project_ref=" + project_ref
+
     $("#search").autocomplete
-      source: json
+      source: search_autocomplete_path + query
+      minLength: 1
       select: (event, ui) ->
         location.href = ui.item.url
 
diff --git a/app/assets/javascripts/stat_graph_contributors_graph.js.coffee b/app/assets/javascripts/stat_graph_contributors_graph.js.coffee
index 48443644169..834c7e5dab0 100644
--- a/app/assets/javascripts/stat_graph_contributors_graph.js.coffee
+++ b/app/assets/javascripts/stat_graph_contributors_graph.js.coffee
@@ -46,11 +46,7 @@ class window.ContributorsGraph
 
 class window.ContributorsMasterGraph extends ContributorsGraph
   constructor: (@data) ->
-    if $(window).width() > 1214
-      @width = 1100
-    else
-      @width = 870
-
+    @width = $('.container').width() - 70
     @height = 200
     @x = null
     @y = null
@@ -88,7 +84,6 @@ class window.ContributorsMasterGraph extends ContributorsGraph
       x(d.date)
     ).y0(@height).y1((d) ->
       xa = d.commits = d.commits ? d.additions ? d.deletions
-      console.log(xa)
       y(xa)
     ).interpolate("basis")
   create_brush: ->
@@ -124,11 +119,7 @@ class window.ContributorsMasterGraph extends ContributorsGraph
 
 class window.ContributorsAuthorGraph extends ContributorsGraph
   constructor: (@data) ->
-    if $(window).width() > 1214
-      @width = 490
-    else
-      @width = 380
-
+    @width = $('.container').width()/2 - 100
     @height = 200
     @x = null
     @y = null
diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
index b1a23427add..eb8bc0d63c0 100644
--- a/app/assets/stylesheets/application.scss
+++ b/app/assets/stylesheets/application.scss
@@ -4,19 +4,44 @@
  * the top of the compiled file, but it's generally better to create a new file per style scope.
  *= require jquery.ui.gitlab
  *= require jquery.atwho
- *= require chosen
  *= require select2
  *= require_self
 */
 
+@import "main/variables.scss";
+@import "main/mixins.scss";
+@import "main/fonts.scss";
+@import "main/layout.scss";
+
+/**
+ * Customized Twitter bootstrap
+ */
+@import 'gl_bootstrap';
+
 /**
- * GitLab bootstrap:
+ * Font icons
+ *
  */
-@import "gitlab_bootstrap.scss";
+@import "font-awesome";
 
-@import "common.scss";
-@import "selects.scss";
+/**
+ * Generic css (forms, nav etc):
+ */
+@import "generic/avatar.scss";
+@import "generic/common.scss";
+@import "generic/typography.scss";
+@import "generic/buttons.scss";
+@import "generic/blocks.scss";
+@import "generic/ui_box.scss";
+@import "generic/issue_box.scss";
+@import "generic/files.scss";
+@import "generic/lists.scss";
+@import "generic/forms.scss";
+@import "generic/selects.scss";
 
+/**
+ * Page specific styles (issues, projects etc):
+ */
 @import "sections/header.scss";
 @import "sections/nav.scss";
 @import "sections/commits.scss";
@@ -39,6 +64,9 @@
 @import "sections/dashboard.scss";
 @import "sections/stat_graph.scss";
 
+/**
+ * Code ighlight
+ */
 @import "highlight/white.scss";
 @import "highlight/dark.scss";
 @import "highlight/solarized_dark.scss";
@@ -57,4 +85,3 @@
  * Styles for JS behaviors.
  */
 @import "behaviors.scss";
-
diff --git a/app/assets/stylesheets/gitlab_bootstrap/avatar.scss b/app/assets/stylesheets/generic/avatar.scss
index 4f038b977e2..4f038b977e2 100644
--- a/app/assets/stylesheets/gitlab_bootstrap/avatar.scss
+++ b/app/assets/stylesheets/generic/avatar.scss
diff --git a/app/assets/stylesheets/gitlab_bootstrap/blocks.scss b/app/assets/stylesheets/generic/blocks.scss
index 1cbd7439835..1cbd7439835 100644
--- a/app/assets/stylesheets/gitlab_bootstrap/blocks.scss
+++ b/app/assets/stylesheets/generic/blocks.scss
diff --git a/app/assets/stylesheets/gitlab_bootstrap/buttons.scss b/app/assets/stylesheets/generic/buttons.scss
index 347da1ad680..219e6ebd68b 100644
--- a/app/assets/stylesheets/gitlab_bootstrap/buttons.scss
+++ b/app/assets/stylesheets/generic/buttons.scss
@@ -143,16 +143,27 @@
     line-height: 16px;
     margin: 2px;
   }
+}
+
+.btn-block {
+  width: 100%;
+  margin: 0;
+  margin-bottom: 15px;
+  &.btn {
+    padding: 6px 0;
+  }
+}
 
+.btn,
+.btn-group {
   &.grouped {
     margin-right: 7px;
     float: left;
-  }
-
-  &.btn-block {
-    width: 100%;
-    margin: 0;
-    padding: 6px 0;
-    margin-bottom: 15px;
+    &:last-child {
+      margin-right: 0px;
+    }
   }
 }
+
+.btn-group-small > .btn { @extend .btn.btn-small; }
+.btn-group-tiny > .btn { @extend .btn.btn-tiny; }
diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/generic/common.scss
index c428d905de2..79a217186de 100644
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/generic/common.scss
@@ -1,48 +1,132 @@
-html {
-  overflow-y: scroll;
+/** COLORS **/
+.cgray { color: gray }
+.clgray { color: #BBB }
+.cred { color: #D12F19 }
+.cgreen { color: #4a2 }
+.cblue { color: #29A }
+.cblack { color: #111 }
+.cdark { color: #444 }
+.camber { color: #ffc000 }
+.cwhite { color: #fff!important }
+.bgred { background: #F2DEDE!important }
+
+/** COMMON CLASSES **/
+.left { float:left }
+
+.prepend-top-10 { margin-top:10px }
+.prepend-top-20 { margin-top:20px }
+.prepend-left-10 { margin-left:10px }
+.prepend-left-20 { margin-left:20px }
+.append-right-10 { margin-right:10px }
+.append-right-20 { margin-right:20px }
+.append-bottom-10 { margin-bottom:10px }
+.append-bottom-15 { margin-bottom:15px }
+.append-bottom-20 { margin-bottom:20px }
+.inline { display: inline-block }
+
+.padded { padding:20px }
+.ipadded { padding:20px!important }
+.lborder { border-left:1px solid #eee }
+.underlined_link { text-decoration: underline; }
+.hint { font-style: italic; color: #999; }
+.light { color: #888 }
+.tiny { font-weight: normal }
+.vtop { vertical-align: top !important; }
+
+
+/** ALERT MESSAGES **/
+.alert.alert-disabled {
+  background: #EEE;
+  color: #777;
+  border-color: #DDD;
+}
+
+/** HELPERS **/
+.nothing_here_message {
+  text-align: center;
+  padding: 20px;
+  color: #666;
+  font-weight: normal;
+  font-size: 16px;
+  line-height: 36px;
 }
 
-/** LAYOUT **/
-
-body {
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  margin-bottom: 20px;
+.slead {
+  color: #666;
+  font-size: 14px;
+  margin-bottom: 12px;
+  font-weight: normal;
+  line-height: 24px;
 }
 
-.container {
-  padding-top: 0;
-  z-index: 5;
+
+.tab-content {
+  overflow: visible;
 }
 
-.container .content {
-  margin: 0 0;
+@media (max-width: 1200px) {
+  .only-wide {
+    display: none;
+  }
 }
 
-.author_link {
-  color: $link_color;
+pre.well-pre {
+  border: 1px solid #EEE;
+  background: #f9f9f9;
+  border-radius: 0;
+  color: #555;
 }
 
-.help li { color:$style_color; }
+.input-append .btn.active, .input-prepend .btn.active {
+  background: #CCC;
+  border-color: #BBB;
+  text-shadow: 0 1px 1px #fff;
+  font-weight: bold;
+  @include box-shadow(inset 0 2px 4px rgba(0,0,0,.15));
+}
 
-.back-link {
+/** Big Labels **/
+.state-label {
   font-size: 14px;
+  padding: 6px 25px;
+  text-align: center;
+  @include border-radius(4px);
+  text-shadow: none;
+  margin-left: 10px;
+
+  &.state-label-green {
+    background: #4A4;
+    color: #FFF;
+  }
+
+  &.state-label-red {
+    background: #DA4E49;
+    color: #FFF;
+  }
 }
 
-table a code {
-  position: relative;
-  top: -2px;
-  margin-right: 3px;
+.dropdown-menu > li > a {
+  text-shadow: none;
 }
 
-.loading {
-  margin: 20px auto;
-  background: url(ajax_loader.gif) no-repeat center center;
-  width: 40px;
-  height: 40px;
-  &.loading-gray {
-    background: url(ajax_loader_gray.gif) no-repeat center center;
-  }
+.dropdown-menu > li > a:hover,
+.dropdown-menu > li > a:focus {
+  background: #29b;
+}
+
+.breadcrumb > li + li:before {
+  content: "/";
+  padding: 0;
+  color: #666;
+}
+
+.str-truncated {
+  display: inline-block;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  vertical-align: top;
+  white-space: nowrap;
+  max-width: 82%;
 }
 
 /** FLASH message **/
@@ -71,6 +155,31 @@ table a code {
     padding: 10px;
   }
 }
+.author_link {
+  color: $link_color;
+}
+
+.help li { color:$style_color; }
+
+.back-link {
+  font-size: 14px;
+}
+
+table a code {
+  position: relative;
+  top: -2px;
+  margin-right: 3px;
+}
+
+.loading {
+  margin: 20px auto;
+  background: url(ajax_loader.gif) no-repeat center center;
+  width: 40px;
+  height: 40px;
+  &.loading-gray {
+    background: url(ajax_loader_gray.gif) no-repeat center center;
+  }
+}
 
 span.update-author {
   display: block;
@@ -92,19 +201,6 @@ span.update-author {
   display: inline;
 }
 
-ul.breadcrumb {
-  background: white;
-  border: none;
-  li {
-    display: inline;
-    text-shadow: 0 1px 0 white
-  }
-
-  a {
-    font-size: 16px;
-  }
-}
-
 .line_holder {
   &:hover {
     td {
@@ -119,18 +215,6 @@ p.time {
   margin: 30px 3px 3px 2px;
 }
 
-.search-holder {
-  label, input {
-     height: 30px;
-     padding: 0;
-     font-size: 14px;
-  }
-  label {
-    line-height: 30px;
-    color: #666;
-  }
-}
-
 .highlight {
   text-shadow: none;
 }
@@ -209,7 +293,7 @@ li.note {
 }
 
 .git_error_tips {
-  @extend .span6;
+  @extend .col-md-6;
   text-align: left;
   margin-top: 40px;
   pre {
@@ -236,6 +320,7 @@ li.note {
   background: #C67;
   margin: 0;
   color: #FFF;
+  margin-top: -1px;
   text-align: center;
 
   a {
@@ -344,12 +429,6 @@ table {
   min-height: 100px;
 }
 
-.navbar-gitlab .navbar-inner .nav > li .btn-sign-in {
-  @extend .btn-new;
-  padding: 5px 15px;
-  text-shadow: none;
-}
-
 .broadcast-message {
   padding: 10px;
   text-align: center;
@@ -395,3 +474,14 @@ table {
     font-weight: bolder;
   }
 }
+
+.btn-sign-in {
+  margin-top: 7px;
+  text-shadow: none;
+}
+
+.side-filters {
+  fieldset {
+    margin-bottom: 15px;
+  }
+}
diff --git a/app/assets/stylesheets/gitlab_bootstrap/files.scss b/app/assets/stylesheets/generic/files.scss
index 3f9e4989a27..11bb715f7b5 100644
--- a/app/assets/stylesheets/gitlab_bootstrap/files.scss
+++ b/app/assets/stylesheets/generic/files.scss
@@ -20,7 +20,6 @@
     text-align: left;
     color: $style_color;
     padding: 9px 10px;
-    height: 18px;
 
     .options {
       float: right;
@@ -46,7 +45,7 @@
       text-align: center;
       img {
         padding: 100px;
-        max-width: 300px;
+        max-width: 50%;
       }
     }
 
diff --git a/app/assets/stylesheets/generic/forms.scss b/app/assets/stylesheets/generic/forms.scss
new file mode 100644
index 00000000000..931b75a3234
--- /dev/null
+++ b/app/assets/stylesheets/generic/forms.scss
@@ -0,0 +1,53 @@
+input[type='search'].search-text-input {
+  background-image: url("icon-search.png");
+  background-repeat: no-repeat;
+  background-position: 10px;
+  padding-left: 25px;
+}
+
+input[type='text'].danger {
+  background: #F2DEDE!important;
+  border-color: #D66;
+  text-shadow: 0 1px 1px #fff
+}
+
+fieldset legend {
+  font-size: 16px;
+}
+
+.datetime-controls {
+  select {
+    width: 100px;
+  }
+}
+
+.form-actions {
+  padding: 17px 20px 18px;
+  margin-top: 18px;
+  margin-bottom: 18px;
+  background-color: whitesmoke;
+  border-top: 1px solid #e5e5e5;
+  padding-left: 17%;
+}
+
+label {
+  &.control-label {
+    @extend .col-sm-2;
+  }
+
+  &.inline-label {
+    margin: 0;
+  }
+}
+
+.inline-input-group {
+  width: 250px;
+}
+
+.input-mx-250 {
+  max-width: 250px;
+}
+
+.input-mn-300 {
+  min-width: 300px;
+}
diff --git a/app/assets/stylesheets/gitlab_bootstrap/issue_box.scss b/app/assets/stylesheets/generic/issue_box.scss
index 6330523ea22..6330523ea22 100644
--- a/app/assets/stylesheets/gitlab_bootstrap/issue_box.scss
+++ b/app/assets/stylesheets/generic/issue_box.scss
diff --git a/app/assets/stylesheets/gitlab_bootstrap/lists.scss b/app/assets/stylesheets/generic/lists.scss
index 83066b5beec..245cccf855d 100644
--- a/app/assets/stylesheets/gitlab_bootstrap/lists.scss
+++ b/app/assets/stylesheets/generic/lists.scss
@@ -4,7 +4,9 @@
  */
 .well-list {
   margin: 0;
+  padding: 0;
   list-style: none;
+
   li {
     padding: 10px;
     min-height: 20px;
diff --git a/app/assets/stylesheets/generic/selects.scss b/app/assets/stylesheets/generic/selects.scss
new file mode 100644
index 00000000000..c506bff8a74
--- /dev/null
+++ b/app/assets/stylesheets/generic/selects.scss
@@ -0,0 +1,80 @@
+/** Select2 selectbox style override **/
+
+.select2-container, .select2-container.select2-drop-above {
+  .select2-choice {
+    background: #FFF;
+    border-color: #BBB;
+
+    .select2-arrow {
+      background: #FFF;
+    }
+  }
+}
+
+.select2-drop-active {
+  border: 1px solid #BBB;
+  margin-top: 4px;
+
+  .select2-search input {
+    background: #fafafa;
+    border-color: #DDD;
+  }
+
+  .select2-results {
+    max-height: 350px;
+    .select2-highlighted {
+      background: $bg_style_color;
+    }
+  }
+}
+
+select {
+  &.select2 {
+    width: 100px;
+  }
+
+  &.select2-sm {
+    width: 100px;
+  }
+}
+
+@media (min-width: $screen-sm-min) {
+  select {
+    &.select2 {
+      width: 150px;
+    }
+    &.select2-sm {
+      width: 120px;
+    }
+  }
+}
+
+/* Medium devices (desktops, 992px and up) */
+@media (min-width: $screen-md-min) {
+  select {
+    &.select2 {
+      width: 170px;
+    }
+    &.select2-sm {
+      width: 140px;
+    }
+  }
+}
+
+/* Large devices (large desktops, 1200px and up) */
+@media (min-width: $screen-lg-min) {
+  select {
+    &.select2 {
+      width: 200px;
+    }
+    &.select2-sm {
+      width: 150px;
+    }
+  }
+}
+
+
+/** Branch/tag selector **/
+.project-refs-form .select2-container {
+  margin-right: 10px;
+}
diff --git a/app/assets/stylesheets/gitlab_bootstrap/typography.scss b/app/assets/stylesheets/generic/typography.scss
index d3986556376..4490566d4e8 100644
--- a/app/assets/stylesheets/gitlab_bootstrap/typography.scss
+++ b/app/assets/stylesheets/generic/typography.scss
@@ -2,11 +2,6 @@
  * Headers
  *
  */
-h1, h2, h3, h4, h5, h6 {
-  font-weight: 500;
-  line-height: 1.1;
-}
-
 h1.page-title {
   @include page-title;
   font-size: 28px;
@@ -99,6 +94,7 @@ a:focus {
     background: #f5f5f5;
   }
   ul {
+    padding: 0;
     margin: 0 0 9px 25px !important;
   }
 }
diff --git a/app/assets/stylesheets/gitlab_bootstrap/ui_box.scss b/app/assets/stylesheets/generic/ui_box.scss
index 056b4eeaaf4..7a977eae70d 100644
--- a/app/assets/stylesheets/gitlab_bootstrap/ui_box.scss
+++ b/app/assets/stylesheets/generic/ui_box.scss
@@ -43,6 +43,7 @@
 
   ul {
     margin: 0;
+    padding: 0;
   }
 
   .title {
@@ -157,7 +158,8 @@
   .title {
     background: #D65;
     color: #fff;
-    text-shadow: 0 1px 1px #900;
+    text-shadow: none;
+    font-weight: 500;
   }
 }
 
diff --git a/app/assets/stylesheets/gitlab_bootstrap.scss b/app/assets/stylesheets/gitlab_bootstrap.scss
deleted file mode 100644
index 322fab4b416..00000000000
--- a/app/assets/stylesheets/gitlab_bootstrap.scss
+++ /dev/null
@@ -1,68 +0,0 @@
-/** Override bootstrap variables **/
-$baseFontSize: 13px !default;
-$baseLineHeight: 18px !default;
-
-/**
- * BOOTSTRAP
- */
-@import "bootstrap/variables";
-@import "bootstrap/mixins";
-@import "bootstrap/reset";
-@import "bootstrap/scaffolding";
-@import "bootstrap/grid";
-@import "bootstrap/layouts";
-@import "bootstrap/type";
-@import "bootstrap/code";
-@import "bootstrap/forms";
-@import "bootstrap/tables";
-@import "bootstrap/sprites";
-@import "bootstrap/dropdowns";
-@import "bootstrap/wells";
-@import "bootstrap/component-animations";
-@import "bootstrap/close";
-@import "bootstrap/button-groups";
-@import "bootstrap/alerts";
-@import "bootstrap/navs";
-@import "bootstrap/navbar";
-@import "bootstrap/breadcrumbs";
-@import "bootstrap/pagination";
-@import "bootstrap/pager";
-@import "bootstrap/modals";
-@import "bootstrap/tooltip";
-@import "bootstrap/popovers";
-@import "bootstrap/thumbnails";
-@import "bootstrap/media";
-@import "bootstrap/labels-badges";
-@import "bootstrap/progress-bars";
-@import "bootstrap/accordion";
-@import "bootstrap/carousel";
-@import "bootstrap/hero-unit";
-@import "bootstrap/utilities";
-@import "bootstrap/responsive-utilities";
-@import "bootstrap/responsive-1200px-min";
-
-/**
- * Font icons
- *
- */
-@import "font-awesome";
-
-/**
- * GitLab bootstrap.
- * Overrides some styles of twitter bootstrap.
- * Also give some common classes for GitLab app
- */
-@import "gitlab_bootstrap/variables.scss";
-@import "gitlab_bootstrap/fonts.scss";
-@import "gitlab_bootstrap/mixins.scss";
-@import "gitlab_bootstrap/avatar.scss";
-@import "gitlab_bootstrap/nav.scss";
-@import "gitlab_bootstrap/common.scss";
-@import "gitlab_bootstrap/typography.scss";
-@import "gitlab_bootstrap/buttons.scss";
-@import "gitlab_bootstrap/blocks.scss";
-@import "gitlab_bootstrap/ui_box.scss";
-@import "gitlab_bootstrap/issue_box.scss";
-@import "gitlab_bootstrap/files.scss";
-@import "gitlab_bootstrap/lists.scss";
-@import "gitlab_bootstrap/forms.scss";
diff --git a/app/assets/stylesheets/gitlab_bootstrap/common.scss b/app/assets/stylesheets/gitlab_bootstrap/common.scss
deleted file mode 100644
index d5426982428..00000000000
--- a/app/assets/stylesheets/gitlab_bootstrap/common.scss
+++ /dev/null
@@ -1,133 +0,0 @@
-/** COLORS **/
-.cgray { color: gray }
-.clgray { color: #BBB }
-.cred { color: #D12F19 }
-.cgreen { color: #4a2 }
-.cblue { color: #29A }
-.cblack { color: #111 }
-.cdark { color: #444 }
-.camber { color: #ffc000 }
-.cwhite { color: #fff!important }
-.bgred { background: #F2DEDE!important }
-
-/** COMMON CLASSES **/
-.left { float:left }
-
-.prepend-top-10 { margin-top:10px }
-.prepend-top-20 { margin-top:20px }
-.prepend-left-10 { margin-left:10px }
-.prepend-left-20 { margin-left:20px }
-.append-right-10 { margin-right:10px }
-.append-right-20 { margin-right:20px }
-.append-bottom-10 { margin-bottom:10px }
-.append-bottom-20 { margin-bottom:20px }
-.inline { display: inline-block }
-
-.padded { padding:20px }
-.ipadded { padding:20px!important }
-.lborder { border-left:1px solid #eee }
-.underlined_link { text-decoration: underline; }
-.hint { font-style: italic; color: #999; }
-.light { color: #888 }
-.tiny { font-weight: normal }
-.vtop { vertical-align: top !important; }
-
-
-/** ALERT MESSAGES **/
-.alert.alert-disabled {
-  background: #EEE;
-  color: #777;
-  border-color: #DDD;
-}
-
-/** HELPERS **/
-.nothing_here_message {
-  text-align: center;
-  padding: 20px;
-  color: #666;
-  font-weight: normal;
-  font-size: 16px;
-  line-height: 36px;
-}
-
-.slead {
-  color: #666;
-  font-size: 14px;
-  margin-bottom: 12px;
-  font-weight: normal;
-  line-height: 24px;
-}
-
-
-.tab-content {
-  overflow: visible;
-}
-
-@media (max-width: 1200px) {
-  .only-wide {
-    display: none;
-  }
-}
-
-.pagination ul > li > a, .pagination ul > li >span {
-  @include linear-gradient(#f1f1f1, #e1e1e1);
-  color: #333;
-  text-shadow: 0 1px 1px #FFF;
-}
-
-pre.well-pre {
-  border: 1px solid #EEE;
-  background: #f9f9f9;
-  border-radius: 0;
-  color: #555;
-}
-
-.input-append .btn.active, .input-prepend .btn.active {
-  background: #CCC;
-  border-color: #BBB;
-  text-shadow: 0 1px 1px #fff;
-  font-weight: bold;
-  @include box-shadow(inset 0 2px 4px rgba(0,0,0,.15));
-}
-
-.label {
-  padding: 2px 4px;
-  font-size: 12px;
-  font-style: normal;
-  font-weight: normal;
-
-  &.label-gray {
-    background-color: #eee;
-    color: #999;
-    text-shadow: none;
-  }
-}
-
-/** Big Labels **/
-.state-label {
-  font-size: 14px;
-  padding: 6px 25px;
-  text-align: center;
-  @include border-radius(4px);
-  text-shadow: none;
-  margin-left: 10px;
-
-  &.state-label-green {
-    background: #4A4;
-    color: #FFF;
-  }
-
-  &.state-label-red {
-    background: #DA4E49;
-    color: #FFF;
-  }
-}
-
-.dropdown-menu > li > a {
-  text-shadow: none;
-}
-
-.dropdown-menu > li > a:hover,
-.dropdown-menu > li > a:focus {
-  background: #29b;
-}
diff --git a/app/assets/stylesheets/gitlab_bootstrap/forms.scss b/app/assets/stylesheets/gitlab_bootstrap/forms.scss
deleted file mode 100644
index 39dd1f6c747..00000000000
--- a/app/assets/stylesheets/gitlab_bootstrap/forms.scss
+++ /dev/null
@@ -1,78 +0,0 @@
-form {
-  @extend .form-horizontal;
-
-  label {
-    @extend .control-label;
-
-    &.radio-label {
-      text-align: left;
-      width: 100%;
-      margin-left: 0;
-
-      input[type="radio"] {
-        margin-top: 1px !important;
-      }
-    }
-
-    &.list-label {
-      float: none;
-      padding: 0 !important;
-      margin: 0;
-      text-align: left;
-    }
-  }
-
-  &.form-tiny {
-    margin: 0;
-  }
-}
-
-input.input-xpadding,
-.add-on.input-xpadding {
-  padding: 6px 10px;
-}
-
-.control-group {
-  .control-label {
-    padding-top: 6px;
-  }
-  .controls {
-    input, textarea {
-      padding: 6px 10px;
-    }
-
-    input[type="radio"], input[type="checkbox"] {
-      margin-top: 6px;
-    }
-
-    .add-on {
-      padding: 6px;
-    }
-  }
-}
-
-input[type='search'].search-text-input {
-  background-image: url("icon-search.png");
-  background-repeat: no-repeat;
-  background-position: 10px;
-  padding-left: 25px;
-  @include border-radius(4px);
-  border: 1px solid #ccc;
-}
-
-input[type='text'].danger {
-  background: #F2DEDE!important;
-  border-color: #D66;
-  text-shadow: 0 1px 1px #fff
-}
-
-fieldset legend {
-  font-size: 16px;
-  margin-bottom: 10px;
-}
-
-.datetime-controls {
-  select {
-    width: 100px;
-  }
-}
diff --git a/app/assets/stylesheets/gitlab_bootstrap/nav.scss b/app/assets/stylesheets/gitlab_bootstrap/nav.scss
deleted file mode 100644
index cc2bf0f912e..00000000000
--- a/app/assets/stylesheets/gitlab_bootstrap/nav.scss
+++ /dev/null
@@ -1,91 +0,0 @@
-/**
- * nav-pills
- *
- */
-.nav-pills {
-  .active a {
-    background: $primary_color;
-  }
-
-  > li > a {
-    @include border-radius(0);
-  }
-
-  &.nav-stacked {
-    > li > a {
-      border-left: 4px solid #EEE;
-      padding: 12px;
-      color: #777;
-    }
-    > .active > a {
-      border-color: $primary_color;
-      background: none;
-      color: #333;
-      font-weight: bolder;
-    }
-
-    &.nav-stacked-menu {
-      li > a {
-        padding: 16px;
-      }
-    }
-  }
-
-  &.nav-pills-small {
-    > li > a {
-      padding: 8px 12px;
-      font-size: 12px;
-    }
-  }
-}
-
-.nav-pills > .active > a > i[class^="icon-"] { background: inherit; }
-
-
-
-/**
- * nav-tabs
- *
- */
-.nav-tabs > li > a, .nav-pills > li > a { color: $style_color; }
-.nav.nav-tabs {
-  li {
-    > a {
-      padding: 8px 20px;
-      margin-right: 7px;
-      line-height: 20px;
-      border-color: #EEE;
-      color: #888;
-      border-bottom: 1px solid #ddd;
-      .badge {
-        background-color: #eee;
-        color: #888;
-        text-shadow: 0 1px 1px #fff;
-      }
-      i[class^="icon-"] {
-        line-height: 14px;
-      }
-    }
-    &.active {
-      > a {
-        border-color: #CCC;
-        border-bottom: 1px solid #fff;
-        color: #333;
-        font-weight: bold;
-      }
-    }
-  }
-
-  &.nav-small-tabs > li > a { padding: 6px 9px; }
-}
-
-
-
-/**
- * fix to keep tooltips position in top navigation bar
- *
- */
-.navbar .nav > li {
-  position: relative;
-  white-space: nowrap;
-}
diff --git a/app/assets/stylesheets/gl_bootstrap.scss b/app/assets/stylesheets/gl_bootstrap.scss
new file mode 100644
index 00000000000..7f45d64fb7c
--- /dev/null
+++ b/app/assets/stylesheets/gl_bootstrap.scss
@@ -0,0 +1,220 @@
+/*
+ * Twitter bootstrap with GitLab customizations/additions
+ *
+ * Some unused bootstrap compontents like panels are not included.
+ * Other components like tabs are modified to GitLab style.
+ *
+ */
+
+$font-size-base: 13px !default;
+$nav-pills-active-link-hover-bg: $bg_style_color;
+$pagination-active-bg: $bg_style_color;
+
+// Core variables and mixins
+@import "bootstrap/variables";
+@import "bootstrap/mixins";
+
+// Reset
+@import "bootstrap/normalize";
+@import "bootstrap/print";
+
+// Core CSS
+@import "bootstrap/scaffolding";
+@import "bootstrap/type";
+@import "bootstrap/code";
+@import "bootstrap/grid";
+@import "bootstrap/tables";
+@import "bootstrap/forms";
+
+// Components
+@import "bootstrap/component-animations";
+@import "bootstrap/dropdowns";
+@import "bootstrap/button-groups";
+@import "bootstrap/input-groups";
+@import "bootstrap/navs";
+@import "bootstrap/navbar";
+@import "bootstrap/breadcrumbs";
+@import "bootstrap/pagination";
+@import "bootstrap/pager";
+@import "bootstrap/labels";
+@import "bootstrap/badges";
+@import "bootstrap/jumbotron";
+@import "bootstrap/thumbnails";
+@import "bootstrap/alerts";
+@import "bootstrap/progress-bars";
+@import "bootstrap/list-group";
+@import "bootstrap/wells";
+@import "bootstrap/close";
+
+// Components w/ JavaScript
+@import "bootstrap/modals";
+@import "bootstrap/tooltip";
+@import "bootstrap/popovers";
+@import "bootstrap/carousel";
+
+// Utility classes
+.clearfix {
+  @include clearfix();
+}
+.center-block {
+  @include center-block();
+}
+.pull-right {
+  float: right !important;
+}
+.pull-left {
+  float: left !important;
+}
+.hide {
+  display: none;
+}
+.show {
+  display: block !important;
+}
+.invisible {
+  visibility: hidden;
+}
+.text-hide {
+  @include text-hide();
+}
+.hidden {
+  display: none !important;
+  visibility: hidden !important;
+}
+.affix {
+  position: fixed;
+}
+
+@import "bootstrap/responsive-utilities";
+
+// Labels
+.label {
+  padding: 2px 4px;
+  font-size: 12px;
+  font-style: normal;
+  font-weight: normal;
+  display: inline-block;
+
+  &.label-gray {
+    background-color: #eee;
+    color: #999;
+    text-shadow: none;
+  }
+
+  &.label-inverse {
+    background-color: #333333;
+  }
+}
+
+// Nav tabs
+.nav.nav-tabs {
+  li {
+    > a {
+      padding: 8px 20px;
+      margin-right: 7px;
+      line-height: 20px;
+      border-color: #EEE;
+      color: #888;
+      border-bottom: 1px solid #ddd;
+      .badge {
+        background-color: #eee;
+        color: #888;
+        text-shadow: 0 1px 1px #fff;
+      }
+      i[class^="icon-"] {
+        line-height: 14px;
+      }
+    }
+    &.active {
+      > a {
+        border-color: #CCC;
+        border-bottom: 1px solid #fff;
+        color: #333;
+        font-weight: bold;
+      }
+    }
+  }
+
+  &.nav-small-tabs > li > a {
+    padding: 6px 9px;
+  }
+}
+
+.nav-tabs > li > a,
+.nav-pills > li > a {
+  color: #666;
+}
+
+.nav-small > li > a {
+  padding: 3px 5px;
+  font-size: 12px;
+}
+
+
+/*
+ * Callouts from Bootstrap3 docs
+ *
+ * Not quite alerts, but custom and helpful notes for folks reading the docs.
+ * Requires a base and modifier class.
+ */
+
+/* Common styles for all types */
+.bs-callout {
+  margin: 20px 0;
+  padding: 20px;
+  border-left: 3px solid #eee;
+  color: #666;
+  background: #f9f9f9;
+}
+.bs-callout h4 {
+  margin-top: 0;
+  margin-bottom: 5px;
+}
+.bs-callout p:last-child {
+  margin-bottom: 0;
+}
+
+/* Variations */
+.bs-callout-danger {
+  background-color: #fdf7f7;
+  border-color: #eed3d7;
+  color: #b94a48;
+}
+.bs-callout-warning {
+  background-color: #faf8f0;
+  border-color: #faebcc;
+  color: #8a6d3b;
+}
+.bs-callout-info {
+  background-color: #f4f8fa;
+  border-color: #bce8f1;
+  color: #34789a;
+}
+.bs-callout-success {
+  background-color: #dff0d8;
+  border-color: #5cA64d;
+  color: #3c763d;
+}
+
+// Breadcrumb
+ul.breadcrumb {
+  background: white;
+  border: none;
+  li {
+    display: inline;
+    text-shadow: 0 1px 0 white
+  }
+
+  a {
+    font-size: 16px;
+  }
+}
+
+/**
+ * fix to keep tooltips position in top navigation bar
+ *
+ */
+.navbar .nav > li {
+  position: relative;
+  white-space: nowrap;
+}
diff --git a/app/assets/stylesheets/gitlab_bootstrap/fonts.scss b/app/assets/stylesheets/main/fonts.scss
index 8cc9986415c..8cc9986415c 100644
--- a/app/assets/stylesheets/gitlab_bootstrap/fonts.scss
+++ b/app/assets/stylesheets/main/fonts.scss
diff --git a/app/assets/stylesheets/main/layout.scss b/app/assets/stylesheets/main/layout.scss
new file mode 100644
index 00000000000..a4d889f26dd
--- /dev/null
+++ b/app/assets/stylesheets/main/layout.scss
@@ -0,0 +1,18 @@
+html {
+  overflow-y: scroll;
+}
+
+body {
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  margin-bottom: 20px;
+}
+
+.container {
+  padding-top: 0;
+  z-index: 5;
+}
+
+.container .content {
+  margin: 0 0;
+}
diff --git a/app/assets/stylesheets/gitlab_bootstrap/mixins.scss b/app/assets/stylesheets/main/mixins.scss
index 5a6b5ac0efd..e637b645b55 100644
--- a/app/assets/stylesheets/gitlab_bootstrap/mixins.scss
+++ b/app/assets/stylesheets/main/mixins.scss
@@ -79,11 +79,15 @@
   color: $style_color;
   text-shadow: 0 1px 1px #FFF;
   font-size: 16px;
-  line-height: 40px;
+  line-height: 44px;
   font-weight: normal;
 }
 
 @mixin md-typography {
+  img {
+    max-width: 100%;
+  }
+
   *:first-child {
     margin-top: 0;
   }
diff --git a/app/assets/stylesheets/gitlab_bootstrap/variables.scss b/app/assets/stylesheets/main/variables.scss
index aeabe7ad2e8..decc5f50469 100644
--- a/app/assets/stylesheets/gitlab_bootstrap/variables.scss
+++ b/app/assets/stylesheets/main/variables.scss
@@ -4,6 +4,7 @@
 $primary_color: #2FA0BB;
 $link_color: #3A89A3;
 $style_color: #474D57;
+$bg_style_color: #2299BB;
 $hover: #D9EDF7;
 
 /**
diff --git a/app/assets/stylesheets/sections/commits.scss b/app/assets/stylesheets/sections/commits.scss
index cd3e5d56c25..ff293bc4a00 100644
--- a/app/assets/stylesheets/sections/commits.scss
+++ b/app/assets/stylesheets/sections/commits.scss
@@ -80,7 +80,7 @@
       border-right: 1px solid #ccc;
       text-align: right;
       min-width: 35px;
-      max-width: 35px;
+      max-width: 50px;
       width: 35px;
       @include user-select(none);
       a {
@@ -399,8 +399,8 @@
 
 .commits-compare-switch{
   background: url("switch_icon.png") no-repeat center center;
-  width: 22px;
-  height: 22px;
+  width: 32px;
+  height: 32px;
   text-indent: -9999px;
   float: left;
   margin-right: 9px;
@@ -481,6 +481,10 @@ li.commit {
       font-family: $monospace_font;
     }
 
+    .str-truncated {
+      max-width: 70%;
+    }
+
     .commit-row-message {
       color: #333;
       font-weight: 500;
diff --git a/app/assets/stylesheets/sections/dashboard.scss b/app/assets/stylesheets/sections/dashboard.scss
index 720d3a8fbd5..1fd82c84fc9 100644
--- a/app/assets/stylesheets/sections/dashboard.scss
+++ b/app/assets/stylesheets/sections/dashboard.scss
@@ -1,11 +1,5 @@
 .dashboard {
-  @extend .row;
-  .activities {
-  }
-
   .side {
-    @extend .pull-right;
-
     .ui-box {
       margin: 0px;
       box-shadow: none;
@@ -20,7 +14,7 @@
 
   .search-text-input {
     float:left;
-    @extend .span2;
+    @extend .col-md-2;
   }
   .btn {
     margin-left: 5px;
@@ -32,14 +26,15 @@
   .dash-filter {
     margin: 7px 0;
     padding: 4px 6px;
-    width: 202px;
+    width: 220px;
     float: left;
+    height: inherit;
   }
 }
 
 @media (max-width: 1200px) {
   .dashboard .dash-filter {
-    width: 132px;
+    width: 150px;
   }
 }
 
@@ -107,7 +102,6 @@
   padding: 8px 12px;
   border-radius: 50px;
   background: #f5f5f5;
-  width: 16px;
   text-align: center;
 
   i {
diff --git a/app/assets/stylesheets/sections/editor.scss b/app/assets/stylesheets/sections/editor.scss
index a71e5438936..057f7b7fd44 100644
--- a/app/assets/stylesheets/sections/editor.scss
+++ b/app/assets/stylesheets/sections/editor.scss
@@ -34,15 +34,4 @@
       margin: 5px 8px 0 8px;
     }
   }
-  .commit_message-group {
-    margin-top: 20px;
-
-    label {
-      font-size: 16px;
-      line-height: 20px;
-    }
-    textarea {
-      @extend .span8;
-    }
-  }
 }
diff --git a/app/assets/stylesheets/sections/events.scss b/app/assets/stylesheets/sections/events.scss
index 966282750d9..a576fefdea1 100644
--- a/app/assets/stylesheets/sections/events.scss
+++ b/app/assets/stylesheets/sections/events.scss
@@ -75,6 +75,7 @@
         margin-top: 4px;
         margin-left: 0px;
         max-width: 200px;
+        float: none;
       }
 
       p:last-child {
@@ -147,7 +148,7 @@
       float: left;
       padding: 9px 6px;
       font-size: 18px;
-      width: 26px;
+      width: 40px;
       @include border-radius(3px);
     }
 
diff --git a/app/assets/stylesheets/sections/header.scss b/app/assets/stylesheets/sections/header.scss
index 157b9dd9e8a..b0dd0d08356 100644
--- a/app/assets/stylesheets/sections/header.scss
+++ b/app/assets/stylesheets/sections/header.scss
@@ -4,17 +4,24 @@
  */
 header {
   &.navbar-gitlab {
+    margin-bottom: 0;
+    min-height: 40px;
+
     .navbar-inner {
-      height: 40px;
-      padding: 3px;
       background: #F1F1F1;
+      border-bottom: 1px solid #DDD;
       filter: none;
 
       .nav > li > a {
         color: $style_color;
         text-shadow: 0 1px 0 #fff;
         font-size: 14px;
-        padding: 10px;
+        line-height: 32px;
+        padding: 6px 10px;
+
+        &:hover {
+          background: none;
+        }
       }
 
       /** NAV block with links and profile **/
@@ -35,9 +42,6 @@ header {
   .app_logo {
     float: left;
     margin-right: 9px;
-    position: relative;
-    top: -3px;
-    padding-top: 3px;
 
     a {
       float: left;
@@ -49,7 +53,7 @@ header {
         background: url('logo-black.png') no-repeat center center;
         background-size: 32px;
         float: left;
-        height: 40px;
+        height: 46px;
         width: 40px;
         @include header-font;
         text-indent: -9999px;
@@ -75,7 +79,7 @@ header {
 
   .profile-pic {
     position: relative;
-    top: -4px;
+    top: -1px;
     img {
       width: 26px;
       height: 26px;
@@ -91,21 +95,25 @@ header {
   .search {
     margin-right: 10px;
     margin-left: 10px;
+    margin-top: 8px;
+
+    form {
+      margin: 0;
+      padding: 0;
+    }
 
     .search-input {
-      @extend .span3;
       background-image: url("icon-search.png");
       background-repeat: no-repeat;
       background-position: 10px;
+      height: inherit;
+      padding: 4px 6px;
       padding-left: 25px;
       font-size: 13px;
       @include border-radius(3px);
       border: 1px solid #c6c6c6;
       box-shadow: none;
       @include transition(all 0.15s ease-in 0s);
-      &:focus {
-        @extend .span4;
-      }
     }
   }
 
@@ -181,12 +189,26 @@ header {
   .separator {
     float: left;
     height: 46px;
-    width: 1px;
+    width: 2px;
     background: white;
     border-left: 1px solid #DDD;
-    margin-top: -3px;
     margin-left: 10px;
     margin-right: 10px;
   }
 }
 
+.search .search-input {
+  width: 300px;
+  &:focus {
+    width: 400px;
+  }
+}
+
+@media (max-width: 1200px)  {
+  .search .search-input {
+    width: 200px;
+    &:focus {
+      width: 300px;
+    }
+  }
+}
diff --git a/app/assets/stylesheets/sections/issues.scss b/app/assets/stylesheets/sections/issues.scss
index c8e55775040..81d945a9b3c 100644
--- a/app/assets/stylesheets/sections/issues.scss
+++ b/app/assets/stylesheets/sections/issues.scss
@@ -77,8 +77,8 @@ input.check_all_issues {
 @media (min-width: 800px)  { .issues_filters select { width: 160px; }  }
 @media (min-width: 1200px) { .issues_filters select { width: 220px; }  }
 
-@media (min-width: 800px)  { .issues_bulk_update .chosen-container { min-width: 120px; }  }
-@media (min-width: 1200px) { .issues_bulk_update .chosen-container { min-width: 160px; }  }
+@media (min-width: 800px)  { .issues_bulk_update .select2-container { min-width: 120px; }  }
+@media (min-width: 1200px) { .issues_bulk_update .select2-container { min-width: 160px; }  }
 
 .issues-holder {
   .issues_filters {
@@ -105,7 +105,7 @@ input.check_all_issues {
 }
 
 .issues_bulk_update {
-  .chosen-container {
+  .select2-container {
     text-shadow: none;
   }
 }
@@ -120,11 +120,6 @@ input.check_all_issues {
   }
 }
 
-.edit-issue.inline-update select {
-  width: 100%;
-  max-width: 200px;
-}
-
 .issue-show-labels .label {
   padding: 6px 10px;
 }
diff --git a/app/assets/stylesheets/sections/login.scss b/app/assets/stylesheets/sections/login.scss
index 402b44fe7a5..186294424a2 100644
--- a/app/assets/stylesheets/sections/login.scss
+++ b/app/assets/stylesheets/sections/login.scss
@@ -1,55 +1,58 @@
 /* Login Page */
-body.login-page{
-  .container > .content {
-    padding-top: 20px;
+.login-page {
+  h1 {
+    font-size: 3em;
+    font-weight: 200;
   }
-}
-
-.login-box{
-  width: 304px;
-  position: relative;
-  @include border-radius(5px);
-  margin: auto;
-  padding: 20px;
-  background: white;
-}
-
-.login-box .login-logo{
-  margin: 10px 0 30px 0;
-  display: block;
-}
-
-.login-box input.text{background-color: #f1f1f1; font-size: 16px; @include border-radius(0); padding: 14px 10px; width: 280px}
-
-.login-box input.text.top{
-  @include border-radius(5px 5px 0 0);
-  margin-bottom: 0px;
-}
 
-.login-box input.text.bottom{
-  @include border-radius(0 0 5px 5px);
-  border-top: 0;
-  margin-bottom: 20px;
-}
-
-.login-box input.text.middle{
-  border-top: 0;
-  margin-bottom:0px;
-}
+  .login-box{
+    width: 304px;
+    position: relative;
+    @include border-radius(5px);
+    margin: auto;
+    padding: 20px;
+    background: white;
+  }
 
-.login-box a.forgot{float: right; padding-top: 6px}
+  .login-logo{
+    margin: 10px 0 30px 0;
+    display: block;
+  }
 
-.remember_me {
-  text-align: left;
+  .form-control {
+    background-color: #f1f1f1;
+    font-size: 16px;
+    padding: 14px 10px;
+    width: 280px;
+    height: auto;
+
+    &.top {
+      @include border-radius(5px 5px 0 0);
+      margin-bottom: 0px;
+    }
+
+    &.bottom {
+      @include border-radius(0 0 5px 5px);
+      border-top: 0;
+      margin-bottom: 20px;
+    }
+
+    &.middle {
+      border-top: 0;
+      margin-bottom:0px;
+      @include border-radius(0);
+    }
+  }
 
-  input {
-    margin: 2px;
+  .login-box a.forgot {
+    float: right;
+    padding-top: 6px
   }
-}
 
-.devise-errors {
-  h2 {
-   font-size: 14px;
-   color: #a00;
+  .devise-errors {
+    h2 {
+      font-size: 14px;
+      color: #a00;
+    }
   }
 }
diff --git a/app/assets/stylesheets/sections/merge_requests.scss b/app/assets/stylesheets/sections/merge_requests.scss
index 0f0f8c858d1..d3462d6aaa7 100644
--- a/app/assets/stylesheets/sections/merge_requests.scss
+++ b/app/assets/stylesheets/sections/merge_requests.scss
@@ -4,10 +4,6 @@
  *
  */
 .automerge_widget {
-  &.can_be_merged {
-    background: #DFF0D8;
-  }
-
   form {
     margin-bottom: 0;
     .clearfix {
@@ -15,32 +11,12 @@
     }
   }
 
-  .accept_group {
-    float: left;
-    border: 1px solid #ADA;
-    padding: 2px;
-    @include border-radius(5px);
-    background: #CEB;
-
-    .accept_merge_request {
-      font-size: 13px;
-      float: left;
-    }
-    .remove_branch_holder {
-      margin-left: 20px;
-      margin-right: 10px;
-      float: left;
-    }
+  .accept-group {
     label {
-      color: #444;
-      text-align: left
+      margin: 5px;
+      margin-left: 20px;
     }
   }
-
-
-  .how_to_merge_link {
-    @extend .primary;
-  }
 }
 
 .merge-request .nav-tabs{
@@ -53,11 +29,6 @@
   }
 }
 
-.merge-in-progress {
-  @extend .padded;
-  @extend .append-bottom-10;
-}
-
 .mr_source_commit,
 .mr_target_commit {
   .commit {
@@ -111,12 +82,8 @@
 .merge-request-angle {
   text-align: center;
   margin: 0 auto;
-  background: #eee;
-  border-radius: 100px;
-  width: 60px;
-  line-height: 60px;
-  color: #777;
-  text-shadow: 0 1px 2px #FFF;
+  font-size: 2em;
+  line-height: 1.1;
 }
 
 .merge-request-form-info {
@@ -128,8 +95,7 @@
     font-weight: normal !important;
   }
 
-  .chosen-container .chosen-single {
-    padding: 2px 0 2px 10px;
+  .select2-container .select2-single {
     span {
       font-weight: bold;
       color: #555;
diff --git a/app/assets/stylesheets/sections/nav.scss b/app/assets/stylesheets/sections/nav.scss
index 54263523e85..f706854b4fe 100644
--- a/app/assets/stylesheets/sections/nav.scss
+++ b/app/assets/stylesheets/sections/nav.scss
@@ -6,6 +6,7 @@
   border-bottom: 1px solid #E1E1E1;
 
   ul {
+    padding: 0;
     margin: auto;
     height: 40px;
     overflow: hidden;
diff --git a/app/assets/stylesheets/sections/notes.scss b/app/assets/stylesheets/sections/notes.scss
index 724b8d414a8..1ae0e161aa2 100644
--- a/app/assets/stylesheets/sections/notes.scss
+++ b/app/assets/stylesheets/sections/notes.scss
@@ -2,7 +2,7 @@
  * Notes
  */
 
-@-webkit-keyframes target-note {
+@-webkit-keyframes targe3-note {
   from { background:#fffff0; }
   50% { background:#ffffd3; }
   to { background:#fffff0; }
@@ -119,9 +119,9 @@ ul.notes {
 }
 
 .file .notes_holder {
-  font-family: $sansFontFamily;
   font-size: 13px;
   line-height: 18px;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 
   td {
     border: 1px solid #ddd;
@@ -138,7 +138,7 @@ ul.notes {
       border-left: 1px solid #ddd !important;
     }
     &.notes_content {
-      background-color: $white;
+      background-color: #fff;
       border-width: 1px 0;
       padding-top: 0;
 
@@ -303,7 +303,7 @@ ul.notes {
 }
 
 .note-image-attach {
-  @extend .span4;
+  @extend .col-md-4;
   @extend .thumbnail;
   margin-left: 45px;
 }
diff --git a/app/assets/stylesheets/sections/profile.scss b/app/assets/stylesheets/sections/profile.scss
index 7e5668ae8a7..3a3bf7cdf2a 100644
--- a/app/assets/stylesheets/sections/profile.scss
+++ b/app/assets/stylesheets/sections/profile.scss
@@ -1,7 +1,6 @@
 .update-notifications {
-  margin-bottom: 0;
-  label {
-    margin-bottom: 0;
+  .radio-inline {
+    margin-right: 9%;
   }
 }
 
@@ -17,7 +16,7 @@
 
     legend {
       border: none;
-      margin: 0;
+      margin-bottom: 10px;
     }
   }
 }
@@ -47,3 +46,62 @@
     margin: 10px 0;
   }
 }
+
+.user-show-username {
+  font-weight: 200;
+  color: #666;
+}
+
+/*
+ * Appearance settings
+ *
+ */
+.themes_opts {
+  label {
+    margin-right: 20px;
+    text-align: center;
+
+    .prev {
+      @extend .thumbnail;
+      height: 30px;
+      width: 175px;
+      margin-bottom: 10px;
+
+      &.classic {
+        background: #31363e;
+      }
+
+      &.default {
+        background: #f1f1f1;
+      }
+
+      &.modern {
+        background: #345;
+      }
+
+      &.gray {
+        background: #373737;
+      }
+
+      &.violet {
+        background: #547;
+      }
+    }
+  }
+}
+
+.code_highlight_opts {
+  margin-top: 10px;
+
+  label {
+    margin-right: 20px;
+    text-align: center;
+
+    .prev {
+      @extend .thumbnail;
+      height: 151px;
+      width: 220px;
+      margin-bottom: 10px;
+    }
+  }
+}
diff --git a/app/assets/stylesheets/sections/projects.scss b/app/assets/stylesheets/sections/projects.scss
index d55e40914b2..178364835ae 100644
--- a/app/assets/stylesheets/sections/projects.scss
+++ b/app/assets/stylesheets/sections/projects.scss
@@ -16,7 +16,7 @@
 
 .project-home-panel {
   border-bottom: 1px solid #DDD;
-  padding-bottom: 25px;
+  padding-bottom: 15px;
   margin-bottom: 30px;
 
   &.empty-project {
@@ -41,24 +41,29 @@
     .project-home-desc {
       float: left;
       color: #777;
+      margin-bottom: 10px;
     }
 
     .project-home-links {
       float: right;
       a {
         margin-left: 10px;
+        font-weight: 500;
       }
     }
   }
 
   .visibility-level-label {
-    font-size: 14px;
+    font-size: 17px;
     background: #f1f1f1;
-    padding: 8px 10px;
     border-radius: 4px;
-    margin-left: 10px;
     color: #888;
+    position: absolute;
+    margin-left: -55px;
     text-shadow: 0 1px 1px #FFF;
+    width: 40px;
+    text-align: center;
+    padding: 6px;
 
     i {
       color: inherit;
@@ -67,76 +72,53 @@
 }
 
 .git-clone-holder {
-  float: right;
-  border: 1px solid #E1E1E1;
-  @include border-radius(4px);
+  .project-home-dropdown + & {
+    margin-right: 45px;
+  }
 
-  input[type="text"],
-  .btn {
-    border: none;
-    @include border-radius(0px);
-    border-left: 1px solid #E1E1E1;
+  .btn,
+  .form-control {
+    border: 1px solid #E1E1E1;
     box-shadow: none;
     padding: 6px 9px;
   }
 
   .btn {
-    float: left;
     background: none;
     color: #29b;
 
-    &:first-child {
-      @include border-radius-left(4px);
-      border-left: 0px;
-    }
-
     &.active {
       color: #333;
       font-weight: bold;
     }
   }
 
-  input[type="text"] {
+  .form-control {
     cursor: auto;
     @extend .monospace;
     background: #FAFAFA;
+    width: 100%;
   }
 }
 
 .project-visibility-level-holder {
-  .controls {
-    padding-bottom: 9px;
-  }
+  .radio {
+    margin-bottom: 10px;
 
-  .controls {
-    input {
-      float: left;
+    i {
+      margin: 0 3px;
+      font-size: 20px;
     }
-    .descr {
-      display: block;
-      margin-left: 1.5em;
-      &.restricted {
-        color: #888;
-      }
 
-      label {
-        float: none;
-        padding: 0;
-        margin: 0;
-        text-align: left;
-      }
-    }
-    .info {
-      display: block;
-      margin-top: 5px;
-    }
-    strong {
+    .option-title {
+      font-weight: bold;
       display: inline-block;
-      width: 4em;
     }
-  }
-  i {
-    color: inherit;
+
+    .option-descr {
+      margin-left: 24px;
+      color: #666;
+    }
   }
 }
 
@@ -218,11 +200,26 @@ ul.nav.nav-projects-tabs {
 .project-side {
   .btn-block {
     background-image: none;
-    background-color: #F1f1f1;
-    border-color: #EEE;
-    &:hover {
-      background-color: #eee;
-      border-color: #DDD;
+    .btn,
+    &.btn,
+    &.btn-group ul.dropdown-menu {
+      background-color: #F1f1f1;
+      border-color: #EEE;
+      &:hover {
+        background-color: #eee;
+        border-color: #DDD;
+      }
+    }
+    &.btn-group-justified {
+        .btn {
+            width: 100%;
+        }
+        .dropdown-toggle {
+            width: 26px;
+        }
+    }
+    ul {
+        width: 100%;
     }
   }
   .project-fork-icon {
@@ -233,46 +230,10 @@ ul.nav.nav-projects-tabs {
   }
 }
 
-.transfer-project .chosen-container {
+.transfer-project .select2-container {
   min-width: 200px;
 }
 
-/** Branch/tag selector **/
-.project-refs-form {
-  margin: 0;
-  span {
-    background:none !important;
-    position:static !important;
-    width:auto !important;
-    height:auto !important;
-  }
-}
-.project-refs-select {
-  width: 120px;
-}
-
-.project-refs-form .chosen-container {
-  position: relative;
-  top: 0;
-  left: 0;
-  margin-right: 10px;
-
-  .chosen-single span {
-    font-weight: bold;
-    color: #555;
-  }
-
-  &.chosen-container-active {
-    .chosen-drop {
-      min-width: 400px;
-    }
-
-    .chosen-results {
-      max-height: 400px;
-    }
-  }
-}
-
 .deploy-project-label {
   margin: 1px;
 }
diff --git a/app/assets/stylesheets/sections/snippets.scss b/app/assets/stylesheets/sections/snippets.scss
index e67ca794f25..84404b6ee36 100644
--- a/app/assets/stylesheets/sections/snippets.scss
+++ b/app/assets/stylesheets/sections/snippets.scss
@@ -1,14 +1,3 @@
-.snippet.file-holder {
-  .file-title {
-    .snippet-file-name {
-      padding: 4px 10px;
-      position: relative;
-      top: -4px;
-      left: -4px;
-    }
-  }
-}
-
 .my-snippets li:first-child {
   h4 { margin-top: 0; }
   padding-top: 0;
diff --git a/app/assets/stylesheets/sections/themes.scss b/app/assets/stylesheets/sections/themes.scss
index cd1aa2b011a..e69de29bb2d 100644
--- a/app/assets/stylesheets/sections/themes.scss
+++ b/app/assets/stylesheets/sections/themes.scss
@@ -1,53 +0,0 @@
-.themes_opts {
-  padding-left: 20px;
-
-  label {
-    width: 175px;
-    margin-right: 40px;
-
-    .prev {
-      @extend .thumbnail;
-      height: 30px;
-      width: 175px;
-      margin-bottom: 10px;
-
-      &.classic {
-        background: #31363e;
-      }
-
-      &.default {
-        background: #f1f1f1;
-      }
-
-      &.modern {
-        background: #345;
-      }
-
-      &.gray {
-        background: #373737;
-      }
-
-      &.violet {
-        background: #547;
-      }
-    }
-  }
-}
-
-.code_highlight_opts {
-  padding-left: 20px;
-
-  label {
-    width: 220px;
-    margin-right: 40px;
-
-    .prev {
-      @extend .thumbnail;
-      height: 151px;
-      width: 220px;
-      margin-bottom: 10px;
-    }
-  }
-}
-
-
diff --git a/app/assets/stylesheets/sections/tree.scss b/app/assets/stylesheets/sections/tree.scss
index efa95e66742..dfdcbb59b6b 100644
--- a/app/assets/stylesheets/sections/tree.scss
+++ b/app/assets/stylesheets/sections/tree.scss
@@ -24,10 +24,10 @@
       th {
         font-weight: normal;
         font-size: 15px;
-        border-bottom: 1px solid #CCC;
+        border-bottom: 1px solid #CCC !important;
       }
       td {
-        border-color: #F1F1F1;
+        border-color: #F1F1F1 !important;
       }
       &:hover {
         td {
@@ -49,6 +49,7 @@
 
   .tree-item {
     .tree-item-file-name {
+      max-width: 320px;
       vertical-align: middle;
       a {
         &:hover {
@@ -61,6 +62,14 @@
         top:-1px;
       }
     }
+
+    .tree_commit {
+      max-width: 320px;
+    }
+
+    .tree_time_ago {
+      min-width: 135px;
+    }
   }
 
   .tree_author {
@@ -111,7 +120,7 @@
 
 .tree-ref-holder {
   float: left;
-  margin-top: 5px;
+  margin-top: 8px;
 }
 
 .readme-holder {
diff --git a/app/assets/stylesheets/sections/votes.scss b/app/assets/stylesheets/sections/votes.scss
index 49489babab7..13f811e01a1 100644
--- a/app/assets/stylesheets/sections/votes.scss
+++ b/app/assets/stylesheets/sections/votes.scss
@@ -36,3 +36,8 @@
   display: inline-block;
   margin: 0 8px;
 }
+
+.votes-holder {
+  float: right;
+  width: 250px;
+}
diff --git a/app/assets/stylesheets/sections/wall.scss b/app/assets/stylesheets/sections/wall.scss
index d6ac08fcf6f..3705afdb87c 100644
--- a/app/assets/stylesheets/sections/wall.scss
+++ b/app/assets/stylesheets/sections/wall.scss
@@ -1,6 +1,6 @@
 .wall-page {
   .wall-note-form {
-    @extend .span12;
+    @extend .col-md-12;
 
     margin: 0;
     height: 140px;
diff --git a/app/assets/stylesheets/selects.scss b/app/assets/stylesheets/selects.scss
deleted file mode 100644
index 7259c7d7e49..00000000000
--- a/app/assets/stylesheets/selects.scss
+++ /dev/null
@@ -1,57 +0,0 @@
-/** Chosen.js selectbox style override **/
-.chosen-container {
-  min-width: 100px;
-
-  .chosen-single {
-    background: #EEE !important;
-    border: 1px solid #DDD !important;
-    @include box-shadow(none !important);
-    @include border-radius(4px !important);
-  }
-
-  .chosen-results li.highlighted {
-    background: #29b;
-  }
-
-  .chosen-drop {
-    margin-top: 10px;
-    border: 1px solid #DDD !important;
-    @include border-radius(4px !important);
-  }
-
-  .chosen-search input {
-    border: 1px solid #CCC !important;
-    @include box-shadow(none !important);
-  }
-}
-
-/** Select2 styling **/
-.select2-container .select2-choice {
-  @include bg-light-gray-gradient;
-}
-
-.select2-container .select2-choice div {
-  border: none;
-  background: none;
-}
-
-.select2-drop {
-  padding-top: 8px;
-}
-
-.select2-no-results, .select2-searching {
-  padding: 7px;
-  color: #666;
-}
-
-.chosen-container .chosen-single div b {
-  background-position-y: 0px !important;
-}
-
-.chosen-container .chosen-drop .chosen-search input {
-  background-position-y: -24px !important;
-}
-
-.chosen-compact {
-  max-width: 170px !important;
-}