mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-11-24 14:43:08 +03:00
Offers archive/active refinements
- added empty archive screen - added indication of archive offer on detail page - set default dropdown style to non-selected - removed archive button for new offers
This commit is contained in:
Peter Zimon
parent
7f2e32d9a5
commit
be5ef010a5
@ -17,7 +17,7 @@
|
||||
@buttonText="Archive"
|
||||
@successText="Archived"
|
||||
@task={{this.archiveOfferTask}}
|
||||
@class="gh-btn gh-btn-black gh-btn-icon"
|
||||
@class="gh-btn gh-btn-red gh-btn-icon"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -45,3 +45,13 @@
|
||||
box-shadow: none;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.gh-badge-title {
|
||||
margin-left: 13px;
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
color: var(--midlightgrey-d2);
|
||||
border: 1px solid var(--lightgrey-d1);
|
||||
border-radius: 4px;
|
||||
line-height: 25px;
|
||||
}
|
||||
@ -70,11 +70,15 @@
|
||||
|
||||
.gh-contentfilter-selected .gh-contentfilter-menu-trigger,
|
||||
.gh-contentfilter-selected .gh-contentfilter-menu-trigger:hover {
|
||||
color: var(--green);
|
||||
font-weight: 600;
|
||||
background: var(--whitegrey-l1);
|
||||
}
|
||||
|
||||
.gh-contentfilter-selected:not(.no-highlight) .gh-contentfilter-menu-trigger,
|
||||
.gh-contentfilter-selected:not(.no-highlight) .gh-contentfilter-menu-trigger:hover {
|
||||
color: var(--green)
|
||||
}
|
||||
|
||||
.gh-canvas-header.grey .gh-contentfilter-menu-trigger,
|
||||
.gh-canvas-header.grey .gh-contentfilter-menu-trigger:focus,
|
||||
.gh-canvas-header.grey .gh-contentfilter-menu-trigger--active {
|
||||
|
||||
@ -234,6 +234,7 @@
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.gh-offers-actions .gh-contentfilter {
|
||||
.gh-offers-actions .gh-contentfilter-menu {
|
||||
margin-left: 0;
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
@ -6,7 +6,10 @@
|
||||
{{#if this.offer.isNew}}
|
||||
New Offer
|
||||
{{else}}
|
||||
{{this.offer.name}}
|
||||
{{this.offer.name}}
|
||||
{{#if (eq this.offer.status "archived")}}
|
||||
<span class="gh-badge gh-badge-title">Archived</span>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</h2>
|
||||
<section class="view-actions">
|
||||
@ -206,13 +209,15 @@
|
||||
<div class="gh-main-section">
|
||||
<div class="gh-main-section-block">
|
||||
{{#if (eq this.offer.status "active")}}
|
||||
<button
|
||||
type="button"
|
||||
class="gh-btn gh-btn-black gh-btn-icon"
|
||||
{{on "click" this.openConfirmArchiveModal}}
|
||||
>
|
||||
<span>Archive offer</span>
|
||||
</button>
|
||||
{{#if (not this.offer.isNew)}}
|
||||
<button
|
||||
type="button"
|
||||
class="gh-btn gh-btn-red gh-btn-icon"
|
||||
{{on "click" this.openConfirmArchiveModal}}
|
||||
>
|
||||
<span>Archive offer</span>
|
||||
</button>
|
||||
{{/if}}
|
||||
{{else}}
|
||||
<button
|
||||
type="button"
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
<h2 class="gh-canvas-title" data-test-screen-title>Offers</h2>
|
||||
<section class="gh-offers-actions view-actions">
|
||||
<div>
|
||||
<div class="gh-contentfilter-menu gh-contentfilter-type {{if this.selectedType.value "gh-contentfilter-selected"}}" data-test-type-select="true">
|
||||
<div class="gh-contentfilter-menu gh-contentfilter-type {{if (not (eq this.selectedType.value "active")) "gh-contentfilter-selected"}}" data-test-type-select="true">
|
||||
<PowerSelect
|
||||
@selected={{this.selectedType}}
|
||||
@options={{this.availableTypes}}
|
||||
@ -15,7 +15,7 @@
|
||||
@matchTriggerWidth={{false}}
|
||||
as |type|
|
||||
>
|
||||
{{#if type.name}}{{type.name}}{{else}}<span class="red">Unknown type</span>{{/if}}
|
||||
{{#if type.name}}{{type.name}} offers{{else}}<span class="red">Unknown type</span>{{/if}}
|
||||
</PowerSelect>
|
||||
</div>
|
||||
</div>
|
||||
@ -25,10 +25,16 @@
|
||||
|
||||
<section class="view-container">
|
||||
|
||||
{{#if this.offersExist}}
|
||||
{{#if (and this.offersExist this.filteredOffers.length)}}
|
||||
<table class="gh-list gh-offers-list">
|
||||
<tr class="gh-list-row header">
|
||||
<th class="gh-list-header">{{this.offersList.length}} offers</th>
|
||||
<th class="gh-list-header">
|
||||
{{#if (eq this.selectedType.value "active")}}
|
||||
{{gh-pluralize this.filteredOffers.length "active offer"}}
|
||||
{{else}}
|
||||
{{gh-pluralize this.filteredOffers.length "archived offer"}}
|
||||
{{/if}}
|
||||
</th>
|
||||
<th class="gh-list-header">Tier</th>
|
||||
<th class="gh-list-header">Terms</th>
|
||||
<th class="gh-list-header">Redemptions</th>
|
||||
@ -75,52 +81,65 @@
|
||||
{{/each}}
|
||||
</table>
|
||||
{{else}}
|
||||
<div class="gh-offers-list-cta">
|
||||
{{svg-jar "discount-bubble" class="discount-bubble"}}
|
||||
<h4>Provide special offers to new signups</h4>
|
||||
<p>
|
||||
Boost your subscriptions by creating targeted discounts to potential members.
|
||||
</p>
|
||||
<LinkTo @route="offer.new" class="gh-btn gh-btn-green gh-btn-icon">
|
||||
<span>{{svg-jar "add"}} Add offer</span>
|
||||
</LinkTo>
|
||||
{{#if (eq this.selectedType.value "active")}}
|
||||
<div class="gh-offers-list-cta">
|
||||
{{svg-jar "discount-bubble" class="discount-bubble"}}
|
||||
<h4>Provide special offers to new signups</h4>
|
||||
<p>
|
||||
Boost your subscriptions by creating targeted discounts to potential members.
|
||||
</p>
|
||||
<LinkTo @route="offer.new" class="gh-btn gh-btn-green gh-btn-icon">
|
||||
<span>{{svg-jar "add"}} Add offer</span>
|
||||
</LinkTo>
|
||||
</div>
|
||||
{{else}}
|
||||
<div class="no-posts-box">
|
||||
<div class="no-posts">
|
||||
<h3>You have no archived offers.</h3>
|
||||
<LinkTo @route="offers" @query={{hash type=null author=null tag=null}} class="gh-btn gh-btn-lg">
|
||||
<span>Show active offers</span>
|
||||
</LinkTo>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
||||
{{#if (eq this.selectedType.value "active")}}
|
||||
<div class="gh-main-section gh-offers-help">
|
||||
<h2 class="gh-main-section-header small bn">Get the most out of offers</h2>
|
||||
<div class="gh-main-section-block">
|
||||
<div class="gh-main-section-content grey">
|
||||
<a href="https://ghost.org/resources" target="_blank" class="gh-offers-help-card">
|
||||
<div>
|
||||
<div class="thumbnail" style="background-image: url(assets/img/dashboard/bp1.jpg);"></div>
|
||||
<h3>Discounts right on the beat</h3>
|
||||
<p>Setting up the right timing for your offers is as critical as finding the right amount.</p>
|
||||
</div>
|
||||
<div class="gh-btn"><span>Read more</span></div>
|
||||
</a>
|
||||
|
||||
<a href="https://ghost.org/resources" target="_blank" class="gh-offers-help-card">
|
||||
<div>
|
||||
<div class="thumbnail" style="background-image: url(assets/img/dashboard/bp2.jpg);"></div>
|
||||
<h3>How The Browser grow their audience with special offers</h3>
|
||||
<p>Learn about how The Browser work with offers</p>
|
||||
</div>
|
||||
<div class="gh-btn"><span>Read more</span></div>
|
||||
</a>
|
||||
|
||||
<a href="https://ghost.org/resources" target="_blank" class="gh-offers-help-card">
|
||||
<div>
|
||||
<div class="thumbnail" style="background-image: url(assets/img/dashboard/join-community.jpg)"></div>
|
||||
<h3>Read more about offers</h3>
|
||||
<p>Check out the Ghost blog for more tips about how offers can boost your subscriptions.</p>
|
||||
</div>
|
||||
<div class="gh-btn"><span>Read more</span></div>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
<div class="gh-main-section gh-offers-help">
|
||||
<h2 class="gh-main-section-header small bn">Get the most out of offers</h2>
|
||||
<div class="gh-main-section-block">
|
||||
<div class="gh-main-section-content grey">
|
||||
<a href="https://ghost.org/resources" target="_blank" class="gh-offers-help-card">
|
||||
<div>
|
||||
<div class="thumbnail" style="background-image: url(assets/img/dashboard/bp1.jpg);"></div>
|
||||
<h3>Discounts right on the beat</h3>
|
||||
<p>Setting up the right timing for your offers is as critical as finding the right amount.</p>
|
||||
</div>
|
||||
<div class="gh-btn"><span>Read more</span></div>
|
||||
</a>
|
||||
|
||||
<a href="https://ghost.org/resources" target="_blank" class="gh-offers-help-card">
|
||||
<div>
|
||||
<div class="thumbnail" style="background-image: url(assets/img/dashboard/bp2.jpg);"></div>
|
||||
<h3>How The Browser grow their audience with special offers</h3>
|
||||
<p>Learn about how The Browser work with offers</p>
|
||||
</div>
|
||||
<div class="gh-btn"><span>Read more</span></div>
|
||||
</a>
|
||||
|
||||
<a href="https://ghost.org/resources" target="_blank" class="gh-offers-help-card">
|
||||
<div>
|
||||
<div class="thumbnail" style="background-image: url(assets/img/dashboard/join-community.jpg)"></div>
|
||||
<h3>Read more about offers</h3>
|
||||
<p>Check out the Ghost blog for more tips about how offers can boost your subscriptions.</p>
|
||||
</div>
|
||||
<div class="gh-btn"><span>Read more</span></div>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
</section>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user