discourse/app/assets/javascripts/admin/addon/templates/admin-badges.hbs
Ella E. be5c37a6d4
UX: Apply admin UI to Badges (#28724)
* UX: Add a description about badges

* WIP: Apply admin UI guidelines

* FIX: Add routeModels to dbutton

Allows routeModels to be passed to a DButton along
with route, so we can use them as a LinkTo replacement
in more places.

Also fix up badges admin page header.

* UX: Reorder action buttons

* UX: Change header hierarchy to better align page's content structure

* UX: Update copy and remove unnecessary UI elements

* UX: Adjust header's icon spacing

* UX: Fix the header action buttons on mobile

* Apply prettier

---------

Co-authored-by: Martin Brennan <martin@discourse.org>
2024-09-04 20:18:23 -06:00

52 lines
1.4 KiB
Handlebars

<div class="badges">
<AdminPageHeader
@titleLabel="admin.badges.title"
@descriptionLabel="admin.badges.description"
@learnMoreUrl="https://meta.discourse.org/t/understanding-and-using-badges/32540"
>
<:breadcrumbs>
<DBreadcrumbsItem
@path="/admin/badges"
@label={{i18n "admin.badges.title"}}
/>
</:breadcrumbs>
<:actions as |actions|>
<actions.Primary
@route="adminBadges.show"
@routeModels="new"
@icon="plus"
@label="admin.badges.new"
/>
<actions.Default
@route="adminBadges.award"
@routeModels="new"
@icon="upload"
@label="admin.badges.mass_award.title"
/>
<actions.Default
@action={{routeAction "editGroupings"}}
@title="admin.badges.group_settings"
@label="admin.badges.group_settings"
@icon="cog"
class="edit-groupings-btn"
/>
</:actions>
</AdminPageHeader>
<div class="content-list">
<ul class="admin-badge-list">
{{#each this.model as |badge|}}
<li class="admin-badge-list-item">
<LinkTo @route={{this.selectedRoute}} @model={{badge.id}}>
<BadgeButton @badge={{badge}} />
{{#if badge.newBadge}}
<span class="list-badge">{{i18n "filters.new.lower_title"}}</span>
{{/if}}
</LinkTo>
</li>
{{/each}}
</ul>
</div>
{{outlet}}
</div>