-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
1 parent
0bce990
commit 25150fb
Showing
44 changed files
with
1,008 additions
and
581 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,11 +1,18 @@ | ||
import { NgModule } from '@angular/core'; | ||
import { Routes, RouterModule } from '@angular/router'; | ||
import { NgModule } from "@angular/core"; | ||
import { Routes, RouterModule } from "@angular/router"; | ||
|
||
|
||
const routes: Routes = []; | ||
import { MovieComponent } from "./movie/movie.component"; | ||
const routes: Routes = [ | ||
{ path: "", component: MovieComponent }, | ||
{ | ||
path: "movie", | ||
loadChildren: () => | ||
import("./movie/movie.module").then((m) => m.MovieModule) | ||
}, | ||
]; | ||
|
||
@NgModule({ | ||
imports: [RouterModule.forRoot(routes)], | ||
exports: [RouterModule] | ||
exports: [RouterModule], | ||
}) | ||
export class AppRoutingModule { } | ||
export class AppRoutingModule {} |
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
.app { | ||
display: flex; | ||
justify-content: flex-start; | ||
flex-direction: row; | ||
|
||
.main { | ||
width: 100%; | ||
display: flex; | ||
justify-content: flex-start; | ||
flex-direction: column; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,18 +1,24 @@ | ||
import { BrowserModule } from '@angular/platform-browser'; | ||
import { NgModule } from '@angular/core'; | ||
import { BrowserModule } from "@angular/platform-browser"; | ||
import { NgModule } from "@angular/core"; | ||
|
||
import { AppRoutingModule } from './app-routing.module'; | ||
import { AppComponent } from './app.component'; | ||
import { AppRoutingModule } from "./app-routing.module"; | ||
import { AppComponent } from "./app.component"; | ||
import { SidebarModule } from "./sidebar/sidebar.module"; | ||
import { MovieModule } from "./movie/movie.module"; | ||
import { SearchBarModule } from "./search-bar/search-bar.module"; | ||
import { LoaderModule } from "./loader/loader.module"; | ||
|
||
@NgModule({ | ||
declarations: [ | ||
AppComponent | ||
], | ||
declarations: [AppComponent], | ||
imports: [ | ||
BrowserModule, | ||
AppRoutingModule | ||
AppRoutingModule, | ||
SidebarModule, | ||
MovieModule, | ||
SearchBarModule, | ||
LoaderModule | ||
], | ||
providers: [], | ||
bootstrap: [AppComponent] | ||
bootstrap: [AppComponent], | ||
}) | ||
export class AppModule { } | ||
export class AppModule {} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
import { NgModule } from '@angular/core'; | ||
import { Routes, RouterModule } from '@angular/router'; | ||
|
||
|
||
const routes: Routes = []; | ||
|
||
@NgModule({ | ||
imports: [RouterModule.forChild(routes)], | ||
exports: [RouterModule] | ||
}) | ||
export class LoaderRoutingModule { } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
<div class="ngma-loader" *ngIf="loading"></div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
@import "variables"; | ||
.ngma-loader { | ||
border: 5px solid $dark; /* Light grey */ | ||
border-top: 5px solid $secondary-color; /* Blue */ | ||
border-radius: 50%; | ||
width: 50px; | ||
height: 50px; | ||
animation: spin 0.8s linear infinite; | ||
margin: 20px auto; | ||
} | ||
|
||
@keyframes spin { | ||
0% { transform: rotate(0deg); } | ||
100% { transform: rotate(360deg); } | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; | ||
|
||
import { LoaderComponent } from './loader.component'; | ||
|
||
describe('LoaderComponent', () => { | ||
let component: LoaderComponent; | ||
let fixture: ComponentFixture<LoaderComponent>; | ||
|
||
beforeEach(async(() => { | ||
TestBed.configureTestingModule({ | ||
declarations: [ LoaderComponent ] | ||
}) | ||
.compileComponents(); | ||
})); | ||
|
||
beforeEach(() => { | ||
fixture = TestBed.createComponent(LoaderComponent); | ||
component = fixture.componentInstance; | ||
fixture.detectChanges(); | ||
}); | ||
|
||
it('should create', () => { | ||
expect(component).toBeTruthy(); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
import { Component, OnInit, Input } from "@angular/core"; | ||
|
||
@Component({ | ||
selector: "app-loader", | ||
templateUrl: "./loader.component.html", | ||
styleUrls: ["./loader.component.scss"], | ||
}) | ||
export class LoaderComponent implements OnInit { | ||
@Input() loading: boolean; | ||
|
||
constructor() {} | ||
|
||
ngOnInit(): void {} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
import { NgModule } from '@angular/core'; | ||
import { CommonModule } from '@angular/common'; | ||
|
||
import { LoaderRoutingModule } from './loader-routing.module'; | ||
|
||
|
||
@NgModule({ | ||
declarations: [], | ||
imports: [ | ||
CommonModule, | ||
LoaderRoutingModule | ||
] | ||
}) | ||
export class LoaderModule { } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
export interface Movie { | ||
id: number; | ||
key: string; | ||
name: string; | ||
description: string; | ||
rate: string; | ||
length: string; | ||
img: string; | ||
cover: string; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
import { NgModule } from '@angular/core'; | ||
import { Routes, RouterModule } from '@angular/router'; | ||
|
||
import { MovieComponent } from './movie.component'; | ||
|
||
const routes: Routes = [ | ||
{ path: 'movies', component: MovieComponent } | ||
]; | ||
|
||
@NgModule({ | ||
imports: [RouterModule.forChild(routes)], | ||
exports: [RouterModule] | ||
}) | ||
export class MovieRoutingModule { } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,33 @@ | ||
<app-search-bar></app-search-bar> | ||
<app-loader [loading]="!movies"></app-loader> | ||
|
||
|
||
<div class="ngmp-main-container"> | ||
|
||
<div *ngIf="movies" class="ngmp-movies-container"> | ||
<div class="ngmp-movies-list-header"> | ||
<span class="ngmp-movies-count"> | ||
{{movies.length}} Movies | ||
</span> | ||
<div class="ngmp-movies-sort"> | ||
SORT BY: | ||
<select [(ngModel)]="sortBy"> | ||
<option value="rate">Rate</option> | ||
<option value="id">Lastest</option> | ||
</select> | ||
</div> | ||
</div> | ||
<hr> | ||
<div class="ngmp-movies-list"> | ||
<div *ngFor="let movie of movies" class="ngmp-movie"> | ||
<a [routerLink]=""> | ||
<figure> | ||
<img src="{{movie.Poster}}" alt="movie poster"> | ||
</figure> | ||
<h3 class="ngmp-movie-title">{{movie.Title}}</h3> | ||
<p class="ngmp-movie-rate">{{movie.Year}}</p> | ||
</a> | ||
</div> | ||
</div> | ||
</div> | ||
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,134 @@ | ||
@import 'variables'; | ||
|
||
:host{ | ||
display: flex; | ||
justify-content: flex-start; | ||
flex-direction: column; | ||
} | ||
|
||
|
||
.ngmp-main-container{ | ||
display: flex; | ||
justify-content: flex-start; | ||
flex-direction: row; | ||
} | ||
|
||
.ngmp-movies-container{ | ||
display: flex; | ||
justify-content: flex-start; | ||
flex-direction: column; | ||
width: 100%; | ||
max-height: 100vh; | ||
|
||
.ngmp-movies-list-header { | ||
display: flex; | ||
justify-content: space-between; | ||
align-items: center; | ||
flex-direction: row; | ||
padding: 1em; | ||
|
||
.ngmp-movies-count{ | ||
color: $secondary-title; | ||
} | ||
|
||
.ngmp-movies-sort{ | ||
color: $primary-title; | ||
padding-right: 1em; | ||
font-size: 0.8em; | ||
} | ||
|
||
select{ | ||
background-color: lighten($primary-color, 15); | ||
border: none; | ||
color: $primary-title; | ||
height: 2.5em; | ||
width: 9em; | ||
font-size: 1.2em; | ||
margin-left: 1em; | ||
} | ||
} | ||
|
||
hr{ | ||
width: 100%; | ||
border-color: $primary-color-light; | ||
opacity: 0.6; | ||
} | ||
|
||
.ngmp-movies-list{ | ||
display: flex; | ||
justify-content: flex-start; | ||
flex-direction: row; | ||
flex-wrap: wrap; | ||
padding: 1em; | ||
} | ||
|
||
.ngmp-movie{ | ||
margin-bottom: 1.8em; | ||
flex-basis: 25%; | ||
|
||
a{ | ||
color: $primary-title; | ||
} | ||
figure{ | ||
padding: 0; | ||
margin: 0; | ||
img{ | ||
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5); | ||
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5); | ||
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5); | ||
} | ||
} | ||
.ngmp-movie-title, | ||
.ngmp-movie-rate{ | ||
display: block; | ||
// margin-top: 0.3em; | ||
} | ||
|
||
.ngmp-movie-title{ | ||
color: $green; | ||
margin: 15px 0 5px; | ||
} | ||
.ngmp-movie-rate{ | ||
color: $grey; | ||
margin: 0; | ||
} | ||
} | ||
} | ||
|
||
@media only screen and (max-width : 48em) { | ||
.main-container{ | ||
flex-direction: column; | ||
|
||
.genres-list{ | ||
width: 100%; | ||
height: auto; | ||
padding: 0.8em; | ||
} | ||
.genre-list-items{ | ||
display: flex; | ||
justify-content: flex-start; | ||
flex-direction: row; | ||
overflow-x: scroll; | ||
overflow-y: hidden; | ||
margin: 0; | ||
|
||
li{ | ||
margin-right: 1em; | ||
} | ||
} | ||
|
||
.movies-container{ | ||
width: 100%; | ||
|
||
.movie{ | ||
flex-basis: 50%!important; | ||
justify-content: space-between; | ||
} | ||
figure{ | ||
img{ | ||
max-width: 8em; | ||
} | ||
} | ||
} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; | ||
|
||
import { MovieComponent } from './movie.component'; | ||
|
||
describe('MovieComponent', () => { | ||
let component: MovieComponent; | ||
let fixture: ComponentFixture<MovieComponent>; | ||
|
||
beforeEach(async(() => { | ||
TestBed.configureTestingModule({ | ||
declarations: [ MovieComponent ] | ||
}) | ||
.compileComponents(); | ||
})); | ||
|
||
beforeEach(() => { | ||
fixture = TestBed.createComponent(MovieComponent); | ||
component = fixture.componentInstance; | ||
fixture.detectChanges(); | ||
}); | ||
|
||
it('should create', () => { | ||
expect(component).toBeTruthy(); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
import { Component, OnInit } from "@angular/core"; | ||
|
||
import { Movie } from "./models/movie.models"; | ||
import { MovieService } from "./services/movie.services"; | ||
|
||
@Component({ | ||
selector: "app-movie", | ||
templateUrl: "./movie.component.html", | ||
styleUrls: ["./movie.component.scss"], | ||
}) | ||
export class MovieComponent implements OnInit { | ||
public movies: Movie[]; | ||
public visibleMovies: Movie[]; | ||
sortBy: any = "id"; | ||
public l = console.log; | ||
|
||
constructor(private movieService: MovieService) { | ||
movieService.getMovies().subscribe((movies) => { | ||
this.movies = movies; | ||
this.l("getMovies", movies); | ||
}); | ||
} | ||
|
||
ngOnInit(): void {} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,19 @@ | ||
import { NgModule } from "@angular/core"; | ||
import { CommonModule } from "@angular/common"; | ||
import { FormsModule } from "@angular/forms"; | ||
import { RouterModule } from "@angular/router"; | ||
import { HttpClientModule } from "@angular/common/http"; | ||
|
||
import { MovieRoutingModule } from "./movie-routing.module"; | ||
import { MovieComponent } from "./movie.component"; | ||
import { SearchBarComponent } from "../search-bar/search-bar.component"; | ||
import { LoaderComponent } from "../loader/loader.component"; | ||
|
||
import { MovieService } from "./services/movie.services"; | ||
|
||
@NgModule({ | ||
declarations: [MovieComponent, SearchBarComponent, LoaderComponent], | ||
imports: [CommonModule, MovieRoutingModule, FormsModule, HttpClientModule], | ||
providers: [HttpClientModule, MovieService], | ||
}) | ||
export class MovieModule {} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,46 @@ | ||
import { Injectable } from "@angular/core"; | ||
|
||
// RxJs | ||
import { Observable } from "rxjs/internal/Observable"; | ||
import { of } from "rxjs/internal/observable/of"; | ||
import { HttpClient } from "@angular/common/http"; | ||
import { catchError, tap, map } from "rxjs/operators"; | ||
|
||
import { Movie } from "../models/movie.models"; | ||
import { API_CONIG } from "../../shared/constants"; | ||
|
||
@Injectable() | ||
export class MovieService { | ||
private moviesEndpoint = `${API_CONIG.API_ENDPOINT}?apikey=${API_CONIG.API_KEY}`; | ||
constructor(private http: HttpClient) {} | ||
|
||
getMovies() { | ||
var url: string = `${this.moviesEndpoint}&s=people`; | ||
return this.http.get(url).pipe( | ||
map((res: any) => res.Search), | ||
catchError(this.handleError("getMovies", [])) | ||
); | ||
} | ||
|
||
getMovieById(id: number): Observable<Movie> { | ||
const url = `${this.moviesEndpoint}/${id}`; | ||
return this.http.get<Movie>(url).pipe( | ||
tap((_) => console.log(`fetched movie with id=${id}`)), | ||
catchError(this.handleError<Movie>(`getMovie id=${id}`)) | ||
); | ||
} | ||
|
||
/** | ||
* Handle Http operation that failed. | ||
* Let the app continue. | ||
* @param operation - name of the operation that failed | ||
* @param result - optional value to return as the observable result | ||
*/ | ||
private handleError<T>(operation = "operation", result?: T) { | ||
return (error: any): Observable<T> => { | ||
console.log(`${operation} failed: ${error.message}`); | ||
// Let the app keep running by returning an empty result. | ||
return of(result as T); | ||
}; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
import { NgModule } from '@angular/core'; | ||
import { Routes, RouterModule } from '@angular/router'; | ||
|
||
|
||
const routes: Routes = []; | ||
|
||
@NgModule({ | ||
imports: [RouterModule.forChild(routes)], | ||
exports: [RouterModule] | ||
}) | ||
export class SearchBarRoutingModule { } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
<div class="ngmp-search-bar"> | ||
<img src="assets/icons/search.svg" alt="search icon"> | ||
<input [(ngModel)]="searchText" name="searchText" type="search" placeholder="Search" aria-label="Search"> | ||
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,42 @@ | ||
@import "variables"; | ||
|
||
.ngmp-search-bar { | ||
position: relative; | ||
|
||
input { | ||
display: block; | ||
width: 100%; | ||
background-color: darken($primary-color, 4); | ||
border: 1px solid darken($primary-color, 4); | ||
color: $primary-title; | ||
padding: 1.5em; | ||
border: none; | ||
outline: none; | ||
font-size: 1em; | ||
padding-left: 4em; | ||
|
||
&::-webkit-input-placeholder { | ||
color: $primary-color-light; | ||
} | ||
|
||
&:-ms-input-placeholder { | ||
color: $primary-color-light; | ||
} | ||
|
||
&::placeholder { | ||
color: $primary-color-light; | ||
} | ||
|
||
&:focus { | ||
outline: none !important; | ||
border: 1px solid $primary-color-light; | ||
} | ||
} | ||
|
||
img { | ||
position: absolute; | ||
top: calc(50% - 1em); | ||
left: 1em; | ||
width: 2em; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; | ||
|
||
import { SearchBarComponent } from './search-bar.component'; | ||
|
||
describe('SearchBarComponent', () => { | ||
let component: SearchBarComponent; | ||
let fixture: ComponentFixture<SearchBarComponent>; | ||
|
||
beforeEach(async(() => { | ||
TestBed.configureTestingModule({ | ||
declarations: [ SearchBarComponent ] | ||
}) | ||
.compileComponents(); | ||
})); | ||
|
||
beforeEach(() => { | ||
fixture = TestBed.createComponent(SearchBarComponent); | ||
component = fixture.componentInstance; | ||
fixture.detectChanges(); | ||
}); | ||
|
||
it('should create', () => { | ||
expect(component).toBeTruthy(); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
import { Component, OnInit } from '@angular/core'; | ||
|
||
@Component({ | ||
selector: 'app-search-bar', | ||
templateUrl: './search-bar.component.html', | ||
styleUrls: ['./search-bar.component.scss'] | ||
}) | ||
export class SearchBarComponent implements OnInit { | ||
searchText: any = ''; | ||
constructor() { } | ||
|
||
ngOnInit(): void { | ||
} | ||
|
||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
import { NgModule } from '@angular/core'; | ||
import { CommonModule } from '@angular/common'; | ||
|
||
import { SearchBarRoutingModule } from './search-bar-routing.module'; | ||
|
||
|
||
@NgModule({ | ||
declarations: [], | ||
imports: [ | ||
CommonModule, | ||
SearchBarRoutingModule | ||
] | ||
}) | ||
export class SearchBarModule { } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
export class API_CONIG { | ||
public static API_ENDPOINT='http://www.omdbapi.com/'; | ||
public static API_KEY='f79aeba3'; | ||
} | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
import { NgModule } from '@angular/core'; | ||
import { Routes, RouterModule } from '@angular/router'; | ||
|
||
|
||
const routes: Routes = []; | ||
|
||
@NgModule({ | ||
imports: [RouterModule.forChild(routes)], | ||
exports: [RouterModule] | ||
}) | ||
export class SidebarRoutingModule { } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
<div class="sidebar"> | ||
<a href="">BM</a> | ||
<nav> | ||
<a href="#"> | ||
<img src="assets/icons/eye.svg" alt="sidebar nav link icon"> | ||
</a> | ||
<a href="#" class="active"> | ||
<img src="assets/icons/monitor.svg" alt="sidebar nav link icon"> | ||
</a> | ||
<a href="#"> | ||
<img src="assets/icons/folder.svg" alt="sidebar nav link icon"> | ||
</a> | ||
<a href="#"> | ||
<img src="assets/icons/heart.svg" alt="sidebar nav link icon"> | ||
</a> | ||
</nav> | ||
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,41 @@ | ||
@import "variables"; | ||
|
||
.sidebar { | ||
width: 100px; | ||
height: 100vh; | ||
display: flex; | ||
flex-direction: column; | ||
justify-content: flex-start; | ||
align-items: center; | ||
padding: 1em 0; | ||
border-right: 1px solid; | ||
|
||
a { | ||
color: $light; | ||
} | ||
|
||
nav { | ||
width: 100%; | ||
display: flex; | ||
flex-direction: column; | ||
text-align: center; | ||
margin-top: 2em; | ||
|
||
a { | ||
padding: 0.5em; | ||
margin-bottom: 0.5em; | ||
|
||
&.active { | ||
background-color: $secondary-color; | ||
} | ||
} | ||
|
||
img { | ||
max-width: 1.5em; | ||
} | ||
} | ||
|
||
@media only screen and (max-width: 48em) { | ||
width: 50px; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; | ||
|
||
import { SidebarComponent } from './sidebar.component'; | ||
|
||
describe('SidebarComponent', () => { | ||
let component: SidebarComponent; | ||
let fixture: ComponentFixture<SidebarComponent>; | ||
|
||
beforeEach(async(() => { | ||
TestBed.configureTestingModule({ | ||
declarations: [ SidebarComponent ] | ||
}) | ||
.compileComponents(); | ||
})); | ||
|
||
beforeEach(() => { | ||
fixture = TestBed.createComponent(SidebarComponent); | ||
component = fixture.componentInstance; | ||
fixture.detectChanges(); | ||
}); | ||
|
||
it('should create', () => { | ||
expect(component).toBeTruthy(); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
import { Component, OnInit } from '@angular/core'; | ||
|
||
@Component({ | ||
selector: 'app-sidebar', | ||
templateUrl: './sidebar.component.html', | ||
styleUrls: ['./sidebar.component.scss'] | ||
}) | ||
export class SidebarComponent implements OnInit { | ||
|
||
constructor() { } | ||
|
||
ngOnInit(): void { | ||
} | ||
|
||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
import { NgModule } from '@angular/core'; | ||
import { CommonModule } from '@angular/common'; | ||
|
||
import { SidebarRoutingModule } from './sidebar-routing.module'; | ||
import { SidebarComponent } from './sidebar.component'; | ||
|
||
|
||
@NgModule({ | ||
exports: [ SidebarComponent ], | ||
declarations: [ SidebarComponent ], | ||
imports: [ | ||
CommonModule, | ||
SidebarRoutingModule | ||
] | ||
}) | ||
export class SidebarModule { } |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
$green: #67e419; | ||
$grey: #f3f3f3; | ||
$blue: #25282d; | ||
$lightBlue: #00B5E9; | ||
$light: #ffffff; | ||
$dark: #000000; | ||
$yellow: #FFB11A; | ||
|
||
|
||
$primary-color: $blue; | ||
$primary-color-dark: darken($primary-color, 8); | ||
$primary-color-light: lighten($primary-color, 10); | ||
$secondary-color: $green; | ||
|
||
$primary-link: $blue; | ||
$secondary-link: $lightBlue; | ||
|
||
$primary-title: $light; | ||
$secondary-title: $yellow; | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
@import 'variables'; | ||
|
||
html { | ||
font-size: 62.5%; /* with the standard base font size of 16px this will be equal to 10px */ | ||
} | ||
body { | ||
font-size: 160%; /* 160% of 10px ~ 16px, understood by all browsers */ | ||
font-size: 1.6rem; /* 1.6 * 10px ~ 16px, understood by all major browsers and IE9+ */ | ||
margin: 0; | ||
padding: 0; | ||
background: $blue; | ||
box-sizing: border-box; | ||
font-family: -apple-system, 'BlinkMacSystemFont', '.SFNSDisplay-Regular', | ||
'San Francisco', 'Roboto', 'Segoe UI', 'Helvetica Neue', 'Lucida Grande', | ||
sans-serif; | ||
} | ||
|
||
*, | ||
*:before, | ||
*:after { | ||
box-sizing: inherit; | ||
font-family: inherit; | ||
} |