Revert "FIX: vertical centering of header, using display: table"

This reverts commit 1b4e0f3300.

app/assets/javascripts/discourse/components/header-extra-info.js.es6

@@ -1,7 +1,6 @@
 import DiscourseURL from 'discourse/lib/url';
 
 const TopicCategoryComponent = Ember.Component.extend({
-  classNames: ['extra-info-cell'],
   needsSecondRow: Ember.computed.gt('secondRowItems.length', 0),
   secondRowItems: function() { return []; }.property(),
 

app/assets/javascripts/discourse/components/home-logo.js.es6

@@ -2,7 +2,7 @@ import DiscourseURL from 'discourse/lib/url';
 import { setting } from 'discourse/lib/computed';
 
 export default Ember.Component.extend({
-  classNameBindings: [":title", "minimized"],
+  classNames: ["title"],
 
   targetUrl: function() {
     // For overriding by customizations

app/assets/javascripts/discourse/templates/header.hbs

@@ -1,13 +1,8 @@
-<div {{bind-attr class=":wrap :d-header-wrap showExtraInfo:minimized:not-minimized"}}>
+<div class='wrap'>
-  <div class='d-header-table contents clearfix'>
+  <div class='contents clearfix'>
-    <div class="d-header-row">
     {{home-logo minimized=showExtraInfo}}
     {{plugin-outlet "header-after-home-logo"}}
 
-      {{#if showExtraInfo}}
-        {{header-extra-info topic=topic}}
-      {{/if}}
-
     <div class='panel clearfix'>
       {{#unless currentUser}}
         {{#if showSignUpButton}}
@@ -15,7 +10,6 @@
         {{/if}}
         {{d-button action="showLogin" class="btn-primary btn-small login-button" icon="user" label="log_in"}}
       {{/unless}}
-        <div class="d-header-nav">
       <ul class='icons clearfix' role='navigation'>
         {{#if currentUser}}
           {{plugin-outlet "header-before-notifications"}}
@@ -63,8 +57,10 @@
         {{hamburger-menu visible=hamburgerVisible showKeyboardAction="showKeyboardShortcutsHelp"}}
         {{search-menu visible=searchVisible}}
     </div>
-      </div>
+
-    </div>
+    {{#if showExtraInfo}}
+      {{header-extra-info topic=topic}}
+    {{/if}}
   </div>
 </div>
 {{plugin-outlet "header-under-content"}}

app/assets/stylesheets/common/base/header.scss

@@ -11,49 +11,12 @@
       backface-visibility: hidden;  /** do magic for scrolling performance **/
     }
 
-  .d-header-table {
+    .contents {
-    display: table;
+      margin: 8px 0;
-    table-layout: fixed; /* or else long topic titles break everything */
-    width: 100%;
-    margin: 8px auto;
-  }
-  .d-header-row {
-    display: table-header-group; /* table-row doesn't work on mobile */
-  }
-  .d-header-wrap {
-    padding: 0;
-  }
-  .title, .extra-info-cell, .panel {
-    display: table-cell;
     }
+
     .title {
-    vertical-align: middle;
+      float: left;
-    padding-left: 8px;
-    overflow: hidden;
-    width: 65%;
-  }
-  .extra-info-cell {
-    vertical-align: middle;
-    padding-left: 8px;
-  }
-  .panel {
-    width:35%;
-    text-align: right;
-    position: relative;
-    .menu-panel {
-      text-align: left;
-    }
-  }
-
-  .not-minimized {
-    .title { width: 65%; }
-    .panel { width: 35%; }
-  }
-  /* .minimized is different for desktop and mobile */
-
-  .d-header-nav {
-    position: relative;
-    float: right;
     }
 
     #site-logo {
@@ -64,8 +27,13 @@
       font-size: 1.643em;
     }
 
+    .panel {
+      float: right;
+      position: relative;
+    }
+
     .login-button, button.sign-up-button {
-    float: none;
+      float: left;
       margin-top: 7px;
       padding: 6px 10px;
       .fa { margin-right: 3px; }
@@ -76,6 +44,7 @@
     }
 
     .icons {
+      float: left;
       text-align: center;
       margin: 0 0 0 5px;
       list-style: none;

app/assets/stylesheets/desktop/header.scss

@@ -11,11 +11,6 @@
     padding:8px;
     font-size: 2.1em;
   }
-  .minimized {
-    .title           { width: 40px; vertical-align: baseline; }
-    .extra-info-cell { width: 74%; }
-    .panel           { width: 25%; }
-  }
 }
 
 @media all

app/assets/stylesheets/mobile/header.scss

@@ -17,10 +17,6 @@
     text-overflow: clip;
   }
 
-  .extra-info-cell {
-    display: none;
-  }
-
   .icons {
     .badge-notification {
       top: -5px;
@@ -35,11 +31,6 @@
   button.sign-up-button {
     display:none;
   }
-
-  .not-minimized, .minimized {
-    .title { width: auto; }
-    .panel { width: auto; }
-  }
 }
 
 #main-outlet {