MOE design in progress

MOE_DEV_NEW_DESIGN
Sultan Khan 4 years ago
parent f7234e3522
commit d581ff52a4

@ -222,7 +222,9 @@ header
margin-left: 0.2cm;
}
ion-content {
--background: #fff;
}
.sidebar-menu .header-div {
@ -232,6 +234,7 @@ header
display: block;
margin-bottom: -10px;
top: 40px;
}
.list-en {
@ -289,7 +292,7 @@ button.menu-item.item.item-block.item-ios {
padding: 0;
text-align: center;
font-weight: bolder;
color: black;
color: var(--primary);
font-size: 18px;
}
@ -369,8 +372,8 @@ ion-thumbnail.menu-thumb {
}
.profile {
color: black !important;
font-weight: bolder !important;
color: #5C6F79 !important;
}

@ -16,14 +16,14 @@
</ion-grid>
<div *ngIf="!user" [dir]="currentLang==1 ?'rtl': 'ltr'">
<ion-item class="item-input-login">
<img style="margin: 9px 8px 9px 0 !important;" class="item-icon" src="assets/imgs/username.png" item-start />
<ion-item lines="none" class="item-input-login">
<img 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">
<img style="margin: 9px 8px 9px 0 !important;" class="item-icon" src="assets/imgs/password.png" item-start />
<ion-item lines="none" class="item-input-login">
<img 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>
<ion-icon *ngIf='inputType === "text"' name="ios-eye" (click)="showPassword()"></ion-icon>
@ -37,7 +37,7 @@
<button class="gridBtn" ion-button (click)="changeLanguage('2')" [ngClass]="{'active':currentLang ==2}">English</button>
<button class="gridBtn arTxt" ion-button (click)="changeLanguage('1')" [ngClass]="{'active':currentLang ==1}">عربي</button>
</div>
</div>
@ -46,7 +46,7 @@
</welcome-login>
<!-- </div> -->
<div *ngIf="!user" class="centerDiv" style="margin: 25px 15px !important;">
<div *ngIf="!user" class="centerDiv" style="margin: 30px 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 -->
@ -60,12 +60,20 @@
{{ts.trPK('login','forgot-password')}}
</button> -->
</div>
</div>
</ion-content>
<ion-footer *ngIf="!user" [ngStyle]="keyboardOpened === true ? {'display': 'none'} : {}" style="padding: 0px;">
<ion-row>
<ion-col class="colPad">
<img class="centerDiv logoFotor" src="../assets/imgs/CSLogo.png" />
<div class="footer-container">
<ion-col class="colPad" size="9">
<img class="logoFotor" src="../assets/imgs/menu_mohemm_logo.png" />
</ion-col>
<ion-col class="colPad" size="9">
<img class="moe-logo" src="../assets/icon/moe-logo.png" />
</ion-col>
</div>
</ion-row>
</ion-footer>

@ -119,6 +119,7 @@ img.centerDiv {
.login-input {
border: none;
margin-right: 5px;
color: var(--grayTextColor);
}
.item-input {
@ -130,7 +131,8 @@ img.centerDiv {
margin-left: 12px;
margin-right: 12px;
box-shadow: 0px 1px 5px #0000000F;
color: var(--primary);
color: var(--grayTextColor);
font-family: var(--fontFamilyIOSAR);
}
.button-login {
@ -140,11 +142,12 @@ img.centerDiv {
white-space: normal;
color: var(--light);
text-transform: capitalize;
min-height: 1.0cm;
--border-radius: 33px !important;
border-radius: 33px !important;
min-height: 57px;
border-radius: 12px !important;
--min-height: 1.6cm !important;
width: 315px;
box-shadow: 0px 1px 6px #0000000F;
font-size: 18px;
}
.button-digital-id {
@ -169,7 +172,7 @@ img.centerDiv {
}
.first-circle {
background: var(--newgreen) !important;
background: var(--main-color) !important;
border-radius: 50%;
height: 292px;
width: 288px;
@ -197,10 +200,23 @@ img.centerDiv {
margin: -147px 0px 0px 274px;
}
.logoFotor {
width: 45px !important;
height: 45px !important;
.footer-container {
position: relative;
width: 100%;
display: flex;
align-items: stretch;
}
.footer-container .logoFotor {
position: relative;
margin: 20px;
width: 95px;
}
.footer-container .moe-logo {
position: relative;
margin: 10px 20px;
width: 45px;
}
.welcomeText {

@ -1611,7 +1611,7 @@ export class CommonService {
value: 0,
name: 'HR',
active: false,
color: '#18a169',
color: '#43A6A0',
key: 'HRSSA',
disable: false,
total: 0
@ -1686,7 +1686,7 @@ export class CommonService {
{
data: [0, 0, 0, 0, 0, 0, 0, 0],
backgroundColor: [
'#18a169',
'#43A6A0',
'#3cb9d5',
'#114475',
'#38c9b3',

@ -1,7 +1,7 @@
<div class="main-container" [ngStyle]="active === true ? {'background': color} : {}">
<div class="main-container-radius" [ngStyle]="active === true ? {'background-color': '#ffffff'} : {'background-color': color}"></div>
<span *ngIf="text != 'All'" class="number-span" [ngStyle]="active === true ? {'color': '#ffffff'} : {}">{{value}}</span>
<span class="text-span" [ngStyle]="active === true ? {'color': '#ffffff'} : {}">{{text}}</span>
<div class="main-container">
<div class="main-container-radius" [ngStyle]="active === true ? {'background-color': color} : {'background-color': '#fff'}"></div>
<span *ngIf="text != 'All'" class="number-span" >{{value}}</span>
<span class="text-span" >{{text}}</span>
</div>

@ -1,4 +1,4 @@
.main-container{
.main-container {
width: 72px;
background-color: white;
padding: 10px;
@ -7,10 +7,12 @@
text-align: right;
font-family: WorkSans-Regular;
padding-top: 25px;
box-shadow: 0 0 6px rgba(0,0,0,0.16);
box-shadow: 0px 1px 5px #00000012;
position: relative;
border: 1px solid #D0D4D696;
}
.main-container-radius{
.main-container-radius {
// content: "";
position: absolute;
width: 30px;
@ -20,14 +22,16 @@
left: 10px;
top: 10px;
}
.number-span{
.number-span {
font-size: 19px;
display: block;
line-height: 18px;
color: #004D71;
}
.text-span{
.text-span {
font-size: 14px;
color: #888;
color: #5C6F79;
margin: -1px;
}
}

@ -1,12 +1,12 @@
.custom-button {
background: #FCFCFC 0% 0% no-repeat padding-box;
margin-bottom: 5px;
box-shadow: 2px 2px 6px #00000029;
box-shadow: 0px 1px 5px #0000000F;
width: 100%;
max-width: 105px;
height: 100px;
max-width: 115px;
height: 105px;
padding: 10px;
min-width: 96px;
min-width: 105px;
border: 1px solid #D0D4D6;
border-radius: 25px;
}
@ -19,9 +19,10 @@
}
.iconBox img {
margin: 0px auto 10px;
margin: 7px auto 3px;
display: inline-block;
width: 35px;
width: 30px;
height: 30px;
// max-width: 35%;
}
@ -30,9 +31,9 @@
}
.pClass {
font-size: 9px;
font-size: 12px;
text-align: center;
margin-top: 10px;
color: black;
color: var(--primary);
font-weight: bold;
}

@ -1,19 +1,22 @@
.custom-button {
background: white;
margin-bottom: 5px;
margin-bottom: 10px;
border: 1px solid #D0D4D6;
border-radius: 20px;
width: 200px;
width: 120px;
max-width: 105px;
height: 160px;
padding: 10px;
box-shadow: 2px 2px 6px #00000029;
max-height: 145px;
box-shadow: 0px 0px 20px #00000029;
}
.iconBox {
display: block;
width: 100%;
position: static;
height: 47px;
img {
// display: block;
@ -24,7 +27,7 @@
max-width: 67%;
padding-bottom: 9px;
padding-top: 5px;
height: 47px;
height: 44px;
}
}
@ -34,7 +37,7 @@
span {
font-size: 25px;
font-weight: bold;
color: black;
color: var(--primary);
text-align: center;
display: block;
}
@ -44,8 +47,9 @@ ion-app[dir="rtl"] .titleBox {
text-align: right;
}
.pClass {
color: black;
color: var(--primary);
width: 100%;
margin-top: 5px;
font-weight: bold;

@ -47,18 +47,18 @@
</ion-slide>
</ion-slides>
<!-- <ion-row class="attendance-module" *ngIf="i == 0">
<ion-col [size]="8">
<h3>{{'home,monthly-attendance' | translate}}</h3>
<span>{{'home,monthly-time-sheet-view' | translate}}</span>
<ion-row class="attendance-module" *ngIf="i == 0">
<ion-col [size]="9">
<h3>{{'myTeam,profile-details' | translate}}</h3>
<ion-button (click)="openTimeCard()">
{{'home,view-detail' | translate}}
</ion-button>
</ion-col>
<ion-col [size]="4">
<img src="assets/icon/new-design/attendance_button_icon.png"/>
<ion-col [size]="3">
<img src="assets/imgs/profile1.png"/>
</ion-col>
</ion-row> -->
</ion-row>
</ion-row>
<!-- <ion-row *ngIf="showStaticServices">

@ -43,10 +43,11 @@ ion-title {
ion-label {
display: block;
color: black !important;
font-size: 14px;
color: var(--primary) !important;
font-size: 18px;
font-weight: bold;
margin: 10px;
margin: 0px 10px 10px 10px;
}
.main-dashboard-container {
@ -75,7 +76,7 @@ ion-label {
.attendance-module {
border-radius: 20px;
background-color: #292F42;
background-color: #44A7A1;
padding: 10px;
color: white;
width: 100%;
@ -85,7 +86,7 @@ ion-label {
h3 {
font-size: 18px;
font-weight: bold;
margin: 0;
margin: 5px 5px 0px 10px;
}
span {
@ -96,19 +97,20 @@ ion-label {
img {
display: block;
margin: 10px auto;
width: 80%;
width: 100%;
}
ion-button {
border-radius: 10px;
padding: 10px;
background: #004D71;
--background: transparent;
--border-radius: 15px;
padding: 5px;
opacity: .8;
color: #fff;
--background: #ffffff33;
--box-shadow: none !important;
height: auto;
height: 43px;
min-height: inherit;
margin-top: 10px;
font-size: 12px;
margin-top: 15px;
font-size: 14px;
}
}

@ -14,7 +14,8 @@
<h2>{{totalRequestCount}}</h2>
<!-- <h2 *ngIf="showSearchButton && newWorkListResponse.length > 0 && itemType === ''">{{newWorkListResponse[0].NO_OF_ROWS + ITGCount}}</h2> -->
<!-- <h2 *ngIf="showSearchButton && newWorkListResponse.length > 0 && selectedFilter !== 'ALL' && itemType !== ''">{{newWorkListResponse[0].NO_OF_ROWS}}</h2> -->
<span>{{ts.trPK('work-list','total')}} <br> {{ts.trPK('work-list','open-reqest')}}</span>
<!-- {{ts.trPK('work-list','total')}} <br> -->
<span> {{ts.trPK('work-list','open-reqest')}}</span>
</div>
<!-- <div *ngIf="!showChart || !receivedITGCount" class="spinner-custom-class">
<ion-spinner class="spinner" name="lines"></ion-spinner>

@ -287,7 +287,8 @@ ion-content {
text-align: center;
display: block;
padding-top: 8px;
font-family: workSans-Regular;
font-size: 18px;
}
}
@ -300,6 +301,7 @@ ion-content {
padding-bottom: 20px;
border-radius: 20px;
z-index: 1;
box-shadow: 0px 1px 25px #00000010;
}
.result-text-container {
@ -314,7 +316,7 @@ ion-content {
h2 {
font-size: 38px;
font-family: WorkSans-Bold;
color: #004D71;
margin: 0 auto;
line-height: 36px;
}
@ -322,9 +324,9 @@ ion-content {
span {
width: 125px;
display: block;
margin: 0 auto;
margin: 3px auto;
font-size: 12px;
font-family: workSans-Regular;
color: #004D71;
}
}
@ -385,15 +387,20 @@ ion-content {
.search-container {
margin-top: 15px;
display: block;
padding: 0 20px;
position: relative;
z-index: 99;
color: #004D71;
height: 36px;
padding: 8px;
ion-col {
background: white;
border-radius: 12px;
// padding-right: 30px;
flex: none;
box-shadow: 0px 1px 5px #0000000f;
ion-icon {
margin-right: 3px;
@ -403,7 +410,7 @@ ion-content {
}
span {
font-size: 14px;
font-size: 12px;
vertical-align: middle;
margin: 5px;
}
@ -414,6 +421,8 @@ ion-content {
position: relative;
display: block;
margin-bottom: 10px;
color: #5C6F79;
font-size: 18px;
}
.date-span:before {
@ -451,15 +460,16 @@ ion-content {
.date-data {
background-color: white;
padding: 1px;
border-radius: 20px;
font-family: WorkSans-Regular;
border-radius: 12px;
padding-left: 15px;
margin-right: 20px;
margin-bottom: 15px;
padding-right: 15px;
box-shadow: 0px 1px 5px #0000000f;
p {
font-size: 14px;
color: #004D71;
}
}

@ -88,7 +88,8 @@ export class HomeComponent implements OnInit {
public options = {
cutoutPercentage: 80,
tooltips: { enabled: false },
legend: { display: false }
legend: { display: false },
};
// public data = {
// datasets: [
@ -112,7 +113,7 @@ export class HomeComponent implements OnInit {
value: 0,
name: 'HR',
active: false,
color: '#18a169',
color: '#43A6A0',
key: 'HRSSA',
disable: false
},

@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="28.013" height="28.013" viewBox="0 0 28.013 28.013">
<g id="user_2_" data-name="user (2)" transform="translate(0 0)">
<g id="Group_142" data-name="Group 142" transform="translate(0 0)">
<path id="Path_65" data-name="Path 65" d="M23.91,4.1A14.006,14.006,0,0,0,4.1,23.91,14.006,14.006,0,0,0,23.91,4.1Zm-9.9,22.269a12.322,12.322,0,0,1-8.58-3.47,9.03,9.03,0,0,1,17.159,0A12.322,12.322,0,0,1,14.006,26.371ZM9.9,10.942a4.1,4.1,0,1,1,4.1,4.1A4.108,4.108,0,0,1,9.9,10.942ZM23.818,21.521a10.7,10.7,0,0,0-6.444-5.928,5.745,5.745,0,1,0-6.736,0,10.7,10.7,0,0,0-6.444,5.928,12.365,12.365,0,1,1,19.624,0Z" transform="translate(0 0)" fill="#a2aaaf"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 718 B

@ -0,0 +1,28 @@
<svg id="Group_7711" data-name="Group 7711" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="35.483" height="35.418" viewBox="0 0 35.483 35.418">
<defs>
<clipPath id="clip-path">
<rect id="Rectangle_5" data-name="Rectangle 5" width="16.823" height="16.806" fill="#99b8c6"/>
</clipPath>
<clipPath id="clip-path-2">
<rect id="Rectangle_6" data-name="Rectangle 6" width="10.435" height="12.713" fill="#99b8c6"/>
</clipPath>
</defs>
<g id="Group_7" data-name="Group 7" transform="translate(4.05 0)" opacity="0.4">
<g id="Group_6" data-name="Group 6" transform="translate(0 0)">
<g id="Group_5" data-name="Group 5" clip-path="url(#clip-path)">
<path id="Path_9" data-name="Path 9" d="M13.792,0a8.4,8.4,0,0,0-.212,16.806,1.4,1.4,0,0,1,.389,0h.124A8.406,8.406,0,0,0,13.792,0" transform="translate(-5.38 0)" fill="#99b8c6"/>
</g>
</g>
</g>
<path id="Path_10" data-name="Path 10" d="M21.463,27.771c-4.941-3.294-13-3.294-17.974,0A6.99,6.99,0,0,0,0,33.49a6.93,6.93,0,0,0,3.471,5.685,16.363,16.363,0,0,0,9,2.5,16.363,16.363,0,0,0,9-2.5,6.988,6.988,0,0,0,3.471-5.72,6.974,6.974,0,0,0-3.471-5.684" transform="translate(0 -6.254)" fill="#004d71"/>
<g id="Group_10" data-name="Group 10" transform="translate(21.514 3.642)" opacity="0.4">
<g id="Group_9" data-name="Group 9">
<g id="Group_8" data-name="Group 8" clip-path="url(#clip-path-2)">
<path id="Path_11" data-name="Path 11" d="M38.992,10.652a6.338,6.338,0,0,1-5.543,6.853h-.089a.831.831,0,0,0-.3.035,6.351,6.351,0,0,1-4.48-1.47,8.1,8.1,0,0,0,2.656-6.729,8.221,8.221,0,0,0-1.363-3.86,6.357,6.357,0,0,1,9.12,5.171" transform="translate(-28.58 -4.838)" fill="#99b8c6"/>
</g>
</g>
</g>
<path id="Path_12" data-name="Path 12" d="M42.457,31.943a5.393,5.393,0,0,1-3.082,4.215,12.5,12.5,0,0,1-6.216,1.381,6.325,6.325,0,0,0,2.161-4.109,6.978,6.978,0,0,0-2.958-5.985,14.605,14.605,0,0,0-4.073-2.231c3.914-1.134,8.837-.372,11.865,2.072a5.381,5.381,0,0,1,2.3,4.657" transform="translate(-6.994 -6.106)" fill="#004d71"/>
<rect id="Rectangle_7" data-name="Rectangle 7" width="35.482" height="35.418" fill="none"/>
<rect id="Rectangle_8" data-name="Rectangle 8" width="35.483" height="35.417" transform="translate(0 0)" fill="none"/>
</svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

@ -0,0 +1,9 @@
<svg id="list" xmlns="http://www.w3.org/2000/svg" width="37.566" height="37.566" viewBox="0 0 37.566 37.566">
<path id="Path_13" data-name="Path 13" d="M45.367,38.353l-3.688,5.3-2.6-2.136a.659.659,0,1,0-.836,1.018L41.4,45.124a.656.656,0,0,0,.418.15.6.6,0,0,0,.09-.007.66.66,0,0,0,.451-.276l4.1-5.885a.659.659,0,0,0-1.082-.753Z" transform="translate(-12.956 -12.98)" fill="#004d71"/>
<path id="Path_14" data-name="Path 14" d="M35.589,23.531V8.025A8.034,8.034,0,0,0,27.564,0H8.025A8.034,8.034,0,0,0,0,8.025v19.54a8.034,8.034,0,0,0,8.025,8.025H23.531A8.562,8.562,0,0,0,35.589,23.531ZM8.025,34.271a6.714,6.714,0,0,1-6.706-6.706V8.025A6.714,6.714,0,0,1,8.025,1.318h19.54a6.714,6.714,0,0,1,6.706,6.706v14.23c-.049-.039-.1-.072-.152-.109-.138-.1-.277-.208-.422-.3l-.047-.028a8.548,8.548,0,0,0-1.065-.585c-.05-.023-.1-.049-.149-.072-.145-.064-.293-.119-.442-.175-.094-.036-.188-.072-.284-.1-.136-.045-.274-.086-.413-.125-.118-.033-.237-.064-.356-.092s-.251-.057-.379-.081c-.152-.028-.3-.05-.458-.07-.1-.013-.2-.03-.309-.04-.264-.026-.529-.041-.8-.041a8.577,8.577,0,0,0-8.328,6.591H17.794a.659.659,0,0,0,0,1.318h2.67c-.017.218-.034.437-.034.659,0,.267.016.533.04.8.01.1.026.207.04.31.02.152.042.3.07.455.024.129.052.256.082.382s.058.235.09.351c.04.141.08.281.127.418.031.093.067.184.1.275.057.152.113.3.177.45.019.043.042.086.062.129a8.481,8.481,0,0,0,.605,1.1c.006.009.011.019.017.028.1.146.2.285.3.424.038.05.071.1.109.152H8.025ZM29,36.248a7.211,7.211,0,0,1-4.837-1.865q-.239-.215-.457-.447c-.032-.034-.063-.069-.095-.1q-.207-.23-.392-.475c-.028-.038-.057-.075-.085-.113q-.183-.253-.343-.52c-.022-.036-.044-.071-.065-.107-.108-.187-.206-.378-.3-.573-.015-.031-.03-.061-.044-.092-.092-.2-.172-.412-.244-.623-.009-.026-.02-.051-.028-.077-.071-.215-.129-.434-.18-.656-.006-.026-.014-.051-.02-.077-.047-.218-.081-.44-.107-.662,0-.031-.011-.061-.014-.093A7.147,7.147,0,0,1,21.749,29,7.258,7.258,0,0,1,29,21.749a7.033,7.033,0,0,1,.765.042c.03,0,.058.01.088.014.224.027.447.061.667.109.025.005.049.014.074.019.223.051.443.109.659.181l.072.026q.32.109.629.246l.086.042q.3.137.579.3c.034.02.068.042.1.062.18.109.355.223.526.347l.107.08q.249.188.482.4c.033.03.066.059.1.089q.236.22.455.464A7.237,7.237,0,0,1,29,36.248Z" fill="#004d71"/>
<path id="Path_15" data-name="Path 15" d="M26.659,13.318H38.522a.659.659,0,1,0,0-1.318H26.659a.659.659,0,0,0,0,1.318Z" transform="translate(-8.865 -4.091)" fill="#004d71"/>
<path id="Path_16" data-name="Path 16" d="M26.659,27.318H38.522a.659.659,0,1,0,0-1.318H26.659a.659.659,0,0,0,0,1.318Z" transform="translate(-8.865 -8.865)" fill="#004d71"/>
<path id="Path_17" data-name="Path 17" d="M15.19,7.231l-4.118,4.8L8.554,10.144A.659.659,0,1,0,7.763,11.2l3.013,2.26a.659.659,0,0,0,.9-.1l4.519-5.272a.659.659,0,1,0-1-.856Z" transform="translate(-2.557 -2.387)" fill="#004d71"/>
<path id="Path_18" data-name="Path 18" d="M15.19,21.231l-4.118,4.8L8.554,24.144A.659.659,0,1,0,7.763,25.2l3.013,2.26a.659.659,0,0,0,.9-.1l4.519-5.272a.659.659,0,1,0-1-.856Z" transform="translate(-2.557 -7.16)" fill="#004d71"/>
<path id="Path_19" data-name="Path 19" d="M15.19,36.231l-4.118,4.8L8.554,39.144A.659.659,0,1,0,7.763,40.2l3.013,2.26a.659.659,0,0,0,.9-.1l4.519-5.272a.659.659,0,1,0-1-.857Z" transform="translate(-2.557 -12.274)" fill="#004d71"/>
</svg>

After

Width:  |  Height:  |  Size: 3.2 KiB

@ -7,7 +7,7 @@ body {
ion-app[lang="ar"] {
font-family: var(--fontFamilyIOSAR) !important;
line-height: 1.3;
}
}
@ -23,7 +23,9 @@ ion-app[lang="en"] {
h2,
h3,
button,
ion-button {
ion-button,
ion-title,
span {
font-size: 16px;
font-family: var(--fontFamilyBoldEN) !important;
}
@ -31,8 +33,7 @@ ion-app[lang="en"] {
ion-app[lang="ar"] {
input,
textarea,
p,
label,
div,
@ -40,9 +41,11 @@ ion-app[lang="ar"] {
h2,
h3,
button,
ion-button {
font-family: var(--fontFamilyIOSAR) !important;
ion-button,
ion-title,
span {
font-family: var(--fontFamilyIOSARSEMIBOLD) !important;
line-height: 1.3;
}
}
@ -311,6 +314,7 @@ ion-app[lang="ar"] {
.boldTxt>label {
font-family: var(--fontFamilyIOSAR) !important;
font-weight: bold;
line-height: 1.3;
}
}
@ -332,7 +336,8 @@ ion-app[lang="ar"] {
ion-app[lang="en"] {
ion-label.boldTxtNav.label.label-md,
ion-label.boldTxtNav.label.label-ios {
ion-label.boldTxtNav.label.label-ios,
ion-label {
// font-weight: bold;
color: var(--dark);
@ -344,9 +349,11 @@ ion-app[lang="en"] {
ion-app[lang="ar"] {
ion-label.boldTxtNav.label.label-md,
ion-label.boldTxtNav.label.label-ios {
ion-label.boldTxtNav.label.label-ios,
ion-label {
font-family: var(--fontFamilyIOSAR) !important;
font-weight: bold;
line-height: 1.3;
}
}
@ -1377,8 +1384,6 @@ div.no-dataDiv {
// --background: color: var(--darkgray) !important;
// background: #7f8c8d !important;
border-radius: 33px;
--border: solid #9999992b !important;
border: solid #9999992b !important;
margin-bottom: 12px;
margin-left: 12px;
margin-right: 12px;
@ -1465,12 +1470,17 @@ div.no-dataDiv {
.slideFullWidth {
margin-left: -10px;
margin-right: -1-px;
}
.slideFullWidth .swiper-container .swiper-wrapper .swiper-slide:first-child {
margin-left: 15px;
}
.slideFullWidth .swiper-container .swiper-wrapper .swiper-slide {
padding: 0px 10px 10px 0px;
}
.alert-button-group.sc-ion-alert-md,
.alert-button.sc-ion-alert-ios {
text-align: center;

@ -78,6 +78,21 @@
src: url('../assets/font/NotoKufiArabic-Regular-1.ttf');
}
@font-face {
font-family: Kufi;
src: url('../assets/font/notokufi/NotoKufiArabic-Regular.ttf');
}
@font-face {
font-family: Kufi-Semibold;
src: url('../assets/font/notokufi/NotoKufiArabic-SemiBold.ttf');
}
@font-face {
font-family: Kufi-Bold;
src: url('../assets/font/notokufi/NotoKufiArabic-Bold.ttf');
}
:root {
--ion-font-family: 'Inter';
--break-small: 450px;
@ -94,6 +109,7 @@
--fontFamilySemiBoldEN: 'Inter';
--fontFamilySemiBoldAR: 'Kufi';
--fontFamilyIOSAR: 'Kufi';
--fontFamilyIOSARSEMIBOLD: 'Semibold';
--fontFamilyAndroidAR: 'Kufi';
--primary: #004D71;
--secondary: #19a163;
@ -112,13 +128,16 @@
--red: #BE1E2D;
--blue: #223262;
--cyanblue: #1b75bc;
--newgreen: #004D71;
--newgreen: #44A7A1;
--main-color: #024D71;
--darkblue: #004D71;
--lightblue: #3cb9d5;
--newred: #cb3232;
--fontFamilyPoppins-SemiBold: 'Poppins-SemiBold';
--fontFamilyPoppins-Medium: 'Poppins-Medium';
--ion-background: #F6F6F7;
--grayTextColor: #5C6F79;
// $font-family-base: $fontFamilyMediumEN !default;
// $font-family-ios-base: $fontFamilyMediumEN !default;
// $font-family-md-base:$fontFamilyMediumEN !default;

Loading…
Cancel
Save