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

This reverts commit 1b4e0f3300.
This commit is contained in:
Sam 2016-03-18 14:29:39 +11:00
parent ebcf8970b3
commit 37ccfbdb2a
6 changed files with 173 additions and 223 deletions

View file

@ -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(),

View file

@ -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

View file

@ -1,13 +1,8 @@
<div {{bind-attr class=":wrap :d-header-wrap showExtraInfo:minimized:not-minimized"}}>
<div class='d-header-table contents clearfix'>
<div class="d-header-row">
<div class='wrap'>
<div class='contents clearfix'>
{{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"}}

View file

@ -11,49 +11,12 @@
backface-visibility: hidden; /** do magic for scrolling performance **/
}
.d-header-table {
display: table;
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;
.contents {
margin: 8px 0;
}
.title {
vertical-align: middle;
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;
float: left;
}
#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;

View file

@ -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

View file

@ -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 {