Merge branch '18080-project-header-alignment' into 'master'

Add flexbox to project header ## What does this MR do? Adds flexbox to project header to keep components vertically centered regardless of description presence/length ## What are the relevant issue numbers? Closes #18080 ## Screenshots (if relevant) ![Screen_Shot_2016-06-01_at_12.02.42_PM](/uploads/edd769110b52ec34046f4079619e45eb/Screen_Shot_2016-06-01_at_12.02.42_PM.png) ![Screen_Shot_2016-06-01_at_12.02.35_PM](/uploads/c5c2828ba5688a2588d3721a2d21d5fe/Screen_Shot_2016-06-01_at_12.02.35_PM.png) See merge request !4417

Merge branch '18080-project-header-alignment' into 'master'
915ad255 · Jacob Schatz · 402767e0 · 30856b1e · 915ad255 · 915ad255
Commit 915ad255 authored Jun 08, 2016 by Jacob Schatz
Hide whitespace changes
Inline Side-by-side

Showing with 13 additions and 5 deletions

projects.scss app/assets/stylesheets/pages/projects.scss +9 -1

_home_panel.html.haml app/views/projects/_home_panel.html.haml +4 -4

No files found.
--- a/app/assets/stylesheets/pages/projects.scss
+++ b/app/assets/stylesheets/pages/projects.scss
@@ -32,6 +32,15 @@

  .container-fluid {
    position: relative;
+
+    @media (min-width: $screen-md-max) {
+      .row {
+        display: flex;
+        -ms-flex-align: center;
+        -webkit-align-items: center;
+        -webkit-box-align: center;
+      }
+    }
  }

  .cover-controls {
@@ -57,7 +66,6 @@
    max-width: 86px;
    min-width: 86px;
    padding-right: 0;
-    margin: 11px 0;

    @media (max-width: $screen-md-max) {
      padding-left: 0;

--- a/app/views/projects/_home_panel.html.haml
+++ b/app/views/projects/_home_panel.html.haml
@@ -29,10 +29,10 @@
          .project-clone-holder
            = render "shared/clone_panel"

-    .project-repo-buttons.btn-group.project-right-buttons
-      = render "projects/buttons/download"
-      = render 'projects/buttons/dropdown'
-      = render 'projects/buttons/notifications'
+      .project-repo-buttons.btn-group.project-right-buttons
+        = render "projects/buttons/download"
+        = render 'projects/buttons/dropdown'
+        = render 'projects/buttons/notifications'

 :javascript
  new Star();