new designs

MOE_DEV_NEW_DESIGN
Sultan Khan 4 years ago
parent c2439eb85c
commit 91605bd7ec

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

@ -37,6 +37,7 @@ export class AppComponent implements OnInit {
deviceToken: string;
TeamFlag: string = 'false';
isIOS = false;
lang: string = 'en';
userInfo;
public requestGetLoginInfo: {
DeviceType: string;
@ -103,10 +104,12 @@ export class AppComponent implements OnInit {
private monitUrlChange() {
this.router.events.subscribe((val) => {
this.lang = TranslatorService.getCurrentLanguageName();
if (this.router.isActive('/authentication/login', true)) {
this.direction = 'ltr';
} else {
this.direction = TranslatorService.getCurrentDirection();
}
});
}

@ -17,12 +17,13 @@
}
.pageTitle {
color: var(--dark);
font-size: 23px;
color: var(--primary);
font-size: 20px;
width: 100%;
text-align: center;
padding: 0px;
margin: 0px;
font-weight: 600;
}
.TxtPlace {
@ -121,17 +122,15 @@ img.centerDiv {
}
.item-input {
--min-height: 1.0cm !important;
--min-height: 57px !important;
--border-radius: 12px;
--ion-color-base: white !important;
// --background: color: var(--darkgray) !important;
// background: #7f8c8d !important;
border-radius: 33px;
--border: solid #9999992b !important;
border: solid #9999992b !important;
border-radius: 12px;
margin-bottom: 12px;
margin-left: 12px;
margin-right: 12px;
box-shadow: 0px 1px 5px #0000000F;
color: var(--primary);
}
.button-login {
@ -191,7 +190,7 @@ img.centerDiv {
.last-circle {
position: inherit;
background: #65C399 !important;
background: #D5E2E8 !important;
border-radius: 50%;
height: 166px;
width: 140px;

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

@ -11,8 +11,8 @@
display: block;
margin: 0 auto;
max-width: 100%;
width: 50px;
height: 50px;
width: 40px;
height: 40px;
position: absolute;
border-radius: 50%;
}
@ -22,7 +22,7 @@
color: white;
font-size: 0.5cm;
font-weight: bold;
font-family: WorkSans-Regular;
// font-family: WorkSans-Regular;
display: block;
text-align: center;
line-height: 46px;

@ -15,11 +15,12 @@
display: block;
width: 100%;
position: static;
text-align: center;
}
.iconBox img {
margin: 0px auto 10px;
display: block;
display: inline-block;
width: 35px;
// max-width: 35%;
}

@ -20,7 +20,7 @@
// max-width: 45%;
// padding-bottom: 5px;
// padding-top: 5px;
display: block;
display: inline-block;
max-width: 67%;
padding-bottom: 9px;
padding-top: 5px;
@ -35,7 +35,7 @@
font-size: 25px;
font-weight: bold;
color: black;
text-align: -webkit-auto;
text-align: center;
display: block;
}
}
@ -46,10 +46,10 @@ ion-app[dir="rtl"] .titleBox {
.pClass {
color: black;
width: 85%;
width: 100%;
margin-top: 5px;
font-weight: bold;
text-align: -webkit-auto;
text-align: center;
display: block;
font-size: 14px !important;
}

@ -196,8 +196,8 @@ export class HomePage implements OnInit {
spaceBetween: 10
};
this.slideOptsTwo = {
slidesPerView: width > 320 ? 3.5 : 3,
spaceBetween: width > 320 ? 20 : 15
slidesPerView: width > 320 ? 3.2 : 2.6,
spaceBetween: width > 320 ? 10 : 10
};
this.showStaticServices = true;
}

Binary file not shown.

@ -1,27 +1,48 @@
// $font-family-base: "WorkSans-Regular" !default;
body {
:root[dir="rtl"] {
ion-app[lang="en"] {
font-family: var(--fontFamilyBoldEN) !important;
}
ion-app[lang="ar"] {
font-family: var(--fontFamilyIOSAR) !important;
}
:root[dir="ltr"] {
font-family: var(--fontFamilyMediumEN) !important;
}
ion-app[lang="en"] {
input,
textarea,
p,
label,
div,
h1,
h2,
h3,
button,
ion-button {
font-size: 16px;
font-family: var(--fontFamilyBoldEN) !important;
}
}
input,
textarea,
p,
label,
div {
font-size: 16px;
ion-app[lang="ar"] {
:root[dir="rtl"] {
input,
textarea,
p,
label,
div,
h1,
h2,
h3,
button,
ion-button {
font-family: var(--fontFamilyIOSAR) !important;
}
:root[dir="ltr"] {
font-family: var(--fontFamilyLightEN) !important;
}
}
@ -29,13 +50,14 @@ h1,
h2,
h3,
button {
:root[dir="rtl"] {
font-family: var(--fontFamilyIOSAR) !important;
}
// ion-app[lang="en"] {
// font-family: var(--fontFamilyBoldEN) !important;
// }
:root[dir="ltr"] {
font-family: var(--fontFamilyMediumEN) !important;
}
// ion-app[lang="ar"] {
// font-family: var(--fontFamilyIOSAR) !important;
// }
}
@ -272,44 +294,57 @@ p.text-caps {
text-transform: uppercase;
}
.boldTxt,
p.boldTxt,
.boldTxt>label {
:root[dir="ltr"] {
ion-app[lang="en"] {
.boldTxt,
p.boldTxt,
.boldTxt>label {
font-family: var(--fontFamilyBoldEN) !important;
}
}
:root[dir="rtl"] {
ion-app[lang="ar"] {
.boldTxt,
p.boldTxt,
.boldTxt>label {
font-family: var(--fontFamilyIOSAR) !important;
font-weight: bold;
}
}
.boldTxtNav,
p.boldTxtNav,
.boldTxtNav>label {
color: var(--dark) !important;
// .boldTxtNav,
// p.boldTxtNav,
// .boldTxtNav>label {
// color: var(--dark) !important;
:root[dir="ltr"] {
font-family: var(--fontFamilyBoldEN) !important;
}
// ion-app[lang="en"] {
// font-family: var(--fontFamilyBoldEN) !important;
// }
:root[dir="rtl"] {
font-family: var(--fontFamilyIOSAR) !important;
font-weight: bold;
}
}
// ion-app[lang="ar"] {
// font-family: var(--fontFamilyIOSAR) !important;
// font-weight: bold;
// }
ion-label.boldTxtNav.label.label-md,
ion-label.boldTxtNav.label.label-ios {
// font-weight: bold;
color: var(--dark);
// }
ion-app[lang="en"] {
:root[dir="ltr"] {
font-family: var(--fontFamilySemiBoldEN) !important;
ion-label.boldTxtNav.label.label-md,
ion-label.boldTxtNav.label.label-ios {
// font-weight: bold;
color: var(--dark);
font-family: var(--fontFamilyBoldEN) !important;
}
}
:root[dir="rtl"] {
ion-app[lang="ar"] {
ion-label.boldTxtNav.label.label-md,
ion-label.boldTxtNav.label.label-ios {
font-family: var(--fontFamilyIOSAR) !important;
font-weight: bold;
}
@ -656,14 +691,15 @@ ion-col.colBold>label {
padding-left: 10px !important;
margin: 10px auto;
:root[dir="ltr"] {
font-family: var(--fontFamilySemiBoldEN) !important;
}
// ion-app[lang="en"] {
// font-family: var(--fontFamilyBoldEN) !important;
// }
// ion-app[lang="ar"] {
// font-family: var(--fontFamilyIOSAR) !important;
// font-weight: bold;
// }
:root[dir="rtl"] {
font-family: var(--fontFamilyIOSAR) !important;
font-weight: bold;
}
}
@ -688,15 +724,16 @@ ion-col.colBold>label {
margin: 10px auto;
margin-right: 12px !important;
:root[dir="ltr"] {
font-family: var(--fontFamilySemiBoldEN) !important;
ion-app[lang="en"] {
font-family: var(--fontFamilyBoldEN) !important;
}
:root[dir="rtl"] {
ion-app[lang="ar"] {
font-family: var(--fontFamilyIOSAR) !important;
font-weight: bold;
}
}
img.flipImg {
@ -954,7 +991,7 @@ div.daynamicForm-DateTime.disabled {
/************footer****************/
ion-footer {
padding: 15px 0px;
background-color: var(--light) !important;
background-color: var(--ion-background) !important;
border: 0px !important;
box-shadow: none !important;
-webkit-box-shadow: none;
@ -1001,14 +1038,15 @@ ion-footer {
text-align: center;
color: var(--darkgray);
:root[dir="ltr"] {
font-family: var(--fontFamilySemiBoldEN);
ion-app[lang="en"] {
font-family: var(--fontFamilyBoldEN) !important;
}
:root[dir="rtl"] {
font-family: var(--fontFamilyIOSAR);
ion-app[lang="ar"] {
font-family: var(--fontFamilyIOSAR) !important;
font-weight: bold;
}
}
.cusprogressbar li:before {
@ -1850,4 +1888,8 @@ ion-app[dir="rtl"] {
ion-menu-button {
display: none !important;
}
ion-content {
--background: var(--ion-background);
}

@ -68,24 +68,34 @@
src: url('../assets/font/Poppins/Poppins-Regular.ttf');
}
@font-face {
font-family: Inter;
src: url('../assets/font/Inter-V.ttf');
}
@font-face {
font-family: Kufi;
src: url('../assets/font/NotoKufiArabic-Regular-1.ttf');
}
:root {
--ion-font-family: 'Poppins';
--ion-font-family: 'Inter';
--break-small: 450px;
--break-big: 565px;
//$break-large: 1200px;
--fontFamilyLightEN: 'Poppins';
--ontFamilyLightAR: 'GE_SS_Two_Light';
--fontFamilyRegularEN: 'Poppins';
--fontFamilyRegularAR: 'GE_SS_TWO_MEDIUM';
--fontFamilyMediumEN: 'Poppins-Regular';
--fontFamilyMediumAR: 'GE_SS_TWO_MEDIUM';
--fontFamilyBoldEN: 'Poppins-Bold';
--fontFamilyBoldAR: 'GE_SS_Two_Bold';
--fontFamilySemiBoldEN: 'Poppins-Bold';
--fontFamilySemiBoldAR: 'GE_SS_Two_Bold';
--fontFamilyIOSAR: -apple-system, "Helvetica Neue", "Roboto", sans-serif;
--fontFamilyAndroidAR: "Roboto", "Helvetica Neue", sans-serif;
--primary: #3ac1f1;
--fontFamilyLightEN: 'Inter';
--ontFamilyLightAR: 'Kufi';
--fontFamilyRegularEN: 'Inter';
--fontFamilyRegularAR: 'Kufi';
--fontFamilyMediumEN: 'Inter';
--fontFamilyMediumAR: 'Kufi';
--fontFamilyBoldEN: 'Inter';
--fontFamilyBoldAR: 'Kufi';
--fontFamilySemiBoldEN: 'Inter';
--fontFamilySemiBoldAR: 'Kufi';
--fontFamilyIOSAR: 'Kufi';
--fontFamilyAndroidAR: 'Kufi';
--primary: #004D71;
--secondary: #19a163;
--danger: #f53d3d;
--customnavy: #44A7A1;
@ -108,6 +118,7 @@
--newred: #cb3232;
--fontFamilyPoppins-SemiBold: 'Poppins-SemiBold';
--fontFamilyPoppins-Medium: 'Poppins-Medium';
--ion-background: #F6F6F7;
// $font-family-base: $fontFamilyMediumEN !default;
// $font-family-ios-base: $fontFamilyMediumEN !default;
// $font-family-md-base:$fontFamilyMediumEN !default;

Loading…
Cancel
Save