CSS changes

MOE_DEV_NEW_TEMPORARY_DESIGN
Sultan Khan 3 years ago
parent 80dd2817df
commit a7d2202897

@ -1,4 +1,4 @@
<ion-app [dir]="direction">
<ion-app [dir]="direction" id="lang">
<ion-split-pane>
<ion-menu [swipeGesture]="false" side='start' *ngIf="direction ==='ltr'">
<ion-content class="sidebar-menu">

@ -2,12 +2,11 @@
height: 25vh;
}
.rowOutside{
// margin-top: -37px;
ion-content {
--background: #f5f5f5;
}
.button-digital-id{
.button-digital-id {
--background: white !important;
background: white !important;
white-space: normal;
@ -22,16 +21,16 @@
}
.digital-id-en{
.digital-id-en {
color: black;
position: absolute;
right: 20px;
width: 10%;
}
}
.digital-id-ar{
.digital-id-ar {
color: black;
position: absolute;
left: 20px;
width: 10%;
}
}

@ -7,7 +7,9 @@
<div class="last-circle"></div>
</div>
</ion-row>
</ion-grid>
<div class="login-container">
<ion-grid>
<ion-row>
<ion-col *ngIf="!user">
<P class="pageTitle text-caps">{{ts.trPK('login','login')}}</P>
@ -16,13 +18,13 @@
</ion-grid>
<div *ngIf="!user" [dir]="currentLang==1 ?'rtl': 'ltr'">
<ion-item class="item-input-login">
<ion-item class="item-input-login" lines="none">
<img style="margin: 9px 8px 9px 0 !important;" class="item-icon" src="assets/imgs/username.png" item-start />
<ion-input class="login-input" required type="text" [(ngModel)]="username" placeholder="{{ts.trPK('login','username')}}">
</ion-input>
</ion-item>
<ion-item class="item-input-login">
<ion-item class="item-input-login" lines="none">
<img style="margin: 9px 8px 9px 0 !important;" class="item-icon" src="assets/imgs/password.png" item-start />
<ion-input class="login-input" required [type]="inputType" [(ngModel)]="password" placeholder="{{ts.trPK('login','password')}}">
</ion-input>
@ -39,16 +41,16 @@
</div>
</div>
<div *ngIf="!user" class="centerDiv" style="margin: 25px 15px !important;">
<ion-button [ngClass]="{'disable-button-opacity': isValidForm()}" class="button-login" (click)="onLogin()" [disabled]="isValidForm()" style="width: 100% !important;">{{ts.trPK('login','login')}}</ion-button>
</div>
<!-- <div *ngIf="welcomeBack"> -->
<welcome-login (onLogin)="login()" (loginWithUser)="loginWithUser()" *ngIf="user">
</welcome-login>
<!-- </div> -->
<div *ngIf="!user" class="centerDiv" style="margin: 25px 15px !important;">
<ion-button [ngClass]="{'disable-button-opacity': isValidForm()}" class="button-login" (click)="onLogin()" [disabled]="isValidForm()" style="width: 100% !important;">{{ts.trPK('login','login')}}</ion-button>
<!-- digital ID button -->
<!-- <ion-button *ngIf="userInfo" class="button-digital-id" (click)="openDigitalId()">
<p style="color: black;">{{ts.trPK('general','digital-id')}}</p>

@ -23,6 +23,7 @@
text-align: center;
padding: 0px;
margin: 0px;
font-weight: bold;
}
.TxtPlace {
@ -97,10 +98,12 @@ img.centerDiv {
}
button.arTxt {
font-family: var(--fontFamilyIOSAR) !important;
:root[dir="rtl"] {
float: right;
color: var(--customnavy) !important;
font-family: var(--fontFamilyIOSAR) !important;
font-weight: bold;
border-radius: 2px 0px 0px 2px !important;
}
@ -118,10 +121,11 @@ img.centerDiv {
.login-input {
border: none;
margin-right: 5px;
font-family: 'Kufi';
}
.item-input {
--min-height: 1.0cm !important;
--min-height: 1.5cm !important;
--border-radius: 12px;
--ion-color-base: white !important;
// --background: color: var(--darkgray) !important;
@ -141,7 +145,7 @@ img.centerDiv {
white-space: normal;
color: var(--light);
text-transform: capitalize;
min-height: 1.0cm;
min-height: 1.3cm;
--border-radius: 33px !important;
border-radius: 33px !important;
--min-height: 1.6cm !important;
@ -172,8 +176,8 @@ img.centerDiv {
.first-circle {
background: #024d71 !important;
border-radius: 50%;
height: 292px;
width: 288px;
height: 310px;
width: 310px;
float: left;
margin-left: -55px;
margin-top: -140px;
@ -185,7 +189,7 @@ img.centerDiv {
background: #387c84 !important;
border-radius: 50%;
height: 160px;
width: 170px;
width: 190px;
margin: -115px 0px 0px 179px;
}

@ -158,6 +158,7 @@ export class LoginComponent implements OnInit, OnDestroy {
}
this.currentLang = langNumber;
document.getElementById('lang').lang = this.currentLang == 1 ? 'ar' : 'en';
}
public forgetPasswordPage() {

@ -3,12 +3,10 @@
margin-left: 2%;
margin-right: 2%;
height: 4cm;
box-shadow: 0px 0px 8px 2px #d5d5d5ab;
background: white;
margin-bottom: 0.3cm;
// border-color: #ececec;
border-style: solid;
border-width: 0.02cm;
border-radius: 30px !important;
border: 1.3px solid #8b8b8b;
}
// .custom-button:hover {
@ -19,7 +17,7 @@
.icon{
.icon {
margin-top: 0.7cm;
margin-left: 27%;
margin-right: 27%;

@ -1,25 +1,27 @@
.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;
min-width: 100px;
box-shadow: 0px 0px 5px #ccc;
margin-bottom: 5px;
}
.iconBox {
display: block;
width: 100%;
position: static;
height: 40px;
}
.iconBox img {
margin: 0px auto 10px !important;
display: block;
width: 35px;
height: 33px;
// max-width: 35%;
}
@ -34,5 +36,5 @@
margin-top: 10px;
color: black;
font-weight: 600;
}
letter-spacing: .6px;
}

@ -1,7 +1,8 @@
.custom-button {
box-shadow: 0px 0px 5px #ccc;
background: white;
margin-bottom: 0px;
border: 1px solid #ccc;
margin-bottom: 5px;
border-radius: 20px;
width: 200px;
max-width: 105px;

@ -51,6 +51,7 @@ ion-label {
.main-dashboard-container {
position: relative;
width: 100%;
--background: #f5f5f5;
}
.contentBg:before {

@ -356,7 +356,7 @@ ion-card {
.active-Segment {
font-size: 0.3cm !important;
background: #024d71 !important;
background: #0ca2de !important;
text-transform: none;
--color-checked: none;
border-radius: 100px;

@ -43,7 +43,7 @@ ion-app[lang="ar"] {
ion-button,
ion-title,
span {
font-family: var(--fontFamilyIOSARSEMIBOLD) !important;
font-family: var(--fontFamilyIOSAR) !important;
line-height: 1.3;
}
}
@ -1447,6 +1447,8 @@ div.no-dataDiv {
border-radius: 25px !important;
border: 1px solid #cccccc;
margin-top: 10px;
width: 98%;
margin: 10px 0;
}
@ -1882,6 +1884,7 @@ ion-segment-button {
.menu-label {
margin-left: 5px;
margin-bottom: 7px;
}
ion-app[dir="rtl"] {
@ -1900,7 +1903,7 @@ ion-app[dir="rtl"] {
}
.pClass {
font-size: 12px;
font-size: 11px;
}
}

Loading…
Cancel
Save