Merge pull request #3272 from riking/featured-css
FEATURE: Style 'Feature Topic' dialog
This commit is contained in:
commit
886e325c98
|
@ -1,60 +1,81 @@
|
|||
<div class="modal-body">
|
||||
<div class="modal-body feature-topic">
|
||||
{{#if pinned_at}}
|
||||
<div>
|
||||
{{d-button action="unpin" icon="thumb-tack" label="topic.actions.unpin" class="btn-primary btn-small"}}
|
||||
<p>{{{unPinMessage}}}</p>
|
||||
{{#if pinned_globally}}
|
||||
<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>
|
||||
{{else}}
|
||||
<div class="feature-section">
|
||||
<div class="button">
|
||||
{{d-button action="unpin" icon="thumb-tack" label="topic.actions.unpin" class="btn-primary"}}
|
||||
</div>
|
||||
<div class="desc">
|
||||
<p>{{{unPinMessage}}}</p>
|
||||
{{#if pinned_globally}}
|
||||
<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>
|
||||
{{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>
|
||||
{{#loading-spinner size="small" condition=loading}}
|
||||
{{{alreadyPinnedMessage}}}
|
||||
{{/loading-spinner}}
|
||||
</p>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
{{else}}
|
||||
<div>
|
||||
{{d-button action="pin" icon="thumb-tack" label="topic.actions.pin" class="btn-primary btn-small"}}
|
||||
<p>{{{pinMessage}}}</p>
|
||||
<p>{{i18n "topic.feature_topic.pin_note"}}</p>
|
||||
<p>
|
||||
{{#loading-spinner size="small" condition=loading}}
|
||||
{{{alreadyPinnedMessage}}}
|
||||
{{/loading-spinner}}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
{{d-button action="pinGlobally" icon="thumb-tack" label="topic.actions.pin_globally" class="btn-primary btn-small"}}
|
||||
<p>{{i18n "topic.feature_topic.pin_globally"}}</p>
|
||||
<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>
|
||||
<hr>
|
||||
<div class="feature-section">
|
||||
<div class="button">
|
||||
{{d-button action="pinGlobally" icon="thumb-tack" label="topic.actions.pin_globally" class="btn-primary"}}
|
||||
</div>
|
||||
<div class="desc">
|
||||
<p>{{i18n "topic.feature_topic.pin_globally"}}</p>
|
||||
<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}}
|
||||
<div>
|
||||
{{#if isBanner}}
|
||||
{{d-button action="removeBanner" icon="bullhorn" label="topic.actions.remove_banner" class="btn-primary btn-small"}}
|
||||
<p>{{i18n "topic.feature_topic.remove_banner"}}</p>
|
||||
{{else}}
|
||||
{{d-button action="makeBanner" icon="bullhorn" label="topic.actions.make_banner" class="btn-primary btn-small"}}
|
||||
<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>
|
||||
<hr>
|
||||
<div class="feature-section">
|
||||
<div class="button">
|
||||
{{#if isBanner}}
|
||||
{{d-button action="removeBanner" icon="bullhorn" label="topic.actions.remove_banner" class="btn-primary"}}
|
||||
{{else}}
|
||||
{{d-button action="makeBanner" icon="bullhorn" label="topic.actions.make_banner" class="btn-primary"}}
|
||||
{{/if}}
|
||||
</div>
|
||||
<div class="desc">
|
||||
{{#if isBanner}}
|
||||
<p>{{i18n "topic.feature_topic.remove_banner"}}</p>
|
||||
{{else}}
|
||||
<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 class="modal-footer">
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue