trying a new way to display account
This commit is contained in:
parent
6428ee927e
commit
bb62c8262b
|
@ -1,4 +1,4 @@
|
|||
<div class="profile flexcroll">
|
||||
<div class="profile">
|
||||
<app-waiting-animation *ngIf="isLoading" class="waiting-icon"></app-waiting-animation>
|
||||
|
||||
<div *ngIf="account" class="profile-header" [ngStyle]="{'background-image':'url('+account.header+')'}">
|
||||
|
@ -9,20 +9,23 @@
|
|||
<h2 class="profile-header__fullhandle"><a href="{{account.url}}" target="_blank">@{{account.acct}}</a></h2>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="account && hasNote" class="profile-description">
|
||||
<app-databinded-text class="status__content" [textIsSelectable]="false" [text]="account.note" (accountSelected)="accountSelected($event)"
|
||||
(hashtagSelected)="hashtagSelected($event)"></app-databinded-text>
|
||||
<!-- <p innerHTML="{{account.note}}"></p> -->
|
||||
</div>
|
||||
<div class="profile-statuses">
|
||||
<app-waiting-animation *ngIf="statusLoading" class="waiting-icon"></app-waiting-animation>
|
||||
|
||||
<div *ngIf="!isLoading && !statusLoading && statuses.length == 0" class="profile-no-toots">
|
||||
no toots found
|
||||
<div class="profile-sub-header flexcroll">
|
||||
<div *ngIf="account && hasNote" class="profile-description">
|
||||
<app-databinded-text class="status__content" [textIsSelectable]="false" [text]="account.note"
|
||||
(accountSelected)="accountSelected($event)" (hashtagSelected)="hashtagSelected($event)"></app-databinded-text>
|
||||
<!-- <p innerHTML="{{account.note}}"></p> -->
|
||||
</div>
|
||||
<div class="profile-statuses">
|
||||
<app-waiting-animation *ngIf="statusLoading" class="waiting-icon"></app-waiting-animation>
|
||||
|
||||
<div *ngFor="let statusWrapper of statuses">
|
||||
<app-status [statusWrapper]="statusWrapper" (browseAccount)="accountSelected($event)"></app-status>
|
||||
<div *ngIf="!isLoading && !statusLoading && statuses.length == 0" class="profile-no-toots">
|
||||
no toots found
|
||||
</div>
|
||||
|
||||
<div *ngFor="let statusWrapper of statuses">
|
||||
<app-status [statusWrapper]="statusWrapper" (browseAccount)="accountSelected($event)"></app-status>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -1,7 +1,10 @@
|
|||
@import "variables";
|
||||
@import "commons";
|
||||
|
||||
$header-height: 160px;
|
||||
|
||||
.profile {
|
||||
overflow: auto;
|
||||
// overflow: auto;
|
||||
height: calc(100% - 30px);
|
||||
|
||||
&-header {
|
||||
|
@ -14,7 +17,7 @@
|
|||
}
|
||||
&__inner {
|
||||
overflow: auto;
|
||||
height: 160px;
|
||||
height: $header-height;
|
||||
background-color: rgba(0, 0, 0, .45);
|
||||
}
|
||||
&__avatar {
|
||||
|
@ -38,6 +41,14 @@
|
|||
}
|
||||
}
|
||||
|
||||
&-sub-header {
|
||||
overflow: auto;
|
||||
height: calc(100% - #{$header-height});
|
||||
// height: calc(20% - 190px);
|
||||
// height: 150px;
|
||||
// border: 1px solid greenyellow;
|
||||
}
|
||||
|
||||
&-description {
|
||||
padding: 10px 10px 15px 10px;
|
||||
font-size: 13px;
|
||||
|
|
|
@ -33,20 +33,15 @@ export class UserProfileComponent implements OnInit {
|
|||
this.loadAccount(accountName)
|
||||
.then((account: Account) => {
|
||||
this.account = account;
|
||||
this.hasNote = account && account.note && account.note !== '<p></p>';
|
||||
return this.getStatuses(this.account);
|
||||
})
|
||||
.catch(err => {
|
||||
this.error = 'Error when retrieving account';
|
||||
this.isLoading = false;
|
||||
this.statusLoading = false;
|
||||
console.warn(this.error);
|
||||
console.error(this.error);
|
||||
});
|
||||
|
||||
// this.account = account;
|
||||
// this.hasNote = account && account.note && account.note !== '<p></p>';
|
||||
// console.warn('currentAccount');
|
||||
// console.warn(account);
|
||||
// this.getStatuses(account);
|
||||
}
|
||||
|
||||
constructor(
|
||||
|
|
Loading…
Reference in New Issue