-avancement page filters
This commit is contained in:
parent
4f780d53d5
commit
d495bcc342
@ -5,12 +5,14 @@ import { HomePageComponent } from './pages/home-page/home-page.component';
|
||||
import { ListCategoriesComponent } from './pages/list-categories/list-categories.component';
|
||||
import { RestoPageComponent } from './pages/resto-page/resto-page.component';
|
||||
import { PageNotFoundComponent } from './pages/page-not-found/page-not-found.component';
|
||||
import { FiltersPageComponent } from './pages/filters-page/filters-page.component';
|
||||
|
||||
const routes: Routes = [
|
||||
{ path: '', redirectTo: 'home', pathMatch: 'full' },
|
||||
{ path: 'home', component: HomePageComponent },
|
||||
{ path: 'categories', component: ListCategoriesComponent },
|
||||
{ path: 'favoris', component: FavorisUserComponent },
|
||||
{ path: 'filters', component: FiltersPageComponent },
|
||||
{ path: 'Deconnexion', redirectTo: 'home'},
|
||||
{path: 'restaurants',component: RestoPageComponent},
|
||||
{path: 'page-not-found',component: PageNotFoundComponent},
|
||||
|
@ -14,6 +14,7 @@ import { ListCategoriesComponent } from './pages/list-categories/list-categories
|
||||
|
||||
import { RestoPageComponent } from './pages/resto-page/resto-page.component';
|
||||
import { PageNotFoundComponent } from './pages/page-not-found/page-not-found.component';
|
||||
import { FiltersPageComponent } from './pages/filters-page/filters-page.component';
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
@ -26,7 +27,8 @@ import { PageNotFoundComponent } from './pages/page-not-found/page-not-found.com
|
||||
HomePageComponent,
|
||||
ListCategoriesComponent,
|
||||
RestoPageComponent,
|
||||
PageNotFoundComponent
|
||||
PageNotFoundComponent,
|
||||
FiltersPageComponent
|
||||
],
|
||||
imports: [
|
||||
BrowserModule,
|
||||
|
@ -13,7 +13,7 @@
|
||||
<div class="navbar-nav ">
|
||||
<a routerLink="home" routerLinkActive="active-custom" class="nav-link p-5 " style="font-size: 25px;">Accueil</a>
|
||||
<a routerLink="categories" routerLinkActive="active-custom" class="nav-link p-5" style="font-size: 25px;">Categories</a>
|
||||
<a routerLink="filtres" routerLinkActive="active-custom" class="nav-link p-5" style="font-size: 25px;">Filtres</a>
|
||||
<a routerLink="filters" routerLinkActive="active-custom" class="nav-link p-5" style="font-size: 25px;">Filtres</a>
|
||||
<a routerLink="favoris" routerLinkActive="active-custom" class="nav-link p-5" style="font-size: 25px;">Mes favoris</a>
|
||||
<a routerLink="deconnexion" routerLinkActive="active-custom" class="nav-link p-5" style="font-size: 25px;">Deconnexion</a>
|
||||
</div>
|
||||
|
87
src/app/pages/filters-page/filters-page.component.html
Normal file
87
src/app/pages/filters-page/filters-page.component.html
Normal file
@ -0,0 +1,87 @@
|
||||
<h2 class="titre ">Filtres :</h2>
|
||||
<div class="separation"></div>
|
||||
|
||||
|
||||
|
||||
<div class="accordion" id="accordionPanelsStayOpenExample">
|
||||
<!-- <div class="accordion-item"> -->
|
||||
<h2 class="accordion-header" id="panelsStayOpen-headingOne">
|
||||
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseOne" aria-expanded="true" aria-controls="panelsStayOpen-collapseOne">
|
||||
Distance
|
||||
</button>
|
||||
</h2>
|
||||
<div id="panelsStayOpen-collapseOne" class="accordion-collapse collapse show" aria-labelledby="panelsStayOpen-headingOne">
|
||||
<div class="accordion-body">
|
||||
test
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!-- <div class="accordion-item"> -->
|
||||
<h2 class="accordion-header" id="panelsStayOpen-headingTwo">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseTwo" aria-expanded="false" aria-controls="panelsStayOpen-collapseTwo">
|
||||
Prix
|
||||
</button>
|
||||
</h2>
|
||||
<div id="panelsStayOpen-collapseTwo" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingTwo">
|
||||
<div class="accordion-body">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2 class="accordion-header" id="panelsStayOpen-headingThree">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseThree" aria-expanded="false" aria-controls="panelsStayOpen-collapseTwo">
|
||||
Prix
|
||||
</button>
|
||||
</h2>
|
||||
<div id="panelsStayOpen-collapseThree" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingThree">
|
||||
<div class="accordion-body">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- <div class="accordion-item">
|
||||
<h2 class="accordion-header" id="panelsStayOpen-headingThree">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseThree" aria-expanded="false" aria-controls="panelsStayOpen-collapseThree">
|
||||
Sur Place / A emporter
|
||||
</button>
|
||||
</h2>
|
||||
<div id="panelsStayOpen-collapseThree" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingThree">
|
||||
<div class="accordion-body">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="panelsStayOpen-headingFour">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseFour" aria-expanded="false" aria-controls="panelsStayOpen-collapseThree">
|
||||
Acces PMR
|
||||
</button>
|
||||
</h2>
|
||||
<div id="panelsStayOpen-collapseFour" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingFour">
|
||||
<div class="accordion-body">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="panelsStayOpen-headingFive">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseFive" aria-expanded="false" aria-controls="panelsStayOpen-collapseThree">
|
||||
Avis
|
||||
</button>
|
||||
</h2>
|
||||
<div id="panelsStayOpen-collapseFive" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingFive">
|
||||
<div class="accordion-body">
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
|
||||
<button class="btn-search btn-primary" type="button">Lancer la recherche</button>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
54
src/app/pages/filters-page/filters-page.component.scss
Normal file
54
src/app/pages/filters-page/filters-page.component.scss
Normal file
@ -0,0 +1,54 @@
|
||||
|
||||
.separation{
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
border-bottom: 2px solid #CE0000;
|
||||
max-width: 83%;
|
||||
}
|
||||
|
||||
.titre{
|
||||
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
margin: 0 0 0.5em 8.2em;
|
||||
color: #CE0000;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.accordion{
|
||||
padding-top: 200px;
|
||||
max-width: 50%;
|
||||
margin : 0 auto;
|
||||
padding-bottom: 200px;
|
||||
border-radius: 20px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.accordion-header{
|
||||
|
||||
margin-bottom: 70px;
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
.accordion-button{
|
||||
background-color: #CE0000;
|
||||
color: white;
|
||||
font-family: cursive;
|
||||
border-radius: 30px 30px 30px 30px;
|
||||
padding-top: 50px;
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
.btn-search{
|
||||
background-color: #CE0000;
|
||||
text-align: center;
|
||||
margin: 100px auto;
|
||||
border-radius: 20px;
|
||||
display: block;
|
||||
}
|
25
src/app/pages/filters-page/filters-page.component.spec.ts
Normal file
25
src/app/pages/filters-page/filters-page.component.spec.ts
Normal file
@ -0,0 +1,25 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { FiltersPageComponent } from './filters-page.component';
|
||||
|
||||
describe('FiltersPageComponent', () => {
|
||||
let component: FiltersPageComponent;
|
||||
let fixture: ComponentFixture<FiltersPageComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ FiltersPageComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(FiltersPageComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
15
src/app/pages/filters-page/filters-page.component.ts
Normal file
15
src/app/pages/filters-page/filters-page.component.ts
Normal file
@ -0,0 +1,15 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-filters-page',
|
||||
templateUrl: './filters-page.component.html',
|
||||
styleUrls: ['./filters-page.component.scss']
|
||||
})
|
||||
export class FiltersPageComponent implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
|
||||
}
|
@ -1,3 +1,2 @@
|
||||
<h2 class="titre ">Catégories :</h2>
|
||||
<div class="separation"></div>
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user