-
-
Post content blblblblblblbllblb
-
+
+
{{post?.content}}
+
+
{{post?.likes}}
\ No newline at end of file
diff --git a/src/app/shared/views/post/post.component.scss b/src/app/shared/views/post/post.component.scss
index f937d42..3ee8903 100644
--- a/src/app/shared/views/post/post.component.scss
+++ b/src/app/shared/views/post/post.component.scss
@@ -12,5 +12,21 @@
display: block;
border-radius: 4px;
}
+
+ .likes {
+ display: block;
+ margin: 10px auto;
+ width: 10px;
+ aspect-ratio: 1;
+ }
+
+ .likes::before {
+ content: "❤️";
+ filter: saturate(0);
+ }
+
+ .likes.liked::before {
+ filter: saturate(1) !important;
+ }
}
diff --git a/src/app/shared/views/post/post.component.ts b/src/app/shared/views/post/post.component.ts
index 78a6046..7165b18 100644
--- a/src/app/shared/views/post/post.component.ts
+++ b/src/app/shared/views/post/post.component.ts
@@ -1,14 +1,16 @@
-import { Component } from '@angular/core';
+import { Component, Input } from '@angular/core';
import { SmallUserComponent } from '../small-user/small-user.component';
+import { Post } from '../../../../model/Post';
+import { NgIf } from '@angular/common';
@Component({
selector: 'app-post',
standalone: true,
- imports: [SmallUserComponent],
+ imports: [SmallUserComponent, NgIf],
templateUrl: './post.component.html',
styleUrl: './post.component.scss'
})
export class PostComponent {
-
+ @Input() post: Post | undefined;
}
diff --git a/src/app/shared/views/small-user/small-user.component.html b/src/app/shared/views/small-user/small-user.component.html
index f340219..542bc53 100644
--- a/src/app/shared/views/small-user/small-user.component.html
+++ b/src/app/shared/views/small-user/small-user.component.html
@@ -1,3 +1,3 @@
-
-
Username
+
+
{{user?.username}}
\ No newline at end of file
diff --git a/src/app/shared/views/small-user/small-user.component.ts b/src/app/shared/views/small-user/small-user.component.ts
index 8c262cc..d615aba 100644
--- a/src/app/shared/views/small-user/small-user.component.ts
+++ b/src/app/shared/views/small-user/small-user.component.ts
@@ -1,12 +1,14 @@
-import { Component } from '@angular/core';
+import { Component, Input } from '@angular/core';
+import { User } from '../../../../model/User';
+import { RouterModule } from '@angular/router';
@Component({
selector: 'app-small-user',
standalone: true,
- imports: [],
+ imports: [RouterModule],
templateUrl: './small-user.component.html',
styleUrl: './small-user.component.scss'
})
export class SmallUserComponent {
-
+ @Input() user: User | undefined;
}
diff --git a/src/app/user/user.component.html b/src/app/user/user.component.html
index d039bb7..52ec478 100644
--- a/src/app/user/user.component.html
+++ b/src/app/user/user.component.html
@@ -1 +1,6 @@
-
user works!
+
+
+
diff --git a/src/app/user/user.component.ts b/src/app/user/user.component.ts
index 8d6911d..f503afb 100644
--- a/src/app/user/user.component.ts
+++ b/src/app/user/user.component.ts
@@ -1,4 +1,6 @@
import { Component } from '@angular/core';
+import { Post } from '../../model/Post';
+import { User } from '../../model/User';
@Component({
selector: 'app-user',
@@ -6,5 +8,40 @@ import { Component } from '@angular/core';
styleUrl: './user.component.scss'
})
export class UserComponent {
+ exampleUser: User = {
+ username: "Zámbó Jimmy",
+ picture: "assets/placeholder-profile-picture.png",
+ followed: true
+ }
+ posts: Array
= new Array(
+ {
+ user: this.exampleUser,
+ content: "Bukott diák vagyok én, nem bírom el a szenvedést.",
+ image: "assets/placeholder-profile-picture.png",
+ likes: 1,
+ liked: true
+ },
+ {
+ user: this.exampleUser,
+ content: "Bukott diák vagyok én, nem bírom el a szenvedést.",
+ image: "assets/placeholder-profile-picture.png",
+ likes: 1,
+ liked: true
+ },
+ {
+ user: this.exampleUser,
+ content: "Bukott diák vagyok én, nem bírom el a szenvedést.",
+ image: "assets/placeholder-profile-picture.png",
+ likes: 1,
+ liked: true
+ },
+ {
+ user: this.exampleUser,
+ content: "Bukott diák vagyok én, nem bírom el a szenvedést.",
+ image: "assets/placeholder-profile-picture.png",
+ likes: 1,
+ liked: true
+ },
+ );
}
diff --git a/src/app/user/user.module.ts b/src/app/user/user.module.ts
index 1594b39..15b1cae 100644
--- a/src/app/user/user.module.ts
+++ b/src/app/user/user.module.ts
@@ -3,7 +3,10 @@ import { CommonModule } from '@angular/common';
import { UserRoutingModule } from './user-routing.module';
import { UserComponent } from './user.component';
-
+import { TopMenuComponent } from '../shared/top-menu/top-menu.component';
+import { SideMenuComponent } from '../shared/side-menu/side-menu.component';
+import { PostComponent } from '../shared/views/post/post.component';
+import { LargeUserComponent } from '../shared/views/large-user/large-user.component';
@NgModule({
declarations: [
@@ -11,7 +14,11 @@ import { UserComponent } from './user.component';
],
imports: [
CommonModule,
- UserRoutingModule
+ UserRoutingModule,
+ TopMenuComponent,
+ SideMenuComponent,
+ PostComponent,
+ LargeUserComponent
]
})
export class UserModule { }
diff --git a/src/model/Post.ts b/src/model/Post.ts
new file mode 100644
index 0000000..ed1f8c3
--- /dev/null
+++ b/src/model/Post.ts
@@ -0,0 +1,9 @@
+import { User } from "./User";
+
+export interface Post {
+ user: User;
+ content: String;
+ image: String;
+ likes: Number;
+ liked: Boolean;
+}
\ No newline at end of file
diff --git a/src/model/User.ts b/src/model/User.ts
new file mode 100644
index 0000000..b60e0e1
--- /dev/null
+++ b/src/model/User.ts
@@ -0,0 +1,5 @@
+export interface User {
+ username: String;
+ picture: String;
+ followed: Boolean;
+}
\ No newline at end of file
diff --git a/src/styles.scss b/src/styles.scss
index 9444fb9..fa751d7 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -27,5 +27,6 @@ body {
#main {
transform: translateX(100px);
+ padding-top: 50px;
width: calc(100vw - 100px);
}
\ No newline at end of file