aboutsummaryrefslogtreecommitdiff
path: root/src/app/components/feed/feed.component.html
blob: 4832456663841bda9cffb86dbff0d86c7e2dde24 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<app-navbar></app-navbar>

<app-loading *ngIf="!dataArrived"></app-loading>

<main class="centered-content scroll-standalone under-navbar flex-col flex-justify-start" *ngIf="dataArrived">
	<form id="create-post" class="card flex-col" [formGroup]="createPostFormGroup" (ngSubmit)="createPost()">
		<textarea class="textarea-new-msg border-faded-slim border-bottom-only padding-dot2" rows="1" formControlName="newPostMessage" placeholder="What's on your mind?"></textarea>
		<section class="flex-row flex-justify-start align-children-center padding-top-bot-dot5">
			<div class="file-button hover-half-opacity click-effect">
				<img src="/assets/icons/tabler-icon-paperclip.svg">
				<input type="file" formControlName="fileUpload" (change)="onFileUpload($event)" multiple>
			</div>
		</section>
		<section class="flex-row bot-padding-dot6ger">
			<div *ngFor="let file of files" class="form-attachment border-faded-slim flexible flex-row flex-no-wrap flex-center-align-items padding-dot2 margin-top-bot-dot2">
				<div class="flexible">
					{{ file.name ? file.name : 'Attachment' }}
				</div>
				<div class="flex-col hover-half-opacity border-radius-dot2 click-effect" (click)="removeAttachment(file.name)">
					<img src="/assets/icons/tabler-icon-x.svg">
				</div>
			</div>
		</section>
		<button class="border-faded-slim padding-dot2 lighter-hover click-effect border-radius-dot3">
			Post
		</button>
	</form>
	<hr class="card-hr">
	<section id="posts" (scroll)="onScroll($event)">
		<div class="text-centered" *ngIf="posts.length === 0">
			None of your friends have posted anything yet!<br>
			Try refreshing your page!
		</div>
		<div *ngFor="let friendPost of posts" class="post">
			<app-post [paramId]="friendPost.postId.toString()"></app-post>
		</div>
	</section>
</main>