src/app/common/components/badges/badges.component.html

@@ -28,4 +28,11 @@
  Founder
  </m-tooltip>
  </li>
+
+ <li *ngIf="showOnchainBadge()" routerLink="/tokens">
+ <m-tooltip icon="link" [iconClass]="{'selected': true }" i18n="Boosted OnChain in the last 7 days">
+ Boosted OnChain in the last 7 days
+ </m-tooltip>
+ </li>
+
 </ul>

src/app/common/components/badges/badges.component.scss

@@ -8,7 +8,7 @@
 
  li{
  display: flex;
- flex: 1;
+ //flex: 1;
  flex-direction: column;
  align-items: center;
  //padding: 16px;
@@ -16,8 +16,8 @@
  }
 
  i{
- font-size:28px;
- padding:8px;
+ font-size: 24px;
+ padding: 0 4px;
 
  &.admin__badge {
  @include m-theme(){

src/app/common/components/badges/badges.component.ts

@@ -22,7 +22,7 @@ export interface SocialProfileMeta {
 export class ChannelBadgesComponent {
 
  @Input() user;
- @Input() badges: Array<string> = [ 'verified', 'plus', 'founder', 'admin' ];
+ @Input() badges: Array<string> = [ 'verified', 'plus', 'founder', 'admin', 'onchain_booster' ];
 
  constructor(public session: Session, private client: Client, private router: Router) { }
 
@@ -84,4 +84,10 @@ export class ChannelBadgesComponent {
  });
  }
 
+ showOnchainBadge() { 
+ return this.user.onchain_booster
+ && this.user.onchain_booster * 1000 > Date.now() 
+ && this.badges.indexOf('onchain_booster') > -1;
+ }
+
 }

src/app/modules/boost/creator/creator.component.scss

@@ -384,7 +384,7 @@
 
  .m-boost--creator-section-submit--network {
  @media screen and (min-width: 780px) {
- margin-top: -56px; //-72px once onchain badges ready
+ margin-top: -72px;
  }
  }
 

src/app/modules/boost/creator/payment-methods/payment-methods.component.html

@@ -40,7 +40,7 @@
  <li>Max 10k per boost</li>
  <li>Stored on the blockchain</li>
  <li>Stand out in the feeds</li>
- <li *ngIf="false">Gain "OnChain" badge</li>
+ <li>Gain "OnChain" badge</li>
  </ul>
 
  <span class="m-boost--creator-selector--selected-label" i18n="@@M__COMMON__SELECTED">Selected</span>
@@ -81,7 +81,7 @@
  <li>Max 5k per boost</li>
  <li>Stored on Minds servers</li>
  <li>No transaction fee</li>
- <li *ngIf="false" style="list-style:none">&nbsp;</li>
+ <li style="list-style:none">&nbsp;</li>
  </ul>
 
  <span class="m-boost--creator-selector--selected-label" i18n="@@M__COMMON__SELECTED">Selected</span>

src/app/modules/channels/channel.component.scss

@@ -172,6 +172,14 @@ m-channel{
  margin-right: 8px;
  }
 
+ > *:last-child {
+ margin-right: 0;
+ }
+
+ .m-channel--badges {
+ min-width: 124px;
+ }
+
  .m-channel--edit-button-wrapper {
  flex-shrink: 0;
  }