Merge pull request #3272 from riking/featured-css

FEATURE: Style 'Feature Topic' dialog
This commit is contained in:
Régis Hanol 2015-03-16 09:44:46 +01:00
commit 886e325c98
2 changed files with 98 additions and 47 deletions

View File

@ -1,60 +1,81 @@
<div class="modal-body"> <div class="modal-body feature-topic">
{{#if pinned_at}} {{#if pinned_at}}
<div> <div class="feature-section">
{{d-button action="unpin" icon="thumb-tack" label="topic.actions.unpin" class="btn-primary btn-small"}} <div class="button">
<p>{{{unPinMessage}}}</p> {{d-button action="unpin" icon="thumb-tack" label="topic.actions.unpin" class="btn-primary"}}
{{#if pinned_globally}} </div>
<p>{{i18n "topic.feature_topic.global_pin_note"}}</p> <div class="desc">
<p> <p>{{{unPinMessage}}}</p>
{{#loading-spinner size="small" condition=loading}} {{#if pinned_globally}}
{{{i18n "topic.feature_topic.already_pinned_globally" count=pinnedGloballyCount}}} <p>{{i18n "topic.feature_topic.global_pin_note"}}</p>
{{/loading-spinner}} <p>
</p> {{#loading-spinner size="small" condition=loading}}
{{else}} {{{i18n "topic.feature_topic.already_pinned_globally" count=pinnedGloballyCount}}}
{{/loading-spinner}}
</p>
{{else}}
<p>{{i18n "topic.feature_topic.pin_note"}}</p>
<p>
{{#loading-spinner size="small" condition=loading}}
{{{alreadyPinnedMessage}}}
{{/loading-spinner}}
</p>
{{/if}}
</div>
</div>
{{else}}
<div class="feature-section">
<div class="button">
{{d-button action="pin" icon="thumb-tack" label="topic.actions.pin" class="btn-primary"}}
</div>
<div class="desc">
<p>{{{pinMessage}}}</p>
<p>{{i18n "topic.feature_topic.pin_note"}}</p> <p>{{i18n "topic.feature_topic.pin_note"}}</p>
<p> <p>
{{#loading-spinner size="small" condition=loading}} {{#loading-spinner size="small" condition=loading}}
{{{alreadyPinnedMessage}}} {{{alreadyPinnedMessage}}}
{{/loading-spinner}} {{/loading-spinner}}
</p> </p>
{{/if}} </div>
</div> </div>
{{else}} <hr>
<div> <div class="feature-section">
{{d-button action="pin" icon="thumb-tack" label="topic.actions.pin" class="btn-primary btn-small"}} <div class="button">
<p>{{{pinMessage}}}</p> {{d-button action="pinGlobally" icon="thumb-tack" label="topic.actions.pin_globally" class="btn-primary"}}
<p>{{i18n "topic.feature_topic.pin_note"}}</p> </div>
<p> <div class="desc">
{{#loading-spinner size="small" condition=loading}} <p>{{i18n "topic.feature_topic.pin_globally"}}</p>
{{{alreadyPinnedMessage}}} <p>{{i18n "topic.feature_topic.global_pin_note"}}</p>
{{/loading-spinner}} <p>
</p> {{#loading-spinner size="small" condition=loading}}
</div> {{{i18n "topic.feature_topic.already_pinned_globally" count=pinnedGloballyCount}}}
<div> {{/loading-spinner}}
{{d-button action="pinGlobally" icon="thumb-tack" label="topic.actions.pin_globally" class="btn-primary btn-small"}} </p>
<p>{{i18n "topic.feature_topic.pin_globally"}}</p> </div>
<p>{{i18n "topic.feature_topic.global_pin_note"}}</p>
<p>
{{#loading-spinner size="small" condition=loading}}
{{{i18n "topic.feature_topic.already_pinned_globally" count=pinnedGloballyCount}}}
{{/loading-spinner}}
</p>
</div> </div>
{{/if}} {{/if}}
<div> <hr>
{{#if isBanner}} <div class="feature-section">
{{d-button action="removeBanner" icon="bullhorn" label="topic.actions.remove_banner" class="btn-primary btn-small"}} <div class="button">
<p>{{i18n "topic.feature_topic.remove_banner"}}</p> {{#if isBanner}}
{{else}} {{d-button action="removeBanner" icon="bullhorn" label="topic.actions.remove_banner" class="btn-primary"}}
{{d-button action="makeBanner" icon="bullhorn" label="topic.actions.make_banner" class="btn-primary btn-small"}} {{else}}
<p>{{i18n "topic.feature_topic.make_banner"}}</p> {{d-button action="makeBanner" icon="bullhorn" label="topic.actions.make_banner" class="btn-primary"}}
{{/if}} {{/if}}
<p>{{i18n "topic.feature_topic.banner_note"}}</p> </div>
<p> <div class="desc">
{{#loading-spinner size="small" condition=loading}} {{#if isBanner}}
{{{i18n "topic.feature_topic.already_banner" count=bannerCount}}} <p>{{i18n "topic.feature_topic.remove_banner"}}</p>
{{/loading-spinner}} {{else}}
</p> <p>{{i18n "topic.feature_topic.make_banner"}}</p>
{{/if}}
<p>{{i18n "topic.feature_topic.banner_note"}}</p>
<p>
{{#loading-spinner size="small" condition=loading}}
{{{i18n "topic.feature_topic.already_banner" count=bannerCount}}}
{{/loading-spinner}}
</p>
</div>
</div> </div>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">

View File

@ -29,3 +29,33 @@
} }
} }
} }
.modal-body.feature-topic .feature-section {
display: block;
.button {
width: 33%;
display: inline-block;
}
.desc {
display: inline-block;
vertical-align: middle;
max-width: 60%;
margin-left: 10px;
p {
margin: 10px 0;
}
}
}
.mobile-view .feature-topic .feature-section {
.button {
width: auto;
display: block;
margin: 0 10px;
}
.desc {
display: block;
clear: both;
max-width: 90%;
margin: 0 10px;
}
}