github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-26 05:23:40 +08:00
Code Issues Actions 6 Packages Projects Releases Wiki Activity

Tweak badge styling

Browse Source
This commit is contained in:
Sam 2014-04-14 15:58:36 +10:00
parent 0d114d7b17
commit 4a0c63ec7f
2 changed files with 45 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
app/assets/javascripts/discourse/templates/poster_expansion.handlebars
View File

@ -6,6 +6,17 @@
{{#if showName}}
<h2><a {{bind-attr href="usernameUrl"}}>{{name}}</a></h2>
{{/if}}
{{#if showBadges}}
<div class="badge-section">
{{#each user.featured_user_badges}}
<span class="user-badge badge-type-{{unbound badge.badge_type_id}}"><i class='fa fa-certificate'></i> {{badge.name}}</span>
{{/each}}
{{#if showMoreBadges}}
<span class="btn more-user-badges">{{i18n badges.more_badges count=moreBadgesCount}}</span>
{{/if}}
</div>
{{/if}}
</div>
{{#if user}}
@ -15,17 +26,6 @@
{{groups-list groups=user.custom_groups}}
</div>
{{#if showBadges}}
<div class="badge-section">
<h3>{{i18n badges.badge_count count=user.badge_count}}</h3>
{{#each user.featured_user_badges}}
<span class="badge">{{badge.name}}</span>
{{/each}}
{{#if showMoreBadges}}
<span class="btn more-badges">{{i18n badges.more_badges count=moreBadgesCount}}</span>
{{/if}}
</div>
{{/if}}
<div class='bottom'>
{{#if user.bio_cooked}}<div class='bio'>{{{user.bio_cooked}}}</div>{{/if}}

26
app/assets/stylesheets/desktop/poster_expansion.scss
View File

@ -91,10 +91,11 @@
}
h2 {
line-height: 15px;
line-height: 12px;
}
.badge-section {
margin-top: 20px;
h3 {
line-height: 43px;
color: $primary_text_color;
@ -102,21 +103,38 @@
margin-bottom: -8px;
}
.badge, .more-badges {
}
}
}
.user-badge, .more-user-badges {
font-size: 12px;
margin: 0;
line-height: 16px;
display: inline-block;
.fa {
padding-right: 5px;
font-size: 16px;
}
}
.badge {
.user-badge {
padding: 3px 8px;
border: 1px solid $secondary-border-color;
}
.more-badges {
.more-user-badges {
padding: 4px 8px;
}
.badge-type-1 .fa-certificate {
color: #A67D3D;
}
.badge-type-2 .fa-certificate {
color: silver;
}
.badge-type-1 .fa-certificate {
color: gold;
}