Skip to content

A
allo-app
Commit b306fa0f by Nabil Sadki
Options

Classement

parent 459c4440
Showing with 800 additions and 91 deletions
src/app/app-routing.module.ts
...@@ -8,8 +8,6 @@ const routes: Routes = [ ...@@ -8,8 +8,6 @@ const routes: Routes = [
{ path: 'mainslider', loadChildren: './pages/mainslider/mainslider.module#MainsliderPageModule' }, { path: 'mainslider', loadChildren: './pages/mainslider/mainslider.module#MainsliderPageModule' },
{ path: 'app', loadChildren: './pages/menu/menu.module#MenuPageModule' }, { path: 'app', loadChildren: './pages/menu/menu.module#MenuPageModule' },
{ path: 'offre-details', loadChildren: './pages/offre-details/offre-details.module#OffreDetailsPageModule' }, { path: 'offre-details', loadChildren: './pages/offre-details/offre-details.module#OffreDetailsPageModule' },
]; ];
@NgModule({ @NgModule({
......
src/app/app.component.ts
...@@ -7,9 +7,6 @@ import { SplashScreen } from '@ionic-native/splash-screen/ngx'; ...@@ -7,9 +7,6 @@ import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx'; import { StatusBar } from '@ionic-native/status-bar/ngx';
import { LocalNotifications } from '@ionic-native/local-notifications/ngx'; import { LocalNotifications } from '@ionic-native/local-notifications/ngx';
import { TripService } from './services/trip-service';
// import { LocationService } from './services/location-service';
@Component({ @Component({
selector: 'app-root', selector: 'app-root',
templateUrl: 'app.component.html' templateUrl: 'app.component.html'
......
src/app/pages/classement/classement.page.html
...@@ -25,19 +25,20 @@ ...@@ -25,19 +25,20 @@
<ion-grid no-padding> <ion-grid no-padding>
<ion-row> <ion-row>
<ion-col class="ion-text-center" no-padding> <ion-col class="ion-text-center" no-padding>
<ion-badge>#1</ion-badge> <!-- <ion-badge>#1</ion-badge> -->
<ion-img class="crown" src="../../assets/img/ressources/crown.png"></ion-img>
</ion-col> </ion-col>
</ion-row> </ion-row>
<ion-row> <ion-row>
<ion-col class="ion-text-center" no-padding> <ion-col class="ion-text-center" no-padding>
<ion-avatar padding-vertical> <ion-avatar padding-bottom>
<ion-img src="../../assets/img/avatar.jpeg"></ion-img> <ion-img src="../../assets/img/avatar.jpeg"></ion-img>
</ion-avatar> </ion-avatar>
</ion-col> </ion-col>
</ion-row> </ion-row>
<ion-row> <ion-row>
<ion-col class="ion-text-center" no-padding> <ion-col class="ion-text-center" no-padding>
<ion-badge color="success">5 263 Exp</ion-badge> <ion-badge color="warning">Legendaire</ion-badge>
</ion-col> </ion-col>
</ion-row> </ion-row>
</ion-grid> </ion-grid>
...@@ -86,7 +87,7 @@ ...@@ -86,7 +87,7 @@
</ion-row> </ion-row>
<ion-row> <ion-row>
<ion-col class="ion-text-center" no-padding> <ion-col class="ion-text-center" no-padding>
2 541 10 542
</ion-col> </ion-col>
<ion-col class="ion-text-center" no-padding> <ion-col class="ion-text-center" no-padding>
Oui Oui
...@@ -121,32 +122,13 @@ ...@@ -121,32 +122,13 @@
<ion-icon name="calendar"></ion-icon> <ion-icon name="calendar"></ion-icon>
28/08/2019 28/08/2019
</p> </p>
<ion-badge color="purple">Epic</ion-badge>
<ion-chip color="success" no-margin> <ion-chip color="success" no-margin>
<ion-icon name="ribbon"></ion-icon> <ion-icon name="ribbon"></ion-icon>
<ion-label>5 000</ion-label> <ion-label>5 000</ion-label>
</ion-chip> </ion-chip>
</ion-text> </ion-text>
</ion-col> </ion-col>
<!-- <ion-grid no-padding>
<ion-row>
<ion-col class="ion-text-center" no-padding>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="ion-text-center" no-padding>
<ion-avatar padding-vertical>
<ion-img src="../../assets/img/avatar.jpeg"></ion-img>
</ion-avatar>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="ion-text-center" no-padding>
<ion-badge color="success">5 263 Exp</ion-badge>
</ion-col>
</ion-row>
</ion-grid> -->
<!-- Second column -->
</ion-row> </ion-row>
</ion-grid> </ion-grid>
</ion-card> </ion-card>
...@@ -173,26 +155,6 @@ ...@@ -173,26 +155,6 @@
</ion-chip> </ion-chip>
</ion-text> </ion-text>
</ion-col> </ion-col>
<!-- <ion-grid no-padding>
<ion-row>
<ion-col class="ion-text-center" no-padding>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="ion-text-center" no-padding>
<ion-avatar padding-vertical>
<ion-img src="../../assets/img/avatar.jpeg"></ion-img>
</ion-avatar>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="ion-text-center" no-padding>
<ion-badge color="success">5 263 Exp</ion-badge>
</ion-col>
</ion-row>
</ion-grid> -->
<!-- Second column -->
</ion-row> </ion-row>
</ion-grid> </ion-grid>
</ion-card> </ion-card>
...@@ -220,26 +182,6 @@ ...@@ -220,26 +182,6 @@
</ion-chip> </ion-chip>
</ion-text> </ion-text>
</ion-col> </ion-col>
<!-- <ion-grid no-padding>
<ion-row>
<ion-col class="ion-text-center" no-padding>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="ion-text-center" no-padding>
<ion-avatar padding-vertical>
<ion-img src="../../assets/img/avatar.jpeg"></ion-img>
</ion-avatar>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="ion-text-center" no-padding>
<ion-badge color="success">5 263 Exp</ion-badge>
</ion-col>
</ion-row>
</ion-grid> -->
<!-- Second column -->
</ion-row> </ion-row>
</ion-grid> </ion-grid>
</ion-card> </ion-card>
...@@ -267,26 +209,140 @@ ...@@ -267,26 +209,140 @@
</ion-chip> </ion-chip>
</ion-text> </ion-text>
</ion-col> </ion-col>
<!-- <ion-grid no-padding> </ion-row>
<ion-row> </ion-grid>
<ion-col class="ion-text-center" no-padding> </ion-card>
</ion-col> <ion-card color="gradgrey" class="mini" no-margin margin-horizontal margin-bottom>
</ion-row> <ion-grid no-padding>
<ion-row> <ion-row>
<ion-col class="ion-text-center" no-padding> <!-- First column -->
<ion-avatar padding-vertical> <ion-col size="2" no-padding>
<ion-img src="../../assets/img/avatar.jpeg"></ion-img> <ion-badge class="rank" color="blue">#6</ion-badge>
</ion-avatar> </ion-col>
</ion-col> <ion-col class="ion-text-left" no-padding>
</ion-row> <ion-avatar class="ion-float-left">
<ion-row> <!-- <ion-img src="../../assets/img/avatar.jpeg"></ion-img> -->
<ion-col class="ion-text-center" no-padding> <ion-icon name="contact" color="dark"></ion-icon>
<ion-badge color="success">5 263 Exp</ion-badge> </ion-avatar>
</ion-col> <ion-text class="ion-float-left">
</ion-row> <h2 no-margin>Mohammed Ziyad</h2>
</ion-grid> --> <p no-margin>
<!-- Second column --> <ion-icon name="calendar"></ion-icon>
28/08/2019
</p>
<ion-chip color="success" no-margin>
<ion-icon name="ribbon"></ion-icon>
<ion-label>1 630</ion-label>
</ion-chip>
</ion-text>
</ion-col>
</ion-row>
</ion-grid>
</ion-card>
<ion-card color="gradgrey" class="mini" no-margin margin-horizontal margin-bottom>
<ion-grid no-padding>
<ion-row>
<!-- First column -->
<ion-col size="2" no-padding>
<ion-badge class="rank" color="rose">#7</ion-badge>
</ion-col>
<ion-col class="ion-text-left" no-padding>
<ion-avatar class="ion-float-left">
<ion-img src="../../assets/img/avatar.jpeg"></ion-img>
</ion-avatar>
<ion-text class="ion-float-left">
<h2 no-margin>Sofia Ouardi
<ion-icon name="card"></ion-icon></h2>
<p no-margin>
<ion-icon name="calendar"></ion-icon>
28/08/2019
</p>
<ion-chip color="success" no-margin>
<ion-icon name="ribbon"></ion-icon>
<ion-label>1 210</ion-label>
</ion-chip>
</ion-text>
</ion-col>
</ion-row>
</ion-grid>
</ion-card>
<ion-card color="gradgrey" class="mini" no-margin margin-horizontal margin-bottom>
<ion-grid no-padding>
<ion-row>
<!-- First column -->
<ion-col size="2" no-padding>
<ion-badge class="rank" color="rose">#8</ion-badge>
</ion-col>
<ion-col class="ion-text-left" no-padding>
<ion-avatar class="ion-float-left">
<ion-img src="../../assets/img/avatar.jpeg"></ion-img>
</ion-avatar>
<ion-text class="ion-float-left">
<h2 no-margin>Ouafae Bicha</h2>
<p no-margin>
<ion-icon name="calendar"></ion-icon>
28/08/2019
</p>
<ion-chip color="success" no-margin>
<ion-icon name="ribbon"></ion-icon>
<ion-label>851</ion-label>
</ion-chip>
</ion-text>
</ion-col>
</ion-row>
</ion-grid>
</ion-card>
<ion-card color="gradgrey" class="mini" no-margin margin-horizontal margin-bottom>
<ion-grid no-padding>
<ion-row>
<!-- First column -->
<ion-col size="2" no-padding>
<ion-badge class="rank" color="blue">#9</ion-badge>
</ion-col>
<ion-col class="ion-text-left" no-padding>
<ion-avatar class="ion-float-left">
<ion-img src="../../assets/img/avatar.jpeg"></ion-img>
</ion-avatar>
<ion-text class="ion-float-left">
<h2 no-margin>Aissam Hadari
<ion-icon name="card"></ion-icon></h2>
<p no-margin>
<ion-icon name="calendar"></ion-icon>
28/08/2019
</p>
<ion-chip color="success" no-margin>
<ion-icon name="ribbon"></ion-icon>
<ion-label>700</ion-label>
</ion-chip>
</ion-text>
</ion-col>
</ion-row>
</ion-grid>
</ion-card>
<ion-card color="gradgrey" class="mini" no-margin margin-horizontal margin-bottom>
<ion-grid no-padding>
<ion-row>
<!-- First column -->
<ion-col size="2" no-padding>
<ion-badge class="rank" color="blue">#10</ion-badge>
</ion-col>
<ion-col class="ion-text-left" no-padding>
<ion-avatar class="ion-float-left">
<ion-img src="../../assets/img/avatar.jpeg"></ion-img>
</ion-avatar>
<ion-text class="ion-float-left">
<h2 no-margin>Anass Seghir
<ion-icon name="card"></ion-icon></h2>
<p no-margin>
<ion-icon name="calendar"></ion-icon>
28/08/2019
</p>
<ion-chip color="success" no-margin>
<ion-icon name="ribbon"></ion-icon>
<ion-label>630</ion-label>
</ion-chip>
</ion-text>
</ion-col>
</ion-row> </ion-row>
</ion-grid> </ion-grid>
</ion-card> </ion-card>
......
src/app/pages/classement/classement.page.scss
...@@ -20,9 +20,18 @@ ion-list { ...@@ -20,9 +20,18 @@ ion-list {
} }
ion-card { ion-card {
font-family: Abel, Arial, Verdana, sans-serif; font-family: Abel, Arial, Verdana, sans-serif;
ion-img.crown {
position: relative;
z-index: 99;
margin-bottom: -15px;
}
ion-avatar { ion-avatar {
width: 100%; width: 100%;
height: 100%; height: 100%;
ion-icon {
width: 100% !important;
height: 100% !important;
}
} }
ion-badge { ion-badge {
font-family: Abel, Arial, Verdana, sans-serif; font-family: Abel, Arial, Verdana, sans-serif;
......
src/app/pages/hauts-faits/hauts-faits.module.ts
...@@ -10,7 +10,32 @@ import { HautsFaitsPage } from './hauts-faits.page'; ...@@ -10,7 +10,32 @@ import { HautsFaitsPage } from './hauts-faits.page';
const routes: Routes = [ const routes: Routes = [
{ {
path: '', path: '',
component: HautsFaitsPage component: HautsFaitsPage,
children: [
{
path: 'merites',
children: [
{
path: '',
loadChildren: '../../pages/progress-merites/progress-merites.module#ProgressMeritesPageModule'
},
]
},
{
path: 'exp',
children: [
{
path: '',
loadChildren: '../../pages/progress-exp/progress-exp.module#ProgressExpPageModule'
},
]
},
{
path: '',
redirectTo: '/app/hauts-faits/merites',
pathMatch: 'full'
}
]
} }
]; ];
...@@ -23,4 +48,4 @@ const routes: Routes = [ ...@@ -23,4 +48,4 @@ const routes: Routes = [
], ],
declarations: [HautsFaitsPage] declarations: [HautsFaitsPage]
}) })
export class HautsFaitsPageModule {} export class HautsFaitsPageModule { }
src/app/pages/progress-exp/progress-exp.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';
import { IonicModule } from '@ionic/angular';
import { ProgressExpPage } from './progress-exp.page';
const routes: Routes = [
{
path: '',
component: ProgressExpPage
}
];
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
RouterModule.forChild(routes)
],
declarations: [ProgressExpPage]
})
export class ProgressExpPageModule {}
src/app/pages/progress-exp/progress-exp.page.html 0 → 100644
<ion-content>
<ion-text class="ion-text-center">
<h1>Progrès</h1>
</ion-text>
<ion-grid>
<ion-row>
<ion-col size="2"></ion-col>
<ion-col>
<ion-img src="../../assets/img/ressources/checklist.png"></ion-img>
</ion-col>
<ion-col size="2"></ion-col>
</ion-row>
</ion-grid>
<!-- <ion-card no-margin margin-horizontal margin-bottom padding-bottom> -->
<ion-list>
<ion-list-header color="light">Connexion</ion-list-header>
<ion-item lines="none" margin-top>
<ion-icon class="ach-icon" name="checkmark-circle-outline" color="success" slot="start"></ion-icon>
<ion-label no-margin>
<h2>Everyday</h2>
<p>Connexion hebdomadaire.</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="trending-up" color="blue"></ion-icon>
<ion-label>20</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
1/1
<ion-progress-bar color="success" value="1">1/1</ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
<ion-item lines="none" margin-top>
<ion-icon class="ach-icon" name="power" slot="start"></ion-icon>
<ion-label no-margin>
<h2>On s'habitue</h2>
<p>Se connecter 7 fois successives à l'application.</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="trending-up" color="blue"></ion-icon>
<ion-label>50</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
1/7
<ion-progress-bar color="primary" value="0.143"></ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
<ion-item lines="none" margin-vertical>
<ion-icon class="ach-icon" name="power" slot="start"></ion-icon>
<ion-label no-margin>
<h2>Toujours en ligne!</h2>
<p>Se connecter 30 fois successives à l'application.</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="trending-up" color="blue"></ion-icon>
<ion-label>200</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
1/30
<ion-progress-bar color="primary" value="0.033"></ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
</ion-list>
<!-- </ion-card> -->
<!-- <ion-card no-margin margin-horizontal margin-bottom padding-bottom> -->
<ion-list>
<ion-list-header color="light">Parrainage</ion-list-header>
<ion-item lines="none" margin-top>
<ion-icon class="ach-icon" name="checkmark-circle-outline" color="success" slot="start"></ion-icon>
<ion-label no-margin>
<h2>Viens, je te montre un truc</h2>
<p>Parrainer un(e) ami(e).</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="trending-up" color="blue"></ion-icon>
<ion-label>40</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
1/1
<ion-progress-bar color="success" value="1"></ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
<ion-item lines="none" margin-top>
<ion-icon class="ach-icon" name="contacts" slot="start"></ion-icon>
<ion-label no-margin>
<h2>C'est super à 5!</h2>
<p>Parrainer 5 ami(e)s.</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="trending-up" color="blue"></ion-icon>
<ion-label>200</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
4/5
<ion-progress-bar color="primary" value="0.8"></ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
<ion-item lines="none" margin-vertical>
<ion-icon class="ach-icon" name="contacts" slot="start"></ion-icon>
<ion-label no-margin>
<h2>A 10, c'est encore mieux!!</h2>
<p>Parrainer 10 ami(e)s.</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="trending-up" color="blue"></ion-icon>
<ion-label>500</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
4/10
<ion-progress-bar color="primary" value="0.4"></ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
<ion-item lines="none" margin-vertical>
<ion-icon class="ach-icon" name="contacts" slot="start"></ion-icon>
<ion-label no-margin>
<h2>Father</h2>
<p>Parrainer 30 ami(e)s.</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="trending-up" color="blue"></ion-icon>
<ion-label>1700</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
4/30
<ion-progress-bar color="primary" value="0.133"></ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
<ion-item lines="none" margin-vertical>
<ion-icon class="ach-icon" name="contacts" slot="start"></ion-icon>
<ion-label no-margin>
<h2>Godfather</h2>
<p>Parrainer 50 ami(e)s.</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="trending-up" color="blue"></ion-icon>
<ion-label>3000</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
4/50
<ion-progress-bar color="primary" value="0.08"></ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
</ion-list>
<!-- </ion-card> -->
</ion-content>
\ No newline at end of file
src/app/pages/progress-exp/progress-exp.page.scss 0 → 100644
ion-item {
border: 1px solid var(--ion-color-light);
border-radius: 15px;
margin: 10px;
padding: 5px;
background: #fff;
.item-native {
border-radius: 15px;
}
ion-icon.ach-icon {
font-size: 3em;
}
h2 {
font-weight: bold;
}
ion-progress-bar {
height: 10px;
border-radius: 5px;
}
}
\ No newline at end of file
src/app/pages/progress-exp/progress-exp.page.spec.ts 0 → 100644
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ProgressExpPage } from './progress-exp.page';
describe('ProgressExpPage', () => {
let component: ProgressExpPage;
let fixture: ComponentFixture<ProgressExpPage>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ProgressExpPage ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ProgressExpPage);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/pages/progress-exp/progress-exp.page.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-progress-exp',
templateUrl: './progress-exp.page.html',
styleUrls: ['./progress-exp.page.scss'],
})
export class ProgressExpPage implements OnInit {
constructor() { }
ngOnInit() {
}
}
src/app/pages/progress-merites/progress-merites.module.ts 0 → 100644
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';
import { IonicModule } from '@ionic/angular';
import { ProgressMeritesPage } from './progress-merites.page';
const routes: Routes = [
{
path: '',
component: ProgressMeritesPage
}
];
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
RouterModule.forChild(routes)
],
declarations: [ProgressMeritesPage]
})
export class ProgressMeritesPageModule {}
src/app/pages/progress-merites/progress-merites.page.html 0 → 100644
<ion-content>
<ion-text class="ion-text-center">
<h1>Progrès</h1>
</ion-text>
<ion-grid>
<ion-row>
<ion-col size="2"></ion-col>
<ion-col>
<ion-img src="../../assets/img/ressources/checklist.png"></ion-img>
</ion-col>
<ion-col size="2"></ion-col>
</ion-row>
</ion-grid>
<!-- <ion-card no-margin margin-horizontal margin-bottom padding-bottom> -->
<ion-list>
<ion-list-header color="light">Connexion</ion-list-header>
<ion-item lines="none" margin-top>
<ion-icon class="ach-icon" name="checkmark-circle-outline" color="success" slot="start"></ion-icon>
<ion-label no-margin>
<h2>Marhba!</h2>
<p>Se connecter une seul fois à l'application.</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="ribbon" color="secondary"></ion-icon>
<ion-label>20</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
1/1
<ion-progress-bar color="success" value="1">1/1</ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
<ion-item lines="none" margin-top>
<ion-icon class="ach-icon" name="power" slot="start"></ion-icon>
<ion-label no-margin>
<h2>On s'habitue</h2>
<p>Se connecter 7 fois successives à l'application.</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="ribbon" color="secondary"></ion-icon>
<ion-label>50</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
1/7
<ion-progress-bar color="primary" value="0.143"></ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
<ion-item lines="none" margin-vertical>
<ion-icon class="ach-icon" name="power" slot="start"></ion-icon>
<ion-label no-margin>
<h2>Toujours en ligne!</h2>
<p>Se connecter 30 fois successives à l'application.</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="ribbon" color="secondary"></ion-icon>
<ion-label>200</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
1/30
<ion-progress-bar color="primary" value="0.033"></ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
</ion-list>
<!-- </ion-card> -->
<!-- <ion-card no-margin margin-horizontal margin-bottom padding-bottom> -->
<ion-list>
<ion-list-header color="light">Parrainage</ion-list-header>
<ion-item lines="none" margin-top>
<ion-icon class="ach-icon" name="checkmark-circle-outline" color="success" slot="start"></ion-icon>
<ion-label no-margin>
<h2>Viens, je te montre un truc</h2>
<p>Parrainer un(e) ami(e).</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="ribbon" color="secondary"></ion-icon>
<ion-label>40</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
1/1
<ion-progress-bar color="success" value="1"></ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
<ion-item lines="none" margin-top>
<ion-icon class="ach-icon" name="contacts" slot="start"></ion-icon>
<ion-label no-margin>
<h2>C'est super à 5!</h2>
<p>Parrainer 5 ami(e)s.</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="ribbon" color="secondary"></ion-icon>
<ion-label>200</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
4/5
<ion-progress-bar color="primary" value="0.8"></ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
<ion-item lines="none" margin-vertical>
<ion-icon class="ach-icon" name="contacts" slot="start"></ion-icon>
<ion-label no-margin>
<h2>A 10, c'est encore mieux!!</h2>
<p>Parrainer 10 ami(e)s.</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="ribbon" color="secondary"></ion-icon>
<ion-label>500</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
4/10
<ion-progress-bar color="primary" value="0.4"></ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
<ion-item lines="none" margin-vertical>
<ion-icon class="ach-icon" name="contacts" slot="start"></ion-icon>
<ion-label no-margin>
<h2>Father</h2>
<p>Parrainer 30 ami(e)s.</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="ribbon" color="secondary"></ion-icon>
<ion-label>1700</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
4/30
<ion-progress-bar color="primary" value="0.133"></ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
<ion-item lines="none" margin-vertical>
<ion-icon class="ach-icon" name="contacts" slot="start"></ion-icon>
<ion-label no-margin>
<h2>Godfather</h2>
<p>Parrainer 50 ami(e)s.</p>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start" size="5">
<ion-chip outline="true">
<ion-icon name="ribbon" color="secondary"></ion-icon>
<ion-label>3000</ion-label>
</ion-chip>
</ion-col>
<ion-col no-padding class="ion-text-end" size="7">
4/50
<ion-progress-bar color="primary" value="0.08"></ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
</ion-list>
<!-- </ion-card> -->
</ion-content>
\ No newline at end of file
src/app/pages/progress-merites/progress-merites.page.scss 0 → 100644
ion-item {
border: 1px solid var(--ion-color-light);
border-radius: 15px;
margin: 10px;
padding: 5px;
background: #fff;
.item-native {
border-radius: 15px;
}
ion-icon.ach-icon {
font-size: 3em;
}
h2 {
font-weight: bold;
}
ion-progress-bar {
height: 10px;
border-radius: 5px;
}
}
\ No newline at end of file
src/app/pages/progress-merites/progress-merites.page.spec.ts 0 → 100644
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ProgressMeritesPage } from './progress-merites.page';
describe('ProgressMeritesPage', () => {
let component: ProgressMeritesPage;
let fixture: ComponentFixture<ProgressMeritesPage>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ProgressMeritesPage ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ProgressMeritesPage);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/pages/progress-merites/progress-merites.page.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-progress-merites',
templateUrl: './progress-merites.page.html',
styleUrls: ['./progress-merites.page.scss'],
})
export class ProgressMeritesPage implements OnInit {
constructor() { }
ngOnInit() {
}
}
src/app/services/quests.service.spec.ts 0 → 100644
import { TestBed } from '@angular/core/testing';
import { QuestsService } from './quests.service';
describe('QuestsService', () => {
beforeEach(() => TestBed.configureTestingModule({}));
it('should be created', () => {
const service: QuestsService = TestBed.get(QuestsService);
expect(service).toBeTruthy();
});
});
src/app/services/quests.service.ts 0 → 100644
import { AlertController } from '@ionic/angular';
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root'
})
export class QuestsService {
constructor(
private alertCtrl: AlertController
) { }
async presentAlert(title, message) {
const alert = await this.alertCtrl.create({
cssClass: 'allo-alert-quest',
header: title,
message: message,
buttons: ['OK']
});
await alert.present();
}
showMsg() {
setInterval(() => { console.log('Still here!'); }, 2000);
}
}
src/theme/variables.scss
...@@ -136,6 +136,14 @@ ...@@ -136,6 +136,14 @@
--ion-color-rose-shade: #e0b5e0; --ion-color-rose-shade: #e0b5e0;
--ion-color-rose-tint: #ffd3ff; --ion-color-rose-tint: #ffd3ff;
/** Purple **/
--ion-color-purple: #c98ce3;
--ion-color-purple-rgb: 201,140,227;
--ion-color-purple-contrast: #000000;
--ion-color-purple-contrast-rgb: 0,0,0;
--ion-color-purple-shade: #b17bc8;
--ion-color-purple-tint: #ce98e6;
--ion-font-family: "Open Sans"; --ion-font-family: "Open Sans";
} }
...@@ -183,3 +191,12 @@ ...@@ -183,3 +191,12 @@
--ion-color-shade: var(--ion-color-rose-shade); --ion-color-shade: var(--ion-color-rose-shade);
--ion-color-tint: var(--ion-color-rose-tint); --ion-color-tint: var(--ion-color-rose-tint);
} }
.ion-color-purple {
--ion-color-base: var(--ion-color-purple);
--ion-color-base-rgb: var(--ion-color-purple-rgb);
--ion-color-contrast: var(--ion-color-purple-contrast);
--ion-color-contrast-rgb: var(--ion-color-purple-contrast-rgb);
--ion-color-shade: var(--ion-color-purple-shade);
--ion-color-tint: var(--ion-color-purple-tint);
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment