pushed timer code
@ -0,0 +1,8 @@
|
||||
import { FeedbackDirective } from './feedback.directive';
|
||||
|
||||
describe('FeedbackDirective', () => {
|
||||
it('should create an instance', () => {
|
||||
const directive = new FeedbackDirective();
|
||||
expect(directive).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@ -0,0 +1,24 @@
|
||||
import { Directive, ElementRef, HostListener } from '@angular/core';
|
||||
import { TranslatorService } from '../../services/translator/translator.service';
|
||||
import { CommonService } from '../../services/common/common.service';
|
||||
import { FeedbackService } from './feedback.service';
|
||||
|
||||
@Directive({
|
||||
selector: '[feedback]'
|
||||
})
|
||||
export class FeedbackDirective {
|
||||
|
||||
constructor(
|
||||
private cs: CommonService,
|
||||
private ts: TranslatorService,
|
||||
private el: ElementRef,
|
||||
private feedBackService: FeedbackService
|
||||
) {
|
||||
|
||||
}
|
||||
|
||||
|
||||
@HostListener('mousedown') onMouseEnter() {
|
||||
this.feedBackService.vibrate();
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,12 @@
|
||||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { FeedbackService } from './feedback.service';
|
||||
|
||||
describe('FeedbackService', () => {
|
||||
beforeEach(() => TestBed.configureTestingModule({}));
|
||||
|
||||
it('should be created', () => {
|
||||
const service: FeedbackService = TestBed.get(FeedbackService);
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@ -0,0 +1,20 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { Vibration } from '@ionic-native/vibration/ngx';
|
||||
// import { SettingsService } from 'src/app/settings/service/settings.service';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class FeedbackService {
|
||||
// constructor(private vibration: Vibration, private settings: SettingsService) {}
|
||||
constructor(private vibration: Vibration) {}
|
||||
|
||||
public async vibrate() {
|
||||
try {
|
||||
const on = true;
|
||||
if (on) {
|
||||
this.vibration.vibrate(500);
|
||||
}} catch (e) {
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,3 +1,8 @@
|
||||
.float-left{
|
||||
float: left;
|
||||
}
|
||||
ion-menu-button {
|
||||
font-size: 0.8cm;
|
||||
color: white;
|
||||
background: #22c6b3;
|
||||
}
|
||||
@ -0,0 +1,8 @@
|
||||
<div feedback class="custom-button">
|
||||
<div class="iconBox">
|
||||
<img [src]="icon" class="icon">
|
||||
</div>
|
||||
<div class="titleBox">
|
||||
<p class="pClass">{{title}}</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,34 @@
|
||||
.custom-button {
|
||||
background: white;
|
||||
margin-bottom: 0px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 20px;
|
||||
width: 100%;
|
||||
max-width: 105px;
|
||||
height: 100px;
|
||||
padding: 10px;
|
||||
min-width: 96px;
|
||||
}
|
||||
|
||||
.iconBox {
|
||||
display: block;
|
||||
width: 100%;
|
||||
position: static;
|
||||
}
|
||||
.iconBox img{
|
||||
margin: 0px auto 10px;
|
||||
display: block;
|
||||
// max-width: 35%;
|
||||
}
|
||||
|
||||
.titleBox {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.pClass {
|
||||
font-size: 12PX;
|
||||
text-align: center;
|
||||
margin-top: 10px;
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
}
|
||||
@ -0,0 +1,27 @@
|
||||
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { ServicesButtonComponent } from './services-button.component';
|
||||
|
||||
describe('ServicesButtonComponent', () => {
|
||||
let component: ServicesButtonComponent;
|
||||
let fixture: ComponentFixture<ServicesButtonComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ ServicesButtonComponent ],
|
||||
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(ServicesButtonComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@ -0,0 +1,28 @@
|
||||
import { Component, OnInit, Input, Output, EventEmitter} from '@angular/core';
|
||||
import { TranslatorService } from '../../services/translator/translator.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-services-button',
|
||||
templateUrl: './services-button.component.html',
|
||||
styleUrls: ['./services-button.component.scss'],
|
||||
})
|
||||
export class ServicesButtonComponent implements OnInit {
|
||||
|
||||
@Input() class: any = '';
|
||||
@Input() buttonClass: any = '';
|
||||
@Input() icon: string;
|
||||
@Input() title: string;
|
||||
@Output() trigger = new EventEmitter();
|
||||
@Input() focusicon: string;
|
||||
@Input() disabled = false;
|
||||
public direction: string;
|
||||
public style: any;
|
||||
constructor(
|
||||
public ts: TranslatorService
|
||||
) {}
|
||||
|
||||
ngOnInit() {}
|
||||
|
||||
public onClicked() {}
|
||||
}
|
||||
|
||||
@ -0,0 +1,9 @@
|
||||
<div feedback class="custom-button">
|
||||
<div class="iconBox">
|
||||
<img [src]="icon" class="icon">
|
||||
</div>
|
||||
<div class="titleBox">
|
||||
<span>{{statsValue}}</span>
|
||||
<p class="pClass">{{title}}</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,42 @@
|
||||
.custom-button {
|
||||
background: white;
|
||||
margin-bottom: 0px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 20px;
|
||||
width: 100%;
|
||||
max-width: 105px;
|
||||
height: 160px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.iconBox {
|
||||
display: block;
|
||||
width: 100%;
|
||||
position: static;
|
||||
img {
|
||||
display: block;
|
||||
max-width: 45%;
|
||||
padding-bottom: 5px;
|
||||
padding-top: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.titleBox {
|
||||
display: block;
|
||||
span {
|
||||
font-size: 40px;
|
||||
font-weight: bold;
|
||||
color: black;
|
||||
text-align: left;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.pClass {
|
||||
color: black;
|
||||
width: 85%;
|
||||
margin-top: 5px;
|
||||
font-weight: bold;
|
||||
text-align: left;
|
||||
display: block;
|
||||
}
|
||||
@ -0,0 +1,27 @@
|
||||
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { StatsButtonComponent } from './stats-button.component';
|
||||
|
||||
describe('StatsButtonComponent', () => {
|
||||
let component: StatsButtonComponent;
|
||||
let fixture: ComponentFixture<StatsButtonComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ StatsButtonComponent ],
|
||||
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(StatsButtonComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@ -0,0 +1,29 @@
|
||||
import { Component, OnInit, Input, Output, EventEmitter} from '@angular/core';
|
||||
import { TranslatorService } from '../../services/translator/translator.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-stats-button',
|
||||
templateUrl: './stats-button.component.html',
|
||||
styleUrls: ['./stats-button.component.scss'],
|
||||
})
|
||||
export class StatsButtonComponent implements OnInit {
|
||||
|
||||
@Input() class: any = '';
|
||||
@Input() buttonClass: any = '';
|
||||
@Input() icon: string;
|
||||
@Input() title: string;
|
||||
@Input() statsValue: string;
|
||||
@Output() trigger = new EventEmitter();
|
||||
@Input() focusicon: string;
|
||||
@Input() disabled = false;
|
||||
public direction: string;
|
||||
public style: any;
|
||||
constructor(
|
||||
public ts: TranslatorService
|
||||
) {}
|
||||
|
||||
ngOnInit() {}
|
||||
|
||||
public onClicked() {}
|
||||
|
||||
}
|
||||
@ -1,117 +1,164 @@
|
||||
<!-- <ion-header no-shadow no-border>
|
||||
<ion-toolbar>
|
||||
<ion-header>
|
||||
<ion-toolbar class="header-toolbar-new">
|
||||
<nav-buttons [enableMenu]="true" [enableBack]="false" [navigate]="false"></nav-buttons>
|
||||
<ion-title>home </ion-title>
|
||||
<ion-badge id="homeBadgeBtn" item-end>{{notBadge}}</ion-badge>
|
||||
<ion-title>DASHBOARD</ion-title>
|
||||
<!-- <ion-icon class="login-icon" name="log-in" slot="end" *ngIf="!logIn" (click)="login()"></ion-icon> -->
|
||||
</ion-toolbar>
|
||||
</ion-header> -->
|
||||
<ion-content class="colorBG">
|
||||
<div class="header-div">
|
||||
<button ion-button icon-only menuToggle class="menubutton" (click)="openMenu()">
|
||||
<img class="menuImg" src="../assets/imgs/home/burgerMenu.png"/>
|
||||
<ion-badge id="homeBadgeBtn" slot="end" color="danger">{{notBadge}}</ion-badge>
|
||||
</button>
|
||||
<!-- <button ion-button icon-only menuToggle class="menubuttonTrans" (click)="openMenu()">
|
||||
<img class="transImg" src="../assets/imgs/home/arabicSwitch.png"/>
|
||||
</button> -->
|
||||
<div class="centerDiv homeBox" (click)="openPersonalInfo()">
|
||||
<p class="TxtPlace">{{ts.trPK('home','hello')}}, {{userData.EMPLOYEE_DISPLAY_NAME}}</p>
|
||||
<div class="profileDiv">
|
||||
<!-- <ion-img class="profileImg" src="{{user_image}}"></ion-img> -->
|
||||
<img class="profileImg" [src]="user_image">
|
||||
</ion-header>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="changeImgBtn">
|
||||
<button ion-button icon-only menuToggle class="menubutton" (click)="changeImage()">
|
||||
<ion-icon class="changeIcon" name="camera"></ion-icon></button>
|
||||
|
||||
<!-- <app-file-uploder-profile >
|
||||
|
||||
</app-file-uploder-profile>
|
||||
-->
|
||||
<!-- <file-uploader (fileSelected)="attachmentSelected($event)" [maxFileSize]="maxFileSize" [multiupload]="false"></file-uploader> -->
|
||||
<ion-content class="main-dashboard-container">
|
||||
<ion-grid class="main-container contentBg">
|
||||
<ion-row class="slideFullWidth">
|
||||
<ion-slides [options]="slideOptsOne" class="padding-slide slide">
|
||||
<ion-slide *ngFor="let button of statsButtons; let i=index;">
|
||||
<app-stats-button
|
||||
[title]="button.title"
|
||||
[statsValue]="button.statsValue"
|
||||
[icon]="button.icon">
|
||||
</app-stats-button>
|
||||
</ion-slide>
|
||||
</ion-slides>
|
||||
</ion-row>
|
||||
|
||||
<ion-row *ngFor="let menuItem of menuEntries; let i=index">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<ion-row class="attendance-module" *ngIf="i == 1">
|
||||
<ion-col [size]="8">
|
||||
<h3>Monthly Attendance</h3>
|
||||
<span>View your Monthly Time Sheet</span>
|
||||
<ion-button>
|
||||
View Detail
|
||||
</ion-button>
|
||||
</ion-col>
|
||||
<ion-col [size]="4">
|
||||
<img src="assets/icon/new-design/attendance_button_icon.png"/>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-col [size]="12">
|
||||
<ion-label>{{menuItem.PROMPT}}</ion-label>
|
||||
</ion-col>
|
||||
<ion-slides [options]="slideOptsTwo">
|
||||
|
||||
<ion-slide *ngFor="let subMenu of menuItem.children; let j=index">
|
||||
<app-services-button
|
||||
[title]="subMenu.PROMPT"
|
||||
icon="assets/icon/new-design/leave_balance.png">
|
||||
</app-services-button>
|
||||
</ion-slide>
|
||||
</ion-slides>
|
||||
</ion-row>
|
||||
|
||||
<div>
|
||||
<div>
|
||||
<p class="dash-header text-caps">{{ts.trPK('home','dashboard')}}</p>
|
||||
</div>
|
||||
<div>
|
||||
<ion-grid class="cus-grid">
|
||||
<ion-row>
|
||||
<ion-col size="6" class="col-grid" *ngFor="let item of menuList; let i=index">
|
||||
<button ion-button block class="serviceItem" (click)="getMeunDetails(i)">
|
||||
<img class="serviceItemImg" src="../assets/imgs/{{item.MENU_TYPE}}.png"/>
|
||||
<p> {{ item.MENU_NAME }} {{item.SUB_MENU_NAME}}</p>
|
||||
</button>
|
||||
</ion-col>
|
||||
<ion-col size="6" class="col-grid">
|
||||
<button ion-button block class="serviceItem" (click)="getDeviceLocation()">
|
||||
<ion-img class="serviceItemImg" src="../assets/imgs/home/attendanceSwipe.png"></ion-img>
|
||||
<p>{{ts.trPK('attendance','attendance')}}</p>
|
||||
</button>
|
||||
</ion-col>
|
||||
<ion-col size="6" class="col-grid" >
|
||||
<button ion-button block class="serviceItem" id="vacationRule" (click)="Vacation_Rule()">
|
||||
<ion-img class="serviceItemImg" src="../assets/imgs/home/vacationRule.png"></ion-img>
|
||||
<p>{{ts.trPK('vacation-rule','vacationRule')}}</p>
|
||||
</button>
|
||||
</ion-col>
|
||||
<ion-col size="6" class="col-grid">
|
||||
<button ion-button block class="serviceItem" id="accrualBalance" (click)="accrualBalance()">
|
||||
<ion-img class="serviceItemImg" src="../assets/imgs/home/accrualBalances.png"></ion-img>
|
||||
<p>{{ts.trPK('absenceList','accrualBalances')}}</p>
|
||||
</button>
|
||||
</ion-col>
|
||||
|
||||
<ion-col size="6" class="col-grid">
|
||||
<button ion-button block class="serviceItem" (click)="Change_password()">
|
||||
<ion-img class="serviceItemImg" src="../assets/imgs/home/changePasword.png"></ion-img>
|
||||
<p>{{ts.trPK('changePassword','changePassword')}}</p>
|
||||
</button>
|
||||
<!-- <ion-row class="attendance-module">
|
||||
<ion-col [size]="8">
|
||||
<h3>Monthly Attendance</h3>
|
||||
<span>View your Monthly Time Sheet</span>
|
||||
<ion-button>
|
||||
View Detail
|
||||
</ion-button>
|
||||
</ion-col>
|
||||
<ion-col [size]="4">
|
||||
<img src="assets/icon/new-design/attendance_button_icon.png"/>
|
||||
</ion-col>
|
||||
</ion-row> -->
|
||||
|
||||
<!-- <ion-row>
|
||||
<ion-col [size]="12">
|
||||
<ion-label>My Travelling</ion-label>
|
||||
</ion-col>
|
||||
<ion-col [size]="4">
|
||||
<app-services-button
|
||||
title="Ticket Request"
|
||||
icon="assets/icon/new-design/ticket_request.png">
|
||||
</app-services-button>
|
||||
</ion-col>
|
||||
|
||||
<ion-col size="6" class="col-grid">
|
||||
<button ion-button block class="serviceItem" (click)="openPayslip()">
|
||||
<ion-img class="serviceItemImg" src="../assets/imgs/home/paySlip.png"></ion-img>
|
||||
<p>{{ts.trPK('login','payslip')}}</p>
|
||||
</button>
|
||||
<ion-col [size]="4">
|
||||
<app-services-button
|
||||
title="Borrowing Passport"
|
||||
icon="assets/icon/new-design/borrowing_passport.png">
|
||||
</app-services-button>
|
||||
</ion-col>
|
||||
|
||||
<!-- <ion-col size="6" class="col-grid">
|
||||
<button ion-button block class="serviceItem" (click)="Change_password()">
|
||||
<ion-img class="serviceItemImg" src="../assets/imgs/home/announcements.png"></ion-img>
|
||||
<p>{{ts.trPK('login','announcement')}}</p>
|
||||
</button>
|
||||
<ion-col [size]="4">
|
||||
<app-services-button
|
||||
title="Vacations Rules"
|
||||
icon="assets/icon/new-design/vacation_rules.png">
|
||||
</app-services-button>
|
||||
</ion-col>
|
||||
<ion-col size="6" class="col-grid">
|
||||
<button ion-button block class="serviceItem" (click)="Change_password()">
|
||||
<ion-img class="serviceItemImg" src="../assets/imgs/home/timeAttendance.png"></ion-img>
|
||||
<p>{{ts.trPK('home','timeAndAttendance')}}</p>
|
||||
</button>
|
||||
</ion-col> -->
|
||||
|
||||
<!-- <ion-col size="6" class="col-grid">
|
||||
<button ion-button block class="serviceItem" (click)="openPayslip()">
|
||||
<ion-img class="serviceItemImg" src="../assets/imgs/changepass.png"></ion-img>
|
||||
<p>{{ts.trPK('payslip','title')}}</p>
|
||||
</button>
|
||||
</ion-col> -->
|
||||
</ion-row>
|
||||
</ion-row> -->
|
||||
|
||||
<!-- <button class="menu-item" ion-item menuClose ion-item *ngFor="let item of menuList; let i=index" (click)="getMeunDetails(i)" >
|
||||
<img width="30" src="../assets/imgs/arrownew.png" item-left class="flipImg">
|
||||
{{ item.MENU_NAME }} {{item.SUB_MENU_NAME}}
|
||||
</button> -->
|
||||
<!-- <ion-row>
|
||||
<ion-col [size]="12">
|
||||
<ion-label>Miscellaneous</ion-label>
|
||||
</ion-col>
|
||||
<ion-col [size]="4">
|
||||
<app-services-button
|
||||
title="Uniform Request"
|
||||
icon="assets/icon/new-design/uniform_request.png">
|
||||
</app-services-button>
|
||||
</ion-col>
|
||||
|
||||
</ion-grid>
|
||||
</div>
|
||||
</div>
|
||||
<ion-col [size]="4">
|
||||
<app-services-button
|
||||
title="ID Badge Request"
|
||||
icon="assets/icon/new-design/id_badge_request.png">
|
||||
</app-services-button>
|
||||
</ion-col>
|
||||
|
||||
<ion-col [size]="4">
|
||||
<app-services-button
|
||||
title="Separation/ Resignation"
|
||||
icon="assets/icon/new-design/separation_resignation.png">
|
||||
</app-services-button>
|
||||
</ion-col>
|
||||
</ion-row> -->
|
||||
|
||||
<!--
|
||||
<ion-row>
|
||||
<ion-col [size]="4">
|
||||
<app-services-button
|
||||
title="Recreational Activities"
|
||||
icon="assets/icon/new-design/recreational_activities.png">
|
||||
</app-services-button>
|
||||
</ion-col>
|
||||
|
||||
<ion-col [size]="4">
|
||||
<app-services-button
|
||||
title="Employee Certificate"
|
||||
icon="assets/icon/new-design/employee_certificate.png">
|
||||
</app-services-button>
|
||||
</ion-col>
|
||||
|
||||
<ion-col [size]="4">
|
||||
<app-services-button
|
||||
title="IT Forms"
|
||||
icon="assets/icon/new-design/it_forms.png">
|
||||
</app-services-button>
|
||||
</ion-col>
|
||||
</ion-row> -->
|
||||
</ion-grid>
|
||||
<!-- {{displayTime}} -->
|
||||
|
||||
<circle-progress
|
||||
[backgroundColor]= "'#094875'"
|
||||
[percent]="percent"
|
||||
[radius]="50"
|
||||
[outerStrokeWidth]="5"
|
||||
[innerStrokeWidth]="3"
|
||||
[outerStrokeColor]="'#ffffff'"
|
||||
[innerStrokeColor]="'#ffffff'"
|
||||
[animation]="true"
|
||||
[animationDuration]="300"
|
||||
[responsive]="false"
|
||||
[space]="-4"
|
||||
[startFromZero]="false"
|
||||
[title]="displayTime"
|
||||
[titleColor]="'#ffffff'"
|
||||
></circle-progress>
|
||||
{{displayTime}}
|
||||
|
||||
</ion-content>
|
||||
|
||||
<!-- <ion-fab>
|
||||
<ion-fab-button>Button</ion-fab-button>
|
||||
</ion-fab> -->
|
||||
|
||||
@ -1,153 +1,85 @@
|
||||
.button-menutoggle.button-menutoggle-md,button-menutoggle.button-menutoggle-ios,
|
||||
.bar-buttons.bar-buttons-ios.button.button-ios.button-default.button-default-ios.button-menutoggle.button-menutoggle-ios{
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow:none;
|
||||
-moz-box-shadow: none;
|
||||
background: transparent !important;
|
||||
}
|
||||
.colorBG{
|
||||
--background: #f0efef;
|
||||
}
|
||||
ion-row {
|
||||
margin-bottom: 15px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.menubutton{
|
||||
white-space: normal;
|
||||
color: var(--light);
|
||||
text-transform: capitalize;
|
||||
min-height: 47px;
|
||||
background: transparent;
|
||||
font-size: 2rem;
|
||||
.header-toolbar-new{
|
||||
--background: #22c6b3;
|
||||
}
|
||||
ion-title{
|
||||
color: white;
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
}
|
||||
.menubuttonTrans{
|
||||
white-space: normal;
|
||||
color: var(--light);
|
||||
text-transform: capitalize;
|
||||
min-height: 47px;
|
||||
background: transparent;
|
||||
font-size: 2rem;
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
left: 315px
|
||||
}
|
||||
#homeBadgeBtn{
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
width: 20px;
|
||||
font-size: 10px;
|
||||
height: 20px;
|
||||
padding: 0px;
|
||||
line-height: 2;
|
||||
min-width: auto;
|
||||
min-height: auto;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.homeBox{
|
||||
|
||||
|
||||
}
|
||||
.header-div{
|
||||
background:var(--primary);
|
||||
background: -moz-linear-gradient(45deg, var(--primary) 0%, var(--secondary) 36%,var(--secondary) 59%, var(--customnavy) 100%);
|
||||
background: -webkit-linear-gradient(45deg, (--primary) 0%, var(--secondary) 36%,var(--secondary) 59%, var(--customnavy) 100%);
|
||||
background: linear-gradient(90deg, #85C48D 0%, #85C48D 13%, #2BB5C6 98%, #2BB5C6 100%);
|
||||
color:var(--light);
|
||||
text-transform: capitalize;
|
||||
|
||||
display: block;
|
||||
position: relative;
|
||||
height: 210px;
|
||||
margin-bottom:60px;
|
||||
border-radius: 0px 0px 70px 70px;
|
||||
}
|
||||
|
||||
.dash-header{
|
||||
top: 0;
|
||||
text-align: center;
|
||||
margin: 16px 0 0 0;
|
||||
|
||||
}
|
||||
|
||||
.TxtPlace {
|
||||
margin: 0;
|
||||
padding: 50px 0 10px 0;
|
||||
text-align: center;
|
||||
width:100%;
|
||||
}
|
||||
|
||||
.serviceItem {
|
||||
// min-height: 160px !important;
|
||||
// padding: 0;
|
||||
// width: 95%;
|
||||
// border: 0px solid #e4e5e7;
|
||||
// background: white;
|
||||
// color: var(--dark);
|
||||
// border-radius: 7px;
|
||||
min-height: 200px !important;
|
||||
padding-top: 0;
|
||||
width: 95%;
|
||||
margin-left: 4px;
|
||||
margin-bottom: 13px;
|
||||
border: 0px solid #e4e5e7;
|
||||
background: white;
|
||||
color: var(--dark);
|
||||
border-radius: 7px;
|
||||
p{
|
||||
margin-top: 0px; margin-bottom:0px;
|
||||
font-weight: normal;
|
||||
left: 15%;
|
||||
right: 15%;
|
||||
font-size: 0.42cm;
|
||||
font-weight: bold;
|
||||
height: 100%;
|
||||
}
|
||||
ion-label{
|
||||
display: block;
|
||||
color: black !important;
|
||||
font-size: 14px;
|
||||
min-height: 20px;
|
||||
// white-space: normal;
|
||||
text-align: center;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
font-weight: bold;
|
||||
}
|
||||
.main-dashboard-container{
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
.header-md:after {
|
||||
height: 0px !important;
|
||||
display: none !important;
|
||||
}
|
||||
.contentBg:before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
background: #22c6b3;
|
||||
height: 100px;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
top: 0px;
|
||||
z-index: 1;
|
||||
}
|
||||
.main-container{
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.attendance-module{
|
||||
border-radius: 20px;
|
||||
background-color: #094875;
|
||||
padding: 10px;
|
||||
color: white;
|
||||
width: 100%;
|
||||
h3{
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
margin: 0;
|
||||
}
|
||||
span {
|
||||
display: block;
|
||||
|
||||
span{
|
||||
font-size: 13px;
|
||||
display: block;
|
||||
}
|
||||
.serviceItemImg {
|
||||
min-width: 60px !important;
|
||||
min-height: 70px !important;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
margin: 10px auto;
|
||||
background: transparent !important;
|
||||
img{
|
||||
display: block;
|
||||
margin: 10px auto;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
}
|
||||
.serviceItem.button,.serviceItem.button-md, .serviceItem.button-ios{
|
||||
background: transparent !important;
|
||||
color:var(--dark);
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow:none;
|
||||
-moz-box-shadow: none;
|
||||
border: 2px solid var(--gray);
|
||||
min-width: auto;
|
||||
}
|
||||
//test
|
||||
.changeImgBtn{
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
top: 80%;
|
||||
left: 53%;
|
||||
-ms-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
//test
|
||||
.changeIcon{
|
||||
background: #c1c1c1;
|
||||
width: 40px;
|
||||
height: 39px;
|
||||
border-radius: 50% !important;
|
||||
position: relative;
|
||||
left: 51px;
|
||||
top:16px;
|
||||
}
|
||||
.menuImg{
|
||||
max-width: 30px;
|
||||
}
|
||||
.transImg{
|
||||
max-width: 45px;
|
||||
}
|
||||
|
||||
ion-button{
|
||||
border-radius: 10px;
|
||||
padding: 10px;
|
||||
background: #3CB9DF;
|
||||
--background: transparent;
|
||||
--box-shadow: none !important;
|
||||
height: auto;
|
||||
min-height: inherit;
|
||||
margin-top: 10px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
.swiper-container {
|
||||
margin: 0 !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 853 B |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.0 KiB |
|
After Width: | Height: | Size: 815 B |
|
After Width: | Height: | Size: 975 B |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 864 B |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 999 B |
|
After Width: | Height: | Size: 1.0 KiB |
|
After Width: | Height: | Size: 1.0 KiB |
|
After Width: | Height: | Size: 984 B |
|
After Width: | Height: | Size: 759 B |