summaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/web/src/app/app.component.html12
-rw-r--r--src/web/src/app/app.component.ts25
-rw-r--r--src/web/src/app/film/film.component.css14
-rw-r--r--src/web/src/app/film/film.component.html20
-rw-r--r--src/web/src/app/film/film.component.ts3
-rw-r--r--src/web/src/app/home/home.component.ts14
-rw-r--r--src/web/src/app/search-item/search-item.component.html6
-rw-r--r--src/web/src/styles.css2
8 files changed, 57 insertions, 39 deletions
diff --git a/src/web/src/app/app.component.html b/src/web/src/app/app.component.html
index 9efd8ad..6813821 100644
--- a/src/web/src/app/app.component.html
+++ b/src/web/src/app/app.component.html
@@ -5,11 +5,15 @@
<div
class="container d-flex flex-column flex-md-row justify-content-between"
>
- <i
- style="font-size: 3rem; color: white"
- class="bi bi-arrow-left-circle-fill icon float-left"
+ <!-- <i
+ style="font-size: 2.5rem; color: white"
+ [hidden]="
+ !(routes.startsWith('/home/') || routes.startsWith('/tv/'))
+ "
+ class="bi bi-arrow-left icon float-left"
[routerLink]="['home']"
- ></i>
+ ></i> -->
+ <span></span>
<a
class="py-2 d-flex flex-row align-items-center justify-content-center"
href="#"
diff --git a/src/web/src/app/app.component.ts b/src/web/src/app/app.component.ts
index 87aaf53..fdbd59f 100644
--- a/src/web/src/app/app.component.ts
+++ b/src/web/src/app/app.component.ts
@@ -1,10 +1,23 @@
-import { Component } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
@Component({
- selector: 'app-root',
- templateUrl: './app.component.html',
- styleUrls: ['./app.component.css']
+ selector: 'app-root',
+ templateUrl: './app.component.html',
+ styleUrls: ['./app.component.css'],
})
-export class AppComponent {
- title = 'client';
+export class AppComponent implements OnInit {
+ title = 'client';
+ routes: string;
+
+ /**
+ *
+ *
+ */
+ constructor(route: Router) {
+ this.routes = route.url;
+ console.log(this.routes);
+ }
+
+ ngOnInit(): void {}
}
diff --git a/src/web/src/app/film/film.component.css b/src/web/src/app/film/film.component.css
index 08001a3..bad8255 100644
--- a/src/web/src/app/film/film.component.css
+++ b/src/web/src/app/film/film.component.css
@@ -6,21 +6,11 @@
font-family: "Playfair Display", sans-serif;
}
.img-s {
- width: 100%;
- overflow-y: scroll;
- z-index: 0;
- position: relative;
+ border-radius: 20px;
+ box-shadow: 5px 5px 20px 3px gray, -5px -5px 20px 3px gray;
}
.wrapper-content {
- display: flex;
- justify-content: center;
width: 100%;
- z-index: 100;
- top: 76px;
- position: absolute;
- left: 0;
- height: 100%;
- padding: 5% 0px;
}
.main-div {
diff --git a/src/web/src/app/film/film.component.html b/src/web/src/app/film/film.component.html
index f7c8075..7e18536 100644
--- a/src/web/src/app/film/film.component.html
+++ b/src/web/src/app/film/film.component.html
@@ -1,12 +1,20 @@
<div class="w-100 main-div-wrapper">
- <img [src]="getImage() ? getImage() : ''" class="img-s" />
-
<div class="wrapper-content" *ngIf="!loading">
<div class="wrapper-wrapper container">
- <div class="main-div container row" style="color: white">
- <div class="description m-auto px-5 pb-0">
+ <div class="main-div container row mx-0 py-4" style="color: white">
+ <div
+ class="col-md-12 col-lg-4 col-s-6 d-flex justify-content-center align-items-center flex-column"
+ >
+ <div class="p-s-5 p-lg-0">
+ <img
+ [src]="getImage() ? getImage() : ''"
+ class="img-s img-fluid"
+ />
+ </div>
+ </div>
+ <div class="description m-auto col-md-12 col-lg-8 px-5 pb-0">
<h1
- class="mt-5 mb-4 col-md-8 pl-0"
+ class="mt-3 mb-4 pl-0 text-center"
style="font-size: xxx-large"
>
<strong>
@@ -17,7 +25,7 @@
}}</strong
>
</h1>
- <p class="mt-4 text-center" style="font-size: larger">
+ <p class="mt-4 text-justify" style="font-size: larger">
{{ model.overview }}
</p>
</div>
diff --git a/src/web/src/app/film/film.component.ts b/src/web/src/app/film/film.component.ts
index 54a7499..d4e90f5 100644
--- a/src/web/src/app/film/film.component.ts
+++ b/src/web/src/app/film/film.component.ts
@@ -18,8 +18,7 @@ export class FilmComponent implements OnInit {
id: string;
constructor(
private route: ActivatedRoute,
- private service: MovieTVService,
- private appService: AppService
+ private service: MovieTVService
) {}
ngOnInit(): void {
this.route.paramMap.subscribe((x) => {
diff --git a/src/web/src/app/home/home.component.ts b/src/web/src/app/home/home.component.ts
index 007fef0..ab3d963 100644
--- a/src/web/src/app/home/home.component.ts
+++ b/src/web/src/app/home/home.component.ts
@@ -1,15 +1,15 @@
import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
@Component({
- selector: 'app-home',
- templateUrl: './home.component.html',
- styleUrls: ['./home.component.css']
+ selector: 'app-home',
+ templateUrl: './home.component.html',
+ styleUrls: ['./home.component.css'],
})
export class HomeComponent implements OnInit {
+ film_page = true;
- constructor() { }
-
- ngOnInit(): void {
- }
+ constructor(private route: Router) {}
+ ngOnInit(): void {}
}
diff --git a/src/web/src/app/search-item/search-item.component.html b/src/web/src/app/search-item/search-item.component.html
index 513ba86..9a3beba 100644
--- a/src/web/src/app/search-item/search-item.component.html
+++ b/src/web/src/app/search-item/search-item.component.html
@@ -3,12 +3,14 @@
<img [src]="getImage()" alt="Not Found" class="example-option-img" />
</div>
<div class="search-item-text col-sm-8 col-md-8">
- <div class="movie-title font-weight-bold text-uppercase">
+ <div
+ class="movie-title font-weight-bold text-capitalize overflow-hidden"
+ >
{{ getTitle() }}
</div>
<div class="year-wrapper">
<small class="year-wrapper-content">
- {{ getYear() }} | {{ model.media_type | titlecase }}
+ {{ getYear() }} | {{ model.media_type | uppercase }}
</small>
</div>
</div>
diff --git a/src/web/src/styles.css b/src/web/src/styles.css
index 071fc51..8c0c651 100644
--- a/src/web/src/styles.css
+++ b/src/web/src/styles.css
@@ -57,6 +57,8 @@ body {
.search-item-text .movie-title {
font-size: 1.5rem;
+ text-overflow: ellipsis;
+ overflow: hidden;
}
.rating {