-
+
-
{{ contentTitle }}
+ {{ blogPost?.title | titlecase }}
-
<< VOLTAR
- {{ contentDescription }}
+ {{ blogPost?.description }}
+
+
<< VOLTAR
diff --git a/src/app/pages/content/content.component.ts b/src/app/pages/content/content.component.ts
index fd99486a..b958ba47 100644
--- a/src/app/pages/content/content.component.ts
+++ b/src/app/pages/content/content.component.ts
@@ -1,36 +1,23 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, inject } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import {dataFake} from '../../data/dataFake'
+import { BloggingService } from 'src/app/blogging.service';
+import { BlogPost } from 'src/app/blog-post';
@Component({
selector: 'app-content',
templateUrl: './content.component.html',
styleUrls: ['./content.component.css']
})
-export class ContentComponent implements OnInit {
- photoCover:string = ""
- contentTitle:string = ""
- contentDescription:string = ""
- private id:string | null = "0"
+export class ContentComponent {
+ route: ActivatedRoute = inject(ActivatedRoute);
+ blogPost: BlogPost | undefined;
+ blogginService: BloggingService = inject(BloggingService);
- constructor(
- private route:ActivatedRoute
- ) { }
- ngOnInit(): void {
- this.route.paramMap.subscribe( value =>
- this.id = value.get("id")
- )
-
- this.setValuesToComponent(this.id)
- }
-
- setValuesToComponent(id:string | null){
- const result = dataFake.filter(article => article.id == id)[0]
-
- this.contentTitle = result.title
- this.contentDescription = result.description
- this.photoCover = result.photoCover
- }
+ constructor() {
+ const blogPostId = parseInt(this.route.snapshot.params['id'], 0);
+ this.blogPost = this.blogginService.getBlogPostById(blogPostId);
+ }
}
diff --git a/src/app/pages/home/home.component.css b/src/app/pages/home/home.component.css
index 0a1ad07b..7c36add1 100644
--- a/src/app/pages/home/home.component.css
+++ b/src/app/pages/home/home.component.css
@@ -8,4 +8,25 @@
}
}
+.container__searchbar {
+ justify-content: center;
+}
+
+input[type=text] {
+ width: 50%;
+ padding: 12px 20px;
+ margin: 8px 10px;
+ box-sizing: border-box;
+ border: 1px solid #04AA6D;
+}
+.button {
+ background-color: #04AA6D; /* Green */
+ border: none;
+ color: white;
+ padding: 15px 32px;
+ text-align: center;
+ text-decoration: none;
+ display: inline-block;
+ font-size: 12px;
+}
\ No newline at end of file
diff --git a/src/app/pages/home/home.component.html b/src/app/pages/home/home.component.html
index 53d749b0..9ab007d1 100644
--- a/src/app/pages/home/home.component.html
+++ b/src/app/pages/home/home.component.html
@@ -1,5 +1,12 @@