Commit 1270866c authored by Ratnadeep Rajendra Kharade's avatar Ratnadeep Rajendra Kharade
Browse files

Merge branch '60-create-common-theming-styles-and-colors' into 'master'

Resolve "Create common theming styles and colors"

Closes #60

See merge request 92khra1mst/hft_awado_app!42
parents 96705627 49df3e0e
......@@ -2,20 +2,19 @@
<ion-split-pane contentId="main-content">
<ion-menu contentId="main-content" type="overlay" *ngIf="restService.isUserLoggedIn && !restService.isLoginPage">
<ion-header>
<ion-toolbar>
<ion-title>Menu</ion-title>
<ion-toolbar color="awPrimary">
<ion-title>AWADO</ion-title>
<div class="ion-text">
Welcome , {{userService.userDetails.username}}
{{"Welcome, " + (userService.userDetails.username || "Guest")}}
</div>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-list>
<ion-menu-toggle auto-hide="false" *ngFor="let p of appPages">
<ion-item [routerDirection]="'root'" [routerLink]="[p.url]">
<ion-icon slot="start" [name]="p.icon"></ion-icon>
<ion-label>
<ion-item [routerDirection]="'root'" [routerLink]="[p.url]" routerLinkActive="active-link">
<ion-icon color="awPrimary" slot="start" [name]="p.icon"></ion-icon>
<ion-label color="awPrimary">
{{p.title}}
</ion-label>
</ion-item>
......
.ion-text{
font-size: small;
color:black;
font-weight: bold;
font-weight: 400;
margin-left: 20px;
margin-top: 3px;
}
margin-top: 8px;
}
// ion-label, ion-icon{
// color: #364f6b!important;
// }
ion-label{
font-weight: 500;
}
ion-toolbar{
padding-top: 10px!important;
padding-bottom: 10px!important;
color: #f5f5f5;
}
\ No newline at end of file
<ion-header>
<ion-toolbar>
<ion-toolbar color="awPrimary">
<ion-buttons slot="start">
<ion-menu-button></ion-menu-button>
</ion-buttons>
......
<ion-header>
<ion-toolbar>
<ion-toolbar color="awPrimary">
<ion-buttons slot="start">
<ion-menu-button></ion-menu-button>
</ion-buttons>
......
<ion-header>
<ion-toolbar>
<ion-toolbar color="awPrimary">
<ion-buttons slot="start">
<ion-menu-button></ion-menu-button>
</ion-buttons>
......
<ion-header>
<ion-toolbar>
<ion-toolbar color="awPrimary">
<ion-buttons slot="start">
<ion-menu-button></ion-menu-button>
</ion-buttons>
<ion-title slot="start">
Home
</ion-title>
<ion-item class="checkbox-wrapper">
<ion-item color="awPrimary" slot="end">
<ion-label class="text" (click)="enable3DMaps()">3D</ion-label>
</ion-item>
</ion-toolbar>
......
<ion-header>
<ion-toolbar>
<ion-toolbar color="awPrimary">
<ion-buttons slot="start">
<ion-menu-button></ion-menu-button>
</ion-buttons>
......
<ion-header>
<ion-toolbar>
<ion-toolbar color="awPrimary">
<ion-buttons slot="start">
<ion-menu-button></ion-menu-button>
</ion-buttons>
......
......@@ -10,6 +10,7 @@
*/
/* Core CSS required for Ionic components to work properly */
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700|Open+Sans:300,400,600,700|Roboto:300,400,500,700&display=swap');
@import "~@ionic/angular/css/core.css";
/* Basic CSS for apps built with Ionic */
......@@ -24,3 +25,7 @@
@import "~@ionic/angular/css/text-alignment.css";
@import "~@ionic/angular/css/text-transformation.css";
@import "~@ionic/angular/css/flex-utils.css";
:root {
--ion-font-family: 'Montserrat', cursive;
}
......@@ -52,7 +52,8 @@
--ion-color-danger-tint: #f25454;
/** dark **/
--ion-color-dark: #222428;
//--ion-color-dark: #222428;
--ion-color-dark: #364f6b;
--ion-color-dark-rgb: 34, 34, 34;
--ion-color-dark-contrast: #ffffff;
--ion-color-dark-contrast-rgb: 255, 255, 255;
......@@ -74,4 +75,24 @@
--ion-color-light-contrast-rgb: 0, 0, 0;
--ion-color-light-shade: #d7d8da;
--ion-color-light-tint: #f5f6f9;
}
/** Awado Specific colors **/
:root {
--ion-color-awPrimary: #364f6b;
--ion-color-awPrimary-rgb: 54,79,107;
--ion-color-awPrimary-contrast: #ffffff;
--ion-color-awPrimary-contrast-rgb: 255,255,255;
--ion-color-awPrimary-shade: #30465e;
--ion-color-awPrimary-tint: #4a617a;
}
.ion-color-awPrimary {
--ion-color-base: var(--ion-color-awPrimary);
--ion-color-base-rgb: var(--ion-color-awPrimary-rgb);
--ion-color-contrast: var(--ion-color-awPrimary-contrast);
--ion-color-contrast-rgb: var(--ion-color-awPrimary-contrast-rgb);
--ion-color-shade: var(--ion-color-awPrimary-shade);
--ion-color-tint: var(--ion-color-awPrimary-tint);
}
Supports Markdown
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