Skip to content

A
allo-app
Commit 459c4440 by Nabil Sadki
Options

Classement

parent 315214c7
Showing with 744 additions and 28 deletions
src/app/app-routing.module.ts
......@@ -9,6 +9,7 @@ const routes: Routes = [
{ path: 'app', loadChildren: './pages/menu/menu.module#MenuPageModule' },
{ path: 'offre-details', loadChildren: './pages/offre-details/offre-details.module#OffreDetailsPageModule' },
];
@NgModule({
......
src/app/pages/classement/classement.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 { ClassementPage } from './classement.page';
const routes: Routes = [
{
path: '',
component: ClassementPage
}
];
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
RouterModule.forChild(routes)
],
declarations: [ClassementPage]
})
export class ClassementPageModule {}
src/app/pages/classement/classement.page.html 0 → 100644
<ion-header>
<ion-toolbar color="primary">
<ion-buttons slot="start">
<ion-back-button defaultHref="/app/hauts-faits" text="Retour"></ion-back-button>
</ion-buttons>
<ion-title>Classement</ion-title>
</ion-toolbar>
</ion-header>
<ion-content color="light" padding-top>
<ion-grid>
<ion-row>
<ion-col size="2"></ion-col>
<ion-col>
<ion-img src="../../assets/img/ressources/trophy.png"></ion-img>
</ion-col>
<ion-col size="2"></ion-col>
</ion-row>
</ion-grid>
<ion-card color="gradgrey" no-margin margin-horizontal margin-bottom padding>
<ion-grid no-padding>
<ion-row>
<!-- First column -->
<ion-col size="3" no-padding>
<ion-grid no-padding>
<ion-row>
<ion-col class="ion-text-center" no-padding>
<ion-badge>#1</ion-badge>
</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>
</ion-col>
<!-- Second column -->
<ion-col no-padding>
<ion-grid no-padding>
<ion-row>
<ion-col class="ion-text-center" no-padding>
<ion-text>
<h2 no-margin>Nabil Sadki</h2>
<p no-margin margin-bottom>Membre depuis le : 28/08/2019</p>
</ion-text>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="ion-text-center" no-padding padding-top>
<ion-grid no-padding>
<ion-row>
<ion-col class="ion-text-center" no-padding>
Mérites
</ion-col>
<ion-col class="ion-text-center" no-padding>
Carte Testeur
</ion-col>
<ion-col class="ion-text-center" no-padding>
Level
</ion-col>
</ion-row>
<ion-row>
<ion-col class="ion-text-center" no-padding>
<ion-chip>
<ion-icon name="ribbon" color="secondary" no-margin></ion-icon>
</ion-chip>
</ion-col>
<ion-col class="ion-text-center" no-padding>
<ion-chip>
<ion-icon name="card" color="secondary" no-margin></ion-icon>
</ion-chip>
</ion-col>
<ion-col class="ion-text-center" no-padding>
<ion-chip>
<ion-icon name="trending-up" color="secondary" no-margin></ion-icon>
</ion-chip>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="ion-text-center" no-padding>
2 541
</ion-col>
<ion-col class="ion-text-center" no-padding>
Oui
</ion-col>
<ion-col class="ion-text-center" no-padding>
14
</ion-col>
</ion-row>
</ion-grid>
</ion-col>
</ion-row>
</ion-grid>
</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="secondary">#2</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>Hamza 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>5 000</ion-label>
</ion-chip>
</ion-text>
</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-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="secondary">#3</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>Younes Chahi</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>4 120</ion-label>
</ion-chip>
</ion-text>
</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-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">#4</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>Zineb Faouzi
<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>3 005</ion-label>
</ion-chip>
</ion-text>
</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-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">#5</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>Ali Zaoui
<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>2 630</ion-label>
</ion-chip>
</ion-text>
</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-grid>
</ion-card>
<!-- <ion-list>
<ion-item lines="none">
<ion-badge slot="start">#1</ion-badge>
<ion-avatar>
<ion-img src="../../assets/img/avatar.jpeg"></ion-img>
</ion-avatar>
<ion-label margin>
<h2>Nabil Sadki</h2>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start">
<ion-chip outline="true" class="badge">
<ion-icon name="trophy" color="secondary"></ion-icon>
<ion-label>Testeur</ion-label>
</ion-chip>
<ion-chip outline="true">
<ion-icon name="ribbon" color="secondary"></ion-icon>
<ion-label>578410</ion-label>
</ion-chip>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
<ion-item lines="none">
<ion-badge slot="start">#2</ion-badge>
<ion-avatar>
<ion-img src="../../assets/img/avatar.jpeg"></ion-img>
</ion-avatar>
<ion-label margin>
<h2>Nabil Sadki</h2>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start">
<ion-chip outline="true" class="badge">
<ion-icon name="trophy" color="secondary"></ion-icon>
<ion-label>Testeur</ion-label>
</ion-chip>
<ion-chip outline="true">
<ion-icon name="ribbon" color="secondary"></ion-icon>
<ion-label>578410</ion-label>
</ion-chip>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
<ion-item lines="none">
<ion-badge slot="start">#3</ion-badge>
<ion-avatar>
<ion-img src="../../assets/img/avatar.jpeg"></ion-img>
</ion-avatar>
<ion-label margin>
<h2>Nabil Sadki</h2>
<ion-grid no-padding>
<ion-row>
<ion-col no-padding class="ion-text-start">
<ion-chip outline="true" class="badge">
<ion-icon name="trophy" color="secondary"></ion-icon>
<ion-label>Testeur</ion-label>
</ion-chip>
<ion-chip outline="true">
<ion-icon name="ribbon" color="secondary"></ion-icon>
<ion-label>578410</ion-label>
</ion-chip>
</ion-col>
</ion-row>
</ion-grid>
</ion-label>
</ion-item>
</ion-list> -->
</ion-content>
\ No newline at end of file
src/app/pages/classement/classement.page.scss 0 → 100644
ion-list {
ion-item {
margin: 3px 0;
ion-avatar {
width: 22vw;
height: 22vw;
}
ion-label {
h2 {
font-weight: bold;
font-family: Abel, Arial, Verdana, sans-serif;
text-transform: uppercase;
}
ion-chip.badge {
--background: var(--ion-color-secondary) !important;
--color: var(--ion-color-dark) !important;
}
}
}
}
ion-card {
font-family: Abel, Arial, Verdana, sans-serif;
ion-avatar {
width: 100%;
height: 100%;
}
ion-badge {
font-family: Abel, Arial, Verdana, sans-serif;
}
h2 {
font-weight: bold;
font-family: Abel, Arial, Verdana, sans-serif;
text-transform: uppercase;
}
p {
font-family: Abel, Arial, Verdana, sans-serif;
}
}
ion-card.mini {
font-family: Abel, Arial, Verdana, sans-serif;
ion-col:nth-child(2) {
padding: 4px 0 4px 4px;
ion-badge {
font-size: 11px;
}
}
ion-avatar {
width: 48px;
height: 48px;
}
ion-badge {
font-family: Abel, Arial, Verdana, sans-serif;
&.rank {
width: 100%;
height: 100%;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
display: flex;
justify-content: center;
flex-direction: column;
text-align: center;
}
}
ion-chip {
padding: 7px;
height: 24px;
position: absolute;
bottom: 0;
right: 0;
}
ion-text {
padding-left: 10px;
}
h2 {
font-weight: bold;
font-family: Abel, Arial, Verdana, sans-serif;
text-transform: uppercase;
}
p {
font-family: Abel, Arial, Verdana, sans-serif;
}
}
src/app/pages/classement/classement.page.spec.ts 0 → 100644
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ClassementPage } from './classement.page';
describe('ClassementPage', () => {
let component: ClassementPage;
let fixture: ComponentFixture<ClassementPage>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ClassementPage ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ClassementPage);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/pages/classement/classement.page.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-classement',
templateUrl: './classement.page.html',
styleUrls: ['./classement.page.scss'],
})
export class ClassementPage implements OnInit {
constructor() { }
ngOnInit() {
}
}
src/app/pages/dashboard/dashboard.page.html
......@@ -77,7 +77,27 @@
<ion-refresher-content></ion-refresher-content>
</ion-refresher>
<!--list of trips-->
<ion-spinner *ngIf="!_TRIP.products"></ion-spinner>
<ion-fab vertical="bottom" horizontal="end" slot="fixed">
<ion-fab-button>
<ion-icon name="arrow-dropup"></ion-icon>
</ion-fab-button>
<ion-fab-list side="top">
<ion-fab-button routerLink="/app/hauts-faits" routerDirection="forward" routerLinkActive="active">
<ion-icon name="done-all"></ion-icon>
</ion-fab-button>
<ion-label>Quêtes</ion-label>
<ion-fab-button routerLink="/app/classement" routerDirection="forward" routerLinkActive="active">
<ion-icon name="trending-up"></ion-icon>
</ion-fab-button>
<ion-label>Classement</ion-label>
</ion-fab-list>
</ion-fab>
<ion-card *ngFor="let trip of _TRIP.products | search : terms" (click)="viewDetail(trip.id)" tappable no-margin
margin-bottom>
<div class="img-spinner-wrap ion-text-center">
......
src/app/pages/dashboard/dashboard.page.scss
......@@ -29,6 +29,31 @@ ion-header {
}
}
}
ion-fab-button {
margin-left: 110px;
overflow: visible;
position: relative;
}
ion-fab-list {
ion-label {
position: relative;
top: 40px;
right: 25px;
color: white;
background-color: rgba(0, 0, 0, 0.7);
line-height: 24px;
padding: 4px 8px;
border-radius: 4px;
margin-top: -30px;
}
}
ion-fab {
ion-badge {
position: relative;
top: 10px;
left: 110px;
}
}
.no-visibility {
visibility: hidden;
}
......
src/app/pages/hauts-faits/hauts-faits.page.html
......@@ -3,7 +3,11 @@
<ion-buttons slot="start">
<ion-back-button defaultHref="/app/profil" text="Retour"></ion-back-button>
</ion-buttons>
<ion-title>Hauts-faits</ion-title>
<!-- <ion-title class="ion-text-left">Progrès</ion-title> -->
<ion-chip slot="end" routerLink="/app/classement" routerDirection="forward" routerLinkActive="active">
<ion-icon name="trophy" color="secondary"></ion-icon>
<ion-label color="light">Classement</ion-label>
</ion-chip>
<ion-chip slot="end">
<ion-icon name="ribbon" color="secondary"></ion-icon>
<ion-label color="light">60</ion-label>
......@@ -12,11 +16,23 @@
</ion-header>
<ion-content color="light" padding-top>
<ion-card no-margin margin-horizontal margin-bottom padding-bottom>
<ion-text class="ion-text-center">
<h1 no-margin no-padding>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="power" color="light" slot="start"></ion-icon>
<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>
......@@ -30,7 +46,7 @@
</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-progress-bar color="success" value="1">1/1</ion-progress-bar>
</ion-col>
</ion-row>
</ion-grid>
......@@ -79,12 +95,12 @@
</ion-label>
</ion-item>
</ion-list>
</ion-card>
<ion-card no-margin margin-horizontal margin-bottom padding-bottom>
<!-- </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="contacts" color="light" slot="start"></ion-icon>
<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>
......@@ -146,6 +162,48 @@
</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-card> -->
</ion-content>
\ No newline at end of file
src/app/pages/hauts-faits/hauts-faits.page.scss
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;
height: 10px;
border-radius: 5px;
}
}
src/app/pages/menu/menu.module.ts
......@@ -53,6 +53,10 @@ const routes: Routes = [
path: 'hauts-faits',
loadChildren: '../hauts-faits/hauts-faits.module#HautsFaitsPageModule'
},
{
path: 'classement',
loadChildren: '../classement/classement.module#ClassementPageModule'
},
]
}
];
......
src/app/pages/profil-edit/profil-edit.page.html
......@@ -6,7 +6,7 @@
<ion-title>
Modifier mon profil
</ion-title>
<ion-button color="success" slot="end">Valider</ion-button>
<ion-button color="success" size="small" slot="end">Valider</ion-button>
</ion-toolbar>
</ion-header>
......
src/app/pages/profil/profil.page.html
......@@ -24,7 +24,7 @@
<ion-icon name="star"></ion-icon>
<ion-label>Testeur</ion-label>
</ion-chip>
<ion-chip color="dark" routerLink="/app/hauts-faits" routerDirection="root" routerLinkActive="active">
<ion-chip color="dark" routerLink="/app/hauts-faits" routerDirection="forward" routerLinkActive="active">
<ion-icon name="trophy" color="secondary"></ion-icon>
<ion-label>2/6</ion-label>
</ion-chip>
......@@ -58,8 +58,7 @@
<ion-card>
<ion-item color="primary">
Infos :
<ion-button slot="end" color="light" fill="outline" routerLink="/app/profil-edit" routerDirection="root"
routerLinkActive="active">Modifier</ion-button>
<ion-button slot="end" color="light" fill="outline" routerLink="/app/profil-edit" routerDirection="forward" routerLinkActive="active">Modifier</ion-button>
</ion-item>
<ion-item>
<ion-icon name="mail" slot="start"></ion-icon> monemail@allo-testeurs.com
......
src/theme/variables.scss
......@@ -2,6 +2,7 @@
// http://ionicframework.com/docs/theming/
/** Ionic CSS Variables **/
@import url('https://fonts.googleapis.com/css?family=Abel');
@font-face {
font-family: "Open Sans";
src: url("../assets/fonts/opensans/regular/OpenSans-Regular-webfont.eot");
......@@ -25,27 +26,27 @@
:root {
/** primary **/
--ion-color-primary: #f93129;
--ion-color-primary-rgb: 56, 128, 255;
--ion-color-primary-rgb: 249, 49, 41;
--ion-color-primary-contrast: #ffffff;
--ion-color-primary-contrast-rgb: 255, 255, 255;
--ion-color-primary-shade: #f7b32b;
--ion-color-primary-tint: #fcf6b1;
--ion-color-primary-shade: #db2b24;
--ion-color-primary-tint: #fa463e;
/** secondary **/
--ion-color-secondary: #f7b32b;
--ion-color-secondary-rgb: 12, 209, 232;
--ion-color-secondary-contrast: #ffffff;
--ion-color-secondary-contrast-rgb: 255, 255, 255;
--ion-color-secondary-shade: #f7b32b;
--ion-color-secondary-tint: #fcf6b1;
--ion-color-secondary-rgb: 247, 179, 43;
--ion-color-secondary-contrast: #000000;
--ion-color-secondary-contrast-rgb: 0, 0, 0;
--ion-color-secondary-shade: #d99e26;
--ion-color-secondary-tint: #f8bb40;
/** tertiary **/
--ion-color-tertiary: #2d1e2f;
--ion-color-tertiary-rgb: 112, 68, 255;
--ion-color-tertiary-rgb: 45, 30, 47;
--ion-color-tertiary-contrast: #ffffff;
--ion-color-tertiary-contrast-rgb: 255, 255, 255;
--ion-color-tertiary-shade: #2d1e2f;
--ion-color-tertiary-tint: #7e57ff;
--ion-color-tertiary-shade: #281a29;
--ion-color-tertiary-tint: #423544;
/** success **/
--ion-color-success: #10dc60;
......@@ -95,9 +96,90 @@
--ion-color-light-shade: #d7d8da;
--ion-color-light-tint: #f5f6f9;
/** **/
/** Gradient grey **/
--ion-color-gradgrey: linear-gradient(to bottom, #ffffff, #fbfbfb, #f6f6f6, #f2f2f2, #eeeeee);
--ion-color-gradgrey-rgb: 255, 255, 255;
--ion-color-gradgrey-contrast: #000000;
--ion-color-gradgrey-contrast-rgb: 0, 0, 0;
--ion-color-gradgrey-shade: #e0e0e0;
--ion-color-gradgrey-tint: #ffffff;
/** FB **/
--ion-color-fb: #3c5a99;
--ion-color-fb-rgb: 60, 90, 153;
--ion-color-fb-contrast: #ffffff;
--ion-color-fb-contrast-rgb: 255, 255, 255;
--ion-color-fb-shade: #354f87;
--ion-color-fb-tint: #506ba3;
/** G **/
--ion-color-g: #cc3333;
--ion-color-g-rgb: 204, 51, 51;
--ion-color-g-contrast: #ffffff;
--ion-color-g-contrast-rgb: 255, 255, 255;
--ion-color-g-shade: #b42d2d;
--ion-color-g-tint: #d14747;
/** Blue **/
--ion-color-blue: #3880ff;
--ion-color-blue-rgb: 56,128,255;
--ion-color-blue-contrast: #ffffff;
--ion-color-blue-contrast-rgb: 255,255,255;
--ion-color-blue-shade: #3171e0;
--ion-color-blue-tint: #4c8dff;
/** Rose **/
--ion-color-rose: #ffceff;
--ion-color-rose-rgb: 255,206,255;
--ion-color-rose-contrast: #000000;
--ion-color-rose-contrast-rgb: 0,0,0;
--ion-color-rose-shade: #e0b5e0;
--ion-color-rose-tint: #ffd3ff;
--ion-font-family: "Open Sans";
}
.ion-color-gradgrey {
--ion-color-base: var(--ion-color-gradgrey);
--ion-color-base-rgb: var(--ion-color-gradgrey-rgb);
--ion-color-contrast: var(--ion-color-gradgrey-contrast);
--ion-color-contrast-rgb: var(--ion-color-gradgrey-contrast-rgb);
--ion-color-shade: var(--ion-color-gradgrey-shade);
--ion-color-tint: var(--ion-color-gradgrey-tint);
}
.ion-color-fb {
--ion-color-base: var(--ion-color-fb);
--ion-color-base-rgb: var(--ion-color-fb-rgb);
--ion-color-contrast: var(--ion-color-fb-contrast);
--ion-color-contrast-rgb: var(--ion-color-fb-contrast-rgb);
--ion-color-shade: var(--ion-color-fb-shade);
--ion-color-tint: var(--ion-color-fb-tint);
}
.ion-color-g {
--ion-color-base: var(--ion-color-g);
--ion-color-base-rgb: var(--ion-color-g-rgb);
--ion-color-contrast: var(--ion-color-g-contrast);
--ion-color-contrast-rgb: var(--ion-color-g-contrast-rgb);
--ion-color-shade: var(--ion-color-g-shade);
--ion-color-tint: var(--ion-color-g-tint);
}
.ion-color-blue {
--ion-color-base: var(--ion-color-blue);
--ion-color-base-rgb: var(--ion-color-blue-rgb);
--ion-color-contrast: var(--ion-color-blue-contrast);
--ion-color-contrast-rgb: var(--ion-color-blue-contrast-rgb);
--ion-color-shade: var(--ion-color-blue-shade);
--ion-color-tint: var(--ion-color-blue-tint);
}
--ion-font-family: 'Open Sans';
.ion-color-rose {
--ion-color-base: var(--ion-color-rose);
--ion-color-base-rgb: var(--ion-color-rose-rgb);
--ion-color-contrast: var(--ion-color-rose-contrast);
--ion-color-contrast-rgb: var(--ion-color-rose-contrast-rgb);
--ion-color-shade: var(--ion-color-rose-shade);
--ion-color-tint: var(--ion-color-rose-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