fix image floats

This commit is contained in:
Nicolas Constant 2019-08-09 00:13:52 -04:00
parent dc6cd2fb17
commit 98ac80dccf
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
3 changed files with 27 additions and 33 deletions

View File

@ -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>

View File

@ -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;
}
}
}

View File

@ -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 {