@@ -5,7 +5,7 @@
viewBox="0 0 300 100" xml:space="preserve" width="100%" class="svg-triangle">
<polygon points="0,75 0,100 300,100 300,99" fill="#FFFFFF" />
</svg>
- <img src="{{ user.profile_image_url_https }}" alt="{{ user.name }}" class="avatar">
+ <img src="{{ user.profile_image_url_https | highResolution }}" alt="{{ user.name }}" class="avatar">
<button ion-button color="primary" *ngIf="!user.following" (click)="follow(user.id_str)" class="follow-button">Follow</button>
<button ion-button color="danger" *ngIf="user.following" (click)="unfollow(user.id_str)" class="follow-button">Unfollow</button>
</div>
@@ -13,8 +13,9 @@ profile-header {
border-radius: 50%;
box-shadow: 0px 0px 4px 0px #777;
position: absolute;
- bottom: -10px;
+ bottom: -15px;
left: 15px;
+ width: 90px;
}
.follow-button {
@@ -0,0 +1,20 @@
+import { Pipe, PipeTransform } from "@angular/core";
+
+/**
+ * Generated class for the HighResolutionPipe pipe.
+ *
+ * See https://angular.io/api/core/Pipe for more info on Angular Pipes.
+ */
+@Pipe({
+ name: "highResolution"
+})
+export class HighResolutionPipe implements PipeTransform {
+ /**
+ * Takes a profile img URL string and removes "normal" from the URL to receive a high resolution image
+ transform(value: string, ...args) {
+ if (value) {
+ return value.replace("_normal", "");
+ }
+}
@@ -3,19 +3,22 @@ import { FriendlyNumberPipe } from "./friendly-number/friendly-number";
import { DiffForHumansPipe } from "./diff-for-humans/diff-for-humans";
import { ReplaceUrlsPipe } from "./replace-urls/replace-urls";
import { ReplaceHashtagsPipe } from "./replace-hashtags/replace-hashtags";
+import { HighResolutionPipe } from './high-resolution/high-resolution';
@NgModule({
declarations: [
FriendlyNumberPipe,
DiffForHumansPipe,
ReplaceUrlsPipe,
- ReplaceHashtagsPipe
+ ReplaceHashtagsPipe,
+ HighResolutionPipe
],
imports: [],
exports: [
]
})
export class PipesModule {}