Merge pull request #2783 from chapel/proper-responsive-extra-info

Make extra info header properly responseive
This commit is contained in:
Robin Ward 2014-09-11 12:42:34 -04:00
commit 4a3e46ee4a
2 changed files with 31 additions and 43 deletions

View File

@ -3,35 +3,6 @@
{{home-logo minimized=showExtraInfo}}
{{#if showExtraInfo}}
<div class="extra-info-wrapper">
<div class="extra-info">
{{#if showStarButton}}
<a {{bind-attr class=":star topic.starred:starred"}} {{action toggleStar}} href='#' {{bind-attr title="topic.starTooltip"}}></a>
{{/if}}
<h1>
{{#if showPrivateMessageGlyph}}
<span class="private-message-glyph">{{fa-icon envelope}}</span>
{{/if}}
{{#if topic.category.parentCategory}}
{{bound-category-link topic.category.parentCategory}}
{{/if}}
{{bound-category-link topic.category}}
{{#if topic.details.loaded}}
{{topic-status topic=topic}}
<a class='topic-link' href='{{unbound topic.url}}' {{action jumpToTopPost}}>{{{topic.fancy_title}}}</a>
{{else}}
{{#if topic.errorLoading}}
{{topic.errorTitle}}
{{else}}
{{i18n topic.loading}}
{{/if}}
{{/if}}
</h1>
</div>
</div>
{{/if}}
<div class='panel clearfix'>
{{#unless currentUser}}
{{#if showSignUpButton}}
@ -120,6 +91,36 @@
{{render "userDropdown"}}
</div>
{{#if showExtraInfo}}
<div class="extra-info-wrapper">
<div class="extra-info">
{{#if showStarButton}}
<a {{bind-attr class=":star topic.starred:starred"}} {{action toggleStar}} href='#' {{bind-attr title="topic.starTooltip"}}></a>
{{/if}}
<h1>
{{#if showPrivateMessageGlyph}}
<span class="private-message-glyph">{{fa-icon envelope}}</span>
{{/if}}
{{#if topic.category.parentCategory}}
{{bound-category-link topic.category.parentCategory}}
{{/if}}
{{bound-category-link topic.category}}
{{#if topic.details.loaded}}
{{topic-status topic=topic}}
<a class='topic-link' href='{{unbound topic.url}}' {{action jumpToTopPost}}>{{{topic.fancy_title}}}</a>
{{else}}
{{#if topic.errorLoading}}
{{topic.errorTitle}}
{{else}}
{{i18n topic.loading}}
{{/if}}
{{/if}}
</h1>
</div>
</div>
{{/if}}
</div>
</div>

View File

@ -522,20 +522,7 @@ iframe {
}
.extra-info-wrapper {
float: left;
width: 78%;
@media all and (max-width : 1080px) {
width: 75%;
}
@media all and (max-width : 870px) {
width: 70%;
}
@media all and (max-width : 725px) {
width: 61%;
}
overflow: hidden;
.topic-statuses {
i { color: $header_primary; }