src/app/common/components/overlay-modal/overlay-modal.component.scss

@@ -107,7 +107,7 @@
 
  &:active {
  @include m-theme(){
- color: themed($m-grey-100);
+ color: themed($m-grey-200);
  }
  }
 

src/app/common/layout/v2-topbar/user-menu.component.html

@@ -19,7 +19,7 @@
  (click)="closeMenu()"
  >
  <a [routerLink]="['/', getCurrentUser()?.username]">
- <i class="material-icons">people</i>
+ <i class="material-icons">person</i>
  <span i18n>View Channel</span>
  </a>
  </li>
@@ -46,6 +46,17 @@
  </a>
  </li>
 
+ <li
+ class="m-dropdownList__item m-user-menuDropdown__Item"
+ *ngIf="getCurrentUser()"
+ (click)="closeMenu()"
+ >
+ <a [routerLink]="['/wallet/tokens/referrals']">
+ <i class="material-icons">people</i>
+ <span i18n>Refer Friends</span>
+ </a>
+ </li>
+
  <li
  class="m-dropdownList__item m-user-menuDropdown__Item"
  *ngIf="getCurrentUser()"

src/app/common/layout/v2-topbar/user-menu.component.scss

@@ -4,10 +4,6 @@ m-user-menu {
  cursor: pointer;
 }
 
-.m-user-menu__Anchor {
- // cursor: pointer;
-}
-
 .m-user-menu__Dropdown {
  list-style: none;
  margin: 34px 0 0;
@@ -18,7 +14,7 @@ m-user-menu {
 
  li:hover {
  @include m-theme(){
- background-color: themed($m-grey-50);
+ background-color: rgba(themed($m-grey-50), 0.5);
  }
  }
 

src/app/common/pipes/tags.spec.ts

@@ -79,6 +79,36 @@ describe('TagPipe', () => {
  expect(transformedString).toContain('<a class="tag"');
  });
 
+ it('should transform when @ followed by `.com`', () => {
+ const pipe = new TagsPipe(featuresServiceMock);
+ const string = 'textstring @name.com';
+ const transformedString = pipe.transform(<any>string);
+ expect(transformedString).toContain('<a class="tag"');
+ expect(transformedString).toContain('@name.com');
+ });
+
+ it('should transform two adjacent tags', () => {
+ const pipe = new TagsPipe(featuresServiceMock);
+ const string = '@test1 @test2';
+ const transformedString = pipe.transform(<any>string);
+ expect(transformedString).toEqual('<a class="tag" href="/test1" target="_blank">@test1</a> <a class="tag" href="/test2" target="_blank">@test2</a>');
+ });
+
+ fit('should transform many adjacent tags', () => {
+ const pipe = new TagsPipe(featuresServiceMock);
+ const string = '@test1 @test2 @test3 @test4 @test5 @test6 @test7 @test8 @test9 @test10 @test11 @test12 @test13 @test14 @test15';
+ console.log(string);
+ const transformedString = pipe.transform(<any>string);
+ expect(transformedString).toEqual(`<a class="tag" href="/test1" target="_blank">@test1</a> <a class="tag" href="/test2" target="_blank">@test2</a> `
+ + `<a class="tag" href="/test3" target="_blank">@test3</a> <a class="tag" href="/test4" target="_blank">@test4</a> `
+ + `<a class="tag" href="/test5" target="_blank">@test5</a> <a class="tag" href="/test6" target="_blank">@test6</a> `
+ + `<a class="tag" href="/test7" target="_blank">@test7</a> <a class="tag" href="/test8" target="_blank">@test8</a> `
+ + `<a class="tag" href="/test9" target="_blank">@test9</a> <a class="tag" href="/test10" target="_blank">@test10</a> `
+ + `<a class="tag" href="/test11" target="_blank">@test11</a> <a class="tag" href="/test12" target="_blank">@test12</a> `
+ + `<a class="tag" href="/test13" target="_blank">@test13</a> <a class="tag" href="/test14" target="_blank">@test14</a> `
+ + `<a class="tag" href="/test15" target="_blank">@test15</a>`);
+ });
+
  it('should transform to an email', () => {
  const pipe = new TagsPipe(featuresServiceMock);
  const string = 'textstring@name.com';
@@ -90,7 +120,6 @@ describe('TagPipe', () => {
  const pipe = new TagsPipe(featuresServiceMock);
  const string = 'textstring name';
  const transformedString = pipe.transform(<any>string);
-
  expect(transformedString).toEqual(string);
  expect(transformedString).not.toContain('<a class="tag"');
  });

src/app/common/pipes/tags.ts

@@ -39,7 +39,7 @@ export class TagsPipe implements PipeTransform {
  }
  },
  at: {
- rule: /(^|\s|\W)@(\w*[a-zA-Z_-]+\w*)/gim,
+ rule: /(^|\W|\s)@([a-z0-9_\-\.]+[a-z0-9_])/gmi,
  replace: (m) => {
  return `${m.match[1]}<a class="tag" href="/${m.match[2]}" target="_blank">@${m.match[2]}</a>`;
  }

src/app/controllers/admin/boosts/boosts.html

 <div class="mdl-tabs__tab-bar">
-  <a [routerLink]="['/admin/boosts/newsfeed']" class="mdl-tabs__tab" [ngClass]="{'is-active': type == 'newsfeed'}" i18n="@@MINDS__ADMIN__BOOSTS__NEWSFEED_TAB">Newsfeed ({{newsfeed_count}})</a>
-  <a [routerLink]="['/admin/boosts/content']" class="mdl-tabs__tab" [ngClass]="{'is-active': type == 'content'}" i18n="@@MINDS__ADMIN__BOOSTS__CONTENT_TAB">Content ({{content_count}})</a>
+ <a [routerLink]="['/admin/boosts/newsfeed']" class="mdl-tabs__tab" [ngClass]="{'is-active': type == 'newsfeed'}" i18n="@@MINDS__ADMIN__BOOSTS__NEWSFEED_TAB">Newsfeed ({{newsfeed_count}})</a>
+ <a [routerLink]="['/admin/boosts/content']" class="mdl-tabs__tab" [ngClass]="{'is-active': type == 'content'}" i18n="@@MINDS__ADMIN__BOOSTS__CONTENT_TAB">Content ({{content_count}})</a>
 </div>
 
 <div class="mdl-grid mdl-card mdl-shadow--4dp m-admin-boosts-statistics"
@@ -98,7 +98,8 @@
  </div>
 
 </div>
-<m--rejection-reason-modal #reasonModal
+<m--rejection-reason-modal
+ #reasonModal
  *ngIf="reasonModalOpened"
  [boost]="selectedBoost"
  [closeAfterAction]="true"

src/app/controllers/admin/boosts/boosts.spec.ts

@@ -11,6 +11,8 @@ import { MaterialSliderMock } from '../../../../tests/material-slider.mock.spec'
 import { CommonModule as NgCommonModule } from '@angular/common';
 import { RouterTestingModule } from '@angular/router/testing';
 import { TokenPipe } from '../../../common/pipes/token.pipe';
+import { OverlayModalService } from "../../../services/ux/overlay-modal";
+import { overlayModalServiceMock } from "../../../../tests/overlay-modal-service-mock.spec";
 
 @Component({
  selector: 'minds-card-video',
@@ -124,7 +126,8 @@ describe('AdminBoosts', () => {
  FormsModule
  ],
  providers: [
- { provide: Client, useValue: clientMock }
+ { provide: Client, useValue: clientMock },
+ { provide: OverlayModalService, useValue: overlayModalServiceMock }
  ]
  })
  .compileComponents(); // compile template and css

src/app/controllers/admin/boosts/boosts.ts

@@ -6,6 +6,8 @@ import { Subscription } from 'rxjs';
 import { Client } from '../../../services/api';
 import { RejectionReasonModalComponent } from './modal/rejection-reason-modal.component';
 import { Reason, rejectionReasons } from './rejection-reasons';
+import { ReportCreatorComponent } from "../../../modules/report/creator/creator.component";
+import { OverlayModalService } from "../../../services/ux/overlay-modal";
 
 @Component({
  moduleId: module.id,
@@ -34,9 +36,15 @@ export class AdminBoosts {
 
  paramsSubscription: Subscription;
 
+ readonly NON_REPORTABLE_REASONS = [7, 8, 12, 13]; // spam, appeals, onchain payment failed, original post removed
+
  @ViewChild('reasonModal', { static: false }) modal: RejectionReasonModalComponent;
 
- constructor(public client: Client, private route: ActivatedRoute) {
+ constructor(
+ public client: Client,
+ private overlayModal: OverlayModalService,
+ private route: ActivatedRoute,
+ ) {
  }
 
  ngOnInit() {
@@ -125,6 +133,10 @@ export class AdminBoosts {
 
  this.reasonModalOpened = false;
 
+ if (this.NON_REPORTABLE_REASONS.indexOf(boost.rejection_reason) === -1) {
+ this.report(this.selectedBoost);
+ }
+
  this.client.post('api/v1/admin/boosts/' + this.type + '/' + boost.guid + '/reject', { reason: boost.rejection_reason });
  this.pop(boost);
  }
@@ -146,6 +158,15 @@ export class AdminBoosts {
  this.reject(boost);
  }
 
+ report(boost: any = null) {
+ if (!boost) {
+ boost = this.boosts[0];
+ }
+
+ this.overlayModal.create(ReportCreatorComponent, boost.entity)
+ .present();
+ }
+
  /**
  * Remove an entity from the list
  */
@@ -171,7 +192,7 @@ export class AdminBoosts {
 
  // numbers
 
- switch(e.key.toLowerCase()) {
+ switch (e.key.toLowerCase()) {
  case '1':
  case '2':
  case '3':

src/app/modules/comments/poster/poster.component.ts

@@ -78,6 +78,7 @@ export class CommentPosterComponent {
  this.inProgress = true;
 
  if (!this.content && !this.attachment.has()) {
+ this.inProgress = false;
  return;
  }
 

src/app/modules/forms/login/login.html

@@ -37,6 +37,11 @@
  i18n="@@MINDS__LOGIN__EXCEPTION__INVALID_TOKEN">
  Invalid token
  </ng-container>
+ <ng-container
+ *ngIf="errorMessage == 'LoginException::EmailAddress'"
+ i18n="@@MINDS__LOGIN__EXCEPTION__ENTERED_EMAIL_ADDRESS_NOT_USERNAME">
+ Please enter a username instead of an email address.
+ </ng-container>
  <ng-container
  *ngIf="errorMessage == 'LoginException::Unknown'"
  i18n="@@MINDS__LOGIN__EXCEPTION__SORRY_THERE_WAS_AN_ERROR_PLEASE_TRY_AGAIN">

src/app/modules/forms/login/login.spec.ts

@@ -28,8 +28,8 @@ describe('LoginForm', () => {
  let twoFactorLoginButton: DebugElement;
  let session: Session;
 
- function login(response) {
- username.nativeElement.value = 'username';
+ function login(response, _username = 'username') {
+ username.nativeElement.value = _username;
  username.nativeElement.dispatchEvent(new Event('input'));
  password.nativeElement.value = 'password';
  password.nativeElement.dispatchEvent(new Event('input'));
@@ -229,6 +229,7 @@ describe('LoginForm', () => {
  expect(loginForm.nativeElement.hidden).toBeTruthy();
  expect(twoFactorForm.nativeElement.hidden).toBeFalsy();
  }));
+
  it('should spawn error message when incorrect code is written', fakeAsync(() => {
  login({ 'status': 'error', 'code': '403', 'message': 'imaprettymessage' });
 
@@ -237,6 +238,12 @@ describe('LoginForm', () => {
  expect(errorMessage.nativeElement.hidden).toBeFalsy();
  }));
 
+ it('should spawn error message when an email is entered as a username', fakeAsync(() => {
+ username.nativeElement.value = 'test@minds.com';
+ login({ 'status': 'error'}, 'test@minds.com');
+ expect(errorMessage.nativeElement.hidden).toBeFalsy();
+ }));
+
  it('should login successfully', fakeAsync(() => {
  login({ 'status': 'error', 'code': '403', 'message': 'imaprettymessage' });
 

src/app/modules/forms/login/login.ts

@@ -4,7 +4,6 @@ import { FormGroup, FormBuilder, Validators } from '@angular/forms';
 import { Client } from '../../../services/api';
 import { Session } from '../../../services/session';
 
-
 @Component({
  moduleId: module.id,
  selector: 'minds-form-login',
@@ -13,7 +12,6 @@ import { Session } from '../../../services/session';
 })
 
 export class LoginForm {
-
  errorMessage: string = '';
  twofactorToken: string = '';
  hideLogin: boolean = false;
@@ -25,6 +23,9 @@ export class LoginForm {
 
  done: EventEmitter<any> = new EventEmitter();
  doneRegistered: EventEmitter<any> = new EventEmitter();
+ 
+ //Taken from advice in https://stackoverflow.com/a/1373724
+ private emailRegex: RegExp = new RegExp("[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?");
 
  constructor(public session: Session, public client: Client, fb: FormBuilder, private zone: NgZone) {
 
@@ -39,12 +40,17 @@ export class LoginForm {
  if (this.inProgress)
  return;
 
+ let username = this.form.value.username.trim();
+ if (this.emailRegex.test(username)) {
+ this.errorMessage = 'LoginException::EmailAddress';
+ return;
+ }
  //re-enable cookies
  document.cookie = 'disabled_cookies=; expires=Thu, 01 Jan 1970 00:00:01 GMT;';
 
  this.errorMessage = '';
  this.inProgress = true;
- this.client.post('api/v1/authenticate', { username: this.form.value.username.trim(), password: this.form.value.password })
+ this.client.post('api/v1/authenticate', { username: username, password: this.form.value.password })
  .then((data: any) => {
  // TODO: [emi/sprint/bison] Find a way to reset controls. Old implementation throws Exception;
  this.inProgress = false;

src/app/modules/messenger/encryption/encryption.component.html

@@ -19,7 +19,7 @@
 
 <div class="m-messenger--encryption-setup m-messenger--encryption-rekey" *ngIf="encryption.reKeying">
  <p class="mdl-color-text--grey-400 m-messenger-encryption-setup-note">
- <ng-container i18n="@@MESSENGER__ENCRYPTION__CHANGING_PWD_NOTE">Changing your encryption password will cause your previous messages to be unreadable. </ng-container>
+ <ng-container i18n="@@MESSENGER__ENCRYPTION__CHANGING_PWD_NOTE">Changing your encryption password will cause your previous messages to be unreadable.</ng-container>
  <a class="mdl-color-text--blue-grey-300" (click)="encryption.reKeying = false" i18n="@@MESSENGER__ENCRYPTION__CANCEL_ACTION">Cancel</a>
  </p>
  <p [hidden]="!error" class="m-messenger--error mdl-color-text--red">{{error}}</p>

src/app/modules/messenger/encryption/encryption.component.scss

@@ -23,13 +23,13 @@
  font-size: 11px;
  line-height: 1.35;
  margin: 0;
- padding: $minds-padding;
+ padding: 8px 12px;
  }
  .m-messenger--encryption-setup-help {
  font-size: 11px;
  line-height: 1.35;
  margin: 0;
- padding: $minds-padding;
+ padding: 8px 12px;
  @include m-theme(){
  color: themed($m-blue-grey-700);
  }

src/app/modules/messenger/userlist/userlist.component.ts

@@ -28,7 +28,7 @@ export class MessengerUserlist {
  hasMoreData: boolean = true;
  inProgress: boolean = false;
  cb: number = Date.now();
- ribbonOpened: boolean = false;
+
  minds: Minds = window.Minds;
  storage: Storage = new Storage();
 
@@ -37,7 +37,8 @@ export class MessengerUserlist {
  };
 
  userListToggle: boolean = false;
-
+ ribbonOpened: boolean = false;
+ 
  search_timeout;
 
  constructor(

src/app/modules/modals/modal.scss

@@ -73,27 +73,34 @@ m-modal-signup, m-modal-signup-on-action{
  & > button {
  margin-left: $minds-padding;
  }
-
- @media screen and (max-width: $min-tablet) {
- & {
- padding: 16px 0;
- }
- }
  }
 
  .m-modal-signup-apps{
  display:flex;
  flex-flow:row nowrap;
  align-items:center;
- padding:0 40px;
  width: 100%;
  box-sizing: border-box;
+ padding: 0 40px;
+ @media screen and (max-width: $max-mobile) {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: center;
+ padding: 0 30px;
+ }
+ 
+ .m-androidApp__download {
+ margin: 0;
+ }
 
  a{
- flex:1;
+ @media screen and (min-width: $max-mobile) {
+ flex:1;
+ }
  margin:$minds-margin/2;
+
  img{
- width:100%;
+ min-width: 130px;
  }
  }
  }

src/app/modules/notifications/notification.component.html

@@ -9,11 +9,26 @@
  <!-- subscribed -->
  <ng-template ngSwitchCase="friends">
  <a [routerLink]="['/', notification.fromObj.username || '']">
- <p *ngIf="notification.fromObj.subscribed" i18n="@@NOTIFICATIONS__NOTIFICATION__FRIENDS_MATCH">You have a match! {{notification.fromObj.name}} subscribed to you</p>
- <p *ngIf="!notification.fromObj.subscribed" i18n="@@NOTIFICATIONS__NOTIFICATION__FRIENDS">{{notification.fromObj.name}} subscribed to you</p>
+ <p *ngIf="notification.fromObj.subscribed" i18n="@@NOTIFICATIONS__NOTIFICATION__FRIENDS_MATCH">You have a match! <span class="pseudo-link mdl-color-text--blue-grey-400">{{notification.fromObj.name}}</span> subscribed to you</p>
+ <p *ngIf="!notification.fromObj.subscribed" i18n="@@NOTIFICATIONS__NOTIFICATION__FRIENDS"><span class="pseudo-link mdl-color-text--blue-grey-400">{{notification.fromObj.name}}</span> subscribed to you</p>
  </a>
  </ng-template>
 
+ <!-- referral pending -->
+ <ng-template ngSwitchCase="referral_pending">
+ <a [routerLink]="['/wallet/tokens/referrals']">
+ <p i18n="@@NOTIFICATIONS__NOTIFICATION__FRIENDS_MATCH">You have a pending referral! <span class="pseudo-link mdl-color-text--blue-grey-400">{{notification.fromObj.name}}</span> used your referral link when they signed up for Minds. You'll get tokens once they set up their wallet.</p>
+ </a>
+ </ng-template>
+
+ <!-- referral complete -->
+ <ng-template ngSwitchCase="referral_complete">
+ <a [routerLink]="['/wallet/tokens/referrals']">
+ <p i18n="@@NOTIFICATIONS__NOTIFICATION__FRIENDS_MATCH">You've earned tokens for the completed referral of <span class="pseudo-link mdl-color-text--blue-grey-400">{{notification.fromObj.name}}</span></p>
+ </a>
+ </ng-template>
+
+
  <!-- group inivite -->
  <ng-template ngSwitchCase="group_invite">
  <a [routerLink]="['/groups/profile', notification.params.group.guid]">

src/app/modules/settings/settings.component.html

@@ -87,8 +87,7 @@
  <a class="m-page--sidebar--navigation--item"
  (click)="openReferralsModal()" 
  >
- <!-- <m-referrals--modal #referrals></m-referrals--modal> -->
- <i class="material-icons">assignment</i>
+ <i class="material-icons">people</i>
  <span i18n="@@M__ACTION__REFERRAL_LINK">Referrals</span>
  </a>
  </div>

src/app/modules/wallet/balances/balance.component.scss

@@ -26,6 +26,7 @@ m-wallet--balance-money, m-wallet--balance-reward, m-wallet--balance-tokens {
  h2 {
  text-align: center;
  font-weight: 600;
+ margin-top: 8px;
  @include m-theme(){
  color: themed($m-blue);
  }

src/app/modules/wallet/tokens/contributions/chart.component.html

@@ -28,48 +28,14 @@
  </div>
  </div>
  <div class="m-token-contributions--chart--contribution">
- <i class="material-icons">share</i>
+ <i class="material-icons">people</i>
  <div class="m-token-contributions--chart--contribution-text">
  <span>Referrals</span>
  <span>+10</span>
  </div>
  </div>
  <div class="m-token-contributions--chart--contribution">
- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" width="512px" height="512px" viewBox="0 0 457.03 457.03" style="enable-background:new 0 0 457.03 457.03;" xml:space="preserve">
- <g>
- <path d="M421.512,207.074l-85.795,85.767c-47.352,47.38-124.169,47.38-171.529,0c-7.46-7.439-13.296-15.821-18.421-24.465 l39.864-39.861c1.895-1.911,4.235-3.006,6.471-4.296c2.756,9.416,7.567,18.33,14.972,25.736c23.648,23.667,62.128,23.634,85.762,0 l85.768-85.765c23.666-23.664,23.666-62.135,0-85.781c-23.635-23.646-62.105-23.646-85.768,0l-30.499,30.532 c-24.75-9.637-51.415-12.228-77.373-8.424l64.991-64.989c47.38-47.371,124.177-47.371,171.557,0 C468.869,82.897,468.869,159.706,421.512,207.074z M194.708,348.104l-30.521,30.532c-23.646,23.634-62.128,23.634-85.778,0 c-23.648-23.667-23.648-62.138,0-85.795l85.778-85.767c23.665-23.662,62.121-23.662,85.767,0 c7.388,7.39,12.204,16.302,14.986,25.706c2.249-1.307,4.56-2.369,6.454-4.266l39.861-39.845 c-5.092-8.678-10.958-17.03-18.421-24.477c-47.348-47.371-124.172-47.371-171.543,0L35.526,249.96 c-47.366,47.385-47.366,124.172,0,171.553c47.371,47.356,124.177,47.356,171.547,0l65.008-65.003 C246.109,360.336,219.437,357.723,194.708,348.104z" fill="#5f7d8b"/>
- </g>
- <g>
- </g>
- <g>
- </g>
- <g>
- </g>
- <g>
- </g>
- <g>
- </g>
- <g>
- </g>
- <g>
- </g>
- <g>
- </g>
- <g>
- </g>
- <g>
- </g>
- <g>
- </g>
- <g>
- </g>
- <g>
- </g>
- <g>
- </g>
- <g>
- </g>
- </svg>
+ <i class="material-icons">link</i>
  <div class="m-token-contributions--chart--contribution-text">
  <span>OnChain Transactions</span>
  <span>+10 (receiver)</span>

src/app/modules/wallet/tokens/contributions/chart.component.scss

@@ -36,6 +36,13 @@
  @include m-theme(){
  color: themed($m-blue-grey-600);
  }
+
+ path {
+ @include m-theme(){
+ fill: themed($m-blue-grey-600);
+ }
+ }
+
  }
 
  .m-token-contributions--chart--contribution-text {

src/app/modules/wallet/tokens/referrals/dashboard/dashboard.component.scss

@@ -53,8 +53,6 @@
  overflow: hidden;
  white-space: nowrap;
  height: 32px;
-
-
  }
  .m-referrals-dashboard__userCol {
  min-width: 130px; 

src/app/modules/wallet/tokens/referrals/links/links.component.html

@@ -18,23 +18,6 @@
  </div>
  </div>
 
-
-
- <!-- <div class="m-referrals-links__copyableLink m-border" [class.focused]="registerUrlFocused"
- (click)="applyFocus(registerUrlEl, 'registerUrl')" 
- > 
- <div (click)="copyToClipboard(registerUrlEl, 'registerUrl')" class="m-referrals-links__copyableLinkButton">
- <div i18n="@@M_REFERRALS__LINKS_COPY_ACTION" *ngIf="!registerUrlRecentlyCopied">Copy</div>
- <div i18n="@@M_REFERRALS__LINKS_COPY_STATE" *ngIf="registerUrlRecentlyCopied">Copied</div>
- </div>
- <input class="m-referrals-links__copyableLinkText" 
- [class.recentlyCopied]="registerUrlRecentlyCopied"
- readonly tabindex="-1"
- (focus)="registerUrlFocused"
- (focusout)="registerUrlFocused = false"
- value="{{registerUrl}}" #registerUrlEl>
- </div> -->
- 
  <p i18n="@@M_REFERRALS__LINKS_REFERRER_PARAM_DESC">You can also get referrals by adding this code to the end of any Minds link you share</p>
  <div class="m-referrals-links__copyableLink m-border" [class.focused]="referrerParamFocused"
  (click)="applyFocus(referrerParamEl, 'referrerParam')" 
@@ -59,7 +42,7 @@
  (click)="openTwitter()"
  >
  <svg viewBox="0 0 24 24">
- <path d="M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.798-1.574 2.165-2.724-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.179 0-5.515 2.966-4.797 6.045-4.091-.205-7.719-2.165-10.148-5.144-1.29 2.213-.669 5.108 1.523 6.574-.806-.026-1.566-.247-2.229-.616-.054 2.281 1.581 4.415 3.949 4.89-.693.188-1.452.232-2.224.084.626 1.956 2.444 3.379 4.6 3.419-2.07 1.623-4.678 2.348-7.29 2.04 2.179 1.397 4.768 2.212 7.548 2.212 9.142 0 14.307-7.721 13.995-14.646.962-.695 1.797-1.562 2.457-2.549z" fill-rule="evenodd"></path> 
+  <path d="M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.798-1.574 2.165-2.724-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.179 0-5.515 2.966-4.797 6.045-4.091-.205-7.719-2.165-10.148-5.144-1.29 2.213-.669 5.108 1.523 6.574-.806-.026-1.566-.247-2.229-.616-.054 2.281 1.581 4.415 3.949 4.89-.693.188-1.452.232-2.224.084.626 1.956 2.444 3.379 4.6 3.419-2.07 1.623-4.678 2.348-7.29 2.04 2.179 1.397 4.768 2.212 7.548 2.212 9.142 0 14.307-7.721 13.995-14.646.962-.695 1.797-1.562 2.457-2.549z" fill-rule="evenodd"></path> 
  </svg>
  </button> 
  
@@ -67,7 +50,7 @@
  (click)="openFacebook()"
  >
  <svg viewBox="0 0 32 32">
- <path d="m8 14.41v-4.17c0-.42.35-.81.77-.81h2.52v-2.08c0-4.84 2.48-7.31 7.42-7.35 1.65 0 3.22.21 4.69.64.46.14.63.42.6.88l-.56 4.06c-.04.18-.14.35-.32.53-.21.11-.42.18-.63.14-.88-.25-1.78-.35-2.8-.35-1.4 0-1.61.28-1.61 1.73v1.8h4.52c.42 0 .81.42.81.88l-.35 4.17c0 .42-.35.71-.77.71h-4.21v16c0 .42-.35.81-.77.81h-5.21c-.42 0-.8-.39-.8-.81v-16h-2.52a.78.78 0 0 1 -.78-.77" fill-rule="evenodd"></path>
+  <path d="m8 14.41v-4.17c0-.42.35-.81.77-.81h2.52v-2.08c0-4.84 2.48-7.31 7.42-7.35 1.65 0 3.22.21 4.69.64.46.14.63.42.6.88l-.56 4.06c-.04.18-.14.35-.32.53-.21.11-.42.18-.63.14-.88-.25-1.78-.35-2.8-.35-1.4 0-1.61.28-1.61 1.73v1.8h4.52c.42 0 .81.42.81.88l-.35 4.17c0 .42-.35.71-.77.71h-4.21v16c0 .42-.35.81-.77.81h-5.21c-.42 0-.8-.39-.8-.81v-16h-2.52a.78.78 0 0 1 -.78-.77" fill-rule="evenodd"></path>
  </svg>
  </button> 
  
@@ -76,7 +59,7 @@
  (click)="openMessenger()"
  >
  <svg viewBox="0 0 32 32">
- <path d="m17.59 19.95-4.07-4.35-7.95 4.35 8.74-9.28 4.17 4.35 7.85-4.35zm-1.59-19.95c-8.84 0-16 6.63-16 14.82 0 4.66 2.33 8.82 5.96 11.54v5.64l5.45-2.99a17.24 17.24 0 0 0 4.59.62c8.84 0 16-6.63 16-14.82 0-8.18-7.16-14.81-16-14.80z" fill-rule="evenodd"></path>
+  <path d="m17.59 19.95-4.07-4.35-7.95 4.35 8.74-9.28 4.17 4.35 7.85-4.35zm-1.59-19.95c-8.84 0-16 6.63-16 14.82 0 4.66 2.33 8.82 5.96 11.54v5.64l5.45-2.99a17.24 17.24 0 0 0 4.59.62c8.84 0 16-6.63 16-14.82 0-8.18-7.16-14.81-16-14.80z" fill-rule="evenodd"></path>
  </svg>
  </button>
  
@@ -93,7 +76,7 @@
  (click)="openSMS()"
  >
  <svg viewBox="0 0 32 32">
- <path d="m23.5 16.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3m-7.5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3m-7.5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3m7.5-14.5c-8.82 0-16 5.94-16 13.32 0 2.9 1.12 5.64 3.14 7.92l-.43 6.23a.5.5 0 0 0 .69.5l6.08-2.51c1.99.78 4.21 1.19 6.52 1.19 8.82 0 16-5.94 16-13.32s-7.18-13.33-16-13.32" fill-rule="evenodd"></path>
+  <path d="m23.5 16.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3m-7.5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3m-7.5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3m7.5-14.5c-8.82 0-16 5.94-16 13.32 0 2.9 1.12 5.64 3.14 7.92l-.43 6.23a.5.5 0 0 0 .69.5l6.08-2.51c1.99.78 4.21 1.19 6.52 1.19 8.82 0 16-5.94 16-13.32s-7.18-13.33-16-13.32" fill-rule="evenodd"></path>
  </svg>
  </button>
  
@@ -101,7 +84,7 @@
  (click)= "openEmail()"
  >
  <svg viewBox="0 0 32 32">
- <path d="m17.42 18.99c.14-.12.86-.76 2.08-1.86l10.43 8.66h-27.76l10.35-8.67c1.24 1.1 1.98 1.74 2.12 1.85.83.65 1.93.63 2.78.02m11.89-10.67-4.83 4.34c-1.51 1.35-2.8 2.51-3.86 3.46l10.35 8.6c.01.01.01.02.02.03v-17.81c0-.04-.02-.07-.02-.11a3.73 3.73 0 0 0 -.08.07zm-25.19-.7a5347.74 5347.74 0 0 0 4.69 4.19c3.94 3.52 6.51 5.79 6.75 5.97a.76.76 0 0 0 .92.03c.21-.18 2.82-2.52 7.01-6.28l4.82-4.33 1.35-1.21h-27.37l.29.26zm3.66 5.28a4436.65 4436.65 0 0 1 -4.66-4.16c-.56-.5-1.07-.96-1.53-1.37l-.57-.51c0 .03-.01.05-.01.07v17.89l10.38-8.7c-1-.89-2.2-1.95-3.61-3.20" fill-rule="evenodd"></path>
+  <path d="m17.42 18.99c.14-.12.86-.76 2.08-1.86l10.43 8.66h-27.76l10.35-8.67c1.24 1.1 1.98 1.74 2.12 1.85.83.65 1.93.63 2.78.02m11.89-10.67-4.83 4.34c-1.51 1.35-2.8 2.51-3.86 3.46l10.35 8.6c.01.01.01.02.02.03v-17.81c0-.04-.02-.07-.02-.11a3.73 3.73 0 0 0 -.08.07zm-25.19-.7a5347.74 5347.74 0 0 0 4.69 4.19c3.94 3.52 6.51 5.79 6.75 5.97a.76.76 0 0 0 .92.03c.21-.18 2.82-2.52 7.01-6.28l4.82-4.33 1.35-1.21h-27.37l.29.26zm3.66 5.28a4436.65 4436.65 0 0 1 -4.66-4.16c-.56-.5-1.07-.96-1.53-1.37l-.57-.51c0 .03-.01.05-.01.07v17.89l10.38-8.7c-1-.89-2.2-1.95-3.61-3.20" fill-rule="evenodd"></path>
  </svg>
  </button> 
  </div> 

src/app/modules/wallet/tokens/referrals/links/links.component.scss

@@ -15,7 +15,7 @@
  h3 {
  font-size: 28px;
  font-weight: 600;
- margin: 0;
+ margin: 0 50px 0 0;
  @include m-theme() {
  color: themed($m-grey-800);
  }
@@ -26,11 +26,11 @@
  }
 
  .m-referrals-links__copyableLink {
- position: relative;
  max-width: 450px;
  margin-bottom: $minds-padding * 3;
  border-radius: 18px;
- text-align: left !important;
+ display: flex;
+ justify-content: space-between;
 
  &.focused {
  @include m-theme() {
@@ -42,9 +42,11 @@
  width: 95%;
  overflow: hidden;
  white-space: nowrap;
+ text-overflow: ellipsis;
+ text-align: left !important;
  font-size: 18px;
  border: none;
- padding: $minds-padding;
+ padding: 8px 0 8px 8px;
  margin: 1px 0 1px 4px;
 
  @include m-theme() {
@@ -63,16 +65,9 @@
 
  .m-referrals-links__copyableLinkButton {
  cursor: pointer;
- position: absolute;
- right: 0;
- top: 0;
- padding: 9px 10px 10px 8px;
- border-top-right-radius: 18px;
- border-bottom-right-radius: 18px;
-
+ padding: 9px 14px 10px 8px;
  @include m-theme() {
  color: themed($m-blue);
- background-color: themed($m-white);
  }
 
  &:hover {

src/app/modules/wallet/tokens/referrals/referrals.component.scss

@@ -18,7 +18,7 @@ m-referrals {
  h2 {
  font-size: 42px;
  font-weight: 600;
- margin-top: $minds-padding * 2;
+ margin-top: $minds-padding;
  @include m-theme(){
  color: themed($m-grey-800);
  }

src/app/modules/wallet/tokens/tokens.component.html

@@ -61,7 +61,7 @@
  routerLink="/wallet/tokens/referrals"
  routerLinkActive="m-page--sidebar--navigation--item-active"
  >
- <i class="material-icons">assignment</i>
+ <i class="material-icons">people</i>
  <span i18n="@@M__ACTION__REFERRAL_LINK">Referrals</span>
  </a>
  </div>

src/app/services/api/upload.ts

@@ -46,10 +46,13 @@ export class Upload {
  }
  xhr.open('POST', this.base + endpoint, true);
  xhr.upload.addEventListener('progress', function (e: any) {
- progress(e.loaded / e.total * 100);
+ if (e.lengthComputable) {
+ progress((e.loaded / (e.total) * 99));
+ }
  });
  xhr.onload = function (this: XMLHttpRequest) {
  if (this.status === 200) {
+ progress(100);
  resolve(JSON.parse(this.response));
  } else {
  reject(this.response);