fix image floats
This commit is contained in:
parent
dc6cd2fb17
commit
98ac80dccf
|
@ -132,26 +132,25 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="profile-statuses" #profilestatuses>
|
||||
<div class="profile__extra-info profile__extra-info__preparefloating" *ngIf="!isLoading"
|
||||
[class.profile__extra-info__floating]="showFloatingStatusMenu">
|
||||
<div class="profile__extra-info__section">
|
||||
<a href class="profile__extra-info__links" (click)="switchStatusSection('status')"
|
||||
title="Status"
|
||||
[class.profile__extra-info__links--selected]="statusSection === 'status'">Status</a>
|
||||
</div>
|
||||
<div class="profile__extra-info__section">
|
||||
<a href class="profile__extra-info__links" (click)="switchStatusSection('replies')"
|
||||
title="Status & Replies"
|
||||
[class.profile__extra-info__links--selected]="statusSection === 'replies'">Status &
|
||||
Replies</a>
|
||||
</div>
|
||||
<div class="profile__extra-info__section">
|
||||
<a href class="profile__extra-info__links" (click)="switchStatusSection('media')" title="Media"
|
||||
[class.profile__extra-info__links--selected]="statusSection === 'media'">Media</a>
|
||||
</div>
|
||||
<div class="profile__extra-info profile__extra-info__preparefloating" *ngIf="!isLoading"
|
||||
[class.profile__extra-info__floating]="showFloatingStatusMenu">
|
||||
<div class="profile__extra-info__section">
|
||||
<a href class="profile__extra-info__links" (click)="switchStatusSection('status')" title="Status"
|
||||
[class.profile__extra-info__links--selected]="statusSection === 'status'">Status</a>
|
||||
</div>
|
||||
<div class="profile__extra-info__section">
|
||||
<a href class="profile__extra-info__links" (click)="switchStatusSection('replies')"
|
||||
title="Status & Replies"
|
||||
[class.profile__extra-info__links--selected]="statusSection === 'replies'">Status &
|
||||
Replies</a>
|
||||
</div>
|
||||
<div class="profile__extra-info__section">
|
||||
<a href class="profile__extra-info__links" (click)="switchStatusSection('media')" title="Media"
|
||||
[class.profile__extra-info__links--selected]="statusSection === 'media'">Media</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="profile-statuses" #profilestatuses>
|
||||
<div class="profile__extra-info" *ngIf="!isLoading">
|
||||
<div class="profile__extra-info__section">
|
||||
<a href class="profile__extra-info__links" (click)="switchStatusSection('status')"
|
||||
|
@ -188,15 +187,15 @@
|
|||
(browseAccountEvent)="browseAccount($event)" (browseThreadEvent)="browseThread($event)">
|
||||
</app-status>
|
||||
</div>
|
||||
<div *ngIf="statusSection === 'media'">
|
||||
<div *ngIf="statusSection === 'media'" class="status-media">
|
||||
<div *ngFor="let media of statusWrapper.status.media_attachments">
|
||||
<a href title="open image" (click)="openAttachment(media)">
|
||||
<img class="status-media__image" src="{{media.preview_url}}" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="clear: both;"></div>
|
||||
|
||||
<app-waiting-animation *ngIf="statusLoading" class="waiting-icon"></app-waiting-animation>
|
||||
</div>
|
||||
|
|
|
@ -79,7 +79,7 @@ $full-alias-color-hover: white;
|
|||
margin: 0 0 2px 0;
|
||||
}
|
||||
|
||||
&__fullhandle {
|
||||
&__fullhandle {
|
||||
transition: all .2s;
|
||||
font-size: 15px;
|
||||
color: $full-alias-color;
|
||||
|
@ -178,7 +178,7 @@ $full-alias-color-hover: white;
|
|||
&:hover {
|
||||
color: $full-alias-color-hover;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__follow {
|
||||
// transition: all .4s;
|
||||
|
@ -241,7 +241,7 @@ $full-alias-color-hover: white;
|
|||
}
|
||||
}
|
||||
|
||||
&__extra-info {
|
||||
&__extra-info {
|
||||
background-color: #20273a;
|
||||
background-color: #141824;
|
||||
background-color: #1a1f2e;
|
||||
|
@ -326,17 +326,12 @@ $full-alias-color-hover: white;
|
|||
}
|
||||
|
||||
.status-media {
|
||||
|
||||
&__image {
|
||||
width: calc(50%);
|
||||
width: calc(50% - 2px);
|
||||
height: 150px;
|
||||
object-fit: cover;
|
||||
|
||||
margin: 1px;
|
||||
float: left;
|
||||
|
||||
&:nth-child(even) {
|
||||
margin-right: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -275,7 +275,7 @@ export class UserProfileComponent implements OnInit {
|
|||
this.showFloatingHeader = false;
|
||||
}
|
||||
|
||||
const menuPosition = element.scrollHeight - this.profilestatuses.nativeElement.offsetHeight - 30;
|
||||
const menuPosition = element.scrollHeight - this.profilestatuses.nativeElement.offsetHeight - 30;
|
||||
if (element.scrollTop > menuPosition) {
|
||||
this.showFloatingStatusMenu = true;
|
||||
} else {
|
||||
|
|
Loading…
Reference in New Issue