diff --git a/Mohem/src/app/absence/absence-confirm/absence-confirm.component.scss b/Mohem/src/app/absence/absence-confirm/absence-confirm.component.scss index 8cdb50a6..7f670d02 100644 --- a/Mohem/src/app/absence/absence-confirm/absence-confirm.component.scss +++ b/Mohem/src/app/absence/absence-confirm/absence-confirm.component.scss @@ -1,285 +1,298 @@ -.imgSize{ - position: absolute; - right: 15px; - top: 0; - bottom: 0; - margin: auto; - height:20px; - width:20px; +.imgSize { + position: absolute; + right: 15px; + top: 0; + bottom: 0; + margin: auto; + height: 20px; + width: 20px; } + .rowAH ion-col { - border: 1px solid #d9d9d9; - font-size: 13px; + border: 1px solid #d9d9d9; + font-size: 13px; } + .titleH { - font-size: 13px; - border: 1px solid #d9d9d9; - border-top-right-radius: 5px; - border-top-left-radius: 5px; - border-bottom: 0px; + font-size: 13px; + border: 1px solid #d9d9d9; + border-top-right-radius: 5px; + border-top-left-radius: 5px; + border-bottom: 0px; } + .gridAH { - text-align: center; - padding: 5px 5px !important; - border-radius: 5px; + text-align: center; + padding: 5px 5px !important; + border-radius: 5px; } -ion-card-content.confirm-details{ - padding: 0; + +ion-card-content.confirm-details { + padding: 0; } -.confirm-details label{ - font-size: 13px; + +.confirm-details label { + font-size: 13px; } /****************** NEW Design ***************************************/ .footer-button { - border-radius: 2px; - padding: 0 1.1em; - min-height: 45px; - min-width: 200px; - } - + border-radius: 2px; + padding: 0 1.1em; + min-height: 45px; + min-width: 200px; +} + + + +.Header { + font-weight: bold; + color: #c6903e !important; + font-size: 10px; +} + +.tbData { + font-size: 10px; +} + +.btnBack { + background: transparent; + float: right; +} + +.attachmentDiv { + background: #ffffff; + height: auto; + text-align: center; + padding-top: 1px; + margin: 10px; + border-radius: 15px; + border: 1px solid grey; +} + +.noDataDiv { + background: #ffffff; + height: 11%; + text-align: center; + padding-top: 1px; + border-radius: 10px; + margin: 10px; + border-radius: 5px; +} + +.submitNote { + background: #ffffff; + height: 80px; + padding-top: 1px; + margin: 10px; + border-radius: 15px; + border: 1px solid grey; +} + +.approvalList { + --background: #f0efef; + height: auto; + text-align: center; + padding-top: 1px; + border-radius: 10px; + margin: 10px; + border-radius: 5px; +} + +/************************New Design**********************************/ +.notification-list { + background: none; + background: none; + border-radius: 32px; + + ion-item { + // margin-top: 5px; + // margin-bottom: 5px; + + background-color: transparent; + + .item-date { + width: 100%; + font-size: 16px; + font-weight: bold; + + text-align: start; + padding: 0; + margin: 0; + + position: absolute; + left: 0; + top: 12%; + } + + ion-label, + [item-end] { + + white-space: normal; + font-size: 14px; + padding-top: 15%; + // :root[dir="ltr"]{ + // margin-left: 10px; + // } + // :root[dir="rtl"]{ + // margin-right: 10px; + // } - - .Header { - font-weight: bold; - color: #1a586d !important; - font-size: 10px; - } - - .tbData { - font-size: 10px; - } - - .btnBack { - background: transparent; - float: right; - } - - .attachmentDiv{ - background: #ffffff; - height: auto; - text-align: center; - padding-top: 1px; - margin: 10px; - border-radius: 15px; - border: 1px solid grey; - } - - .noDataDiv{ - background: #ffffff; - height: 11%; - text-align: center; - padding-top: 1px; - border-radius: 10px; - margin: 10px; - border-radius: 5px; - } - .submitNote{ - background: #ffffff; - height: 80px; - padding-top: 1px; - margin: 10px; - border-radius: 15px; - border: 1px solid grey; - } - - .approvalList{ - --background: #f0efef; - height: auto; - text-align: center; - padding-top: 1px; - border-radius: 10px; - margin: 10px; - border-radius: 5px; - } - - /************************New Design**********************************/ - .notification-list{ - background: none; - background: none; - border-radius: 32px; - ion-item{ - // margin-top: 5px; - // margin-bottom: 5px; - - background-color: transparent; - .item-date{ - width: 100%; - font-size: 16px; - font-weight: bold; - - text-align: start; - padding: 0; - margin: 0; - - position: absolute; - left: 0; - top: 12%; - } - ion-label , [item-end]{ - - white-space: normal; - font-size: 14px; - padding-top: 15%; - // :root[dir="ltr"]{ - // margin-left: 10px; - // } - // :root[dir="rtl"]{ - // margin-right: 10px; - // } - - } - } - } - - - - - - - .timeline { - position: relative; - margin: 15px 0 0 0; - // border-bottom: solid 1px var(--cusgray); - } - - .timeline:before { - - content: ''; - position: inherit !important; - top: 0; - bottom: 0; - width: 4px; - // background: #e4e4e4; - z-index: 1; - left: 35px; - /* margin-left: -10px; */ - /* z-index: 1; */ - } - - .timeline .timeline-thumb { - - border-radius: 500px; - width: 70px !important; - z-index: 2; - position: absolute; - left: 0px; - // :root[dir="ltr"]{ - // left: 37px; - // } - // :root[dir="rtl"]{ - // right: 37px; - // } - float: right; - top: 9px; - } - - .timeline .timeline-thumb.timeline-icon { - height: 70px; - // text-align: center; - // color: white; - // border: 5px solid #CBD0D3; - // transform: scale(0.2); - } - - - - .timeline .timeline-item { - // width: 40px; - - } - - .timeline .timeline-stats { - position: relative; - font-size: 12px; - color: var(--darkgray); - - } - - .empImge{ - border-radius: 50%; - width:60px; - height: 60px; - border: #dedede solid 1px; - - } - .empImgeRep { - border-radius: 50% !important; - width: 80px; - height: 80px; - border: #dedede solid 1px; - } - - .line{ - padding-bottom:87px; - } - - .attachLable{ - position: absolute; - top: 0px; - z-index: 0; - background: #30b8c6; - color: #fff; - border-radius: 50%; - border: 0px; - width: 24px; - height: 24px; - text-align: center; - font-size: 5px; - } - - .removeLable{ - top: 0px; - z-index: 0; - background: #d8252d; - color: #fff; - border-radius: 50%; - border: 0px; - width: 20px; - height: 20px; - text-align: center; - font-size: 5px; - } - - .note-modal { - // width: 90%; - // height: 50%; - // top: 20%; - // left: 5%; - // right: 5%; - // bottom: 5%; - background: rgba(0, 0, 0, 0.5) !important; - padding: 30% 10% !important; - --height: 12cm !important; - // --width: 80% !important; - --border-radius:20px; - - } - .header-toolbar-new{ - --background: #269DB8; - } - - .confirmEitOkButton{ - white-space: normal !important; - text-transform: capitalize !important; - min-height: 45px !important; - min-width: 5px !important; - margin: 8px !important; - --background: #269DB8; - width: 80% !important; - color: white!important; - border-radius: 16px !important; - } - .approvalTitle-ar{ - font-weight: bold; - font-size: 16px; - text-align: right; - } - .approvalTitle{ - font-weight: bold; - font-size: 16px; - text-align: left; - } \ No newline at end of file +} + + + + + + +.timeline { + position: relative; + margin: 15px 0 0 0; + // border-bottom: solid 1px var(--cusgray); +} + +.timeline:before { + + content: ''; + position: inherit !important; + top: 0; + bottom: 0; + width: 4px; + // background: #e4e4e4; + z-index: 1; + left: 35px; + /* margin-left: -10px; */ + /* z-index: 1; */ +} + +.timeline .timeline-thumb { + + border-radius: 500px; + width: 70px !important; + z-index: 2; + position: absolute; + left: 0px; + // :root[dir="ltr"]{ + // left: 37px; + // } + // :root[dir="rtl"]{ + // right: 37px; + // } + float: right; + top: 9px; +} + +.timeline .timeline-thumb.timeline-icon { + height: 70px; + // text-align: center; + // color: white; + // border: 5px solid #CBD0D3; + // transform: scale(0.2); +} + + + +.timeline .timeline-item { + // width: 40px; + +} + +.timeline .timeline-stats { + position: relative; + font-size: 12px; + color: var(--darkgray); + +} + +.empImge { + border-radius: 50%; + width: 60px; + height: 60px; + border: #dedede solid 1px; + +} + +.empImgeRep { + border-radius: 50% !important; + width: 80px; + height: 80px; + border: #dedede solid 1px; +} + +.line { + padding-bottom: 87px; +} + +.attachLable { + position: absolute; + top: 0px; + z-index: 0; + background: #30b8c6; + color: #fff; + border-radius: 50%; + border: 0px; + width: 24px; + height: 24px; + text-align: center; + font-size: 5px; +} + +.removeLable { + top: 0px; + z-index: 0; + background: #d8252d; + color: #fff; + border-radius: 50%; + border: 0px; + width: 20px; + height: 20px; + text-align: center; + font-size: 5px; +} + +.note-modal { + // width: 90%; + // height: 50%; + // top: 20%; + // left: 5%; + // right: 5%; + // bottom: 5%; + background: rgba(0, 0, 0, 0.5) !important; + padding: 30% 10% !important; + --height: 12cm !important; + // --width: 80% !important; + --border-radius: 20px; + +} + +.header-toolbar-new { + --background: #BE332F; +} + +.confirmEitOkButton { + white-space: normal !important; + text-transform: capitalize !important; + min-height: 45px !important; + min-width: 5px !important; + margin: 8px !important; + --background: #BE332F; + width: 80% !important; + color: white !important; + border-radius: 16px !important; +} + +.approvalTitle-ar { + font-weight: bold; + font-size: 16px; + text-align: right; + +} + +.approvalTitle { + font-weight: bold; + font-size: 16px; + text-align: left; +} \ No newline at end of file diff --git a/Mohem/src/app/absence/home/home.component.html b/Mohem/src/app/absence/home/home.component.html index 5b60bdc0..9c24e7d2 100644 --- a/Mohem/src/app/absence/home/home.component.html +++ b/Mohem/src/app/absence/home/home.component.html @@ -145,7 +145,7 @@
- +

@@ -154,7 +154,7 @@
- +

@@ -163,7 +163,7 @@
- +

@@ -172,7 +172,7 @@
- +

@@ -181,7 +181,7 @@
- +

@@ -190,7 +190,7 @@
- +

@@ -199,7 +199,7 @@
- +

@@ -208,7 +208,7 @@
- +

diff --git a/Mohem/src/app/absence/home/home.component.scss b/Mohem/src/app/absence/home/home.component.scss index 0e176a32..062f0f4d 100644 --- a/Mohem/src/app/absence/home/home.component.scss +++ b/Mohem/src/app/absence/home/home.component.scss @@ -1,125 +1,128 @@ -.imgSize{ - position: absolute; - right: 15px; - top: 0; - bottom: 0; - margin: auto; - height:20px; - width:20px; -} - -.addClass{ - background-color: #269DB8; - width: 80px; - height: 80px; - right: 8%; - position: fixed; - color: white; - bottom: 5%; - border-radius: 50%; - z-index: 999; - -webkit-box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59); - -moz-box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59); - box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59); - } +.imgSize { + position: absolute; + right: 15px; + top: 0; + bottom: 0; + margin: auto; + height: 20px; + width: 20px; +} - .grids{ - border-radius: 20px !important; - background: white; - padding-left: 1px; - padding-right: 1px; - margin: 13px; - padding-top: 0px; - padding-bottom: 3px; - padding-left: 13px; - padding-right: 13px; - border: 1px solid #cac8c8; - margin-bottom: 10% !important; - } - - .bgcolor { - - color: white; - border-top-right-radius: 19px; - border-top-left-radius: 15px; - padding-top: 1; - padding-bottom: 0; - margin-top: 0; - margin-bottom: 0; - /* border-radius: 12px !important; */ - background: #269DB8; - border-bottom: 1px solid #a7a4a4; - border-top: 1px solid #cac8c8; - margin-left: -13px; - margin-right: -13px; - } - - - .header-div { - background-color: #269DB8; - text-transform: capitalize; - height: 100px; - } - - .header-toolbar-new{ - --background: #269DB8; - } - - - .hrClass{ - border-width: 0; - box-sizing: content-box; - border-bottom: 1px solid #e6e6e6; - background: #fff !important; - height: 1px; - } +.addClass { + background-color: #BE332F; + width: 80px; + height: 80px; + right: 8%; + position: fixed; + color: white; + bottom: 5%; + border-radius: 50%; + z-index: 999; + -webkit-box-shadow: 2px -1px 13px 0px rgba(0, 0, 0, 0.59); + -moz-box-shadow: 2px -1px 13px 0px rgba(0, 0, 0, 0.59); + box-shadow: 2px -1px 13px 0px rgba(0, 0, 0, 0.59); +} - //////////////////////////////////////////////down +.grids { + border-radius: 20px !important; + background: white; + padding-left: 1px; + padding-right: 1px; + margin: 13px; + padding-top: 0px; + padding-bottom: 3px; + padding-left: 13px; + padding-right: 13px; + border: 1px solid #cac8c8; + margin-bottom: 10% !important; +} - .colorBG{ - --background: #f0efef; - } +.bgcolor { + + color: white; + border-top-right-radius: 19px; + border-top-left-radius: 15px; + padding-top: 1; + padding-bottom: 0; + margin-top: 0; + margin-bottom: 0; + /* border-radius: 12px !important; */ + background: #BE332F; + border-bottom: 1px solid #a7a4a4; + border-top: 1px solid #cac8c8; + margin-left: -13px; + margin-right: -13px; +} +.header-div { + background-color: #BE332F; + text-transform: capitalize; + height: 100px; +} +.header-toolbar-new { + --background: #BE332F; +} - .Title{ - text-align: center; - color: white; - margin-top: -33px; - font-size: 17px; - } - .result-graph{ - font-size: 14px; - margin-left: -48px; - margin-right: 3px; - margin-bottom: -30px; - } +.hrClass { + border-width: 0; + box-sizing: content-box; + border-bottom: 1px solid #e6e6e6; + background: #fff !important; + height: 1px; +} - .datetime{ - text-align: center; - font-family: WorkSans-Bold; - margin-left: -120px; - margin-top: -19px; +//////////////////////////////////////////////down + +.colorBG { + --background: #f0efef; +} + + + + +.Title { + text-align: center; + color: white; + margin-top: -33px; + font-size: 17px; +} + +.result-graph { + font-size: 14px; + margin-left: -48px; + margin-right: 3px; + margin-bottom: -30px; +} + +.datetime { + text-align: center; + font-family: WorkSans-Bold; + margin-left: -120px; + margin-top: -19px; + +} + +.datelabel { + margin-left: 150px; + color: black !important; + font-family: WorkSans-Bold; +} + +.iconCalendar { + // margin-left: -241px; + // margin-top: 5px; + margin-left: -12px !important; + width: 22% !important; + height: 26px !important; + margin-top: -50px !important; + margin-bottom: 23px !important; +} - } - .datelabel{ - margin-left: 150px; - color: black !important; - font-family: WorkSans-Bold; - } - .iconCalendar{ - // margin-left: -241px; - // margin-top: 5px; - margin-left: -12px !important; - width: 22% !important; - height: 26px !important; - margin-top: -50px !important; - margin-bottom: 23px !important; - } // .today-graph{ - + // display: block !important; // height: 196px; // width: 385px; @@ -137,100 +140,104 @@ // margin-bottom: -30px; // } - .headerGrid{ - background-color: white !important; - border: 1px solid #cac8c8 !important; - border-radius: 20px !important; - padding-top: 28px; - padding-bottom: 26px; - margin-left: 13px; - margin-right: 13px; - margin-top: -93px; - margin-bottom: 10px; - - } - .header{ - - margin-top: -126px; - } - .result-text-container { - padding: 0; - margin: 0; - position: absolute; - left: 31%; - top: 23%; - display: block; - text-align: center; - transform: translate(-50%, -50%); +.headerGrid { + background-color: white !important; + border: 1px solid #cac8c8 !important; + border-radius: 20px !important; + padding-top: 28px; + padding-bottom: 26px; + margin-left: 13px; + margin-right: 13px; + margin-top: -93px; + margin-bottom: 10px; + +} + +.header { + + margin-top: -126px; +} + +.result-text-container { + padding: 0; + margin: 0; + position: absolute; + left: 31%; + top: 23%; + display: block; + text-align: center; + transform: translate(-50%, -50%); - h2 { + h2 { - font-size: 25px; - font-family: WorkSans-Bold; - margin: 0 auto; - // margin-top: 289px; - line-height: 36px; + font-size: 25px; + font-family: WorkSans-Bold; + margin: 0 auto; + // margin-top: 289px; + line-height: 36px; - } + } - span { + span { - width: 125px; - display: block; - margin: 0 auto; - font-size: 12px; - // margin-top: 289px; - font-family: workSans-Regular; - } + width: 125px; + display: block; + margin: 0 auto; + font-size: 12px; + // margin-top: 289px; + font-family: workSans-Regular; } -.green-label{ -font-size: 12px; -margin-top: -13px; } -.green-amount{ +.green-label { + font-size: 12px; + margin-top: -13px; +} + +.green-amount { font-size: 15px; font-family: WorkSans-Bold; margin-top: 0px; } -.red-label{ +.red-label { font-size: 12px; margin-top: -13px; - } - - .red-amount{ - font-size: 15px; - font-family: WorkSans-Bold; - margin-top: 0px; - } +} + +.red-amount { + font-size: 15px; + font-family: WorkSans-Bold; + margin-top: 0px; +} - - .orng-label{ - font-size: 12px; - margin-top: -13px; - } - - - .orng-amount{ - font-size: 15px; - font-family: WorkSans-Bold; - margin-top: 0px; - } - - .contentEit:before { - position: absolute; + +.orng-label { + font-size: 12px; + margin-top: -13px; +} + + +.orng-amount { + font-size: 15px; + font-family: WorkSans-Bold; + margin-top: 0px; +} + +.contentEit:before { + position: absolute; content: ""; - // background: #269DB8; + // background: #BE332F; height: 140px; width: 100%; left: 0; top: 0px; z-index: 1; - } - .div-green{ +} + +.div-green { position: relative; left: 82%; bottom: 141px; @@ -238,9 +245,9 @@ margin-top: -13px; background-color: #1FA269; width: 11%; height: 6px; - } +} - .div-red-ar{ +.div-red-ar { position: relative; bottom: 59px; color: black; @@ -250,7 +257,8 @@ margin-top: -13px; height: 6px; right: 16px; - } +} + // .div-red-ar{ // position: relative; // bottom: 131px; @@ -266,12 +274,12 @@ margin-top: -13px; // bottom: 146px; // color: black; // background-color: #CB3232; -// // background-color: #269DB8; +// // background-color: #BE332F; // width: 11%; // height: 6px; // } - - .div-red{ + +.div-red { position: relative; left: 82%; bottom: 80px; @@ -280,8 +288,9 @@ margin-top: -13px; // background-color: #DDB017; width: 11%; height: 6px; - } - .div-green-ar{ +} + +.div-green-ar { position: relative; bottom: 124px; color: black; @@ -290,15 +299,16 @@ margin-top: -13px; width: 11%; height: 6px; right: 16px; - } -.subTitle{ +} + +.subTitle { margin-top: -10px; margin-left: 10px; font-family: WorkSans-Bold; font-size: 16px; } -.subTitle-ar{ +.subTitle-ar { margin-top: -10px; margin-right: 10px; font-family: WorkSans-Bold; @@ -311,8 +321,8 @@ margin-top: -13px; height: 102px; width: 211px; margin-top: 20px; -margin-left: -39px; -max-height: 4cm; + margin-left: -39px; + max-height: 4cm; } .today-graph-ar { @@ -325,11 +335,12 @@ max-height: 4cm; margin-right: 105px; } -.graph-container{ +.graph-container { margin-left: 160px; position: relative; margin-top: -98px; } + // .label-container{ // position: absolute; // // width: 20%; @@ -337,26 +348,31 @@ max-height: 4cm; // top: 50%; // margin-top: -27px; // left: 20px; - + // } -.green-label-container{ - margin-top: 20px; margin-left: 12px; - +.green-label-container { + margin-top: 20px; + margin-left: 12px; + } -.green-label-container-ar{ - margin-top: 20px; margin-right: 12px; - + +.green-label-container-ar { + margin-top: 20px; + margin-right: 12px; + } -.black-label-container{ +.black-label-container { margin-left: 12px; } -.black-label-container-ar{ + +.black-label-container-ar { margin-right: 12px; } -.used-label-container{ + +.used-label-container { // border-top: 5px solid #292F42; // padding: 1px 0px; // margin: 15px 0px @@ -367,7 +383,8 @@ max-height: 4cm; background-color: #b60c0c; margin-top: 30px; } -.current-label-container{ + +.current-label-container { width: 12px; height: 12px; padding-right: -10px; @@ -375,51 +392,53 @@ max-height: 4cm; background-color: black; margin-top: 21px; } -.current-label{ + +.current-label { width: 12px; height: 12px; padding-right: -10px; border-radius: 100%; - background-color: #269DB8; + background-color: #BE332F; // margin-top: 30px; } -.span-one{ + +.span-one { // display: block; // font-size: 12px; // color: black; display: block; font-size: 12px; - color: #269DB8; + color: #BE332F; margin-left: 6px; margin-top: -2px; font-weight: bold; - + } -.span-one-ar{ +.span-one-ar { display: block; font-size: 12px; - color: #269DB8; + color: #BE332F; margin-right: 6px; margin-top: -2px; font-weight: bold; - + } -.span-two{ +.span-two { // display: block; // font-size: 22px; display: block; font-size: 12px; - color: #269DB8; + color: #BE332F; margin-left: 6px; margin-top: -2px; font-weight: bold; font-family: WorkSans-Bold; - + } -.black-span1{ +.black-span1 { // display: block; // font-size: 12px; // color: black; @@ -429,9 +448,10 @@ max-height: 4cm; margin-left: 6px; margin-top: 20px; font-weight: bold; - + } -.black-span1-ar{ + +.black-span1-ar { // display: block; // font-size: 12px; // color: black; @@ -441,9 +461,10 @@ max-height: 4cm; margin-right: 6px; margin-top: 20px; font-weight: bold; - + } -.black-span2{ + +.black-span2 { // display: block; // font-size: 22px; display: block; @@ -453,9 +474,10 @@ max-height: 4cm; margin-top: 20px; font-weight: bold; font-family: WorkSans-Bold; - + } -.red-span1{ + +.red-span1 { // display: block; // font-size: 12px; // color: black; @@ -465,9 +487,10 @@ max-height: 4cm; margin-left: 6px; margin-top: 28px; font-weight: bold; - + } -.red-span1-ar{ + +.red-span1-ar { // display: block; // font-size: 12px; // color: black; @@ -477,9 +500,10 @@ max-height: 4cm; margin-right: 6px; margin-top: 28px; font-weight: bold; - + } -.red-span2{ + +.red-span2 { // display: block; // font-size: 22px; display: block; @@ -489,16 +513,18 @@ max-height: 4cm; margin-top: 28px; font-weight: bold; font-family: WorkSans-Bold; - + } -.yearLabel{ + +.yearLabel { font-size: 13px; color: gray; font-family: WorkSans-Bold; margin-left: 29px; margin-top: 5px; } -.yearLabel-ar{ + +.yearLabel-ar { font-size: 13px; color: gray; font-family: WorkSans-Bold; diff --git a/Mohem/src/app/absence/home/home.component.ts b/Mohem/src/app/absence/home/home.component.ts index f76a31bf..3f221aaa 100644 --- a/Mohem/src/app/absence/home/home.component.ts +++ b/Mohem/src/app/absence/home/home.component.ts @@ -118,7 +118,7 @@ export class HomeComponent implements OnInit { backgroundColor: [ // '#1FA269', // '#CB3232',], - '#269DB8', + '#BE332F', '#b60c0c',], borderWidth: 1 } @@ -276,7 +276,7 @@ export class HomeComponent implements OnInit { { data: [this.accrualNet, this.accrualUsed], backgroundColor: [ - '#269DB8', + '#BE332F', '#b60c0c',], borderWidth: 1 } diff --git a/Mohem/src/app/absence/submit-absence-modal/submit-absence-modal.component.scss b/Mohem/src/app/absence/submit-absence-modal/submit-absence-modal.component.scss index 5a81509a..93545e99 100644 --- a/Mohem/src/app/absence/submit-absence-modal/submit-absence-modal.component.scss +++ b/Mohem/src/app/absence/submit-absence-modal/submit-absence-modal.component.scss @@ -1,53 +1,52 @@ -.rowBtn{ +.rowBtn { display: flex; flex-direction: row; justify-content: center; align-items: center; } -.Header{ +.Header { color: black !important; font-size: 25px !important; - font-weight: bold !important;; + font-weight: bold !important; + ; margin: 0; text-align: center; margin-bottom: 20px; } -.labelRadio{ +.labelRadio { color: black !important; font-weight: bold !important; padding-bottom: 20px; } -.labelcheck{ +.labelcheck { color: red !important; font-weight: bold !important; margin-bottom: 10px; } -.submitOkButton{ +.submitOkButton { white-space: normal !important; text-transform: capitalize !important; min-height: 45px !important; min-width: 5px !important; margin: 8px !important; - --background:: #269DB8; + --background: #BE332F; width: 100% !important; - color: white!important; + color: white !important; border-radius: 16px !important; } -.submitCancelButton{ + +.submitCancelButton { white-space: normal !important; text-transform: capitalize !important; min-height: 45px !important; min-width: 5px !important; margin: 8px !important; - --background:: #269DB8; + --background: #BE332F; width: 100% !important; - color: white!important; + color: white !important; border-radius: 16px !important; -} - - - +} \ No newline at end of file diff --git a/Mohem/src/app/absence/submit-absence/submit-absence.component.scss b/Mohem/src/app/absence/submit-absence/submit-absence.component.scss index 94ac7f71..476d98d7 100644 --- a/Mohem/src/app/absence/submit-absence/submit-absence.component.scss +++ b/Mohem/src/app/absence/submit-absence/submit-absence.component.scss @@ -1,114 +1,114 @@ -.search-button{ - background: transparent; - font-size: 25px; - color: #7F8C8D; +.search-button { + background: transparent; + font-size: 25px; + color: #7F8C8D; } -.header-toolbar-new{ - --background: #269DB8; - } - - .confirmEitOkButton{ - white-space: normal !important; - text-transform: capitalize !important; - min-height: 45px !important; - min-width: 5px !important; - margin: 8px !important; - --background: #269DB8; - width: 80% !important; - color: white!important; - border-radius: 16px !important; - } +.header-toolbar-new { + --background: #BE332F; +} + +.confirmEitOkButton { + white-space: normal !important; + text-transform: capitalize !important; + min-height: 45px !important; + min-width: 5px !important; + margin: 8px !important; + --background: #BE332F; + width: 80% !important; + color: white !important; + border-radius: 16px !important; +} - .label-Select{ - color: var(--dark); - font-size: 15px; - border: none; - font-weight: 400; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - width: 80%; - padding: 1px 0px; - background-color: var(--light); - border-bottom: var(--cusgray) solid 1px; - border-radius: 0px; - // margin-left: 20px; - margin-left: 30px; - // margin-top: -10px; - // -webkit-appearance: none; - // -moz-appearance: none; - text-indent: 1px; - // text-overflow: ''; - box-shadow: none; - -webkit-box-shadow:none; - -moz-box-shadow: none; - text-overflow: ellipsis; - white-space: nowrap; - overflow: hidden; +.label-Select { + color: var(--dark); + font-size: 15px; + border: none; + font-weight: 400; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + width: 80%; + padding: 1px 0px; + background-color: var(--light); + border-bottom: var(--cusgray) solid 1px; + border-radius: 0px; + // margin-left: 20px; + margin-left: 30px; + // margin-top: -10px; + // -webkit-appearance: none; + // -moz-appearance: none; + text-indent: 1px; + // text-overflow: ''; + box-shadow: none; + -webkit-box-shadow: none; + -moz-box-shadow: none; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; - :root[dir="ltr"]{ + :root[dir="ltr"] { background-image: linear-gradient(45deg, transparent 50%, #999 50%), linear-gradient(135deg, #999 50%, transparent 50%), linear-gradient(to right, #ffffff, #ffffff); background-position: calc(100% - 14px) calc(1em + 2px), calc(100% - 8px) calc(1em + 2px), 100% 0; background-size: 6px 6px, 6px 6px, 2.9em 2.9em; background-repeat: no-repeat; padding-right: 20px; - } - :root[dir="rtl"]{ - background-image: linear-gradient(-135deg, #999 50%, transparent 50%),linear-gradient(-45deg, transparent 50%, #999 50%), linear-gradient(to right, #ffffff, #ffffff); - background-position: calc(1em - 10px) calc(100% - 8px), calc(1em - 4px) calc(100% - 8px), 0 100%; - background-size: 6px 6px, 6px 6px, 2.9em 2.9em; - background-repeat: no-repeat; - padding-left: 20px; - } + } + + :root[dir="rtl"] { + background-image: linear-gradient(-135deg, #999 50%, transparent 50%), linear-gradient(-45deg, transparent 50%, #999 50%), linear-gradient(to right, #ffffff, #ffffff); + background-position: calc(1em - 10px) calc(100% - 8px), calc(1em - 4px) calc(100% - 8px), 0 100%; + background-size: 6px 6px, 6px 6px, 2.9em 2.9em; + background-repeat: no-repeat; + padding-left: 20px; + } } -.label{ - font-size: 16px; - // margin-left: 15px; - color: #a2a5a6 !important; - display: block; - overflow: hidden; - -webkit-box-flex: 1; - -webkit-flex: 1; - -ms-flex: 1; - flex: 1; - /* font-size: inherit; */ - // text-overflow: ellipsis; - // white-space: nowrap; - white-space: normal; - // padding-top: 10px; - padding: 5px 0px; - padding-left: 10px !important; - margin: 10px auto; - :root[dir="ltr"]{ - font-family: var(--fontFamilySemiBoldEN) !important; - } - :root[dir="rtl"]{ - font-family: var(--fontFamilyIOSAR) !important; - font-weight: bold; - } +.label { + font-size: 16px; + // margin-left: 15px; + color: #a2a5a6 !important; + display: block; + overflow: hidden; + -webkit-box-flex: 1; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + /* font-size: inherit; */ + // text-overflow: ellipsis; + // white-space: nowrap; + white-space: normal; + // padding-top: 10px; + padding: 5px 0px; + padding-left: 10px !important; + margin: 10px auto; + + :root[dir="ltr"] { + font-family: var(--fontFamilySemiBoldEN) !important; + } + + :root[dir="rtl"] { + font-family: var(--fontFamilyIOSAR) !important; + font-weight: bold; + } } -.Field-en{ +.Field-en { border-radius: 30px; - border: 1px solid #a2a5a6!important; + border: 1px solid #a2a5a6 !important; margin-bottom: 20px; - padding-left: 20px !important; + padding-left: 20px !important; padding-top: 6px !important; color: #999999 !important; } -.Field-ar{ +.Field-ar { border-radius: 30px; - border: 1px solid #a2a5a6!important; + border: 1px solid #a2a5a6 !important; margin-bottom: 20px; - padding-right: 20px !important; + padding-right: 20px !important; padding-top: 6px !important; color: #999999 !important; -} - - - +} \ No newline at end of file diff --git a/Mohem/src/app/absence/view-attachments/view-attachments.component.scss b/Mohem/src/app/absence/view-attachments/view-attachments.component.scss index 1e941e1b..4560ae98 100644 --- a/Mohem/src/app/absence/view-attachments/view-attachments.component.scss +++ b/Mohem/src/app/absence/view-attachments/view-attachments.component.scss @@ -1,3 +1,3 @@ -.header-toolbar-new{ - --background: #269DB8; - } \ No newline at end of file +.header-toolbar-new { + --background: #BE332F; +} \ No newline at end of file diff --git a/Mohem/src/app/app.component.scss b/Mohem/src/app/app.component.scss index ddfc7489..008a0132 100644 --- a/Mohem/src/app/app.component.scss +++ b/Mohem/src/app/app.component.scss @@ -77,7 +77,7 @@ header .logout { - background-color: #269DB8; + background-color: #BE332F; border: none; color: white; // padding: 20px; @@ -96,7 +96,7 @@ header } .logout-ar { - background-color: #269DB8; + background-color: #BE332F; border: none; color: white; text-align: center; diff --git a/Mohem/src/app/attendance/monthly-attendance/monthly-attendance.component.html b/Mohem/src/app/attendance/monthly-attendance/monthly-attendance.component.html index ae5467ea..c738cbf2 100644 --- a/Mohem/src/app/attendance/monthly-attendance/monthly-attendance.component.html +++ b/Mohem/src/app/attendance/monthly-attendance/monthly-attendance.component.html @@ -44,14 +44,14 @@ left: 79%; bottom: 35px; color: black; - background-color: #269DB8; + background-color: #BE332F; width: 20%; height: 6px;">
diff --git a/Mohem/src/app/attendance/monthly-attendance/monthly-attendance.component.scss b/Mohem/src/app/attendance/monthly-attendance/monthly-attendance.component.scss index dccd6552..7a723022 100644 --- a/Mohem/src/app/attendance/monthly-attendance/monthly-attendance.component.scss +++ b/Mohem/src/app/attendance/monthly-attendance/monthly-attendance.component.scss @@ -1,14 +1,15 @@ .colorBG { - --background: #f0efef; + --background: #f0efef; } + .header-div { - background: #269DB8; - color: var(--light); - text-transform: capitalize; - display: block; - position: relative; - height: 210px; - margin-bottom: 60px; + background: #BE332F; + color: var(--light); + text-transform: capitalize; + display: block; + position: relative; + height: 210px; + margin-bottom: 60px; } @@ -16,227 +17,230 @@ .chart-modal .modal-Wrapper { --background: rgb(116, 108, 108) !important; - --border-color:white!important ; - width: 85%!important ; - height: 40px !important ; - - } + --border-color: white !important; + width: 85% !important; + height: 40px !important; - .navbar{ - font-size: 10px !important; - --background: #269DB8 !important; - color: aliceblue !important; -// margin-top: 10px !important; +} - } +.navbar { + font-size: 10px !important; + --background: #BE332F !important; + color: aliceblue !important; + // margin-top: 10px !important; - .menu{ - // margin-left:330px !important; - margin-top: 0px !important; - font-size: 35px !important; - background: #269DB8; - color: aliceblue; - margin-left: 0px !important; +} - } +.menu { + // margin-left:330px !important; + margin-top: 0px !important; + font-size: 35px !important; + background: #BE332F; + color: aliceblue; + margin-left: 0px !important; - .person{ - - margin-left:100px !important; - margin-top: 0px !important; - font-size: 23px !important; - background: #269DB8 !important; - color: aliceblue !important; - - } +} - .grid{ -margin-bottom: 550px !important; -margin-top: 20px !important; -margin-left: 15px !important; -margin-right: 15px !important; -background-color:white !important; -border-radius: 20px !important; -height: 250px !important; - } +.person { - .headerGrid{ - margin-bottom: 550px !important; -margin-top: 80px !important; -margin-left: 15px !important; -margin-right: 15px !important; -background-color:white !important; -border-radius: 20px !important; -height: 250px !important; - } + margin-left: 100px !important; + margin-top: 0px !important; + font-size: 23px !important; + background: #BE332F !important; + color: aliceblue !important; - .bodyGrid{ - margin-bottom: 550px !important; - margin-top: 20px !important; - margin-left: 15px !important; - margin-right: 15px !important; - background-color:white !important; - border-radius: 20px !important; - height: 270px !important; - } - .labelGrid{ - margin-top: -30px !important; - background-color:white !important; - border-radius: 20px !important; - height: 100px !important; - } +} -.ionSliders{ - margin: 0px !important; - padding: 0px !important; +.grid { + margin-bottom: 550px !important; + margin-top: 20px !important; + margin-left: 15px !important; + margin-right: 15px !important; + background-color: white !important; + border-radius: 20px !important; + height: 250px !important; +} +.headerGrid { + margin-bottom: 550px !important; + margin-top: 80px !important; + margin-left: 15px !important; + margin-right: 15px !important; + background-color: white !important; + border-radius: 20px !important; + height: 250px !important; } +.bodyGrid { + margin-bottom: 550px !important; + margin-top: 20px !important; + margin-left: 15px !important; + margin-right: 15px !important; + background-color: white !important; + border-radius: 20px !important; + height: 270px !important; +} - .ionSlide{ - margin-top: 5px !important; - margin-left: 190px !important; - color: black !important; +.labelGrid { + margin-top: -30px !important; + background-color: white !important; + border-radius: 20px !important; + height: 100px !important; +} - } - .dateLable{ +.ionSliders { + margin: 0px !important; + padding: 0px !important; + +} + + +.ionSlide { + margin-top: 5px !important; + margin-left: 190px !important; + color: black !important; + +} + +.dateLable { + + margin-left: 90px !important; + color: black !important; + font-size: small !important; + margin-top: 15px !important; +} - margin-left: 90px !important; - color: black !important; - font-size: small !important; - margin-top: 15px !important; - } // h1{ // font-size: 15px !important; // text-align: center !important; // } -.arrowDropright{ - margin-left:100px !important; - font-size: 20px !important; - color: rgb(168, 165, 165) !important; - margin-top: 15px !important; +.arrowDropright { + margin-left: 100px !important; + font-size: 20px !important; + color: rgb(168, 165, 165) !important; + margin-top: 15px !important; } -.arrowDropleft{ - font-size: 20px !important; + +.arrowDropleft { + font-size: 20px !important; margin-left: 10px !important; margin-top: 15px !important; color: rgb(116, 108, 108) !important; } - .ionLable{ - font-size: 10px !important; - } +.ionLable { + font-size: 10px !important; +} - .number{ +.number { - font-size: 18px !important; - font-weight: bolder !important; - color: black !important; - } + font-size: 18px !important; + font-weight: bolder !important; + color: black !important; +} + +.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: #BE332F; + // 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; +} + +.request-heading { + + span { + + text-align: center; - .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: #269DB8; - // 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; - } - - .request-heading { - - span { - - text-align: center; - - display: block; - - padding-top: 8px; - - font-family: workSans-Regular; - - } - + + padding-top: 8px; + + font-family: workSans-Regular; + + } + +} + + + +.result-graph { + + position: relative; + + background: white; + + margin-right: 20px; + + margin-left: 20px; + + margin-top: 20px; + + padding-bottom: 20px; + + border-radius: 20px; + +} + + + + + + + + + + +.result-text-container { + + padding: 0; + + margin: 0; + + position: absolute; + + left: 50%; + + top: 50%; + + display: block; + + text-align: center; + + transform: translate(-50%, -50%); + + h2 { + + font-size: 38px; + + font-family: WorkSans-Bold; + + margin: 0 auto; + + line-height: 36px; + } - - - - .result-graph { - - position: relative; - - background: white; - - margin-right: 20px; - - margin-left: 20px; - - margin-top: 20px; - - padding-bottom: 20px; - - border-radius: 20px; - - } - - - - - - - - - - - .result-text-container { - - padding: 0; - - margin: 0; - - position: absolute; - - left: 50%; - - top: 50%; - + + span { + + width: 125px; + display: block; - - text-align: center; - - transform: translate(-50%, -50%); - - h2 { - - font-size: 38px; - - font-family: WorkSans-Bold; - - margin: 0 auto; - - line-height: 36px; - - } - - span { - - width: 125px; - - display: block; - - margin: 0 auto; - - font-size: 12px; - - font-family: workSans-Regular; - } + + margin: 0 auto; + + font-size: 12px; + + font-family: workSans-Regular; } - \ No newline at end of file +} \ No newline at end of file diff --git a/Mohem/src/app/attendance/monthly-attendance/monthly-attendance.component.ts b/Mohem/src/app/attendance/monthly-attendance/monthly-attendance.component.ts index 044998c5..41de9f66 100644 --- a/Mohem/src/app/attendance/monthly-attendance/monthly-attendance.component.ts +++ b/Mohem/src/app/attendance/monthly-attendance/monthly-attendance.component.ts @@ -40,7 +40,7 @@ export class MonthlyAttendanceComponent implements OnInit { -public data = { + public data = { datasets: [ @@ -50,9 +50,9 @@ public data = { backgroundColor: [ - '#269DB8', + '#BE332F', - '#269DB8', + '#BE332F', ], borderWidth: 2 @@ -65,12 +65,12 @@ public data = { ionViewWillEnter() { this.currentMonth = this.sharedData.getSharedData("currentMonth"); console.log(this.currentMonth); - let day = this.currentMonth.split(" "); - this.todayMonth =day[0]; + let day = this.currentMonth.split(" "); + this.todayMonth = day[0]; this.todayYear = day[1]; this.todayYear = parseInt(this.todayYear); - console.log("MONTH: " +this.todayMonth); - console.log("YEAR: " +this.todayYear); + console.log("MONTH: " + this.todayMonth); + console.log("YEAR: " + this.todayYear); this.getSubordinatesAttStatus() } @@ -92,7 +92,7 @@ public data = { } - x(){ + x() { console.log("ENAD CHANge") } diff --git a/Mohem/src/app/authentication/check-user/check-user.component.scss b/Mohem/src/app/authentication/check-user/check-user.component.scss index 0628ac93..0677089d 100644 --- a/Mohem/src/app/authentication/check-user/check-user.component.scss +++ b/Mohem/src/app/authentication/check-user/check-user.component.scss @@ -1,8 +1,8 @@ -.header-toolbar{ - --background: linear-gradient(45deg, #3ac1f1 0%, #19a163 36%, #19a163 59%, #1a586d 100%); +.header-toolbar { + --background: linear-gradient(45deg, #3ac1f1 0%, #19a163 36%, #19a163 59%, #c6903e 100%); } -.btnBack{ +.btnBack { background: transparent; } @@ -11,21 +11,22 @@ .login-input { border: none; } -.item-input{ + +.item-input { --min-height: 1.0cm !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; - margin-bottom :12px; - margin-left: 12px; - margin-right: 12px; + border-radius: 33px; + --border: solid #9999992b !important; + border: solid #9999992b !important; + margin-bottom: 12px; + margin-left: 12px; + margin-right: 12px; } -.button-login{ +.button-login { --background: var(--newgreen) !important; background: var(--newgreen) !important; @@ -38,4 +39,5 @@ --min-height: 1.6cm !important; width: 315px; } + /////////////////////////////////////////// \ No newline at end of file diff --git a/Mohem/src/app/authentication/login/login.component.scss b/Mohem/src/app/authentication/login/login.component.scss index 5b7fc282..32b3208a 100644 --- a/Mohem/src/app/authentication/login/login.component.scss +++ b/Mohem/src/app/authentication/login/login.component.scss @@ -182,7 +182,7 @@ img.centerDiv { .middle-circle { position: relative; - background: #1a586d !important; + background: #c6903e !important; border-radius: 50%; height: 160px; width: 170px; diff --git a/Mohem/src/app/authentication/sms-page/sms-page.page.scss b/Mohem/src/app/authentication/sms-page/sms-page.page.scss index 86b95644..d50b0f62 100644 --- a/Mohem/src/app/authentication/sms-page/sms-page.page.scss +++ b/Mohem/src/app/authentication/sms-page/sms-page.page.scss @@ -1,5 +1,5 @@ .header-toolbar { - --background: linear-gradient(45deg, #3ac1f1 0%, #19a163 36%, #19a163 59%, #1a586d 100%); + --background: linear-gradient(45deg, #3ac1f1 0%, #19a163 36%, #19a163 59%, #c6903e 100%); } .btnBack { diff --git a/Mohem/src/app/eit/add-attach/add-attach.component.scss b/Mohem/src/app/eit/add-attach/add-attach.component.scss index e6ced223..c6395a3c 100644 --- a/Mohem/src/app/eit/add-attach/add-attach.component.scss +++ b/Mohem/src/app/eit/add-attach/add-attach.component.scss @@ -13,7 +13,8 @@ width: 22px; height: 22px; } + .Header { font-weight: bold; - color: #1a586d; -} + color: #c6903e; +} \ No newline at end of file diff --git a/Mohem/src/app/eit/add-cei/add-cei.component.scss b/Mohem/src/app/eit/add-cei/add-cei.component.scss index a6dbf815..47ce98e0 100644 --- a/Mohem/src/app/eit/add-cei/add-cei.component.scss +++ b/Mohem/src/app/eit/add-cei/add-cei.component.scss @@ -1,45 +1,46 @@ .footer-button { - border-radius: 2px; - padding: 0 1.1em; - min-height: 45px; - min-width: 200px; - } - - ion-label { - color: var(--customnavy) !important; - } - - .daynamicForm-Label { - font-size: 16px; - color: #a2a5a6 !important; - display: block; - overflow: hidden; - -webkit-flex: 1; - flex: 1; - font-size: inherit; - white-space: normal; - padding: 5px 0px; - margin: 10px auto; - padding-left: 10px; - } - - - .header-toolbar-new{ - --background: #269DB8; - } - .addEitOkButton{ - white-space: normal !important; - text-transform: capitalize !important; - min-height: 45px !important; - min-width: 5px !important; - margin: 8px !important; - background-color: #269DB8; - width: 80% !important; - color: white!important; - border-radius: 16px !important; - } + border-radius: 2px; + padding: 0 1.1em; + min-height: 45px; + min-width: 200px; +} - .country{ - margin-top: 10px; - padding: 10px; - } \ No newline at end of file +ion-label { + color: var(--customnavy) !important; +} + +.daynamicForm-Label { + font-size: 16px; + color: #a2a5a6 !important; + display: block; + overflow: hidden; + -webkit-flex: 1; + flex: 1; + font-size: inherit; + white-space: normal; + padding: 5px 0px; + margin: 10px auto; + padding-left: 10px; +} + + +.header-toolbar-new { + --background: #BE332F; +} + +.addEitOkButton { + white-space: normal !important; + text-transform: capitalize !important; + min-height: 45px !important; + min-width: 5px !important; + margin: 8px !important; + background-color: #BE332F; + width: 80% !important; + color: white !important; + border-radius: 16px !important; +} + +.country { + margin-top: 10px; + padding: 10px; +} \ No newline at end of file diff --git a/Mohem/src/app/eit/add-eit/add-eit.component.scss b/Mohem/src/app/eit/add-eit/add-eit.component.scss index 00701426..0e9562d9 100644 --- a/Mohem/src/app/eit/add-eit/add-eit.component.scss +++ b/Mohem/src/app/eit/add-eit/add-eit.component.scss @@ -24,17 +24,18 @@ ion-label { } -.header-toolbar-new{ - --background: #269DB8; +.header-toolbar-new { + --background: #BE332F; } -.addEitOkButton{ + +.addEitOkButton { white-space: normal !important; text-transform: capitalize !important; min-height: 45px !important; min-width: 5px !important; margin: 8px !important; - background-color: #269DB8; + background-color: #BE332F; width: 80% !important; - color: white!important; + color: white !important; border-radius: 16px !important; } \ No newline at end of file diff --git a/Mohem/src/app/eit/cei-homepage/cei-homepage.component.html b/Mohem/src/app/eit/cei-homepage/cei-homepage.component.html index 55aeadb4..82a13612 100644 --- a/Mohem/src/app/eit/cei-homepage/cei-homepage.component.html +++ b/Mohem/src/app/eit/cei-homepage/cei-homepage.component.html @@ -63,7 +63,7 @@ \ No newline at end of file diff --git a/Mohem/src/app/eit/cei-list/cei-list.component.html b/Mohem/src/app/eit/cei-list/cei-list.component.html index 31f62243..c3deb1d4 100644 --- a/Mohem/src/app/eit/cei-list/cei-list.component.html +++ b/Mohem/src/app/eit/cei-list/cei-list.component.html @@ -22,7 +22,7 @@
- +

diff --git a/Mohem/src/app/eit/cei-list/cei-list.component.scss b/Mohem/src/app/eit/cei-list/cei-list.component.scss index 28b2905f..f18247e4 100644 --- a/Mohem/src/app/eit/cei-list/cei-list.component.scss +++ b/Mohem/src/app/eit/cei-list/cei-list.component.scss @@ -1,330 +1,348 @@ .footer-button { - border-radius: 2px; - padding: 0 1.1em; - min-height: 45px; - min-width: 200px; - } - - .datetime{ - text-align: center; - font-family: WorkSans-Bold; - margin-left: 47px; - margin-top: -19px; - - } - .iconCalendar{ - margin-left: 30px !important; - width: 22% !important; - height: 26px !important; - margin-top: -69px !important; - margin-bottom: 20px !important; - } - h4 { - font-size: 2.2rem; - text-align: center; - color: #000000; - } - .grids{ - border-radius: 20px !important; - background: white; - padding-left: 1px; - padding-right: 1px; - margin: 13px; - padding-top: 0px; - padding-bottom: 3px; - padding-left: 13px; - padding-right: 13px; - border: 1px solid #cac8c8; - } - - .bgcolor { - - color: white; - border-top-right-radius: 19px; - border-top-left-radius: 15px; - padding-top: 1; - padding-bottom: 0; - margin-top: 0; - margin-bottom: 0; - /* border-radius: 12px !important; */ - background: #269DB8; - border-bottom: 1px solid #a7a4a4; - border-top: 1px solid #cac8c8; - margin-left: -13px; - margin-right: -13px; - } - .colEit{ - border-right: 1px solid #cac8c8; - border-bottom-left-radius: -10px !important; - padding-top: 8px; - padding-bottom: 8px; - margin-left: 18px; - font-size: 12px !important; - } - - .header-div { - - background-color: #269DB8; - text-transform: capitalize; - height: 160px; - // position: relative; - display: block; - margin-bottom: -28px; - } - - .header-toolbar-new{ - --background: #269DB8; - } - - .addClass{ - background-color: #269DB8; - width: 80px; - height: 80px; - right: 8%; - position: fixed; - color: white; - bottom: 5%; - border-radius: 50%; - z-index: 999; - -webkit-box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59); - -moz-box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59); - box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59); - } - - .contentEit:before { - position: absolute; + border-radius: 2px; + padding: 0 1.1em; + min-height: 45px; + min-width: 200px; +} + +.datetime { + text-align: center; + font-family: WorkSans-Bold; + margin-left: 47px; + margin-top: -19px; + +} + +.iconCalendar { + margin-left: 30px !important; + width: 22% !important; + height: 26px !important; + margin-top: -69px !important; + margin-bottom: 20px !important; +} + +h4 { + font-size: 2.2rem; + text-align: center; + color: #000000; +} + +.grids { + border-radius: 20px !important; + background: white; + padding-left: 1px; + padding-right: 1px; + margin: 13px; + padding-top: 0px; + padding-bottom: 3px; + padding-left: 13px; + padding-right: 13px; + border: 1px solid #cac8c8; +} + +.bgcolor { + + color: white; + border-top-right-radius: 19px; + border-top-left-radius: 15px; + padding-top: 1; + padding-bottom: 0; + margin-top: 0; + margin-bottom: 0; + /* border-radius: 12px !important; */ + background: #BE332F; + border-bottom: 1px solid #a7a4a4; + border-top: 1px solid #cac8c8; + margin-left: -13px; + margin-right: -13px; +} + +.colEit { + border-right: 1px solid #cac8c8; + border-bottom-left-radius: -10px !important; + padding-top: 8px; + padding-bottom: 8px; + margin-left: 18px; + font-size: 12px !important; +} + +.header-div { + + background-color: #BE332F; + text-transform: capitalize; + height: 160px; + // position: relative; + display: block; + margin-bottom: -28px; +} + +.header-toolbar-new { + --background: #BE332F; +} + +.addClass { + background-color: #BE332F; + width: 80px; + height: 80px; + right: 8%; + position: fixed; + color: white; + bottom: 5%; + border-radius: 50%; + z-index: 999; + -webkit-box-shadow: 2px -1px 13px 0px rgba(0, 0, 0, 0.59); + -moz-box-shadow: 2px -1px 13px 0px rgba(0, 0, 0, 0.59); + box-shadow: 2px -1px 13px 0px rgba(0, 0, 0, 0.59); +} + +.contentEit:before { + position: absolute; content: ""; - // background: #269DB8; + // background: #BE332F; height: 140px; width: 100%; left: 0; top: 0px; z-index: 1; - } - - .hrClass{ - border-width: 0; - box-sizing: content-box; - border-bottom: 1px solid #e6e6e6; - background: #fff !important; - height: 1px; - } - - //////////////////////////////// - .content:before { - position: absolute; +} + +.hrClass { + border-width: 0; + box-sizing: content-box; + border-bottom: 1px solid #e6e6e6; + background: #fff !important; + height: 1px; +} + +//////////////////////////////// +.content:before { + position: absolute; content: ""; - background: #269DB8; + background: #BE332F; height: 140px; width: 100%; left: 0; top: 0px; z-index: 1; - } - - - .colorBG{ - --background: #f0efef; - } - - .Title{ - text-align: center; - color: white; - margin-top: -33px; - font-size: 17px; - } - .title{ - text-align: center; - color: black; - margin-top: 5px; - font-size: 17px; - } - .today-graph{ - display: block !important; - height: 196px; - width: 365px; - /* padding-left: 51px; */ - margin-left: 28px !important; - } - - .headerGrid{ - background-color: white !important; - border: 1px solid #cac8c8 !important; - padding-bottom: 53px; - padding-top: -30px; - margin-left: 13px; - margin-right: 13px; - margin-bottom: 10px; - position: relative; - z-index: 1; - border-radius: 20px; - margin-top: 17px; - } - .result-graph{ - font-size: 14px; - margin-left: -48px; - margin-right: 3px; - margin-bottom: -30px; - - - - } - - .green-label{ - font-size: 15px !important; - margin-left: 7px !important; - margin-right: 42px; - } - .green-label-ar{ - font-size: 15px !important; - margin-left: 7px !important; - margin-right: 15px; - } - .blue-label{ - font-size: 15px !important; - margin-left: 7px !important; - margin-right: 13px; - } - .light-label{ - font-size: 15px !important; - margin-left: 7px !important; - margin-right: -26px; - } - .light-label-ar{ - font-size: 15px !important; - margin-right: 7px !important; - margin-left: -26px; - } - - .light-dote{ - background-color: #3CB9D5; - width: 12px; - height: 12px; - border-radius: 50% !important; - display: inline-block; - } - .blue-dote{ - - background-color: #269DB8; - width: 12px; - height: 12px; - border-radius: 50% !important; - display: inline-block; - } - .green-dote{ - background-color: #1FA269; - width: 12px; - height: 12px; - border-radius: 50% !important; - display: inline-block; - margin-right: -1px; - } - .col{ - text-align: right; - } - - .gridService{ - - /* margin-top: 87px; */ - border-radius: 10px; - /* margin-bottom: -49px; */ - margin-left: 14px; - margin-right: 14px; - - } - .columns{ - margin: 3px; - margin-bottom: 13px; - background: white; - border-radius: 27px; - padding-left: 30px; - padding-right: 6px; - padding-top: 19px; - padding-bottom: 8px; - border: 1px solid #cac8c8 !important; - } - - - .service{ - font-size: 22px; - color: black; - letter-spacing: 1px; - font-weight: bold; - } - .services{ - - font-size: 12px; - color: black; - } - - .adult-dote{ - background-color: #3CB9D5; - width: 15px; - height: 15px; - border-radius: 50% !important; - display: inline-block; - margin-left: -17px; - margin-right: 5px; - } - - .adult-dote-ar{ - background-color: #3CB9D5; - width: 15px; - height: 15px; - border-radius: 50% !important; - display: inline-block; - margin-right: 0px; - margin-left: 5px; - } - .child-dote{ - - background-color: #269DB8; - width: 15px; - height: 15px; - border-radius: 50% !important; - display: inline-block; - margin-left: -17px; - margin-right: 5px; - } - .child-dote-ar{ - background-color: #269DB8; - width: 15px; - height: 15px; - border-radius: 50% !important; - display: inline-block; - margin-right: 1px; - margin-left: 5px; - } - .infants-dote{ - background-color: #1FA269; - width: 15px; - height: 15px; - border-radius: 50% !important; - display: inline-block; - margin-left: -17px; - margin-right: 5px; - // margin-bottom: 6px; - } - - .infants-dote-ar{ - background-color: #1FA269; - width: 15px; - height: 15px; - border-radius: 50% !important; - display: inline-block; - margin-right: 1px; - margin-left: 5px; - } - .addEitOkButton{ - white-space: normal !important; - text-transform: capitalize !important; - min-height: 45px !important; - min-width: 5px !important; - margin: 8px !important; - background-color: #269DB8; - width: 80% !important; - color: white!important; - border-radius: 16px !important; - } - - \ No newline at end of file +} + + +.colorBG { + --background: #f0efef; +} + +.Title { + text-align: center; + color: white; + margin-top: -33px; + font-size: 17px; +} + +.title { + text-align: center; + color: black; + margin-top: 5px; + font-size: 17px; +} + +.today-graph { + display: block !important; + height: 196px; + width: 365px; + /* padding-left: 51px; */ + margin-left: 28px !important; +} + +.headerGrid { + background-color: white !important; + border: 1px solid #cac8c8 !important; + padding-bottom: 53px; + padding-top: -30px; + margin-left: 13px; + margin-right: 13px; + margin-bottom: 10px; + position: relative; + z-index: 1; + border-radius: 20px; + margin-top: 17px; +} + +.result-graph { + font-size: 14px; + margin-left: -48px; + margin-right: 3px; + margin-bottom: -30px; + + + +} + +.green-label { + font-size: 15px !important; + margin-left: 7px !important; + margin-right: 42px; +} + +.green-label-ar { + font-size: 15px !important; + margin-left: 7px !important; + margin-right: 15px; +} + +.blue-label { + font-size: 15px !important; + margin-left: 7px !important; + margin-right: 13px; +} + +.light-label { + font-size: 15px !important; + margin-left: 7px !important; + margin-right: -26px; +} + +.light-label-ar { + font-size: 15px !important; + margin-right: 7px !important; + margin-left: -26px; +} + +.light-dote { + background-color: #3CB9D5; + width: 12px; + height: 12px; + border-radius: 50% !important; + display: inline-block; +} + +.blue-dote { + + background-color: #BE332F; + width: 12px; + height: 12px; + border-radius: 50% !important; + display: inline-block; +} + +.green-dote { + background-color: #1FA269; + width: 12px; + height: 12px; + border-radius: 50% !important; + display: inline-block; + margin-right: -1px; +} + +.col { + text-align: right; +} + +.gridService { + + /* margin-top: 87px; */ + border-radius: 10px; + /* margin-bottom: -49px; */ + margin-left: 14px; + margin-right: 14px; + +} + +.columns { + margin: 3px; + margin-bottom: 13px; + background: white; + border-radius: 27px; + padding-left: 30px; + padding-right: 6px; + padding-top: 19px; + padding-bottom: 8px; + border: 1px solid #cac8c8 !important; +} + + +.service { + font-size: 22px; + color: black; + letter-spacing: 1px; + font-weight: bold; +} + +.services { + + font-size: 12px; + color: black; +} + +.adult-dote { + background-color: #3CB9D5; + width: 15px; + height: 15px; + border-radius: 50% !important; + display: inline-block; + margin-left: -17px; + margin-right: 5px; +} + +.adult-dote-ar { + background-color: #3CB9D5; + width: 15px; + height: 15px; + border-radius: 50% !important; + display: inline-block; + margin-right: 0px; + margin-left: 5px; +} + +.child-dote { + + background-color: #BE332F; + width: 15px; + height: 15px; + border-radius: 50% !important; + display: inline-block; + margin-left: -17px; + margin-right: 5px; +} + +.child-dote-ar { + background-color: #BE332F; + width: 15px; + height: 15px; + border-radius: 50% !important; + display: inline-block; + margin-right: 1px; + margin-left: 5px; +} + +.infants-dote { + background-color: #1FA269; + width: 15px; + height: 15px; + border-radius: 50% !important; + display: inline-block; + margin-left: -17px; + margin-right: 5px; + // margin-bottom: 6px; +} + +.infants-dote-ar { + background-color: #1FA269; + width: 15px; + height: 15px; + border-radius: 50% !important; + display: inline-block; + margin-right: 1px; + margin-left: 5px; +} + +.addEitOkButton { + white-space: normal !important; + text-transform: capitalize !important; + min-height: 45px !important; + min-width: 5px !important; + margin: 8px !important; + background-color: #BE332F; + width: 80% !important; + color: white !important; + border-radius: 16px !important; +} \ No newline at end of file diff --git a/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.scss b/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.scss index 2ed98379..a53d7d25 100644 --- a/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.scss +++ b/Mohem/src/app/eit/confirm-add-cei/confirm-add-cei.component.scss @@ -1,263 +1,273 @@ .footer-button { - border-radius: 2px; - padding: 0 1.1em; - min-height: 45px; - min-width: 200px; - } - - .imgSize { - width: 22px; - height: 22px; - } - - .Header { - font-weight: bold; - color: #1a586d !important; - font-size: 10px; - } - - .tbData { - font-size: 10px; - } - - .btnBack { - background: transparent; - float: right; - } - - .attachmentDiv{ - background: #ffffff; - height: auto; - text-align: center; - padding-top: 1px; - margin: 10px; - border-radius: 15px; - border: 1px solid grey; - } - - .noDataDiv{ - background: #ffffff; - height: 11%; - text-align: center; - padding-top: 1px; - border-radius: 10px; - margin: 10px; - border-radius: 5px; - } - .submitNote{ - background: #ffffff; - height: 80px; - padding-top: 1px; - margin: 10px; - border-radius: 15px; - border: 1px solid grey; - } - - .approvalList{ - --background: #f0efef; - height: auto; - text-align: center; - padding-top: 1px; - border-radius: 10px; - margin: 10px; - border-radius: 5px; - } - - /************************New Design**********************************/ - .notification-list{ - background: none; - background: none; - border-radius: 32px; - ion-item{ - // margin-top: 5px; - // margin-bottom: 5px; - - background-color: transparent; - .item-date{ - width: 100%; - font-size: 16px; - font-weight: bold; - - text-align: start; - padding: 0; - margin: 0; - - position: absolute; - left: 0; - top: 12%; - } - ion-label , [item-end]{ - - white-space: normal; - font-size: 14px; - padding-top: 15%; - // :root[dir="ltr"]{ - // margin-left: 10px; - // } - // :root[dir="rtl"]{ - // margin-right: 10px; - // } - - } - + border-radius: 2px; + padding: 0 1.1em; + min-height: 45px; + min-width: 200px; +} + +.imgSize { + width: 22px; + height: 22px; +} + +.Header { + font-weight: bold; + color: #c6903e !important; + font-size: 10px; +} + +.tbData { + font-size: 10px; +} + +.btnBack { + background: transparent; + float: right; +} + +.attachmentDiv { + background: #ffffff; + height: auto; + text-align: center; + padding-top: 1px; + margin: 10px; + border-radius: 15px; + border: 1px solid grey; +} + +.noDataDiv { + background: #ffffff; + height: 11%; + text-align: center; + padding-top: 1px; + border-radius: 10px; + margin: 10px; + border-radius: 5px; +} + +.submitNote { + background: #ffffff; + height: 80px; + padding-top: 1px; + margin: 10px; + border-radius: 15px; + border: 1px solid grey; +} + +.approvalList { + --background: #f0efef; + height: auto; + text-align: center; + padding-top: 1px; + border-radius: 10px; + margin: 10px; + border-radius: 5px; +} + +/************************New Design**********************************/ +.notification-list { + background: none; + background: none; + border-radius: 32px; + + ion-item { + // margin-top: 5px; + // margin-bottom: 5px; + + background-color: transparent; + + .item-date { + width: 100%; + font-size: 16px; + font-weight: bold; + + text-align: start; + padding: 0; + margin: 0; + + position: absolute; + left: 0; + top: 12%; } + + ion-label, + [item-end] { + + white-space: normal; + font-size: 14px; + padding-top: 15%; + // :root[dir="ltr"]{ + // margin-left: 10px; + // } + // :root[dir="rtl"]{ + // margin-right: 10px; + // } + + } + } - - - - - - - .timeline { - position: relative; - margin: 15px 0 0 0; - // border-bottom: solid 1px var(--cusgray); - } - - .timeline:before { - - content: ''; - position: inherit !important; - top: 0; - bottom: 0; - width: 4px; - // background: #e4e4e4; - z-index: 1; - left: 35px; - /* margin-left: -10px; */ - /* z-index: 1; */ - } - - .timeline .timeline-thumb { - - border-radius: 500px; - width: 70px !important; - z-index: 2; - position: absolute; - left: 0px; - // :root[dir="ltr"]{ - // left: 37px; - // } - // :root[dir="rtl"]{ - // right: 37px; - // } - float: right; - top: 9px; - } - - .timeline .timeline-thumb.timeline-icon { - height: 70px; - // text-align: center; - // color: white; - // border: 5px solid #CBD0D3; - // transform: scale(0.2); - } - - - - .timeline .timeline-item { - width: 40px; - - } - - .timeline .timeline-stats { - position: relative; - font-size: 12px; - color: var(--darkgray); - - } - - .empImge{ - border-radius: 50%; - width:100%; - height: 100%; - border: #dedede solid 1px; - - } - .empImgeRep { - border-radius: 50% !important; - width: 80px; - height: 80px; - border: #dedede solid 1px; - } - - .line{ - padding-bottom:87px; - } - - .attachLable{ - position: absolute; - top: 0px; - z-index: 0; - background: #30b8c6; - color: #fff; - border-radius: 50%; - border: 0px; - width: 24px; - height: 24px; - text-align: center; - font-size: 5px; - } - - .removeLable{ - top: 0px; - z-index: 0; - background: #d8252d; - color: #fff; - border-radius: 50%; - border: 0px; - width: 20px; - height: 20px; - text-align: center; - font-size: 5px; - } - - .note-modal { - // width: 90%; - // height: 50%; - // top: 20%; - // left: 5%; - // right: 5%; - // bottom: 5%; - background: rgba(0, 0, 0, 0.5) !important; - padding: 30% 10% !important; - --height: 12cm !important; - // --width: 80% !important; - --border-radius:20px; - - } - .header-toolbar-new{ - --background: #269DB8; - } - .title{ - margin-top: -37px; - margin-left: 85px; - } - .title-ar{ - margin-top: -37px; - margin-right: 101px; - } - .confirmEitOkButton{ - white-space: normal !important; - text-transform: capitalize !important; - min-height: 45px !important; - min-width: 5px !important; - margin: 8px !important; - background-color: #269DB8; - width: 80% !important; - color: white!important; - border-radius: 16px !important; - } - - .approvalTitle-ar{ - font-weight: bold; - font-size: 16px; - text-align: right; - - } - .approvalTitle{ - font-weight: bold; - font-size: 16px; - text-align: left; - } - \ No newline at end of file +} + + + + + + +.timeline { + position: relative; + margin: 15px 0 0 0; + // border-bottom: solid 1px var(--cusgray); +} + +.timeline:before { + + content: ''; + position: inherit !important; + top: 0; + bottom: 0; + width: 4px; + // background: #e4e4e4; + z-index: 1; + left: 35px; + /* margin-left: -10px; */ + /* z-index: 1; */ +} + +.timeline .timeline-thumb { + + border-radius: 500px; + width: 70px !important; + z-index: 2; + position: absolute; + left: 0px; + // :root[dir="ltr"]{ + // left: 37px; + // } + // :root[dir="rtl"]{ + // right: 37px; + // } + float: right; + top: 9px; +} + +.timeline .timeline-thumb.timeline-icon { + height: 70px; + // text-align: center; + // color: white; + // border: 5px solid #CBD0D3; + // transform: scale(0.2); +} + + + +.timeline .timeline-item { + width: 40px; + +} + +.timeline .timeline-stats { + position: relative; + font-size: 12px; + color: var(--darkgray); + +} + +.empImge { + border-radius: 50%; + width: 100%; + height: 100%; + border: #dedede solid 1px; + +} + +.empImgeRep { + border-radius: 50% !important; + width: 80px; + height: 80px; + border: #dedede solid 1px; +} + +.line { + padding-bottom: 87px; +} + +.attachLable { + position: absolute; + top: 0px; + z-index: 0; + background: #30b8c6; + color: #fff; + border-radius: 50%; + border: 0px; + width: 24px; + height: 24px; + text-align: center; + font-size: 5px; +} + +.removeLable { + top: 0px; + z-index: 0; + background: #d8252d; + color: #fff; + border-radius: 50%; + border: 0px; + width: 20px; + height: 20px; + text-align: center; + font-size: 5px; +} + +.note-modal { + // width: 90%; + // height: 50%; + // top: 20%; + // left: 5%; + // right: 5%; + // bottom: 5%; + background: rgba(0, 0, 0, 0.5) !important; + padding: 30% 10% !important; + --height: 12cm !important; + // --width: 80% !important; + --border-radius: 20px; + +} + +.header-toolbar-new { + --background: #BE332F; +} + +.title { + margin-top: -37px; + margin-left: 85px; +} + +.title-ar { + margin-top: -37px; + margin-right: 101px; +} + +.confirmEitOkButton { + white-space: normal !important; + text-transform: capitalize !important; + min-height: 45px !important; + min-width: 5px !important; + margin: 8px !important; + background-color: #BE332F; + width: 80% !important; + color: white !important; + border-radius: 16px !important; +} + +.approvalTitle-ar { + font-weight: bold; + font-size: 16px; + text-align: right; + +} + +.approvalTitle { + font-weight: bold; + font-size: 16px; + text-align: left; +} \ No newline at end of file diff --git a/Mohem/src/app/eit/confirm-add-eit/confirm-add-eit.component.scss b/Mohem/src/app/eit/confirm-add-eit/confirm-add-eit.component.scss index 22672913..a53d7d25 100644 --- a/Mohem/src/app/eit/confirm-add-eit/confirm-add-eit.component.scss +++ b/Mohem/src/app/eit/confirm-add-eit/confirm-add-eit.component.scss @@ -12,7 +12,7 @@ .Header { font-weight: bold; - color: #1a586d !important; + color: #c6903e !important; font-size: 10px; } @@ -25,7 +25,7 @@ float: right; } -.attachmentDiv{ +.attachmentDiv { background: #ffffff; height: auto; text-align: center; @@ -35,7 +35,7 @@ border: 1px solid grey; } -.noDataDiv{ +.noDataDiv { background: #ffffff; height: 11%; text-align: center; @@ -44,7 +44,8 @@ margin: 10px; border-radius: 5px; } -.submitNote{ + +.submitNote { background: #ffffff; height: 80px; padding-top: 1px; @@ -53,7 +54,7 @@ border: 1px solid grey; } -.approvalList{ +.approvalList { --background: #f0efef; height: auto; text-align: center; @@ -64,41 +65,45 @@ } /************************New Design**********************************/ -.notification-list{ +.notification-list { background: none; background: none; border-radius: 32px; - ion-item{ - // margin-top: 5px; - // margin-bottom: 5px; - - background-color: transparent; - .item-date{ - width: 100%; - font-size: 16px; - font-weight: bold; - - text-align: start; - padding: 0; - margin: 0; - - position: absolute; - left: 0; - top: 12%; - } - ion-label , [item-end]{ - - white-space: normal; - font-size: 14px; - padding-top: 15%; - // :root[dir="ltr"]{ - // margin-left: 10px; - // } - // :root[dir="rtl"]{ - // margin-right: 10px; - // } - - } + + ion-item { + // margin-top: 5px; + // margin-bottom: 5px; + + background-color: transparent; + + .item-date { + width: 100%; + font-size: 16px; + font-weight: bold; + + text-align: start; + padding: 0; + margin: 0; + + position: absolute; + left: 0; + top: 12%; + } + + ion-label, + [item-end] { + + white-space: normal; + font-size: 14px; + padding-top: 15%; + // :root[dir="ltr"]{ + // margin-left: 10px; + // } + // :root[dir="rtl"]{ + // margin-right: 10px; + // } + + } } } @@ -109,13 +114,13 @@ .timeline { - position: relative; - margin: 15px 0 0 0; + position: relative; + margin: 15px 0 0 0; // border-bottom: solid 1px var(--cusgray); } .timeline:before { - + content: ''; position: inherit !important; top: 0; @@ -129,7 +134,7 @@ } .timeline .timeline-thumb { - + border-radius: 500px; width: 70px !important; z-index: 2; @@ -146,7 +151,7 @@ } .timeline .timeline-thumb.timeline-icon { - height: 70px; + height: 70px; // text-align: center; // color: white; // border: 5px solid #CBD0D3; @@ -161,19 +166,20 @@ } .timeline .timeline-stats { - position: relative; - font-size: 12px; - color: var(--darkgray); - + position: relative; + font-size: 12px; + color: var(--darkgray); + } -.empImge{ +.empImge { border-radius: 50%; - width:100%; + width: 100%; height: 100%; border: #dedede solid 1px; } + .empImgeRep { border-radius: 50% !important; width: 80px; @@ -181,25 +187,25 @@ border: #dedede solid 1px; } -.line{ - padding-bottom:87px; +.line { + padding-bottom: 87px; } -.attachLable{ +.attachLable { position: absolute; - top: 0px; - z-index: 0; - background: #30b8c6; - color: #fff; - border-radius: 50%; - border: 0px; - width: 24px; - height: 24px; - text-align: center; - font-size: 5px; + top: 0px; + z-index: 0; + background: #30b8c6; + color: #fff; + border-radius: 50%; + border: 0px; + width: 24px; + height: 24px; + text-align: center; + font-size: 5px; } -.removeLable{ +.removeLable { top: 0px; z-index: 0; background: #d8252d; @@ -223,40 +229,45 @@ padding: 30% 10% !important; --height: 12cm !important; // --width: 80% !important; - --border-radius:20px; - + --border-radius: 20px; + } -.header-toolbar-new{ - --background: #269DB8; + +.header-toolbar-new { + --background: #BE332F; } -.title{ + +.title { margin-top: -37px; margin-left: 85px; } -.title-ar{ + +.title-ar { margin-top: -37px; - margin-right: 101px; + margin-right: 101px; } -.confirmEitOkButton{ + +.confirmEitOkButton { white-space: normal !important; text-transform: capitalize !important; min-height: 45px !important; min-width: 5px !important; margin: 8px !important; - background-color: #269DB8; + background-color: #BE332F; width: 80% !important; - color: white!important; + color: white !important; border-radius: 16px !important; } -.approvalTitle-ar{ +.approvalTitle-ar { font-weight: bold; font-size: 16px; text-align: right; } -.approvalTitle{ + +.approvalTitle { font-weight: bold; font-size: 16px; text-align: left; -} +} \ No newline at end of file diff --git a/Mohem/src/app/eit/eit-list/eit-list.component.html b/Mohem/src/app/eit/eit-list/eit-list.component.html index 261eb065..d94c8534 100644 --- a/Mohem/src/app/eit/eit-list/eit-list.component.html +++ b/Mohem/src/app/eit/eit-list/eit-list.component.html @@ -223,7 +223,7 @@ - +

diff --git a/Mohem/src/app/eit/eit-list/eit-list.component.scss b/Mohem/src/app/eit/eit-list/eit-list.component.scss index c1c3c196..64b3805b 100644 --- a/Mohem/src/app/eit/eit-list/eit-list.component.scss +++ b/Mohem/src/app/eit/eit-list/eit-list.component.scss @@ -5,7 +5,7 @@ min-width: 200px; } -.datetime{ +.datetime { // text-align: center; // font-family: WorkSans-Bold; // margin-left: 111px; @@ -14,8 +14,9 @@ margin-left: 47px; margin-top: -19px; - } -.iconCalendar{ +} + +.iconCalendar { // margin-left: -241px; // margin-top: 5px; margin-left: 30px !important; @@ -23,13 +24,15 @@ height: 26px !important; margin-top: -69px !important; margin-bottom: 20px !important; - } +} + h4 { font-size: 2.2rem; text-align: center; color: #000000; } -.grids{ + +.grids { border-radius: 20px !important; background: white; padding-left: 1px; @@ -40,9 +43,9 @@ h4 { padding-left: 13px; padding-right: 13px; border: 1px solid #cac8c8; - } +} - .bgcolor { +.bgcolor { color: white; border-top-right-radius: 19px; @@ -52,24 +55,25 @@ h4 { margin-top: 0; margin-bottom: 0; /* border-radius: 12px !important; */ - background: #269DB8; + background: #BE332F; border-bottom: 1px solid #a7a4a4; border-top: 1px solid #cac8c8; margin-left: -13px; margin-right: -13px; } -.colEit{ + +.colEit { border-right: 1px solid #cac8c8; - border-bottom-left-radius: -10px !important; - padding-top: 8px; - padding-bottom: 8px; - margin-left: 18px; - font-size: 12px !important; + border-bottom-left-radius: -10px !important; + padding-top: 8px; + padding-bottom: 8px; + margin-left: 18px; + font-size: 12px !important; } .header-div { - - background-color: #269DB8; + + background-color: #BE332F; text-transform: capitalize; height: 160px; // position: relative; @@ -77,74 +81,76 @@ h4 { margin-bottom: -28px; } -.header-toolbar-new{ - --background: #269DB8; +.header-toolbar-new { + --background: #BE332F; } -.addClass{ - background-color: #269DB8; - width: 80px; - height: 80px; - right: 8%; - position: fixed; - color: white; - bottom: 5%; - border-radius: 50%; - z-index: 999; - -webkit-box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59); - -moz-box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59); - box-shadow: 2px -1px 13px 0px rgba(0,0,0,0.59); +.addClass { + background-color: #BE332F; + width: 80px; + height: 80px; + right: 8%; + position: fixed; + color: white; + bottom: 5%; + border-radius: 50%; + z-index: 999; + -webkit-box-shadow: 2px -1px 13px 0px rgba(0, 0, 0, 0.59); + -moz-box-shadow: 2px -1px 13px 0px rgba(0, 0, 0, 0.59); + box-shadow: 2px -1px 13px 0px rgba(0, 0, 0, 0.59); } .contentEit:before { position: absolute; -content: ""; -// background: #269DB8; -height: 140px; -width: 100%; -left: 0; -top: 0px; -z-index: 1; + content: ""; + // background: #BE332F; + height: 140px; + width: 100%; + left: 0; + top: 0px; + z-index: 1; } -.hrClass{ +.hrClass { border-width: 0; - box-sizing: content-box; - border-bottom: 1px solid #e6e6e6; - background: #fff !important; - height: 1px; + box-sizing: content-box; + border-bottom: 1px solid #e6e6e6; + background: #fff !important; + height: 1px; } //////////////////////////////// .content:before { position: absolute; -content: ""; -background: #269DB8; -height: 140px; -width: 100%; -left: 0; -top: 0px; -z-index: 1; + content: ""; + background: #BE332F; + height: 140px; + width: 100%; + left: 0; + top: 0px; + z-index: 1; } -.colorBG{ +.colorBG { --background: #f0efef; - } +} -.Title{ +.Title { text-align: center; color: white; margin-top: -33px; font-size: 17px; } -.title{ + +.title { text-align: center; color: black; margin-top: 5px; font-size: 17px; } -.today-graph{ + +.today-graph { display: block !important; height: 196px; width: 365px; @@ -152,183 +158,195 @@ z-index: 1; margin-left: 28px !important; } - .headerGrid{ - // background-color: white !important; - // border: 1px solid #cac8c8 !important; - // border-radius: 20px !important; - // padding-top: 28px; - // padding-bottom: 53px; - // margin-left: 9px; - // margin-right: 13px; - // margin-top: -94px; - // margin-bottom: 10px; - background-color: white !important; - border: 1px solid #cac8c8 !important; - /* padding-top: 28px; */ - padding-bottom: 53px; - padding-top: -30px; - margin-left: 13px; - margin-right: 13px; - /* margin-top: -86px; */ - margin-bottom: 10px; - position: relative; - z-index: 1; - border-radius: 20px; - margin-top: 17px; - } - .result-graph{ - font-size: 14px; - margin-left: -48px; - margin-right: 3px; - margin-bottom: -30px; - - - - } - - .green-label{ - font-size: 15px !important; - margin-left: 7px !important; - margin-right: 42px; - } - .green-label-ar{ - font-size: 15px !important; - margin-left: 7px !important; - margin-right: 15px; - } - .blue-label{ - font-size: 15px !important; - margin-left: 7px !important; - margin-right: 13px; - } - .light-label{ - font-size: 15px !important; - margin-left: 7px !important; - margin-right: -26px; - } - .light-label-ar{ - font-size: 15px !important; - margin-right: 7px !important; - margin-left: -26px; - } - - .light-dote{ - background-color: #3CB9D5; - width: 12px; - height: 12px; - border-radius: 50% !important; - display: inline-block; - } - .blue-dote{ - - background-color: #269DB8; - width: 12px; - height: 12px; - border-radius: 50% !important; - display: inline-block; - } - .green-dote{ - background-color: #1FA269; - width: 12px; - height: 12px; - border-radius: 50% !important; - display: inline-block; - margin-right: -1px; - } - .col{ - text-align: right; - } - - .gridService{ - - /* margin-top: 87px; */ - border-radius: 10px; - /* margin-bottom: -49px; */ - margin-left: 14px; - margin-right: 14px; - - } - .columns{ - margin: 3px; - margin-bottom: 13px; - background: white; - border-radius: 27px; - padding-left: 30px; - padding-right: 6px; - padding-top: 19px; - padding-bottom: 8px; - border: 1px solid #cac8c8 !important; - } - - - .service{ - font-size: 22px; - color: black; - letter-spacing: 1px; - font-weight: bold; - } - .services{ - - font-size: 12px; - color: black; - } - - .adult-dote{ - background-color: #3CB9D5; - width: 15px; - height: 15px; - border-radius: 50% !important; - display: inline-block; - margin-left: -17px; - margin-right: 5px; - } - - .adult-dote-ar{ - background-color: #3CB9D5; - width: 15px; - height: 15px; - border-radius: 50% !important; - display: inline-block; - margin-right: 0px; - margin-left: 5px; - } - .child-dote{ - - background-color: #269DB8; - width: 15px; - height: 15px; - border-radius: 50% !important; - display: inline-block; - margin-left: -17px; - margin-right: 5px; - } - .child-dote-ar{ - background-color: #269DB8; - width: 15px; - height: 15px; - border-radius: 50% !important; - display: inline-block; - margin-right: 1px; - margin-left: 5px; - } - .infants-dote{ - background-color: #1FA269; - width: 15px; - height: 15px; - border-radius: 50% !important; - display: inline-block; - margin-left: -17px; - margin-right: 5px; - // margin-bottom: 6px; - } - - .infants-dote-ar{ - background-color: #1FA269; - width: 15px; - height: 15px; - border-radius: 50% !important; - display: inline-block; - margin-right: 1px; - margin-left: 5px; - } - +.headerGrid { + // background-color: white !important; + // border: 1px solid #cac8c8 !important; + // border-radius: 20px !important; + // padding-top: 28px; + // padding-bottom: 53px; + // margin-left: 9px; + // margin-right: 13px; + // margin-top: -94px; + // margin-bottom: 10px; + background-color: white !important; + border: 1px solid #cac8c8 !important; + /* padding-top: 28px; */ + padding-bottom: 53px; + padding-top: -30px; + margin-left: 13px; + margin-right: 13px; + /* margin-top: -86px; */ + margin-bottom: 10px; + position: relative; + z-index: 1; + border-radius: 20px; + margin-top: 17px; +} + +.result-graph { + font-size: 14px; + margin-left: -48px; + margin-right: 3px; + margin-bottom: -30px; + + + +} + +.green-label { + font-size: 15px !important; + margin-left: 7px !important; + margin-right: 42px; +} + +.green-label-ar { + font-size: 15px !important; + margin-left: 7px !important; + margin-right: 15px; +} + +.blue-label { + font-size: 15px !important; + margin-left: 7px !important; + margin-right: 13px; +} + +.light-label { + font-size: 15px !important; + margin-left: 7px !important; + margin-right: -26px; +} + +.light-label-ar { + font-size: 15px !important; + margin-right: 7px !important; + margin-left: -26px; +} + +.light-dote { + background-color: #3CB9D5; + width: 12px; + height: 12px; + border-radius: 50% !important; + display: inline-block; +} + +.blue-dote { + + background-color: #BE332F; + width: 12px; + height: 12px; + border-radius: 50% !important; + display: inline-block; +} + +.green-dote { + background-color: #1FA269; + width: 12px; + height: 12px; + border-radius: 50% !important; + display: inline-block; + margin-right: -1px; +} + +.col { + text-align: right; +} + +.gridService { + + /* margin-top: 87px; */ + border-radius: 10px; + /* margin-bottom: -49px; */ + margin-left: 14px; + margin-right: 14px; + +} + +.columns { + margin: 3px; + margin-bottom: 13px; + background: white; + border-radius: 27px; + padding-left: 30px; + padding-right: 6px; + padding-top: 19px; + padding-bottom: 8px; + border: 1px solid #cac8c8 !important; +} + + +.service { + font-size: 22px; + color: black; + letter-spacing: 1px; + font-weight: bold; +} + +.services { + + font-size: 12px; + color: black; +} + +.adult-dote { + background-color: #3CB9D5; + width: 15px; + height: 15px; + border-radius: 50% !important; + display: inline-block; + margin-left: -17px; + margin-right: 5px; +} + +.adult-dote-ar { + background-color: #3CB9D5; + width: 15px; + height: 15px; + border-radius: 50% !important; + display: inline-block; + margin-right: 0px; + margin-left: 5px; +} + +.child-dote { + + background-color: #BE332F; + width: 15px; + height: 15px; + border-radius: 50% !important; + display: inline-block; + margin-left: -17px; + margin-right: 5px; +} + +.child-dote-ar { + background-color: #BE332F; + width: 15px; + height: 15px; + border-radius: 50% !important; + display: inline-block; + margin-right: 1px; + margin-left: 5px; +} + +.infants-dote { + background-color: #1FA269; + width: 15px; + height: 15px; + border-radius: 50% !important; + display: inline-block; + margin-left: -17px; + margin-right: 5px; + // margin-bottom: 6px; +} + +.infants-dote-ar { + background-color: #1FA269; + width: 15px; + height: 15px; + border-radius: 50% !important; + display: inline-block; + margin-right: 1px; + margin-left: 5px; +} \ No newline at end of file diff --git a/Mohem/src/app/eit/eit-list/eit-list.component.ts b/Mohem/src/app/eit/eit-list/eit-list.component.ts index ab521197..09697be5 100644 --- a/Mohem/src/app/eit/eit-list/eit-list.component.ts +++ b/Mohem/src/app/eit/eit-list/eit-list.component.ts @@ -21,7 +21,7 @@ import { AuthenticatedUser } from 'src/app/hmg-common/services/authentication/mo export class EitListComponent implements OnInit { Sdate: any; emp_no: any; - balance:any; + balance: any; //////////////up P_PAGE_NUM: number; P_PAGE_LIMIT: number; @@ -53,17 +53,18 @@ export class EitListComponent implements OnInit { public options = { cutoutPercentage: 80, tooltips: { enabled: false }, - legend: { display: false }}; - gaugeType = 'full'; + legend: { display: false } + }; + gaugeType = 'full'; accrualBalancesList: any; common: any; direction: string; - // gaugeValue = 11.200; - // gaugeLabel = ""; + // gaugeValue = 11.200; + // gaugeLabel = ""; // tslint:disable-next-line: max-line-length - constructor(private cs: CommonService, private EITService: EitService, public ts: TranslatorService, - private modalCtrl: ModalController, public accrualService: AccrualService, public authService:AuthenticationService,) { + constructor(private cs: CommonService, private EITService: EitService, public ts: TranslatorService, + private modalCtrl: ModalController, public accrualService: AccrualService, public authService: AuthenticationService,) { this.direction = TranslatorService.getCurrentLanguageName(); this.selMenu = this.cs.sharedService.getSharedData(MenuResponse.SHARED_DATA, false); this.selEmp = this.cs.sharedService.getSharedData(MenuResponse.SHARED_SEL_EMP, false); @@ -86,35 +87,36 @@ export class EitListComponent implements OnInit { this.getEITTransactions(); this.accrualBalancesList = this.cs.sharedService.getSharedData('tickitsbalance', false); - // accrualNetInfants - // accrualUNetChild - // accrualNetAdult - if(this.accrualBalancesList){ - this.accrualNetAdult = this.accrualBalancesList[1].ACCRUAL_NET_ENTITLEMENT; - this.accrualUNetChild = this.accrualBalancesList[2].ACCRUAL_NET_ENTITLEMENT; - this. accrualNetInfants = this.accrualBalancesList[3].ACCRUAL_NET_ENTITLEMENT; - } + // accrualNetInfants + // accrualUNetChild + // accrualNetAdult + if (this.accrualBalancesList) { + this.accrualNetAdult = this.accrualBalancesList[1].ACCRUAL_NET_ENTITLEMENT; + this.accrualUNetChild = this.accrualBalancesList[2].ACCRUAL_NET_ENTITLEMENT; + this.accrualNetInfants = this.accrualBalancesList[3].ACCRUAL_NET_ENTITLEMENT; + } this.data = { // labels: ['earingTotal', 'deductionTotal'], datasets: [ - { data: [this.accrualNetInfants, this.accrualUNetChild, this.accrualNetAdult], - backgroundColor: [ - '#1FA269', - '#269DB8', - '#3CB9D5', ], - borderWidth: 2 - } - ] - }; + { + data: [this.accrualNetInfants, this.accrualUNetChild, this.accrualNetAdult], + backgroundColor: [ + '#1FA269', + '#BE332F', + '#3CB9D5',], + borderWidth: 2 + } + ] + }; } - getUserDetails(){ + getUserDetails() { this.authService.loadAuthenticatedUser().subscribe((user: AuthenticatedUser) => { - if (user) { - // this.emp_no=user.EMPLOYEE_NUMBER; - - } - }); + if (user) { + // this.emp_no=user.EMPLOYEE_NUMBER; + + } + }); } public getAccrualBalance() { if (this.Sdate) { @@ -137,11 +139,11 @@ export class EitListComponent implements OnInit { } handleAccrualResult(result) { if (this.cs.validResponse(result)) { - this.balance=result.GetAccrualBalancesList; + this.balance = result.GetAccrualBalancesList; this.accrualNetAdult = this.balance[1].ACCRUAL_NET_ENTITLEMENT; this.accrualUNetChild = this.balance[2].ACCRUAL_NET_ENTITLEMENT; - this. accrualNetInfants = this.balance[3].ACCRUAL_NET_ENTITLEMENT; - } + this.accrualNetInfants = this.balance[3].ACCRUAL_NET_ENTITLEMENT; + } } /////////////////////////////////// @@ -190,7 +192,7 @@ export class EitListComponent implements OnInit { this.EITTransactionsListObj.P_PAGE_NUM = this.P_PAGE_NUM; result.GetEITTransactionList.forEach(vr => { console.log(vr.length); - if(vr.length && vr.length != 0){ + if (vr.length && vr.length != 0) { if (vr.Collection_Transaction[0].ROW_NUM == vr.Collection_Transaction[0].NO_OF_ROWS) { this.IsReachEnd = true; } else { @@ -379,7 +381,7 @@ export class EitListComponent implements OnInit { } else if (item.APPLICATION_COLUMN_NAME == 'PEI_EXTRA_INFO_ID') { obj.peiExtraInfoID = item.NUMBER_VALUE; - } + } } }// end for @@ -568,40 +570,40 @@ export class EitListComponent implements OnInit { this.removeItems(item.Collection_Transaction[0].TRANSACTION_NUMBER); } - -////////////////////////// -// getUserDetails(){ -// this.authService.loadAuthenticatedUser().subscribe((user: AuthenticatedUser) => { -// if (user) { -// this.emp_no=user.EMPLOYEE_NUMBER; - -// } -// }); -// } -// public getAccrualBalance() { -// if (this.Sdate) { -// let today = new Date(this.Sdate); -// let day = today.getDate(); -// let month = today.getMonth() + 1; -// let year = today.getFullYear(); -// let todayDate = month + '/' + day + '/' + year; -// let effectiveDate = todayDate; -// const request = { -// P_SELECTED_EMPLOYEE_NUMBER: this.emp_no, -// P_EFFECTIVE_DATE: effectiveDate -// }; -// this.accrualService -// .getAccrualBalances(request) -// .subscribe((result: any) => { -// this.handleAccrualResult(result); -// }); -// } -// } -// handleAccrualResult(result) { -// if (this.cs.validResponse(result)) { -// this.balance=result.GetAccrualBalancesList; -// } -// } + + ////////////////////////// + // getUserDetails(){ + // this.authService.loadAuthenticatedUser().subscribe((user: AuthenticatedUser) => { + // if (user) { + // this.emp_no=user.EMPLOYEE_NUMBER; + + // } + // }); + // } + // public getAccrualBalance() { + // if (this.Sdate) { + // let today = new Date(this.Sdate); + // let day = today.getDate(); + // let month = today.getMonth() + 1; + // let year = today.getFullYear(); + // let todayDate = month + '/' + day + '/' + year; + // let effectiveDate = todayDate; + // const request = { + // P_SELECTED_EMPLOYEE_NUMBER: this.emp_no, + // P_EFFECTIVE_DATE: effectiveDate + // }; + // this.accrualService + // .getAccrualBalances(request) + // .subscribe((result: any) => { + // this.handleAccrualResult(result); + // }); + // } + // } + // handleAccrualResult(result) { + // if (this.cs.validResponse(result)) { + // this.balance=result.GetAccrualBalancesList; + // } + // } } ////////////////////////////////up diff --git a/Mohem/src/app/eit/eit-update-list/eit-update-list.component.html b/Mohem/src/app/eit/eit-update-list/eit-update-list.component.html index 1fb0a2cd..c4945b3d 100644 --- a/Mohem/src/app/eit/eit-update-list/eit-update-list.component.html +++ b/Mohem/src/app/eit/eit-update-list/eit-update-list.component.html @@ -29,7 +29,7 @@
- +
diff --git a/Mohem/src/app/eit/eit-update-list/eit-update-list.component.scss b/Mohem/src/app/eit/eit-update-list/eit-update-list.component.scss index f4ce5a98..68ebdbd2 100644 --- a/Mohem/src/app/eit/eit-update-list/eit-update-list.component.scss +++ b/Mohem/src/app/eit/eit-update-list/eit-update-list.component.scss @@ -1,17 +1,17 @@ -.addEitOkButton{ - white-space: normal !important; - text-transform: capitalize !important; - min-height: 45px !important; - min-width: 5px !important; - margin: 8px !important; - background-color: #269DB8; - width: 80% !important; - color: white!important; - border-radius: 16px !important; - } +.addEitOkButton { + white-space: normal !important; + text-transform: capitalize !important; + min-height: 45px !important; + min-width: 5px !important; + margin: 8px !important; + background-color: #BE332F; + width: 80% !important; + color: white !important; + border-radius: 16px !important; +} - .editIconDiv{ - right: 10px; - position: absolute; - top: 10px; - } \ No newline at end of file +.editIconDiv { + right: 10px; + position: absolute; + top: 10px; +} \ No newline at end of file diff --git a/Mohem/src/app/eit/home/home.component.scss b/Mohem/src/app/eit/home/home.component.scss index 546cdfd0..e5b26660 100644 --- a/Mohem/src/app/eit/home/home.component.scss +++ b/Mohem/src/app/eit/home/home.component.scss @@ -12,8 +12,8 @@ ion-item.custCollabs.item.item-block.item-ios { border-bottom: 1px solid #c8c8c8; } -.header-toolbar-new{ - --background: #269DB8; +.header-toolbar-new { + --background: #BE332F; } ion-item.item.item-block { @@ -25,6 +25,7 @@ ion-item.item.item-block { ion-item.childItem.item.item-block { padding: 0px 5px; width: 100%; + ion-label.label.label-md, ion-label.label.label-ios { -webkit-box-shadow: none; @@ -46,9 +47,11 @@ ion-item.item.item-block { padding: 0px 10px; min-height: 40px; } + div.notSelected { padding: 0px 10px; } + // ion-label.label.label-md, // ion-label.label.label-ios { } @@ -56,40 +59,43 @@ ion-item.item.item-block { ion-icon::before { line-height: 2; } -.arrow-down{ + +.arrow-down { position: absolute; top: 0; - right:0; + right: 0; } + // .list-md > .item-block:last-child .item-inner, // .list-ios > .item-block:last-child .item-inner{ // border-bottom: 1px solid #dedede; // } -.span-arrow-en{ +.span-arrow-en { float: right; font-size: 25px; color: grey; transform: rotate(0deg); } -.span-arrow-ar{ +.span-arrow-ar { float: left; font-size: 25px; color: grey; transform: rotate(180deg); } -.arrow-forward{ +.arrow-forward { float: right; font-size: 25px; color: grey; } -.arrow-forward-ar{ + +.arrow-forward-ar { float: left; - font-size: 25px; - color: grey; - -webkit-transform: rotate(180deg); - transform: rotate(180deg); + font-size: 25px; + color: grey; + -webkit-transform: rotate(180deg); + transform: rotate(180deg); } \ No newline at end of file diff --git a/Mohem/src/app/eit/submit-eit-modal/submit-eit-modal.component.scss b/Mohem/src/app/eit/submit-eit-modal/submit-eit-modal.component.scss index 5a81509a..93545e99 100644 --- a/Mohem/src/app/eit/submit-eit-modal/submit-eit-modal.component.scss +++ b/Mohem/src/app/eit/submit-eit-modal/submit-eit-modal.component.scss @@ -1,53 +1,52 @@ -.rowBtn{ +.rowBtn { display: flex; flex-direction: row; justify-content: center; align-items: center; } -.Header{ +.Header { color: black !important; font-size: 25px !important; - font-weight: bold !important;; + font-weight: bold !important; + ; margin: 0; text-align: center; margin-bottom: 20px; } -.labelRadio{ +.labelRadio { color: black !important; font-weight: bold !important; padding-bottom: 20px; } -.labelcheck{ +.labelcheck { color: red !important; font-weight: bold !important; margin-bottom: 10px; } -.submitOkButton{ +.submitOkButton { white-space: normal !important; text-transform: capitalize !important; min-height: 45px !important; min-width: 5px !important; margin: 8px !important; - --background:: #269DB8; + --background: #BE332F; width: 100% !important; - color: white!important; + color: white !important; border-radius: 16px !important; } -.submitCancelButton{ + +.submitCancelButton { white-space: normal !important; text-transform: capitalize !important; min-height: 45px !important; min-width: 5px !important; margin: 8px !important; - --background:: #269DB8; + --background: #BE332F; width: 100% !important; - color: white!important; + color: white !important; border-radius: 16px !important; -} - - - +} \ No newline at end of file diff --git a/Mohem/src/app/hmg-common/services/connector/connector.service.ts b/Mohem/src/app/hmg-common/services/connector/connector.service.ts index d21af9bb..7b883a2c 100644 --- a/Mohem/src/app/hmg-common/services/connector/connector.service.ts +++ b/Mohem/src/app/hmg-common/services/connector/connector.service.ts @@ -27,16 +27,16 @@ export class ConnectorService { public static retryTimes = 0; public static timeOut = 180 * 1000; - // public static host = 'https://uat.hmgwebservices.com/'; + public static host = 'https://uat.hmgwebservices.com/'; // public static host = 'https://hmgwebservices.com/'; // public static host = 'http://riyt-mohemm1:1010/' //MOE - public static host = 'http://riyt-mohemm1.mopm.gov.sa:1010/' + // public static host = 'http://riyt-mohemm1.mopm.gov.sa:1010/' // public static host = 'http://mohemm-app-test.srca.org.sa:1010/' // public static host = 'http://10.254.212.41:1010/' - - + + constructor(public httpClient: HttpClient, public cs: CommonService, private events: Events, diff --git a/Mohem/src/app/hmg-common/ui/card-calendar/card-calendar.component.html b/Mohem/src/app/hmg-common/ui/card-calendar/card-calendar.component.html index b4ff6e5a..dd8df64c 100644 --- a/Mohem/src/app/hmg-common/ui/card-calendar/card-calendar.component.html +++ b/Mohem/src/app/hmg-common/ui/card-calendar/card-calendar.component.html @@ -2,5 +2,5 @@
- {{text}} + {{text}}
diff --git a/Mohem/src/app/hmg-common/ui/circle-calendar/circle-calendar.component.scss b/Mohem/src/app/hmg-common/ui/circle-calendar/circle-calendar.component.scss index 2bf170c9..35f168a6 100644 --- a/Mohem/src/app/hmg-common/ui/circle-calendar/circle-calendar.component.scss +++ b/Mohem/src/app/hmg-common/ui/circle-calendar/circle-calendar.component.scss @@ -1,111 +1,114 @@ .chart-modal .modal-Wrapper { --background: rgb(116, 108, 108) !important; - --border-color:white!important ; - width: 85%!important ; - height: 40px !important ; - - } - - .navbar{ - font-size: 10px !important; - --background: #269DB8 !important; - color: aliceblue !important; - } - - .menu { - margin-top: 0px !important; - font-size: 35px !important; - background: #269DB8; - color: aliceblue; - margin-left: 0px !important; - - } - - .person{ - margin-left:100px !important; - margin-top: 0px !important; - font-size: 23px !important; - background: #269DB8 !important; - color: aliceblue !important; - - } - - .grid{ - margin-bottom: 550px !important; - margin-top: 20px !important; - margin-left: 15px !important; - margin-right: 15px !important; - background-color:white !important; - border-radius: 20px !important; - height: 250px !important; - } - - .ionSliders{ - margin: 0px !important; - padding: 0px !important; - } - - - .ionSlide{ - margin-top: 5px !important; - margin-left: 190px !important; - color: black !important; - - } - .dateLable{ - - margin-left: 90px !important; - color: black !important; - font-size: small !important; - margin-top: 15px !important; - } + --border-color: white !important; + width: 85% !important; + height: 40px !important; + +} + +.navbar { + font-size: 10px !important; + --background: #BE332F !important; + color: aliceblue !important; +} + +.menu { + margin-top: 0px !important; + font-size: 35px !important; + background: #BE332F; + color: aliceblue; + margin-left: 0px !important; + +} + +.person { + margin-left: 100px !important; + margin-top: 0px !important; + font-size: 23px !important; + background: #BE332F !important; + color: aliceblue !important; + +} + +.grid { + margin-bottom: 550px !important; + margin-top: 20px !important; + margin-left: 15px !important; + margin-right: 15px !important; + background-color: white !important; + border-radius: 20px !important; + height: 250px !important; +} + +.ionSliders { + margin: 0px !important; + padding: 0px !important; +} + + +.ionSlide { + margin-top: 5px !important; + margin-left: 190px !important; + color: black !important; + +} + +.dateLable { + + margin-left: 90px !important; + color: black !important; + font-size: small !important; + margin-top: 15px !important; +} + // h1{ // font-size: 15px !important; // text-align: center !important; // } -.arrowDropright{ - margin-left:100px !important; - font-size: 20px !important; - color: rgb(168, 165, 165) !important; - margin-top: 15px !important; +.arrowDropright { + margin-left: 100px !important; + font-size: 20px !important; + color: rgb(168, 165, 165) !important; + margin-top: 15px !important; } -.arrowDropleft{ - font-size: 20px !important; + +.arrowDropleft { + font-size: 20px !important; margin-left: 10px !important; margin-top: 15px !important; color: rgb(116, 108, 108) !important; } - .ionLable{ - font-size: 10px !important; - } - - .number{ - - font-size: 18px !important; - font-weight: bolder !important; - color: black !important; - } - - .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: #269DB8; - // 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; - } - - .advanced-search-modal { - --height: 12cm !important; - --width: 80% !important; - --border-radius: 0.4cm; - } \ No newline at end of file +.ionLable { + font-size: 10px !important; +} + +.number { + + font-size: 18px !important; + font-weight: bolder !important; + color: black !important; +} + +.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: #BE332F; + // 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; +} + +.advanced-search-modal { + --height: 12cm !important; + --width: 80% !important; + --border-radius: 0.4cm; +} \ No newline at end of file diff --git a/Mohem/src/app/hmg-common/ui/circle-calendar/date-info-modal/date-info-modal.component.scss b/Mohem/src/app/hmg-common/ui/circle-calendar/date-info-modal/date-info-modal.component.scss index f0dc7258..26d77f56 100644 --- a/Mohem/src/app/hmg-common/ui/circle-calendar/date-info-modal/date-info-modal.component.scss +++ b/Mohem/src/app/hmg-common/ui/circle-calendar/date-info-modal/date-info-modal.component.scss @@ -7,12 +7,14 @@ display: block; text-align: center; transform: translate(-50%, -50%); + h2 { font-size: 25px; font-weight: bold; margin: 0 auto; line-height: 36px; } + span { width: 125px; display: block; @@ -61,19 +63,22 @@ color: rgb(163, 163, 163) !important; } } -.today-graph{ + +.today-graph { display: block; height: 127px; width: 270px; margin-left: -60px; } -.today-graph-ar{ + +.today-graph-ar { display: block; height: 127px; width: 270px; margin-right: -70px; } -.amountlabel{ + +.amountlabel { color: black !important; font-weight: bold !important; font-size: 13px !important; @@ -82,136 +87,153 @@ display: block; text-align: center; } - .rowlabel{ - color: #a3a3a3 !important; - font-size: 13px !important; - font-family: WorkSans-Bold; - display: block; - width: 100%; - text-align: center; - padding: 1px; - } - .grid{ -padding-bottom: -20px !important; -padding-top: -20px !important; -height: 360px !important; - } - .liftcol{ - border-right: 1px solid rgb(163, 163, 163) !important; - } - .liftcol-ar{ - - border-left: 1px solid rgb(163, 163, 163) !important; - } - +.rowlabel { + color: #a3a3a3 !important; + font-size: 13px !important; + font-family: WorkSans-Bold; + display: block; + width: 100%; + text-align: center; + padding: 1px; +} - .rightcol{ +.grid { + padding-bottom: -20px !important; + padding-top: -20px !important; + height: 360px !important; - margin-left: 5px !important; - } - .gridrow{ - border-top: 1px solid rgb(163, 163, 163) !important; - margin-left: 19px; - margin-right: 12px; - } - - .div{ - border: 1px solid #a3a3a3 !important; - border-radius: 10px; - margin-bottom:10px; - } - .div-ar{ - border: 1px solid #a3a3a3 !important; - border-radius: 9px; - width: 264%; - margin-right: -302px; - } - .p0{ - margin-bottom: -13px !important; - color: black !important; - font-weight: bold !important; - font-size: 14px !important; - margin-top: 8px; - text-align: center; - display: block; - width: 100%; - } - .p1{ - margin-bottom: -7px !important; - color: black !important; - font-family: WorkSans-Bold !important; - font-size: 33px; - margin-top: 10px; - text-align: center; - display: block; - width: 100%; - } - .p2{ - font-weight: bold !important; - font-size: 17px !important; - margin-bottom: 43px !important; - margin-top: 0px !important; - color: black !important; - font-weight: bold !important; - text-align: center; - display: block; - width: 100%; - } - .p3{ - color: black !important; - font-weight: bold !important; - font-size: 19px; - margin-top: -43px; - text-align: center; - display: block; - width: 100%; - } +} - .p2-ar{ font-weight: bold !important; - font-size: 17px !important; - margin-bottom: 43px !important; - margin-top: 0px !important; - color: black !important; - font-weight: bold !important; - margin-right: 33px; - } - .p3-ar{ /* margin-bottom: -72px !important; */ - color: black !important; - font-weight: bold !important; - font-size: 19px; - margin-top: -43px; - margin-right: 27px; - } - .p4{ margin-bottom: 56px !important; - margin-top: -26px !important; - color: black !important; - } - // .pdiv{background-color: gray;height: 26px;} - .p5{ - font-size: 14px; - text-align: center; - background-color: #269DB8; - color: white; - margin-top: -13px; - margin-bottom: -3px; - height: 21px; - width: 110px; - padding-top: 7px; - padding-bottom: 21px; - border-bottom-left-radius: 5px; - border-bottom-right-radius: 5px; - } +.liftcol { + border-right: 1px solid rgb(163, 163, 163) !important; +} - .slider-container { - padding-bottom: 20px; - } - .col{ - border-bottom: 1px solid rgb(204, 204, 204); - border-right: 1px solid rgb(204, 204, 204); - } - .col-ar{ - border-bottom: 1px solid rgb(204, 204, 204); - border-left: 1px solid rgb(204, 204, 204); - } - +.liftcol-ar { + + border-left: 1px solid rgb(163, 163, 163) !important; +} + + +.rightcol { + + margin-left: 5px !important; +} + +.gridrow { + border-top: 1px solid rgb(163, 163, 163) !important; + margin-left: 19px; + margin-right: 12px; +} + +.div { + border: 1px solid #a3a3a3 !important; + border-radius: 10px; + margin-bottom: 10px; +} + +.div-ar { + border: 1px solid #a3a3a3 !important; + border-radius: 9px; + width: 264%; + margin-right: -302px; +} + +.p0 { + margin-bottom: -13px !important; + color: black !important; + font-weight: bold !important; + font-size: 14px !important; + margin-top: 8px; + text-align: center; + display: block; + width: 100%; +} + +.p1 { + margin-bottom: -7px !important; + color: black !important; + font-family: WorkSans-Bold !important; + font-size: 33px; + margin-top: 10px; + text-align: center; + display: block; + width: 100%; +} + +.p2 { + font-weight: bold !important; + font-size: 17px !important; + margin-bottom: 43px !important; + margin-top: 0px !important; + color: black !important; + font-weight: bold !important; + text-align: center; + display: block; + width: 100%; +} + +.p3 { + color: black !important; + font-weight: bold !important; + font-size: 19px; + margin-top: -43px; + text-align: center; + display: block; + width: 100%; +} + +.p2-ar { + font-weight: bold !important; + font-size: 17px !important; + margin-bottom: 43px !important; + margin-top: 0px !important; + color: black !important; + font-weight: bold !important; + margin-right: 33px; +} + +.p3-ar { + /* margin-bottom: -72px !important; */ + color: black !important; + font-weight: bold !important; + font-size: 19px; + margin-top: -43px; + margin-right: 27px; +} + +.p4 { + margin-bottom: 56px !important; + margin-top: -26px !important; + color: black !important; +} + +// .pdiv{background-color: gray;height: 26px;} +.p5 { + font-size: 14px; + text-align: center; + background-color: #BE332F; + color: white; + margin-top: -13px; + margin-bottom: -3px; + height: 21px; + width: 110px; + padding-top: 7px; + padding-bottom: 21px; + border-bottom-left-radius: 5px; + border-bottom-right-radius: 5px; +} + +.slider-container { + padding-bottom: 20px; +} + +.col { + border-bottom: 1px solid rgb(204, 204, 204); + border-right: 1px solid rgb(204, 204, 204); +} + +.col-ar { + border-bottom: 1px solid rgb(204, 204, 204); + border-left: 1px solid rgb(204, 204, 204); +} \ No newline at end of file diff --git a/Mohem/src/app/hmg-common/ui/circle-calendar/date-info-modal/date-info-modal.component.ts b/Mohem/src/app/hmg-common/ui/circle-calendar/date-info-modal/date-info-modal.component.ts index 56f31536..e4d0acf3 100644 --- a/Mohem/src/app/hmg-common/ui/circle-calendar/date-info-modal/date-info-modal.component.ts +++ b/Mohem/src/app/hmg-common/ui/circle-calendar/date-info-modal/date-info-modal.component.ts @@ -54,16 +54,16 @@ export class DateInfoModalComponent implements OnInit { public navParams: NavParams, public ts: TranslatorService, public common: CommonService - ) { - this.direction = TranslatorService.getCurrentDirection(); - } + ) { + this.direction = TranslatorService.getCurrentDirection(); + } ngOnInit() { console.log(this.TODAYDATE); this.excess = this.TODAYDATE.EXCESS_HRS; this.lateIn = this.TODAYDATE.LATE_IN_HRS; this.shortage = this.TODAYDATE.SHORTAGE_HRS; - this.earlyOut = this.TODAYDATE.EARLY_OUT_HRS ; + this.earlyOut = this.TODAYDATE.EARLY_OUT_HRS; this.scheduleDate = this.TODAYDATE.SCHEDULE_DATE; this.assignData(this.SHIFTDETAILS.GetScheduleShiftsDetailsList[0]); } @@ -94,19 +94,19 @@ export class DateInfoModalComponent implements OnInit { { data: [this.percChart], backgroundColor: [ - '#269DB8' + '#BE332F' ], borderWidth: 2 }] }; } -slideChanged(ev) { - this.slides.getActiveIndex().then(index => { - const shiftDetails = this.SHIFTDETAILS.GetScheduleShiftsDetailsList[index]; - this.assignData(shiftDetails); - }); -} + slideChanged(ev) { + this.slides.getActiveIndex().then(index => { + const shiftDetails = this.SHIFTDETAILS.GetScheduleShiftsDetailsList[index]; + this.assignData(shiftDetails); + }); + } getHeaderDay(date: any) { if (this.direction === 'ltr') { diff --git a/Mohem/src/app/hmg-common/ui/file-uploder-profile/file-uploder-profile.component.scss b/Mohem/src/app/hmg-common/ui/file-uploder-profile/file-uploder-profile.component.scss index dc77de05..ec6ceba7 100644 --- a/Mohem/src/app/hmg-common/ui/file-uploder-profile/file-uploder-profile.component.scss +++ b/Mohem/src/app/hmg-common/ui/file-uploder-profile/file-uploder-profile.component.scss @@ -1,31 +1,33 @@ //test - .changeImgBtn{ - margin: 0; - position: absolute; - top: 80%; - left: 53%; - -ms-transform: translate(-50%, -50%); - transform: translate(-50%, -50%); - } - .btnImge{ - // button{ - border-color:transparent !important; - --background: #269DB8 !important; - background: #269DB8 !important; + .changeImgBtn { + margin: 0; + position: absolute; + top: 80%; + left: 53%; + -ms-transform: translate(-50%, -50%); + transform: translate(-50%, -50%); + } - height: 57px !important; - width: 60px !important; - border-radius: 50% !important; - // } - - } -//test - .changeIcon{ - background: #269DB8 !important; - border-radius: 50% !important; - width: 73px; - height: 55px; - color: white !important; - width: 80px; - height: 71px; - } \ No newline at end of file + .btnImge { + // button{ + border-color: transparent !important; + --background: #BE332F !important; + background: #BE332F !important; + + height: 57px !important; + width: 60px !important; + border-radius: 50% !important; + // } + + } + + //test + .changeIcon { + background: #BE332F !important; + border-radius: 50% !important; + width: 73px; + height: 55px; + color: white !important; + width: 80px; + height: 71px; + } \ No newline at end of file diff --git a/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.scss b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.scss index 60f1d786..43c3212b 100644 --- a/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.scss +++ b/Mohem/src/app/hmg-common/ui/generic-header/generic-header.component.scss @@ -1,4 +1,4 @@ -.profile-image-container{ +.profile-image-container { display: block; margin: 7px auto 0; width: 32px; @@ -6,13 +6,15 @@ border-radius: 100%; overflow: hidden; text-align: center; - img{ + + img { display: block; margin: 0 auto; max-width: 100%; } } -.ion-title{ + +.ion-title { color: white; font-size: 0.5cm; font-weight: bold; @@ -21,10 +23,12 @@ text-align: center; line-height: 46px; } + .header-toolbar-new { - --background: #269DB8; + --background: #BE332F; } -.setting-conatainer{ + +.setting-conatainer { height: 40px !important; width: 40px !important; } \ No newline at end of file diff --git a/Mohem/src/app/hmg-common/ui/nav-buttons/nav-buttons.component.scss b/Mohem/src/app/hmg-common/ui/nav-buttons/nav-buttons.component.scss index a9861567..559c3087 100644 --- a/Mohem/src/app/hmg-common/ui/nav-buttons/nav-buttons.component.scss +++ b/Mohem/src/app/hmg-common/ui/nav-buttons/nav-buttons.component.scss @@ -1,9 +1,10 @@ -.float-left{ +.float-left { float: left; } + ion-menu-button { font-size: 0.8cm; color: white; - background: #269DB8; + background: #BE332F; margin: 0 auto; } \ No newline at end of file diff --git a/Mohem/src/app/home/home.page.scss b/Mohem/src/app/home/home.page.scss index aa1f09cf..77fa053e 100644 --- a/Mohem/src/app/home/home.page.scss +++ b/Mohem/src/app/home/home.page.scss @@ -4,7 +4,7 @@ ion-row { } .header-toolbar-new { - --background: #269DB8; + --background: #BE332F; } .profile-image-container { @@ -56,7 +56,7 @@ ion-label { .contentBg:before { position: absolute; content: ""; - background: #269DB8; + background: #BE332F; height: 100px; width: 100%; left: 0; @@ -101,7 +101,7 @@ ion-label { ion-button { border-radius: 10px; padding: 10px; - background: #269db8; + background: #BE332F; --background: transparent; --box-shadow: none !important; height: auto; @@ -149,7 +149,7 @@ ion-label { // z-index: 2; // height: 112px; // width: 112px; -// background-color: #269DB8; +// background-color: #BE332F; // border-radius: 50%; // display: inline-block; // img { diff --git a/Mohem/src/app/mowadhafi/hr-request-form/hr-request-form.component.scss b/Mohem/src/app/mowadhafi/hr-request-form/hr-request-form.component.scss index 60613fd8..000e301f 100644 --- a/Mohem/src/app/mowadhafi/hr-request-form/hr-request-form.component.scss +++ b/Mohem/src/app/mowadhafi/hr-request-form/hr-request-form.component.scss @@ -1,25 +1,23 @@ +.header-toolbar-new { + --background: #BE332F; +} - -.header-toolbar-new{ - --background: #269DB8; - } - - .contentBg{ +.contentBg { padding: 0px 20px; } .contentBg:before { position: absolute; - content: ""; - background: #269DB8; - height: 140px; - width: 100%; - left: 0; - top: 0px; - z-index: 1; + content: ""; + background: #BE332F; + height: 140px; + width: 100%; + left: 0; + top: 0px; + z-index: 1; } -@media screen and (min-width: 1px) and (max-width:767px){ +@media screen and (min-width: 1px) and (max-width:767px) { .result-graph { position: relative; background: white; @@ -32,142 +30,152 @@ border-radius: 20px; border: 1px solid #ccc; padding-top: 12px; - }} - - @media screen and (min-width: 768px) and (max-width:1024px){ - .result-graph { - position: relative; - background: white; - // margin-top: 20px; - padding-bottom: 20px; - border-radius: 20px; - z-index: 1; - margin-bottom: 10px; - margin-top: 89px; - border-radius: 20px; - border: 1px solid #ccc; - padding-top: 114px !important; - }} - - .user-info{ - text-align: center; - margin-bottom: 3px; - .user-image-container{ - position: relative; - width: 100%; - height: 24px; - justify-content: space-between; - display: flex; - margin: 0 auto; - align-items: center; - }} - - .Boldtext{ - font-size: 13px; - font-family: WorkSans-Bold; - color: black !important; - display: block !important; - // line-height: 0px !important; - } - - .Nametext{ - font-size: 15px; - font-family: WorkSans-Bold; - color: black !important; - display: block !important; - // line-height: 0px !important; - } - - .employee-information-indetail{ - background: white; - margin-top: 15px; - border-radius: 20px; - margin-bottom: 15px; - border-radius: 20px; - border: 1px solid #ccc; - ion-col{ - padding: 15px; - // border-bottom: 1px solid #ccc; - } - h2{ - font-size: 13px; - // font-family: WorkSans-Bold; - margin: 0; - font-weight: bold; - color: rgb(128, 124, 124); - } - p{ - font-size: 13px; - margin: 0; - font-family: WorkSans-Bold; - // margin-bottom: 10px; - } - } - - @media screen and (min-width: 1px) and (max-width:767px){ - .user-image{ - position: relative; - display: block; - width: 95%; - height: 100%; - border-radius: 80px; - /* border: 1px solid #ccc; */ - margin-top: -125px; - - }} - @media screen and (min-width: 768px) and (max-width:1024px){ - .user-image{ - position: relative; - display: block; - width: 95%; - height: 100%; - border-radius: 80px; - margin-bottom: 371px; - }} - - .img{ - width: 100px; - height: 100px; - display: inline-flex; - overflow: hidden; - background: transparent; - border-radius: 70% !important; - position: relative; - top: 3px; - } - - .sendCodeBtn{ - --background: #269DB8; - color: white; - text-align: center; - text-decoration: none; - display: inline-block; - font-size: 12px; - margin-left: 5px !important; - margin-top: 15px !important; - margin-bottom: 20px !important; - /* border-radius: 4px; */ - height: 26px; - /* padding: 6px 24px; */ - font-size: 15px; - width: 322px; - } - - .verify-code{ - position: relative; - background: white; - border-radius: 20px; - z-index: 1; - border-radius: 20px; - border: 1px solid #ccc; - padding: 21px 3px 34px 14px; - margin: 25px 22px 2px 22px; - - - } - - - + } +} + +@media screen and (min-width: 768px) and (max-width:1024px) { + .result-graph { + position: relative; + background: white; + // margin-top: 20px; + padding-bottom: 20px; + border-radius: 20px; + z-index: 1; + margin-bottom: 10px; + margin-top: 89px; + border-radius: 20px; + border: 1px solid #ccc; + padding-top: 114px !important; + } +} + +.user-info { + text-align: center; + margin-bottom: 3px; + + .user-image-container { + position: relative; + width: 100%; + height: 24px; + justify-content: space-between; + display: flex; + margin: 0 auto; + align-items: center; + } +} + +.Boldtext { + font-size: 13px; + font-family: WorkSans-Bold; + color: black !important; + display: block !important; + // line-height: 0px !important; +} + +.Nametext { + font-size: 15px; + font-family: WorkSans-Bold; + color: black !important; + display: block !important; + // line-height: 0px !important; +} + +.employee-information-indetail { + background: white; + margin-top: 15px; + border-radius: 20px; + margin-bottom: 15px; + border-radius: 20px; + border: 1px solid #ccc; + + ion-col { + padding: 15px; + // border-bottom: 1px solid #ccc; + } + + h2 { + font-size: 13px; + // font-family: WorkSans-Bold; + margin: 0; + font-weight: bold; + color: rgb(128, 124, 124); + } + + p { + font-size: 13px; + margin: 0; + font-family: WorkSans-Bold; + // margin-bottom: 10px; + } +} + +@media screen and (min-width: 1px) and (max-width:767px) { + .user-image { + position: relative; + display: block; + width: 95%; + height: 100%; + border-radius: 80px; + /* border: 1px solid #ccc; */ + margin-top: -125px; + + } +} + +@media screen and (min-width: 768px) and (max-width:1024px) { + .user-image { + position: relative; + display: block; + width: 95%; + height: 100%; + border-radius: 80px; + margin-bottom: 371px; + } +} + +.img { + width: 100px; + height: 100px; + display: inline-flex; + overflow: hidden; + background: transparent; + border-radius: 70% !important; + position: relative; + top: 3px; +} + +.sendCodeBtn { + --background: #BE332F; + color: white; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 12px; + margin-left: 5px !important; + margin-top: 15px !important; + margin-bottom: 20px !important; + /* border-radius: 4px; */ + height: 26px; + /* padding: 6px 24px; */ + font-size: 15px; + width: 322px; +} + +.verify-code { + position: relative; + background: white; + border-radius: 20px; + z-index: 1; + border-radius: 20px; + border: 1px solid #ccc; + padding: 21px 3px 34px 14px; + margin: 25px 22px 2px 22px; + + +} + + + // .sms_code{ // margin: 0px; // text-align: center; @@ -186,18 +194,19 @@ ion-input { transition: all .2s ease-in-out; border-radius: 3px; display: inline-block; + &:focus { - border-color:var(--ion-color-secondary) !important; - box-shadow: 0 0 5px var(--ion-color-secondary) !important; + border-color: var(--ion-color-secondary) !important; + box-shadow: 0 0 5px var(--ion-color-secondary) !important; } - + &::selection { - background: transparent; + background: transparent; } - } +} - .sendVerifyBtn{ - --background: #269DB8; +.sendVerifyBtn { + --background: #BE332F; color: white; text-align: center; text-decoration: none; @@ -210,9 +219,9 @@ ion-input { font-size: 15px; width: 322px; margin-left: 22px; - } +} - @media screen and (min-width: 1px) and (max-width:320px){ +@media screen and (min-width: 1px) and (max-width:320px) { .custom-radio .radio-icon { margin: 0px; border-radius: 50%; @@ -220,157 +229,162 @@ ion-input { border-style: var(--border-style); border-color: #dcdcdc; margin-top: 6px !important; - border-color: #d8d4d4 !important; - margin-bottom: 18px;} - - .text-label{ - color: black !important; - font-size: 9px; - margin-left: 2px; - margin-right: 2px; - font-family: 'WorkSans-Bold'; - } } - - @media screen and (min-width: 325px){ - .custom-radio .radio-icon { - margin: 0px; - border-radius: 50%; - border-width: var(--border-width); - border-style: var(--border-style); - border-color: #dcdcdc; - margin-top: 6px !important; - border-color: #d8d4d4 !important; - margin-bottom: 18px;} - - .text-label{ - color: black !important; - font-size: 10px; - margin-left: 15px; - margin-right: 13px; - font-family: 'WorkSans-Bold'; - } } - - // .radio-list{ - // background: white; - // margin-left: 18px; - // /* margin-right: 10px; */ - // margin-top: 12px; - // } - - .result-serviceType{ - position: relative; - background: white; - border-radius: 20px; - z-index: 1; - border-radius: 25px; - border: 1px solid #ccc; - margin: 15px; + border-color: #d8d4d4 !important; + margin-bottom: 18px; } - .request-heading { - span { - display: block; - margin-bottom: 15px; - // padding-top: 8px; - padding-left: 3px; - /* font-weight: bold; */ - font-size: 14px; - font-family: 'WorkSans-Bold'; - } + .text-label { + color: black !important; + font-size: 9px; + margin-left: 2px; + margin-right: 2px; + font-family: 'WorkSans-Bold'; } +} - .filed1{ - border-radius: 30px; - border: 1px solid #d3d5d5 !important; - margin: 10px; - padding-left: 10px !important; - padding-top: 10px !important; - color: #636161; - padding-bottom: 10px; - width: 130% !important; - } - - .filedDesc{ - border-radius: 30px; - border: 1px solid #d3d5d5 !important; - // margin: 10px; - padding-left: 20px !important; - padding-top: 6px !important; - color: #636161; - --padding-bottom: 90px; - font-size: 13px; - text-align: start; +@media screen and (min-width: 325px) { + .custom-radio .radio-icon { + margin: 0px; + border-radius: 50%; + border-width: var(--border-width); + border-style: var(--border-style); + border-color: #dcdcdc; + margin-top: 6px !important; + border-color: #d8d4d4 !important; + margin-bottom: 18px; } - .filedDesc-ar{ - border-radius: 30px; - border: 1px solid #d3d5d5 !important; - // margin: 10px; - padding-right: 20px !important; - padding-top: 6px !important; - color: #636161; - --padding-bottom: 90px; - font-size: 13px; - text-align: start; + + .text-label { + color: black !important; + font-size: 10px; + margin-left: 15px; + margin-right: 13px; + font-family: 'WorkSans-Bold'; } +} - .labelDesc{ +// .radio-list{ +// background: white; +// margin-left: 18px; +// /* margin-right: 10px; */ +// margin-top: 12px; +// } + +.result-serviceType { + position: relative; + background: white; + border-radius: 20px; + z-index: 1; + border-radius: 25px; + border: 1px solid #ccc; + margin: 15px; +} + +.request-heading { + span { display: block; + margin-bottom: 15px; + // padding-top: 8px; + padding-left: 3px; + /* font-weight: bold; */ + font-size: 14px; + font-family: 'WorkSans-Bold'; + } +} + +.filed1 { + border-radius: 30px; + border: 1px solid #d3d5d5 !important; + margin: 10px; + padding-left: 10px !important; + padding-top: 10px !important; + color: #636161; + padding-bottom: 10px; + width: 130% !important; +} + +.filedDesc { + border-radius: 30px; + border: 1px solid #d3d5d5 !important; + // margin: 10px; + padding-left: 20px !important; + padding-top: 6px !important; + color: #636161; + --padding-bottom: 90px; + font-size: 13px; + text-align: start; +} + +.filedDesc-ar { + border-radius: 30px; + border: 1px solid #d3d5d5 !important; + // margin: 10px; + padding-right: 20px !important; + padding-top: 6px !important; + color: #636161; + --padding-bottom: 90px; + font-size: 13px; + text-align: start; +} + +.labelDesc { + display: block; padding-top: 8px; padding-left: 15px; font-size: 14px; font-weight: bold; color: #adabab; - } +} + +.selectLabel { + display: block; + padding-top: 8px; + padding-left: 15px; + font-size: 14px; + /* font-family: 'WorkSans-Bold'; */ + font-weight: bold; + color: black; +} - .selectLabel{ - display: block; - padding-top: 8px; - padding-left: 15px; - font-size: 14px; - /* font-family: 'WorkSans-Bold'; */ - font-weight: bold; - color: black; - } - - // .cancelRequest{ - // padding: 10px 7px 10px 0px; - // ion-button{ - // border-radius: 7px; - // padding: 12px 30px 12px 30px; - // background: #d00a0a; - // --background: transparent; - // --box-shadow: none !important; - // height: auto; - // min-height: inherit; - // font-size: 16px; - // font-weight: bold; - // margin-top: -5px; - // }} - // .submitRequest{ - // padding: 10px 7px 10px 0px; - // ion-button{ - // border-radius: 7px; - // padding: 12px 30px 12px 30px; - // background: #19a163; - // --background: transparent; - // --box-shadow: none !important; - // height: auto; - // min-height: inherit; - // font-size: 16px; - // font-weight: bold; - // margin-top: -5px; - // }} - - -.gridDiv{ +// .cancelRequest{ +// padding: 10px 7px 10px 0px; +// ion-button{ +// border-radius: 7px; +// padding: 12px 30px 12px 30px; +// background: #d00a0a; +// --background: transparent; +// --box-shadow: none !important; +// height: auto; +// min-height: inherit; +// font-size: 16px; +// font-weight: bold; +// margin-top: -5px; +// }} +// .submitRequest{ +// padding: 10px 7px 10px 0px; +// ion-button{ +// border-radius: 7px; +// padding: 12px 30px 12px 30px; +// background: #19a163; +// --background: transparent; +// --box-shadow: none !important; +// height: auto; +// min-height: inherit; +// font-size: 16px; +// font-weight: bold; +// margin-top: -5px; +// }} + + +.gridDiv { width: 100%; height: 40px; margin-top: 18px; font-size: 14px; } -.gridCancelBtn{ +.gridCancelBtn { min-width: auto; // margin: 0px; padding: 10px; @@ -391,11 +405,11 @@ ion-input { --background: #d00a0a !important; } -.main-button{ - --box-shadow:none; - } +.main-button { + --box-shadow: none; +} -.gridSubmitBtn{ +.gridSubmitBtn { min-width: auto; // margin: 0px; padding: 10px; @@ -413,25 +427,26 @@ ion-input { font-family: 'WorkSans-bold'; font-size: 16px; min-height: 1.0cm; - --background: #19a163 !important;} + --background: #19a163 !important; +} - .filed-container{ - margin-right: -17px; - margin-left: -25px; - } +.filed-container { + margin-right: -17px; + margin-left: -25px; +} - .labels{ +.labels { display: block; margin-top: 15px; padding-top: 8px; padding-left: 3px; font-size: 14px; font-family: 'WorkSans-Bold'; - } +} - .CreateBtn{ - --background: var(--newgreen) !important; +.CreateBtn { + --background: var(--newgreen) !important; background: var(--newgreen) !important; white-space: normal; color: var(--light); @@ -441,92 +456,102 @@ ion-input { border-radius: 7px !important; --min-height: 1.6cm !important; width: 315px; - } - .footer{ +} + +.footer { padding: 15px 0px 0px 0px; background-color: var(--light) !important; border: 0px !important; box-shadow: none !important; -webkit-box-shadow: none; - } - .Btn{ - margin: auto; text-align: center; display: block; - } - .footer2{ - padding: 15px 0px 0px 24px; - background-color: var(--light) !important; - border: 0px !important; - box-shadow: none !important; - -webkit-box-shadow: none; - } +} - ion-footer .footer-button{ - --background: #259CB8; - width: 80%; - } - @media screen and (min-width: 325px){ +.Btn { + margin: auto; + text-align: center; + display: block; +} + +.footer2 { + padding: 15px 0px 0px 24px; + background-color: var(--light) !important; + border: 0px !important; + box-shadow: none !important; + -webkit-box-shadow: none; +} + +ion-footer .footer-button { + --background: #259CB8; + width: 80%; +} + +@media screen and (min-width: 325px) { .fileUpload { position: relative; overflow: hidden; margin: 10px; margin-left: -233px; - }} - @media screen and (min-width: 1px) and (max-width:320px){ + } +} + +@media screen and (min-width: 1px) and (max-width:320px) { .fileUpload { position: relative; overflow: hidden; margin: 10px; margin-left: -158px; - }} - - .fileUpload input.upload { - position: absolute; - top: 0; - right: 0; - margin: 0; - padding: 0; - font-size: 20px; - cursor: pointer; - opacity: 0; - filter: alpha(opacity=0); } +} + +.fileUpload input.upload { + position: absolute; + top: 0; + right: 0; + margin: 0; + padding: 0; + font-size: 20px; + cursor: pointer; + opacity: 0; + filter: alpha(opacity=0); +} - .iconButton .imgSize{ - width: 10px !important; - height: 10px; - } +.iconButton .imgSize { + width: 10px !important; + height: 10px; +} - button.iconButton.button.button-ios.button-default.button-default-ios, +button.iconButton.button.button-ios.button-default.button-default-ios, button.iconButton.button.button-md.button-default.button-default-md { padding: 0px; } select option[data-default] { color: #888; - } +} - .Field-en{ +.Field-en { border-radius: 30px; - border: 1px solid #a2a5a6!important; + border: 1px solid #a2a5a6 !important; margin-bottom: 20px; - padding-left: 20px !important; + padding-left: 20px !important; padding-top: 6px !important; color: #999999 !important; - } - - .Field-ar{ +} + +.Field-ar { border-radius: 30px; - border: 1px solid #a2a5a6!important; + border: 1px solid #a2a5a6 !important; margin-bottom: 20px; - padding-right: 20px !important; + padding-right: 20px !important; padding-top: 6px !important; color: #999999 !important; - } - - .button-native { - box-shadow: none!important; - } - .gridAH{ - text-align: justify; - } \ No newline at end of file +} + +.button-native { + box-shadow: none !important; +} + +.gridAH { + text-align: justify; +} \ No newline at end of file diff --git a/Mohem/src/app/mowadhafi/hr-request/hr-request.component.scss b/Mohem/src/app/mowadhafi/hr-request/hr-request.component.scss index 9a786617..44fcb364 100644 --- a/Mohem/src/app/mowadhafi/hr-request/hr-request.component.scss +++ b/Mohem/src/app/mowadhafi/hr-request/hr-request.component.scss @@ -1,27 +1,27 @@ +.header-toolbar-new { + --background: #BE332F; +} - -.header-toolbar-new{ - --background: #269DB8; - } - ion-content { +ion-content { --ion-background-color: whitesmoke; } - .contentBg{ + +.contentBg { padding: 0px 20px; } .contentBg:before { position: absolute; - content: ""; - background: #269DB8; - height: 140px; - width: 100%; - left: 0; - top: 0px; - z-index: 1; + content: ""; + background: #BE332F; + height: 140px; + width: 100%; + left: 0; + top: 0px; + z-index: 1; } -@media screen and (min-width: 1px) and (max-width:767px){ +@media screen and (min-width: 1px) and (max-width:767px) { .result-graph { position: relative; background: white; @@ -34,260 +34,276 @@ border-radius: 20px; border: 1px solid #ccc; padding-top: 12px; - }} - - @media screen and (min-width: 768px) and (max-width:1024px){ - .result-graph { - position: relative; - background: white; - // margin-top: 20px; - padding-bottom: 20px; - border-radius: 20px; - z-index: 1; - margin-bottom: 10px; - margin-top: 89px; - border-radius: 20px; - border: 1px solid #ccc; - padding-top: 114px !important; - }} - - .user-info{ - text-align: center; - margin-bottom: 3px; - .user-image-container{ - position: relative; - width: 100%; - height: 24px; - justify-content: space-between; - display: flex; - margin: 0 auto; - align-items: center; - }} - - .Boldtext{ - // font-size: 13px; - // font-family: WorkSans-Bold; - // color: black !important; - // display: block !important; - text-align: center; - // font: normal normal 600 16px/19px Poppins; - letter-spacing: -0.64px; - color: #2B353E; - opacity: 1; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - font-size: 16px; - line-height: 19px; - - } - .p{ - text-align: center; - // font: normal normal 600 13px/0px Poppins; + } +} + +@media screen and (min-width: 768px) and (max-width:1024px) { + .result-graph { + position: relative; + background: white; + // margin-top: 20px; + padding-bottom: 20px; + border-radius: 20px; + z-index: 1; + margin-bottom: 10px; + margin-top: 89px; + border-radius: 20px; + border: 1px solid #ccc; + padding-top: 114px !important; + } +} + +.user-info { + text-align: center; + margin-bottom: 3px; + + .user-image-container { + position: relative; + width: 100%; + height: 24px; + justify-content: space-between; + display: flex; + margin: 0 auto; + align-items: center; + } +} + +.Boldtext { + // font-size: 13px; + // font-family: WorkSans-Bold; + // color: black !important; + // display: block !important; + text-align: center; + // font: normal normal 600 16px/19px Poppins; + letter-spacing: -0.64px; + color: #2B353E; + opacity: 1; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + font-size: 16px; + line-height: 19px; + +} + +.p { + text-align: center; + // font: normal normal 600 13px/0px Poppins; + letter-spacing: -0.52px; + color: #A2A2A2; + opacity: 1; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + font-size: 13px; + line-height: 0px; +} + +.p1 { + text-align: center; + // font: normal normal 600 13px/6px Poppins; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + font-size: 13px; + line-height: 6px; + letter-spacing: -0.52px; + color: #A2A2A2; + opacity: 1; +} + +.Nametext { + // font-size: 15px; + // font-family: WorkSans-Bold; + // color: black !important; + // display: block !important; + text-align: center; + /* font: normal normal 600 21px/31px Poppins; */ + letter-spacing: -0.84px; + color: #2B353E; + opacity: 1; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 21px; + font-size: 21px; + +} + +.title { + text-align: left; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 20px; + font-size: 20px; + letter-spacing: -0.8px; + color: #2B353E; + opacity: 1; + margin-top: 12px; + margin-bottom: -22px; +} + +.title-ar { + text-align: right; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 20px; + font-size: 20px; + letter-spacing: -0.8px; + color: #2B353E; + opacity: 1; + margin-top: 12px; + margin-bottom: -22px; +} + +.employee-information-indetail { + background: white; + // margin-top: 15px; + border-radius: 20px; + // margin-bottom: 15px; + border-radius: 20px; + border: 1px solid #ccc; + + ion-col { + padding: 15px; + // border-bottom: 1px solid #ccc; + } + + h2 { + // font-size: 13px; + // margin: 0; + // font-weight: bold; + // color: rgb(128, 124, 124); + text-align: left; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 0px; + font-size: 13px; letter-spacing: -0.52px; color: #A2A2A2; opacity: 1; + } + + p { + // font-size: 13px; + // margin: 0; + // font-family: WorkSans-Bold; + + text-align: left; + // font: normal normal 600 16px/5px Poppins; font-family: var(--fontFamilyPoppins-SemiBold, inherit); - font-size: 13px; - line-height: 0px; - } - .p1{ - text-align: center; - // font: normal normal 600 13px/6px Poppins; + line-height: 5px; + font-size: 16px; + letter-spacing: -0.64px; + color: #2B353E; + opacity: 1; + line-height: 20px; + + + } +} + +.employee-information-indetail-ar { + background: white; + // margin-top: 15px; + border-radius: 20px; + // margin-bottom: 15px; + border-radius: 20px; + border: 1px solid #ccc; + + ion-col { + padding: 15px; + // border-bottom: 1px solid #ccc; + } + + h2 { + // font-size: 13px; + // margin: 0; + // font-weight: bold; + // color: rgb(128, 124, 124); + text-align: right; font-family: var(--fontFamilyPoppins-SemiBold, inherit); - font-size: 13px; - line-height: 6px; + line-height: 0px; + font-size: 13px; letter-spacing: -0.52px; color: #A2A2A2; opacity: 1; - } - .Nametext{ - // font-size: 15px; - // font-family: WorkSans-Bold; - // color: black !important; - // display: block !important; - text-align: center; - /* font: normal normal 600 21px/31px Poppins; */ - letter-spacing: -0.84px; - color: #2B353E; - opacity: 1; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 21px; - font-size: 21px; - - } - - .title{ - text-align: left; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 20px; - font-size: 20px; - letter-spacing: -0.8px; - color: #2B353E; - opacity: 1; - margin-top: 12px; - margin-bottom: -22px; - } - - .title-ar{ - text-align: right; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 20px; - font-size: 20px; - letter-spacing: -0.8px; - color: #2B353E; - opacity: 1; - margin-top: 12px; - margin-bottom: -22px; - } - - .employee-information-indetail{ - background: white; - // margin-top: 15px; - border-radius: 20px; - // margin-bottom: 15px; - border-radius: 20px; - border: 1px solid #ccc; - ion-col{ - padding: 15px; - // border-bottom: 1px solid #ccc; - } - h2{ - // font-size: 13px; - // margin: 0; - // font-weight: bold; - // color: rgb(128, 124, 124); - text-align: left; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 0px; - font-size: 13px; - letter-spacing: -0.52px; - color: #A2A2A2; - opacity: 1; - } - p{ - // font-size: 13px; - // margin: 0; - // font-family: WorkSans-Bold; - - text-align: left; - // font: normal normal 600 16px/5px Poppins; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 5px; - font-size: 16px; - letter-spacing: -0.64px; - color: #2B353E; - opacity: 1; - line-height: 20px; - - - } - } - - .employee-information-indetail-ar{ - background: white; - // margin-top: 15px; - border-radius: 20px; - // margin-bottom: 15px; - border-radius: 20px; - border: 1px solid #ccc; - ion-col{ - padding: 15px; - // border-bottom: 1px solid #ccc; - } - h2{ - // font-size: 13px; - // margin: 0; - // font-weight: bold; - // color: rgb(128, 124, 124); - text-align: right; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 0px; - font-size: 13px; - letter-spacing: -0.52px; - color: #A2A2A2; - opacity: 1; - } - p{ - // font-size: 13px; - // margin: 0; - // font-family: WorkSans-Bold; - - text-align: right; - // font: normal normal 600 16px/5px Poppins; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 5px; - font-size: 16px; - letter-spacing: -0.64px; - color: #2B353E; - opacity: 1; - - - } - } - - @media screen and (min-width: 1px) and (max-width:767px){ - .user-image{ - position: relative; - display: block; - width: 95%; - height: 100%; - border-radius: 80px; - /* border: 1px solid #ccc; */ - margin-top: -125px; - - }} - @media screen and (min-width: 768px) and (max-width:1024px){ - .user-image{ - position: relative; - display: block; - width: 95%; - height: 100%; - border-radius: 80px; - margin-bottom: 371px; - }} - - .img{ - width: 100px; - height: 100px; - display: inline-flex; - overflow: hidden; - background: transparent; - border-radius: 70% !important; - position: relative; - top: 3px; - } - - .sendCodeBtn{ - --background: #269DB8; - color: white; - text-align: center; - text-decoration: none; - display: inline-block; - font-size: 12px; - margin-left: 5px !important; - margin-top: 15px !important; - margin-bottom: 20px !important; - /* border-radius: 4px; */ - height: 26px; - /* padding: 6px 24px; */ - font-size: 15px; - width: 322px; - } - - .verify-code{ - position: relative; - background: white; - border-radius: 20px; - z-index: 1; - border-radius: 20px; - border: 1px solid #ccc; - padding: 21px 3px 34px 14px; - margin: 25px 22px 2px 22px; - - - } - - - + } + + p { + // font-size: 13px; + // margin: 0; + // font-family: WorkSans-Bold; + + text-align: right; + // font: normal normal 600 16px/5px Poppins; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 5px; + font-size: 16px; + letter-spacing: -0.64px; + color: #2B353E; + opacity: 1; + + + } +} + +@media screen and (min-width: 1px) and (max-width:767px) { + .user-image { + position: relative; + display: block; + width: 95%; + height: 100%; + border-radius: 80px; + /* border: 1px solid #ccc; */ + margin-top: -125px; + + } +} + +@media screen and (min-width: 768px) and (max-width:1024px) { + .user-image { + position: relative; + display: block; + width: 95%; + height: 100%; + border-radius: 80px; + margin-bottom: 371px; + } +} + +.img { + width: 100px; + height: 100px; + display: inline-flex; + overflow: hidden; + background: transparent; + border-radius: 70% !important; + position: relative; + top: 3px; +} + +.sendCodeBtn { + --background: #BE332F; + color: white; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 12px; + margin-left: 5px !important; + margin-top: 15px !important; + margin-bottom: 20px !important; + /* border-radius: 4px; */ + height: 26px; + /* padding: 6px 24px; */ + font-size: 15px; + width: 322px; +} + +.verify-code { + position: relative; + background: white; + border-radius: 20px; + z-index: 1; + border-radius: 20px; + border: 1px solid #ccc; + padding: 21px 3px 34px 14px; + margin: 25px 22px 2px 22px; + + +} + + + // .sms_code{ // margin: 0px; // text-align: center; @@ -306,18 +322,19 @@ ion-input { transition: all .2s ease-in-out; border-radius: 3px; display: inline-block; + &:focus { - border-color:var(--ion-color-secondary) !important; - box-shadow: 0 0 5px var(--ion-color-secondary) !important; + border-color: var(--ion-color-secondary) !important; + box-shadow: 0 0 5px var(--ion-color-secondary) !important; } - + &::selection { - background: transparent; + background: transparent; } - } +} - .sendVerifyBtn{ - --background: #269DB8; +.sendVerifyBtn { + --background: #BE332F; color: white; text-align: center; text-decoration: none; @@ -330,169 +347,174 @@ ion-input { font-size: 15px; width: 322px; margin-left: 22px; - } +} - .custom-radio .radio-icon { - margin: 0px; - border-radius: 50%; - border-width: var(--border-width); - border-style: var(--border-style); - border-color: #dcdcdc; - margin-top: 6px !important; - border-color: #d8d4d4 !important; - margin-bottom: 18px;} - - .text-label{ - color: black !important; - font-size: 10px; - margin-left: 15px; - margin-right: 18px; - font-family: 'WorkSans-Bold'; - } - - // .radio-list{ - // background: white; - // margin-left: 18px; - // /* margin-right: 10px; */ - // margin-top: 12px; - // } - - .result-serviceType{ - position: relative; - background: white; - border-radius: 20px; - z-index: 1; - border-radius: 25px; - border: 1px solid #ccc; - margin: 15px; - } +.custom-radio .radio-icon { + margin: 0px; + border-radius: 50%; + border-width: var(--border-width); + border-style: var(--border-style); + border-color: #dcdcdc; + margin-top: 6px !important; + border-color: #d8d4d4 !important; + margin-bottom: 18px; +} - .request-heading { - span { - display: block; - margin-bottom: 15px; - // padding-top: 8px; - // padding-left: 15px; - /* font-weight: bold; */ - font-size: 14px; - font-family: 'WorkSans-Bold'; - } - } +.text-label { + color: black !important; + font-size: 10px; + margin-left: 15px; + margin-right: 18px; + font-family: 'WorkSans-Bold'; +} - .filed1{ - border-radius: 30px; - border: 1px solid #d3d5d5 !important; - margin: 10px; - padding-left: 11px !important; - padding-top: 6px !important; - color: #636161; - padding-bottom: 15px; - // padding-right: 252px; - padding-right: 115px; - } - .filed2{ - border-radius: 30px; - border: 1px solid #d3d5d5 !important; - margin: 10px; - padding-left: 11px !important; - padding-top: 6px !important; - color: #636161; - padding-bottom: 15px; - // padding-right: 252px; - padding-right: 153px; - } - .filed3{ - border-radius: 30px; - border: 1px solid #d3d5d5 !important; - margin: 10px; - padding-left: 11px !important; - padding-top: 6px !important; - color: #636161; - padding-bottom: 15px; - // padding-right: 252px; - padding-right: 61px; - } - .filedDesc{ - border-radius: 30px; - border: 1px solid #d3d5d5 !important; - // margin: 10px; - padding-left: 20px !important; - padding-top: 6px !important; - color: #636161; - --padding-bottom: 90px; - font-size: 13px; - text-align: start; - } - .filedDesc-ar{ - border-radius: 30px; - border: 1px solid #d3d5d5 !important; - // margin: 10px; - padding-right: 20px !important; - padding-top: 6px !important; - color: #636161; - --padding-bottom: 90px; - font-size: 13px; - text-align: start; - } +// .radio-list{ +// background: white; +// margin-left: 18px; +// /* margin-right: 10px; */ +// margin-top: 12px; +// } - .labelDesc{ +.result-serviceType { + position: relative; + background: white; + border-radius: 20px; + z-index: 1; + border-radius: 25px; + border: 1px solid #ccc; + margin: 15px; +} + +.request-heading { + span { display: block; + margin-bottom: 15px; + // padding-top: 8px; + // padding-left: 15px; + /* font-weight: bold; */ + font-size: 14px; + font-family: 'WorkSans-Bold'; + } +} + +.filed1 { + border-radius: 30px; + border: 1px solid #d3d5d5 !important; + margin: 10px; + padding-left: 11px !important; + padding-top: 6px !important; + color: #636161; + padding-bottom: 15px; + // padding-right: 252px; + padding-right: 115px; +} + +.filed2 { + border-radius: 30px; + border: 1px solid #d3d5d5 !important; + margin: 10px; + padding-left: 11px !important; + padding-top: 6px !important; + color: #636161; + padding-bottom: 15px; + // padding-right: 252px; + padding-right: 153px; +} + +.filed3 { + border-radius: 30px; + border: 1px solid #d3d5d5 !important; + margin: 10px; + padding-left: 11px !important; + padding-top: 6px !important; + color: #636161; + padding-bottom: 15px; + // padding-right: 252px; + padding-right: 61px; +} + +.filedDesc { + border-radius: 30px; + border: 1px solid #d3d5d5 !important; + // margin: 10px; + padding-left: 20px !important; + padding-top: 6px !important; + color: #636161; + --padding-bottom: 90px; + font-size: 13px; + text-align: start; +} + +.filedDesc-ar { + border-radius: 30px; + border: 1px solid #d3d5d5 !important; + // margin: 10px; + padding-right: 20px !important; + padding-top: 6px !important; + color: #636161; + --padding-bottom: 90px; + font-size: 13px; + text-align: start; +} + +.labelDesc { + display: block; padding-top: 8px; padding-left: 15px; font-size: 14px; font-weight: bold; color: #adabab; - } +} - .selectLabel{ - display: block; - padding-top: 8px; - padding-left: 15px; - font-size: 14px; - /* font-family: 'WorkSans-Bold'; */ - font-weight: bold; - color: black; - } +.selectLabel { + display: block; + padding-top: 8px; + padding-left: 15px; + font-size: 14px; + /* font-family: 'WorkSans-Bold'; */ + font-weight: bold; + color: black; +} - - // .cancelRequest{ - // padding: 10px 7px 10px 0px; - // ion-button{ - // border-radius: 7px; - // padding: 12px 30px 12px 30px; - // background: #d00a0a; - // --background: transparent; - // --box-shadow: none !important; - // height: auto; - // min-height: inherit; - // font-size: 16px; - // font-weight: bold; - // margin-top: -5px; - // }} - // .submitRequest{ - // padding: 10px 7px 10px 0px; - // ion-button{ - // border-radius: 7px; - // padding: 12px 30px 12px 30px; - // background: #19a163; - // --background: transparent; - // --box-shadow: none !important; - // height: auto; - // min-height: inherit; - // font-size: 16px; - // font-weight: bold; - // margin-top: -5px; - // }} - - -.gridDiv{ + +// .cancelRequest{ +// padding: 10px 7px 10px 0px; +// ion-button{ +// border-radius: 7px; +// padding: 12px 30px 12px 30px; +// background: #d00a0a; +// --background: transparent; +// --box-shadow: none !important; +// height: auto; +// min-height: inherit; +// font-size: 16px; +// font-weight: bold; +// margin-top: -5px; +// }} +// .submitRequest{ +// padding: 10px 7px 10px 0px; +// ion-button{ +// border-radius: 7px; +// padding: 12px 30px 12px 30px; +// background: #19a163; +// --background: transparent; +// --box-shadow: none !important; +// height: auto; +// min-height: inherit; +// font-size: 16px; +// font-weight: bold; +// margin-top: -5px; +// }} + + +.gridDiv { width: 100%; height: 40px; margin-top: 18px; font-size: 14px; } -.gridCancelBtn{ +.gridCancelBtn { min-width: auto; // margin: 0px; padding: 10px; @@ -510,7 +532,7 @@ ion-input { font-family: 'WorkSans-bold'; } -.gridSubmitBtn{ +.gridSubmitBtn { min-width: auto; // margin: 0px; padding: 10px; @@ -525,93 +547,103 @@ ion-input { color: white; // margin-left: 15px; // margin-right: 5px; - font-family: 'WorkSans-bold';} + font-family: 'WorkSans-bold'; +} - .filed-container{ - margin-right: -17px; - margin-left: -25px; - } +.filed-container { + margin-right: -17px; + margin-left: -25px; +} - .labels{ +.labels { display: block; margin-top: 15px; padding-top: 8px; padding-left: 15px; font-size: 14px; font-family: 'WorkSans-Bold'; - } +} - @media screen and (min-width: 325px) { .CreateBtn{ +@media screen and (min-width: 325px) { + .CreateBtn { --background: var(--newgreen) !important; - background: var(--newgreen) !important; - white-space: normal; - color: var(--light); - text-transform: capitalize; - min-height: 1.0cm; - --border-radius: 7px !important; - border-radius: 7px !important; - --min-height: 1.6cm !important; - width: 315px; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - }} - @media screen and (min-width: 1px) and (max-width:320px) { - .CreateBtn{ + background: var(--newgreen) !important; + white-space: normal; + color: var(--light); + text-transform: capitalize; + min-height: 1.0cm; + --border-radius: 7px !important; + border-radius: 7px !important; + --min-height: 1.6cm !important; + width: 315px; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + } +} + +@media screen and (min-width: 1px) and (max-width:320px) { + .CreateBtn { --background: var(--newgreen) !important; - background: var(--newgreen) !important; - white-space: normal; - color: var(--light); - text-transform: capitalize; - min-height: 1.0cm; - --border-radius: 7px !important; - border-radius: 7px !important; - --min-height: 1.6cm !important; - width: 231px; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - }} + background: var(--newgreen) !important; + white-space: normal; + color: var(--light); + text-transform: capitalize; + min-height: 1.0cm; + --border-radius: 7px !important; + border-radius: 7px !important; + --min-height: 1.6cm !important; + width: 231px; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + } +} - .footer{ +.footer { padding: 15px 0px 0px 0px; background-color: var(--light) !important; border: 0px !important; box-shadow: none !important; -webkit-box-shadow: none; - } - .Btn{ - margin: auto; text-align: center; display: block; - } - .footer2{ - padding: 15px 0px 0px 24px; - background-color: var(--light) !important; - border: 0px !important; - box-shadow: none !important; - -webkit-box-shadow: none; - } +} - ion-footer .footer-button{ - --background: #259CB8; - width: 80%; - } +.Btn { + margin: auto; + text-align: center; + display: block; +} - .fileUpload { - position: relative; - overflow: hidden; - margin: 10px; - margin-left: -233px; - } - .fileUpload input.upload { - position: absolute; - top: 0; - right: 0; - margin: 0; - padding: 0; - font-size: 20px; - cursor: pointer; - opacity: 0; - filter: alpha(opacity=0); - } +.footer2 { + padding: 15px 0px 0px 24px; + background-color: var(--light) !important; + border: 0px !important; + box-shadow: none !important; + -webkit-box-shadow: none; +} + +ion-footer .footer-button { + --background: #259CB8; + width: 80%; +} + +.fileUpload { + position: relative; + overflow: hidden; + margin: 10px; + margin-left: -233px; +} + +.fileUpload input.upload { + position: absolute; + top: 0; + right: 0; + margin: 0; + padding: 0; + font-size: 20px; + cursor: pointer; + opacity: 0; + filter: alpha(opacity=0); +} - .hL{ - line-height: 19px !important; - } \ No newline at end of file +.hL { + line-height: 19px !important; +} \ No newline at end of file diff --git a/Mohem/src/app/mowadhafi/request-details/request-details.component.scss b/Mohem/src/app/mowadhafi/request-details/request-details.component.scss index a0ae8e95..4b20cdfc 100644 --- a/Mohem/src/app/mowadhafi/request-details/request-details.component.scss +++ b/Mohem/src/app/mowadhafi/request-details/request-details.component.scss @@ -1,414 +1,449 @@ - - ion-content { +ion-content { --ion-background-color: whitesmoke; } - .sendCodeBtn{ - --background: #269DB8; - color: white; - text-align: center; - text-decoration: none; - display: inline-block; +.sendCodeBtn { + --background: #BE332F; + color: white; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 12px; + margin-left: 23px !important; + margin-top: 15px !important; + margin-bottom: 20px !important; + /* border-radius: 4px; */ + height: 26px; + /* padding: 6px 24px; */ + font-size: 15px; + width: 322px; +} + +.empty-en { + color: black; + text-align: center; + font-size: 15px; + font-family: WorkSans-Bold; + margin: 50px 0px 0px 100px; +} + +.empty-ar { + color: black; + text-align: center; + font-size: 15px; + font-family: WorkSans-Bold; + margin: 50px 100px 0px 0px; +} + +.result-container { + // position: relative; + // background: white; + + // border-radius: 20px; + // z-index: 1; + // margin: 15px; + // border-radius: 10px; + // border: 1px solid #ccc; + background: #FFFFFF 0% 0% no-repeat padding-box; + box-shadow: 0px 0px 5px #00000029; + border-radius: 10px; + opacity: 1; +} + +.result-containerList { + // position: relative; + // background: white; + // border-radius: 20px; + // z-index: 1; + // margin: 15px; + // border-radius: 10px; + // border: 1px solid #ccc; + background: #FFFFFF 0% 0% no-repeat padding-box; + box-shadow: 0px 0px 5px #00000029; + border-radius: 10px; + opacity: 1; +} + +.text { + text-align: left; + /* font-family: var(--fontFamilyPoppins-Medium, inherit); */ + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 11px; + font-size: 16px; + letter-spacing: -0.64px; + color: #2B353E; + opacity: 1; + +} + +.text-ar { + text-align: right; + /* font-family: var(--fontFamilyPoppins-Medium, inherit); */ + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 11px; + font-size: 16px; + letter-spacing: -0.64px; + color: #2B353E; + opacity: 1; + +} + +@media screen and (min-width: 1px) and (max-width:320px) { + .date { + // margin-right: -38px; + color: gray; + font-size: 12px; + margin-left: -44px; + } +} + +@media screen and (min-width: 325px) { + .date { + // margin-top: -9px; + margin-right: -49px; + color: gray; font-size: 12px; - margin-left: 23px !important; - margin-top: 15px !important; - margin-bottom: 20px !important; - /* border-radius: 4px; */ - height: 26px; - /* padding: 6px 24px; */ - font-size: 15px; - width: 322px; - } - - .empty-en{ - color: black; - text-align: center; - font-size: 15px; - font-family: WorkSans-Bold; - margin: 50px 0px 0px 100px; - } - .empty-ar{ - color: black; - text-align: center; - font-size: 15px; - font-family: WorkSans-Bold; - margin: 50px 100px 0px 0px; - } - - .result-container{ - // position: relative; - // background: white; - - // border-radius: 20px; - // z-index: 1; - // margin: 15px; - // border-radius: 10px; - // border: 1px solid #ccc; - background: #FFFFFF 0% 0% no-repeat padding-box; - box-shadow: 0px 0px 5px #00000029; - border-radius: 10px; - opacity: 1; - } - - .result-containerList{ - // position: relative; - // background: white; - // border-radius: 20px; - // z-index: 1; - // margin: 15px; - // border-radius: 10px; - // border: 1px solid #ccc; - background: #FFFFFF 0% 0% no-repeat padding-box; - box-shadow: 0px 0px 5px #00000029; - border-radius: 10px; - opacity: 1; - } - .text{ - text-align: left; - /* font-family: var(--fontFamilyPoppins-Medium, inherit); */ - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 11px; - font-size: 16px; - letter-spacing: -0.64px; - color: #2B353E; - opacity: 1; - - } - - .text-ar{ - text-align: right; - /* font-family: var(--fontFamilyPoppins-Medium, inherit); */ - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 11px; - font-size: 16px; - letter-spacing: -0.64px; - color: #2B353E; - opacity: 1; - - } - @media screen and (min-width: 1px) and (max-width:320px) { - .date{ - // margin-right: -38px; - color: gray; - font-size: 12px; - margin-left: -44px; - }} - - @media screen and (min-width: 325px) { - .date{ - // margin-top: -9px; - margin-right: -49px; - color: gray; - font-size: 12px; - }} - - @media screen and (min-width: 1px) and (max-width:320px) { - .date-ar{ - // margin-right: -38px; - color: gray; - font-size: 10px; - margin-left: 58px; - }} - - @media screen and (min-width: 325px) { - .date-ar{ - // margin-top: -9px; - margin-right: -49px; - color: gray; - font-size: 12px; - }} - - .labels{ - // font-size: 13px; - // margin-bottom: 0px; - // margin-top: -10px; - // color: #a9a5a5; - // font-family: 'WorkSans-bold'; - text-align: left; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - // font-weight: 600; - line-height: 20px; - font-size: 13px; - // font: normal normal 600 13px/20px Poppins; - letter-spacing: -0.52px; - color: #A2A2A2; - opacity: 1; - padding-bottom: 3px; - } - .labels-ar{ - // font-size: 13px; - // margin-bottom: 0px; - // margin-top: -10px; - // color: #a9a5a5; - // font-family: 'WorkSans-bold'; - text-align: right; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - // font-weight: 600; - line-height: 20px; - font-size: 13px; - // font: normal normal 600 13px/20px Poppins; - letter-spacing: -0.52px; - color: #A2A2A2; - opacity: 1; - padding-bottom: 3px; - } - .request-list-container { - position: relative; - padding-left: 37px; - clear: both; - min-height: 200px; - padding-top: 15px; - } - .request-list-container:before{ - content: ""; - position: absolute; - height: 100%; - width: 4px; - left: 7px; - top: 15px; - background-color: #f5f4f4; - } - .request-list-container-ar { - position: relative; - padding-left: 60px; - clear: both; - min-height: 200px; - // margin-bottom: 80px; - padding-top: 15px; - } - .request-list-container-ar:before{ - content: ""; - position: absolute; - height: 100%; - width: 4px; - left: 30px; - top: 15px; - right: 6px; - background-color: #dddddd; - } - - .text-span { - position: relative; - display: block; - letter-spacing: -0.64px; - color: #2B353E; - opacity: 1; - // font-weight: 600; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 25px; - font-size: 16px; - } - .text-span:before{ - content: ""; - position: absolute; - left: -35px; - border-radius: 50%; - width: 15px; - height: 15px; - background-color: #269db8; - top: 1px; - } - - .text-span-ar{ - position: relative; - display: block; - letter-spacing: -0.64px; - color: #2B353E; - opacity: 1; - // font-weight: 600; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 25px; - font-size: 16px; - margin-right: 37px; - } - .text-span-ar:before{ - content: ""; - position: absolute; - right: -35px; - border-radius: 50%; - width: 15px; - height: 15px; - background-color: #269db8; - top: 1px; - } - - .action-data{ - background-color: white; - padding: 1px; - border-radius: 20px; - font-family: WorkSans-Regular; - // padding-left: 15px; - margin-right: 20px; - margin-bottom: 15px; - p{ - // font-size: 14px; - text-align: left; - letter-spacing: -0.52px; - color: #535353; - opacity: 1; - //font-weight: 500; - font-family: var(--fontFamilyPoppins-Medium, inherit); - line-height: 18px; - font-size: 13px; - } - } - - .action-data-ar{ - background-color: white; - padding: 1px; - border-radius: 20px; - font-family: WorkSans-Regular; - // padding-left: 15px; - margin-right: 20px; - margin-bottom: 15px; - p{ - // font-size: 14px; - text-align: right; - letter-spacing: -0.52px; - color: #535353; - opacity: 1; - //font-weight: 500; - font-family: var(--fontFamilyPoppins-Medium, inherit); - line-height: 18px; - font-size: 13px; - } - } - .date-span{ - text-align: right; - - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - //font-weight: 600; - line-height: 20px; - font-size: 13px; - // font: normal normal 600 13px/20px Poppins; - letter-spacing: -0.52px; - color: #A2A2A2; - opacity: 1; - } - // @media screen and (min-width: 325px){ - // .date-span{ - // font-size: 13px; - // margin-bottom: 0px; - // margin-top: -10px; - // color: gray; - // margin-left: 160px; - - // }} - // @media screen and (min-width: 1px) and (max-width:320px) { - // .date-span{ - // font-size: 13px; - // margin-bottom: 0px; - // margin-top: -10px; - // color: gray; - // margin-left: 76px; - - // }} - - // @media screen and (min-width: 1px) and (max-width:320px) { - // .date-span-ar{ - // font-size: 13px; + } +} + +@media screen and (min-width: 1px) and (max-width:320px) { + .date-ar { + // margin-right: -38px; + color: gray; + font-size: 10px; + margin-left: 58px; + } +} + +@media screen and (min-width: 325px) { + .date-ar { + // margin-top: -9px; + margin-right: -49px; + color: gray; + font-size: 12px; + } +} + +.labels { + // font-size: 13px; + // margin-bottom: 0px; + // margin-top: -10px; + // color: #a9a5a5; + // font-family: 'WorkSans-bold'; + text-align: left; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + // font-weight: 600; + line-height: 20px; + font-size: 13px; + // font: normal normal 600 13px/20px Poppins; + letter-spacing: -0.52px; + color: #A2A2A2; + opacity: 1; + padding-bottom: 3px; +} + +.labels-ar { + // font-size: 13px; // margin-bottom: 0px; // margin-top: -10px; - // color: gray; - // margin-right: 60px; - // }} - - // @media screen and (min-width: 325px){ - // .date-span-ar{ - // font-size: 13px; - // margin-bottom: 0px; - // margin-top: -10px; - // color: gray; - // margin-right: 140px; - // }} - - - .New{ - margin-top: 5px; - color: #1FA169; - font-family:'WorkSans-bold'; + // color: #a9a5a5; + // font-family: 'WorkSans-bold'; + text-align: right; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + // font-weight: 600; + line-height: 20px; + font-size: 13px; + // font: normal normal 600 13px/20px Poppins; + letter-spacing: -0.52px; + color: #A2A2A2; + opacity: 1; + padding-bottom: 3px; +} + +.request-list-container { + position: relative; + padding-left: 37px; + clear: both; + min-height: 200px; + padding-top: 15px; +} + +.request-list-container:before { + content: ""; + position: absolute; + height: 100%; + width: 4px; + left: 7px; + top: 15px; + background-color: #f5f4f4; +} + +.request-list-container-ar { + position: relative; + padding-left: 60px; + clear: both; + min-height: 200px; + // margin-bottom: 80px; + padding-top: 15px; +} + +.request-list-container-ar:before { + content: ""; + position: absolute; + height: 100%; + width: 4px; + left: 30px; + top: 15px; + right: 6px; + background-color: #dddddd; +} + +.text-span { + position: relative; + display: block; + letter-spacing: -0.64px; + color: #2B353E; + opacity: 1; + // font-weight: 600; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 25px; + font-size: 16px; +} + +.text-span:before { + content: ""; + position: absolute; + left: -35px; + border-radius: 50%; + width: 15px; + height: 15px; + background-color: #BE332F; + top: 1px; +} + +.text-span-ar { + position: relative; + display: block; + letter-spacing: -0.64px; + color: #2B353E; + opacity: 1; + // font-weight: 600; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 25px; + font-size: 16px; + margin-right: 37px; +} + +.text-span-ar:before { + content: ""; + position: absolute; + right: -35px; + border-radius: 50%; + width: 15px; + height: 15px; + background-color: #BE332F; + top: 1px; +} + +.action-data { + background-color: white; + padding: 1px; + border-radius: 20px; + font-family: WorkSans-Regular; + // padding-left: 15px; + margin-right: 20px; + margin-bottom: 15px; + + p { + // font-size: 14px; + text-align: left; + letter-spacing: -0.52px; + color: #535353; + opacity: 1; + //font-weight: 500; + font-family: var(--fontFamilyPoppins-Medium, inherit); + line-height: 18px; + font-size: 13px; } +} + +.action-data-ar { + background-color: white; + padding: 1px; + border-radius: 20px; + font-family: WorkSans-Regular; + // padding-left: 15px; + margin-right: 20px; + margin-bottom: 15px; + + p { + // font-size: 14px; + text-align: right; + letter-spacing: -0.52px; + color: #535353; + opacity: 1; + //font-weight: 500; + font-family: var(--fontFamilyPoppins-Medium, inherit); + line-height: 18px; + font-size: 13px; + } +} + +.date-span { + text-align: right; + + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + //font-weight: 600; + line-height: 20px; + font-size: 13px; + // font: normal normal 600 13px/20px Poppins; + letter-spacing: -0.52px; + color: #A2A2A2; + opacity: 1; +} + +// @media screen and (min-width: 325px){ +// .date-span{ +// font-size: 13px; +// margin-bottom: 0px; +// margin-top: -10px; +// color: gray; +// margin-left: 160px; + +// }} +// @media screen and (min-width: 1px) and (max-width:320px) { +// .date-span{ +// font-size: 13px; +// margin-bottom: 0px; +// margin-top: -10px; +// color: gray; +// margin-left: 76px; + +// }} + +// @media screen and (min-width: 1px) and (max-width:320px) { +// .date-span-ar{ +// font-size: 13px; +// margin-bottom: 0px; +// margin-top: -10px; +// color: gray; +// margin-right: 60px; +// }} + +// @media screen and (min-width: 325px){ +// .date-span-ar{ +// font-size: 13px; +// margin-bottom: 0px; +// margin-top: -10px; +// color: gray; +// margin-right: 140px; +// }} + + +.New { + margin-top: 5px; + color: #1FA169; + font-family: 'WorkSans-bold'; +} + +.ReOpen { + margin-top: 5px; + color: #1FA169; +} - .ReOpen{ margin-top: 5px; - color: #1FA169; - } - .AssToManager{ margin-top: 5px; - color: #259CB8; - } - .AssToSpec{ margin-top: 5px; - color: #259CB8; - } - .Pending{ margin-top: 5px; - color: #E29D03; - } - .BackToSpec{ margin-top: 5px; - color: #3A476E; - } - .Closed{ margin-top: 5px; - color: #CA3332; - } - .BackToManager{ margin-top: 5px; - color: #3A476E; - } - .AssignedToHR{ margin-top: 5px; - color: #259CB8; - } - - // .card-content{ - // margin-left: -3px; margin-right: -9px;} - // .card-content-ar{ - // margin-left: -122px; - // } - - - .status{ - text-align: left; - /* font: normal normal 600 10px/16px Poppins; */ - letter-spacing: -0.4px; - opacity: 1; - - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - // font-weight: 600; - line-height: 16px; - font-size: 10px; - color: #269db8; - } - .postedDate{ - text-align: left !important; - // font-weight: 600; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 16px !important; - font-size: 10px !important; - letter-spacing: -0.4px !important; - color: #969696 !important; - opacity: 1 !important; - } - .DescrText{ - text-align: left; - // font: normal normal medium 13px/18px Poppins; - letter-spacing: -0.52px; - color: #535353; - opacity: 1; - // font-weight: 500; - font-family: var(--fontFamilyPoppins-Medium, inherit); - line-height: 5px; - font-size: 13px; - } - .DescrText-ar{ - text-align: right; - // font: normal normal medium 13px/18px Poppins; - letter-spacing: -0.52px; - color: #535353; - opacity: 1; - // font-weight: 500; - font-family: var(--fontFamilyPoppins-Medium, inherit); - line-height: 5px; - font-size: 13px; - } - .div{ - position: relative; - display: flex; - justify-content: space-between; - margin-bottom: -12px; - } +.AssToManager { + margin-top: 5px; + color: #259CB8; +} + +.AssToSpec { + margin-top: 5px; + color: #259CB8; +} + +.Pending { + margin-top: 5px; + color: #E29D03; +} + +.BackToSpec { + margin-top: 5px; + color: #3A476E; +} + +.Closed { + margin-top: 5px; + color: #CA3332; +} + +.BackToManager { + margin-top: 5px; + color: #3A476E; +} + +.AssignedToHR { + margin-top: 5px; + color: #259CB8; +} + +// .card-content{ +// margin-left: -3px; margin-right: -9px;} +// .card-content-ar{ +// margin-left: -122px; +// } + + +.status { + text-align: left; + /* font: normal normal 600 10px/16px Poppins; */ + letter-spacing: -0.4px; + opacity: 1; + + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + // font-weight: 600; + line-height: 16px; + font-size: 10px; + color: #BE332F; +} + +.postedDate { + text-align: left !important; + // font-weight: 600; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 16px !important; + font-size: 10px !important; + letter-spacing: -0.4px !important; + color: #969696 !important; + opacity: 1 !important; +} + +.DescrText { + text-align: left; + // font: normal normal medium 13px/18px Poppins; + letter-spacing: -0.52px; + color: #535353; + opacity: 1; + // font-weight: 500; + font-family: var(--fontFamilyPoppins-Medium, inherit); + line-height: 5px; + font-size: 13px; +} + +.DescrText-ar { + text-align: right; + // font: normal normal medium 13px/18px Poppins; + letter-spacing: -0.52px; + color: #535353; + opacity: 1; + // font-weight: 500; + font-family: var(--fontFamilyPoppins-Medium, inherit); + line-height: 5px; + font-size: 13px; +} +.div { + position: relative; + display: flex; + justify-content: space-between; + margin-bottom: -12px; +} \ No newline at end of file diff --git a/Mohem/src/app/my-team/details/details.component.scss b/Mohem/src/app/my-team/details/details.component.scss index 49b07c86..1e61c866 100644 --- a/Mohem/src/app/my-team/details/details.component.scss +++ b/Mohem/src/app/my-team/details/details.component.scss @@ -1,7 +1,8 @@ ion-content { --ion-background-color: whitesmoke; } -ion-title{ + +ion-title { color: white; position: absolute; top: 0; @@ -13,25 +14,27 @@ ion-title{ height: 100%; font-family: WorkSans-Regular; } -.contentBg{ + +.contentBg { padding: 0px 20px; } .contentBg:before { position: absolute; - content: ""; - background: #269DB8; - height: 140px; - width: 100%; - left: 0; - top: 0px; - z-index: 1; -} - - .user-info{ - text-align: center; - margin-bottom: 15px; - .user-image-container{ + content: ""; + background: #BE332F; + height: 140px; + width: 100%; + left: 0; + top: 0px; + z-index: 1; +} + +.user-info { + text-align: center; + margin-bottom: 15px; + + .user-image-container { position: relative; width: 100%; height: 24px; @@ -40,101 +43,113 @@ ion-title{ margin: 0 auto; align-items: center; } - // position: relative; - // width: 80px; - // height: 80px; - // display: block; - // margin: 0 auto; - // &:before{ - // position: absolute; - // content: ""; - // width: 20px; - // height: 20px; - // border-radius: 20px; - // border: 1px solid white; - // top: 0; - // right: 0; - // background-color: red; - // z-index: 9; - // } - // &.present:before{ - // background-color: green !important; - // } - } - - @media screen and (min-width: 1px) and (max-width:767px){ - .user-image{ - position: relative; - display: block; - width: 30%; - height: 100%; - border-radius: 80px; - /* border: 1px solid #ccc; */ - margin-top: -125px; - }} - @media screen and (min-width: 768px) and (max-width:1024px){ - .user-image{ + // position: relative; + // width: 80px; + // height: 80px; + // display: block; + // margin: 0 auto; + // &:before{ + // position: absolute; + // content: ""; + // width: 20px; + // height: 20px; + // border-radius: 20px; + // border: 1px solid white; + // top: 0; + // right: 0; + // background-color: red; + // z-index: 9; + // } + // &.present:before{ + // background-color: green !important; + // } +} + +@media screen and (min-width: 1px) and (max-width:767px) { + .user-image { + position: relative; + display: block; + width: 30%; + height: 100%; + border-radius: 80px; + /* border: 1px solid #ccc; */ + margin-top: -125px; + + } +} + +@media screen and (min-width: 768px) and (max-width:1024px) { + .user-image { position: relative; display: block; width: 30%; height: 100%; border-radius: 80px; margin-bottom: 371px; - }} - h1{ - margin: 0; - padding: 0; - font-family: WorkSans-Bold; - font-size: 18px; - margin-bottom: 4px; - } - span{ - font-size: 12px; - display: block; - // color: #888 - - } - - $actionBtnSize : 36px; - .user-actions{ - text-align: center; - margin-left: 1px; - .action-button{ - font-size: 11px; - font-weight: bold; - // white-space: nowrap; - // color: #888; - .action-button-icon{ - width: $actionBtnSize; - height: $actionBtnSize; - border-radius: $actionBtnSize; - margin: 0 auto; - display: block; - background-color: #269DB8; - line-height: $actionBtnSize; - margin-bottom: 3px; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - display: flex; - img{ - margin: 0 auto; - vertical-align: middle; - } - .span{ + } +} + +h1 { + margin: 0; + padding: 0; + font-family: WorkSans-Bold; + font-size: 18px; + margin-bottom: 4px; +} + +span { + font-size: 12px; + display: block; + // color: #888 + +} + +$actionBtnSize : 36px; + +.user-actions { + text-align: center; + margin-left: 1px; + + .action-button { + font-size: 11px; + font-weight: bold; + + // white-space: nowrap; + // color: #888; + .action-button-icon { + width: $actionBtnSize; + height: $actionBtnSize; + border-radius: $actionBtnSize; + margin: 0 auto; + display: block; + background-color: #BE332F; + line-height: $actionBtnSize; + margin-bottom: 3px; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + display: flex; + + img { + margin: 0 auto; + vertical-align: middle; + } + + .span { font-size: 10px; display: block; font-family: var(--fontFamilyPoppins-SemiBold, inherit); - } - } - } - } + } + } + } +} - .employee-information-indetail{ +.employee-information-indetail { background: #FFFFFF 0% 0% no-repeat padding-box; box-shadow: 0px 0px 5px #00000029; border-radius: 20px; opacity: 1; - } +} + // .employee-information-indetail{ // background: white; // margin-top: 15px; @@ -169,7 +184,7 @@ ion-title{ color: black; } -@media screen and (min-width: 1px) and (max-width:767px){ +@media screen and (min-width: 1px) and (max-width:767px) { .active-Segment { width: 11%; max-width: 11%; @@ -181,14 +196,15 @@ ion-title{ // margin-right: 22px; // margin-left: 22px; margin-left: 19px; - background-color: #269DB8; + background-color: #BE332F; display: flex; - } } - @media screen and (min-width: 768px) and (max-width:1024px){ - .active-Segment{ +} - background: #269DB8 !important; +@media screen and (min-width: 768px) and (max-width:1024px) { + .active-Segment { + + background: #BE332F !important; // padding-left: 17px; // display: flex; width: 11%; @@ -203,11 +219,12 @@ ion-title{ margin-left: 57px; // margin-left: 14px; display: flex; - - }} - @media screen and (min-width: 1px) and (max-width:767px){ - .normal-Segment { + } +} + +@media screen and (min-width: 1px) and (max-width:767px) { + .normal-Segment { width: 11%; max-width: 11%; min-width: 39px; @@ -220,11 +237,12 @@ ion-title{ margin-left: 15px; background: #414040 !important; display: flex; - - } + } - @media screen and (min-width: 768px) and (max-width:1024px){ - .normal-Segment{ +} + +@media screen and (min-width: 768px) and (max-width:1024px) { + .normal-Segment { width: 11%; max-width: 11%; min-width: 39px; @@ -238,12 +256,13 @@ ion-title{ // margin-left: 14px; background: #414040 !important; display: flex; - }} + } +} + - - @media screen and (min-width: 1px) and (max-width:767px){ - .imgSize{ +@media screen and (min-width: 1px) and (max-width:767px) { + .imgSize { position: absolute; /* right: 15px; */ top: 0; @@ -252,22 +271,28 @@ ion-title{ margin: auto; height: 18px; display: flex; - }} - @media screen and (min-width: 768px) and (max-width:1024px){ - .imgSize{position: absolute; + } +} + +@media screen and (min-width: 768px) and (max-width:1024px) { + .imgSize { + position: absolute; top: 0; bottom: 0; - left: 2px; + left: 2px; margin: auto; height: 28px; - display: flex;}} + display: flex; + } +} - .colum-container{ +.colum-container { padding: 15px; border-bottom: 1px solid #ccc; - } - .img{ +} + +.img { width: 100px; height: 100px; display: inline-flex; @@ -277,21 +302,24 @@ ion-title{ /* top: 34px; */ background: transparent; margin-left: -3px; - } - ///////////////////////// Team Members css //////////////////////@extend +} + +///////////////////////// Team Members css //////////////////////@extend .filters-row { margin-top: 10px; } -.search-dropdown{ - background: #269DB8; +.search-dropdown { + background: #BE332F; + ion-select { - .select-text{ + .select-text { margin-left: -10px; } - .select-icon{ - .select-icon-inner{ + + .select-icon { + .select-icon-inner { opacity: 1; color: white; margin-top: -1px; @@ -300,27 +328,31 @@ ion-title{ } } -.input-container{ +.input-container { background: white; - ion-input{ + + ion-input { border-bottom-color: transparent; } } -.search-container{ +.search-container { margin-top: 15px; - ion-col{ + + ion-col { background: white; border-radius: 12px; padding-right: 10px; flex: none; - ion-icon{ + + ion-icon { margin-right: 3px; font-size: 14px; margin-left: 3px; vertical-align: middle; } - span{ + + span { font-size: 12px; vertical-align: middle; } @@ -329,39 +361,42 @@ ion-title{ /////////////////////////////////////////////////////// Attendance /////////////////////// -.header{ +.header { // margin-top: 20px; margin-top: 1px; } -.slidPrev{ +.slidPrev { margin-left: 10px; background: transparent; } - -.slidNext{ + +.slidNext { background: transparent; margin-top: -1px; margin-left: 43px; } -.activeArrow{ + +.activeArrow { height: 20px; width: 20px; - color: #269DB8; + color: #BE332F; } -.disabledArrow{ + +.disabledArrow { height: 20px; width: 20px; color: gray; } -.activeArrow-ar{ +.activeArrow-ar { height: 20px; - width: 20px; - color: #269DB8; - margin-right: 275px; + width: 20px; + color: #BE332F; + margin-right: 275px; } -.disabledArrow-ar{ + +.disabledArrow-ar { height: 20px; width: 20px; color: gray; @@ -369,22 +404,23 @@ ion-title{ margin-right: -251px; } -@media screen and (min-width: 1px) and (max-width:767px){ -.result-graph { - position: relative; - background: white; - // margin-top: 20px; - padding-bottom: 5px; - border-radius: 20px; - z-index: 1; - margin-bottom: 10px; - margin-top: 56px; - border-radius: 20px; - border: 1px solid #ccc; - padding-top: 12px; -}} +@media screen and (min-width: 1px) and (max-width:767px) { + .result-graph { + position: relative; + background: white; + // margin-top: 20px; + padding-bottom: 5px; + border-radius: 20px; + z-index: 1; + margin-bottom: 10px; + margin-top: 56px; + border-radius: 20px; + border: 1px solid #ccc; + padding-top: 12px; + } +} -@media screen and (min-width: 768px) and (max-width:1024px){ +@media screen and (min-width: 768px) and (max-width:1024px) { .result-graph { position: relative; background: white; @@ -397,7 +433,9 @@ ion-title{ border-radius: 20px; border: 1px solid #ccc; padding-top: 114px !important; - }} + } +} + .result-graph-attendence { position: relative; background: white; @@ -418,7 +456,8 @@ ion-title{ margin-bottom: 10px; margin-left: 10px; } -.request-heading-ar{ + +.request-heading-ar { text-align: right; display: block; padding-top: 8px; @@ -435,12 +474,14 @@ ion-title{ display: block; text-align: center; transform: translate(-50%, -50%); + h2 { font-size: 38px; font-family: WorkSans-Bold; margin: 0 auto; line-height: 36px; } + span { width: 125px; display: block; @@ -448,57 +489,61 @@ ion-title{ font-size: 12px; font-family: workSans-Regular; } - } - @media screen and (min-width: 325px){ - .today-graph { - // width: 100%; - max-height: 4cm; - display: block; - height: 132px; - width: 264px; - margin-left: 154px; - }} - @media screen and (min-width: 1px) and (max-width:320px) { - .today-graph { - // width: 100%; - max-height: 4cm; - display: block; - height: 132px; - width: 264px; - margin-left: 84px; - }} +} - .today-graph-ar { +@media screen and (min-width: 325px) { + .today-graph { + // width: 100%; + max-height: 4cm; + display: block; + height: 132px; + width: 264px; + margin-left: 154px; + } +} + +@media screen and (min-width: 1px) and (max-width:320px) { + .today-graph { + // width: 100%; + max-height: 4cm; + display: block; + height: 132px; + width: 264px; + margin-left: 84px; + } +} + +.today-graph-ar { max-height: 4cm; display: block; height: 132px; width: 264px; margin-right: -74px; - } +} -.green-label{ +.green-label { font-size: 12px; margin-top: -13px; } - -.green-amount{ + +.green-amount { font-size: 17px; font-family: WorkSans-Bold; margin-top: -3px; } - -.blue-label{ + +.blue-label { font-size: 12px; margin-top: -13px; } - -.blue-amount{ + +.blue-amount { font-size: 17px; font-family: WorkSans-Bold; margin-top: -4px; } -.labelGrid{ +.labelGrid { background-color: white !important; border-radius: 20px !important; height: 88px !important; @@ -511,21 +556,22 @@ ion-title{ line-height: 11px !important; display: block; } + h2 { font-size: 25px; font-weight: bold; display: block; text-align: right; - margin:0; + margin: 0; position: absolute; bottom: 0; - left:0; + left: 0; width: 100%; padding: 10px; } } -.bodyGrid{ +.bodyGrid { margin-top: 7px !important; margin-left: 15px !important; margin-right: 15px !important; @@ -535,7 +581,7 @@ ion-title{ border: 1px solid #d6d4d4 !important; } -.attendance-information{ +.attendance-information { background: white; border-radius: 20px; padding: 9px; @@ -543,19 +589,20 @@ ion-title{ // border-right: 1px solid rgb(221, 221, 221); // @media screen and (min-width: 300px) and (max-width:359px) { - h2{ - padding: 0; - margin: 0; - font-size: 10px; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - } - span{ - font-size: 10px; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - } - + h2 { + padding: 0; + margin: 0; + font-size: 10px; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + } + + span { + font-size: 10px; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + } + // } - + // @media screen and (min-width: 360px) { // h2{ // padding: 0; @@ -568,53 +615,61 @@ ion-title{ // font-family: var(--fontFamilyPoppins-SemiBold, inherit); // margin-bottom: 3px; // } - + // } - } - @media screen and (min-width: 325px) { - .statsIcon{ - background: white; - margin-left: 12px; - margin-top: 6px; - }} - @media screen and (min-width: 1px) and (max-width:320px) { - .statsIcon{ - background: white; - margin-left: -15px; - margin-top: 6px; - }} - - @media screen and (min-width: 325px) { - .statsIcon-ar{ - background: white; -// margin-left: 12px; - margin-top: 6px; -}} +} + +@media screen and (min-width: 325px) { + .statsIcon { + background: white; + margin-left: 12px; + margin-top: 6px; + } +} + +@media screen and (min-width: 1px) and (max-width:320px) { + .statsIcon { + background: white; + margin-left: -15px; + margin-top: 6px; + } +} + +@media screen and (min-width: 325px) { + .statsIcon-ar { + background: white; + // margin-left: 12px; + margin-top: 6px; + } +} + @media screen and (min-width: 1px) and (max-width:320px) { -.statsIcon-ar{ - background: white; - margin-right: -2px; - margin-top: 6px; -}} -.month-year-span{ + .statsIcon-ar { + background: white; + margin-right: -2px; + margin-top: 6px; + } +} + +.month-year-span { font-size: 16px; // font-family: WorkSans-Bold; font-weight: bold; } -.green-label-container{ - // border-top: 5px solid #269DB8; +.green-label-container { + // border-top: 5px solid #BE332F; // padding: 1px 0px; // margin: 15px 0px width: 12px; height: 12px; padding-right: -10px; border-radius: 100%; - background-color: #269DB8; - + background-color: #BE332F; + } -.blue-label-container{ +.blue-label-container { // border-top: 5px solid #292F42; // padding: 1px 0px; // margin: 15px 0px @@ -625,7 +680,8 @@ ion-title{ background-color: #292F42; margin-top: 30px; } -.span-one{ + +.span-one { // display: block; // font-size: 12px; // color: black; @@ -635,9 +691,10 @@ ion-title{ margin-left: 6px; margin-top: -2px; font-weight: bold; - + } -.span-two{ + +.span-two { // display: block; // font-size: 22px; display: block; @@ -647,10 +704,10 @@ ion-title{ margin-top: -2px; font-weight: bold; font-family: WorkSans-Bold; - + } -.spa-one{ +.spa-one { // display: block; // font-size: 12px; // color: black; @@ -660,9 +717,10 @@ ion-title{ margin-left: 6px; margin-top: 28px; font-weight: bold; - + } -.spa-two{ + +.spa-two { // display: block; // font-size: 22px; display: block; @@ -672,91 +730,102 @@ ion-title{ margin-top: 28px; font-weight: bold; font-family: WorkSans-Bold; - + } -.graph-container{ + +.graph-container { margin-left: -50px; position: relative; margin-right: 50px; } -.graph-container-ar{ +.graph-container-ar { margin-right: -50px; position: relative; margin-left: 50px; } -.label-container{ + +.label-container { position: absolute; // width: 20%; // right: 30px; top: 50%; margin-top: -27px; left: 20px; - + } -@media screen and (min-width: 325px){ -.attendance-summary .attendance-information { - span{ - height: 32px; - display: block; - line-height: 14px; - } - h2{ - // text-align: right; - // font-family: WorkSans-Bold; - font-weight: bolder; - font-size: 13px; + +@media screen and (min-width: 325px) { + .attendance-summary .attendance-information { + span { + height: 32px; + display: block; + line-height: 14px; + } + + h2 { + // text-align: right; + // font-family: WorkSans-Bold; + font-weight: bolder; + font-size: 13px; + } + } - -}} +} + @media screen and (min-width: 1px) and (max-width:320px) { -.attendance-summary .attendance-information { - span{ - height: 32px; - display: block; - line-height: 7px; - font-size: 7px; - } - h2{ - // text-align: right; - // font-family: WorkSans-Bold; - font-weight: bolder; - font-size: 13px; + .attendance-summary .attendance-information { + span { + height: 32px; + display: block; + line-height: 7px; + font-size: 7px; + } + + h2 { + // text-align: right; + // font-family: WorkSans-Bold; + font-weight: bolder; + font-size: 13px; + } + } - -}} +} -.calendar-container{ +.calendar-container { background: white; margin-bottom: 100px; margin-top: 10px; border-radius: 20px; border: 1px solid #ccc; padding-bottom: 25px; - span{ + + span { text-align: left; display: block; padding-top: 8px; margin-bottom: 10px; margin-left: 10px; } - } - .calendar-container-ar{ +} + +.calendar-container-ar { background: white; margin-bottom: 100px; margin-top: 20px; border-radius: 20px; - span{ - text-align: right; - display: block; - padding-top: 8px; - margin-bottom: 6px; - margin-right: 12px; + + span { + text-align: right; + display: block; + padding-top: 8px; + margin-bottom: 6px; + margin-right: 12px; } - } +} - -.Boldtext{ + +.Boldtext { // font-size: 13px; // font-family: WorkSans-Bold; // color: black !important; @@ -770,60 +839,63 @@ ion-title{ line-height: 19px; } -.attendence{ - position: relative; +.attendence { + position: relative; background: white; border-radius: 20px; border: 1px solid #ccc; } -.attendence-text{ +.attendence-text { margin-bottom: 1px; margin-left: 10px; // font-family: WorkSans-Bold; font-size: 16px; font-family: var(--fontFamilyPoppins-SemiBold, inherit); } -.stats{ - color: #289DB8; font-size: 9px; - margin-right: 5px; - font-family: 'WorkSans-Bold'; + +.stats { + color: #289DB8; + font-size: 9px; + margin-right: 5px; + font-family: 'WorkSans-Bold'; } -.stats-ar{ - color: #289DB8; font-size: 9px; - margin-left: 5px; - font-family: 'WorkSans-Bold'; +.stats-ar { + color: #289DB8; + font-size: 9px; + margin-left: 5px; + font-family: 'WorkSans-Bold'; } -.text{ +.text { font-size: 16px; font-weight: bolder; font-family: 'WorkSans-Bold'; margin-top: 27px; } -.number{ +.number { width: 22px; height: 20px; border-radius: 100%; - background-color: #269DB8; + background-color: #BE332F; z-index: 9; margin-top: 25px; padding-left: 4px; } -.number-ar{ +.number-ar { width: 22px; height: 20px; border-radius: 100%; - background-color: #269DB8; + background-color: #BE332F; z-index: 9; margin-top: 25px; padding-right: 4px; } -.numberEmp{ +.numberEmp { color: white; font-size: 12px; font-weight: bolder; @@ -831,35 +903,39 @@ ion-title{ padding-top: 2px; } -.slider-container{ +.slider-container { padding-bottom: 20px; } .filters-row { margin-top: 10px; margin-left: 20px; - } +} + +.disable-filter { + pointer-events: none; + opacity: .3; +} - .disable-filter { - pointer-events: none; - opacity: .3; - } -.favIcon{ - height: 18px; margin-left: 23px; +.favIcon { + height: 18px; + margin-left: 23px; } -.favIcon-ar{ - height: 18px; margin-right: 23px; +.favIcon-ar { + height: 18px; + margin-right: 23px; } -.call{ +.call { margin-right: 16px; } - -.call-ar{ + +.call-ar { margin-left: 16px; } -.name{ + +.name { text-align: center; letter-spacing: -0.84px; color: #2B353E; @@ -868,7 +944,8 @@ ion-title{ line-height: 21px; font-size: 21px; } -.email{ + +.email { text-align: center; font-family: var(--fontFamilyPoppins-SemiBold, inherit); font-size: 13px; @@ -878,27 +955,30 @@ ion-title{ opacity: 1; padding-top: 3px; } -.subTitle{ + +.subTitle { text-align: center; letter-spacing: -0.52px; color: #A2A2A2; opacity: 1; font-family: var(--fontFamilyPoppins-SemiBold, inherit); font-size: 13px; - line-height: 0px; + line-height: 0px; } -.profile{ - text-align: left; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 20px; - font-size: 20px; - letter-spacing: -0.8px; - color: #2B353E; - opacity: 1; - margin-top: 20px; - margin-bottom: 2px; -} -.label1{ + +.profile { + text-align: left; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 20px; + font-size: 20px; + letter-spacing: -0.8px; + color: #2B353E; + opacity: 1; + margin-top: 20px; + margin-bottom: 2px; +} + +.label1 { text-align: left; font-family: var(--fontFamilyPoppins-SemiBold, inherit); line-height: 0px; @@ -908,7 +988,7 @@ ion-title{ opacity: 1; } -.label2{ +.label2 { text-align: left; font-family: var(--fontFamilyPoppins-SemiBold, inherit); line-height: 5px; @@ -918,56 +998,62 @@ ion-title{ opacity: 1; } -.profile-ar{ +.profile-ar { text-align: right; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 20px; - font-size: 20px; - letter-spacing: -0.8px; - color: #2B353E; - opacity: 1; - margin-top: 20px; - margin-bottom: 2px; -} -.label1-ar{ -text-align: right; -font-family: var(--fontFamilyPoppins-SemiBold, inherit); -line-height: 0px; -font-size: 13px; -letter-spacing: -0.52px; -color: #A2A2A2; -opacity: 1; -} - -.label2-ar{ -text-align: right; -font-family: var(--fontFamilyPoppins-SemiBold, inherit); -line-height: 5px; -font-size: 16px; -letter-spacing: -0.64px; -color: #2B353E; -opacity: 1; -} -@media screen and (min-width: 768px) and (max-width:1024px){ -.div{ - position: relative; - display: flex; - margin-left: 48px; - -}} -@media screen and (min-width: 1px) and (max-width:767px){ -.div{ - position: relative; - display: flex; - margin-left: -1px; -}} + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 20px; + font-size: 20px; + letter-spacing: -0.8px; + color: #2B353E; + opacity: 1; + margin-top: 20px; + margin-bottom: 2px; +} + +.label1-ar { + text-align: right; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 0px; + font-size: 13px; + letter-spacing: -0.52px; + color: #A2A2A2; + opacity: 1; +} + +.label2-ar { + text-align: right; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 5px; + font-size: 16px; + letter-spacing: -0.64px; + color: #2B353E; + opacity: 1; +} + +@media screen and (min-width: 768px) and (max-width:1024px) { + .div { + position: relative; + display: flex; + margin-left: 48px; + + } +} -.MyTeamdiv{ +@media screen and (min-width: 1px) and (max-width:767px) { + .div { + position: relative; + display: flex; + margin-left: -1px; + } +} + +.MyTeamdiv { position: relative; display: flex; margin-bottom: -12px; } -.numberEmp{ + +.numberEmp { color: white; font-size: 12px; font-weight: bolder; @@ -977,7 +1063,7 @@ opacity: 1; width: 23px; height: 23px; border-radius: 100%; - background-color: #269DB8; + background-color: #BE332F; z-index: 9; margin-top: 25px; /* padding-left: 4px; */ @@ -985,7 +1071,7 @@ opacity: 1; padding-top: 3px; } -.numberEmp-ar{ +.numberEmp-ar { color: white; font-size: 12px; font-weight: bolder; @@ -995,7 +1081,7 @@ opacity: 1; width: 23px; height: 23px; border-radius: 100%; - background-color: #269DB8; + background-color: #BE332F; z-index: 9; margin-top: 25px; /* padding-left: 4px; */ @@ -1003,7 +1089,7 @@ opacity: 1; padding-top: 3px; } -.MyTeamtext{ +.MyTeamtext { text-align: left; font-family: var(--fontFamilyPoppins-SemiBold, inherit); line-height: 11px; @@ -1015,23 +1101,20 @@ opacity: 1; margin-bottom: 28px; } - .btnTitle{ +.btnTitle { text-align: center; font-family: var(--fontFamilyPoppins-SemiBold, inherit); line-height: 10px; - font-size: 11px; + font-size: 11px; color: #4D4D4D; margin-top: -13px; - } -.btnDiv{ +} + +.btnDiv { position: relative; display: flex; justify-content: space-between; margin-bottom: -15px; margin-top: -12px; -} - - - - \ No newline at end of file +} \ No newline at end of file diff --git a/Mohem/src/app/my-team/details/details.component.ts b/Mohem/src/app/my-team/details/details.component.ts index 98955dfd..1ce8c501 100644 --- a/Mohem/src/app/my-team/details/details.component.ts +++ b/Mohem/src/app/my-team/details/details.component.ts @@ -449,7 +449,7 @@ export class DetailsComponent implements OnInit { data: [this.absentDays, this.attendedDays], backgroundColor: [ 'black', - '#269DB8' + '#BE332F' ], borderWidth: 1, // cutoutPrecentage:20 , @@ -793,7 +793,7 @@ export class DetailsComponent implements OnInit { selEmp.EMPLOYEE_DISPLAY_NAME = selEmp.EMPLOYEE_DISPLAY_NAME ? selEmp.EMPLOYEE_DISPLAY_NAME : selEmp.NAME; selEmp.EMPLOYEE_IMAGE = selEmp.EMPLOYEE_IMAGE ? selEmp.EMPLOYEE_IMAGE : ''; selEmp.EMAIL_ADDRESS = selEmp.EMAIL_ADDRESS ? selEmp.EMAIL_ADDRESS : ''; - if(!this.isFavorite) { + if (!this.isFavorite) { let confirmBoxhtml = `

Do you want to add ` + selEmp.EMPLOYEE_DISPLAY_NAME + ` in your favorite list


@@ -817,31 +817,31 @@ export class DetailsComponent implements OnInit { confirmBoxhtml , () => { const request = - [ - { - "USER_NAME": this.employee.EMPLOYEE_NUMBER, - "EMPLOYEE_DISPLAY_NAME": this.employee.EMPLOYEE_DISPLAY_NAME, - "EMAIL_ADDRESS": this.employee.EMAIL_ADDRESS, - "EMPLOYEE_IMAGE": this.employee.EMPLOYEE_IMAGE, - "IsFavorite": true - } - ]; + [ + { + "USER_NAME": this.employee.EMPLOYEE_NUMBER, + "EMPLOYEE_DISPLAY_NAME": this.employee.EMPLOYEE_DISPLAY_NAME, + "EMAIL_ADDRESS": this.employee.EMAIL_ADDRESS, + "EMPLOYEE_IMAGE": this.employee.EMPLOYEE_IMAGE, + "IsFavorite": true + } + ]; this.saveUserFavruiteList(request); }, - () => {}); + () => { }); } } else { const request = - [ - { - "USER_NAME": this.employee.EMPLOYEE_NUMBER, - "EMPLOYEE_DISPLAY_NAME": this.employee.EMPLOYEE_DISPLAY_NAME, - "EMAIL_ADDRESS": this.employee.EMAIL_ADDRESS, - "EMPLOYEE_IMAGE": this.employee.EMPLOYEE_IMAGE, - "IsFavorite": false - } - ]; + [ + { + "USER_NAME": this.employee.EMPLOYEE_NUMBER, + "EMPLOYEE_DISPLAY_NAME": this.employee.EMPLOYEE_DISPLAY_NAME, + "EMAIL_ADDRESS": this.employee.EMAIL_ADDRESS, + "EMPLOYEE_IMAGE": this.employee.EMPLOYEE_IMAGE, + "IsFavorite": false + } + ]; this.saveUserFavruiteList(request); } } diff --git a/Mohem/src/app/my-team/home/home.component.scss b/Mohem/src/app/my-team/home/home.component.scss index 04d07eca..95ed4c36 100644 --- a/Mohem/src/app/my-team/home/home.component.scss +++ b/Mohem/src/app/my-team/home/home.component.scss @@ -1,4 +1,4 @@ -ion-title{ +ion-title { color: white; position: absolute; top: 0; @@ -11,31 +11,34 @@ ion-title{ } @media only screen and (max-width: 360px) { - .contentBg{ + .contentBg { padding: 0px 15px !important; } } -.contentBg{ +.contentBg { padding: 0px 20px; } .contentBg:before { position: absolute; - content: ""; - background: #269DB8; - height: 140px; - width: 100%; - left: 0; - top: 0px; - z-index: 1; + content: ""; + background: #BE332F; + height: 140px; + width: 100%; + left: 0; + top: 0px; + z-index: 1; } + ion-content { --ion-background-color: whitesmoke; } + .request-heading { padding-left: 15px; margin-top: 10px; + span { // display: block; // padding-top: 8px; @@ -53,7 +56,7 @@ ion-content { } } -.search-label{ +.search-label { // border: 1px solid #ccc; // margin-left: 15px; // margin-right: 15px; @@ -80,8 +83,9 @@ ion-content { border-radius: 20px; z-index: 1; border: 1px solid #ccc; - } - .result-text-container { +} + +.result-text-container { padding: 0; margin: 0; position: absolute; @@ -90,12 +94,14 @@ ion-content { display: block; text-align: center; transform: translate(-50%, -50%); + h2 { font-size: 38px; font-family: WorkSans-Bold; margin: 0 auto; line-height: 36px; } + span { width: 125px; display: block; @@ -103,35 +109,42 @@ ion-content { font-size: 12px; font-family: workSans-Regular; } - } - .today-graph { +} + +.today-graph { width: 100%; max-height: 4cm; - } +} .swiper-container { margin: 0 !important; width: 100% !important; } + .filters-row { margin-top: 10px; } + .search-input { margin-top: 15px; background: white; border-radius: 15px; + ion-input { border-bottom-color: transparent; } } -.search-dropdown{ - background: #269DB8; + +.search-dropdown { + background: #BE332F; + ion-select { - .select-text{ + .select-text { margin-left: -10px; } - .select-icon{ - .select-icon-inner{ + + .select-icon { + .select-icon-inner { opacity: 1; color: white; margin-top: -1px; @@ -139,36 +152,41 @@ ion-content { } } } -.input-container{ + +.input-container { background: white; - ion-input{ + + ion-input { border-bottom-color: transparent; } } -.user-image-container{ +.user-image-container { position: relative; width: 80px; height: 80px; display: block; margin: 0 auto; - &:before{ - position: absolute; - content: ""; - width: 20px; - height: 20px; - border-radius: 20px; - border: 1px solid white; - top: 0; - right: 0; - background-color: red; - z-index: 9; - } - &.present:before{ - background-color: green !important; - } + + &:before { + position: absolute; + content: ""; + width: 20px; + height: 20px; + border-radius: 20px; + border: 1px solid white; + top: 0; + right: 0; + background-color: red; + z-index: 9; + } + + &.present:before { + background-color: green !important; + } } -.user-image{ + +.user-image { overflow: hidden; position: relative; display: block; @@ -179,7 +197,7 @@ ion-content { margin: 0px auto 6px; } -.search-container{ +.search-container { // margin-top: 15px; // margin-top: -35px; // margin-left: 262px; @@ -189,18 +207,21 @@ ion-content { top: 45px; right: 38px; z-index: 999999; - ion-col{ + + ion-col { // background: white; // border-radius: 12px; // padding-right: 10px; flex: none; - ion-icon{ + + ion-icon { margin-right: 3px; font-size: 14px; margin-left: 3px; vertical-align: middle; } - span{ + + span { font-size: 12px; vertical-align: middle; } @@ -215,19 +236,19 @@ ion-content { // } @media only screen and (max-width: 375px) { - .text-label{ + .text-label { margin-left: 6px !important; - } + } } @media only screen and (max-width: 320px) { - .text-label{ + .text-label { margin-left: 2px !important; - } + } } -.text-label{ +.text-label { // --color: black !important; // font-size: 13px; // margin-left: 15px; @@ -242,9 +263,9 @@ ion-content { opacity: 1; margin-left: 15px; margin-right: 18px; -} +} -.radio-list{ +.radio-list { background: white; // margin-left: 18px; /* margin-right: 10px; */ @@ -256,18 +277,20 @@ ion-content { // color: red; // } - .radio-icon{ - -.custom-radio .radio-icon { - margin: 0px; - border-radius: 50%; - border-width: var(--border-width); - border-style: var(--border-style); - border-color: #dcdcdc; - margin-top: 6px !important; - border-color: #d8d4d4 !important;} +.radio-icon { + + .custom-radio .radio-icon { + margin: 0px; + border-radius: 50%; + border-width: var(--border-width); + border-style: var(--border-style); + border-color: #dcdcdc; + margin-top: 6px !important; + border-color: #d8d4d4 !important; + } } -.text{ + +.text { // font-size: 16px; // font-weight: bolder; // font-family: 'WorkSans-Bold'; @@ -289,7 +312,7 @@ ion-content { // height: 21px; // padding-right: -10px; // border-radius: 100%; -// background-color: #269DB8; +// background-color: #BE332F; // z-index: 9; // margin-top: 26px; // } @@ -301,25 +324,27 @@ ion-content { // margin-left: 3px; // padding-top: 2px; // } -.number{ +.number { width: 22px; height: 20px; border-radius: 100%; - background-color: #269DB8; + background-color: #BE332F; z-index: 9; margin-top: 25px; padding-left: 4px; } -.number-ar{ + +.number-ar { width: 22px; height: 20px; border-radius: 100%; - background-color: #269DB8; + background-color: #BE332F; z-index: 9; margin-top: 25px; padding-right: 4px; } -.numberEmp{ + +.numberEmp { color: white; font-size: 12px; font-weight: bolder; @@ -329,14 +354,15 @@ ion-content { width: 23px; height: 23px; border-radius: 100%; - background-color: #269DB8; + background-color: #BE332F; z-index: 9; margin-top: 25px; /* padding-left: 4px; */ text-align: center; padding-top: 3px; } -.numberEmp-ar{ + +.numberEmp-ar { color: white; font-size: 12px; font-weight: bolder; @@ -346,16 +372,17 @@ ion-content { width: 23px; height: 23px; border-radius: 100%; - background-color: #269DB8; + background-color: #BE332F; z-index: 9; margin-top: 25px; /* padding-left: 4px; */ text-align: center; padding-top: 3px; } -.div{ + +.div { position: relative; display: flex; // justify-content: space-between; margin-bottom: -12px; -} +} \ No newline at end of file diff --git a/Mohem/src/app/my-team/home/home.component.ts b/Mohem/src/app/my-team/home/home.component.ts index 6e5f23da..dd0b46f2 100644 --- a/Mohem/src/app/my-team/home/home.component.ts +++ b/Mohem/src/app/my-team/home/home.component.ts @@ -32,7 +32,7 @@ export class HomeComponent implements OnInit { myColor: string = 'secondary'; public EmpTotal = []; public EmployeeTotal: any; - public direction:any; + public direction: any; public options = { cutoutPercentage: 80, @@ -41,13 +41,13 @@ export class HomeComponent implements OnInit { }; public data = { datasets: [ - { - data: [100], - backgroundColor: [ - '#269DB8' - ], - borderWidth: 5 - }] + { + data: [100], + backgroundColor: [ + '#BE332F' + ], + borderWidth: 5 + }] }; // public filters = [ // { @@ -104,15 +104,15 @@ export class HomeComponent implements OnInit { } ngOnInit() { - this.common.sharedService.setSharedData( [], DetailsComponent.opendEmployeesARR); + this.common.sharedService.setSharedData([], DetailsComponent.opendEmployeesARR); this.setIntitial(); - + // this.getSuborinatesAttStatus(); } toggleColor() { this.myColor = 'secondary'; - // this.myColor = '#269DB8' -} + // this.myColor = '#BE332F' + } // activeFilter(index: number) { // this.previousActiveIndex = this.currentActiveIndex; @@ -144,23 +144,23 @@ export class HomeComponent implements OnInit { this.empSubordinate = this.arrList; this.isSearch = false; } - if(this.searchKeySelect === 'Name'){ + if (this.searchKeySelect === 'Name') { this.empSubordinate = this.arrList.filter((item) => { this.isSearch = true; return (item.EMPLOYEE_NAME.toLowerCase().indexOf(val.toLowerCase()) > -1); }); - } else if(this.searchKeySelect === 'User Name'){ + } else if (this.searchKeySelect === 'User Name') { this.empSubordinate = this.arrList.filter((item) => { this.isSearch = true; return (item.EMPLOYEE_NUMBER.toLowerCase().indexOf(val.toLowerCase()) > -1); }); - } else if(this.searchKeySelect === 'Email'){ + } else if (this.searchKeySelect === 'Email') { this.empSubordinate = this.arrList.filter((item) => { this.isSearch = true; return (item.EMPLOYEE_EMAIL_ADDRESS.toLowerCase().indexOf(val.toLowerCase()) > -1); }); } - + } getEmpSubordinate() { @@ -186,57 +186,57 @@ export class HomeComponent implements OnInit { }; this.getEmployeeSubordinatesRequestObject = body; this.myTeamService.getEmployeeSubordinates(body).subscribe((result: any) => { - if (this.common.validResponse(result)) { - if (!this.pageFirstVisit) { - this.pageFirstVisit = true; - this.totalEmployees = result.P_NUM_OF_SUBORDINATES; - } - this.handleEmpResult(result.GetEmployeeSubordinatesList); + if (this.common.validResponse(result)) { + if (!this.pageFirstVisit) { + this.pageFirstVisit = true; + this.totalEmployees = result.P_NUM_OF_SUBORDINATES; } + this.handleEmpResult(result.GetEmployeeSubordinatesList); + } }); } handleEmpResult(result) { - this.EmployeeTotal = result.length; - const lastItemIndex = result.length - 1; - const lastItem = result[lastItemIndex]; - if (lastItem) { - if (lastItem.NO_OF_ROWS === lastItem.ROW_NUM) { - this.isReachEnd = true; - if (this.infiniteScroll) { - this.infiniteScroll.complete(); - } - } else { - this.isReachEnd = false; - if (this.infiniteScroll) { - this.infiniteScroll.complete(); - } + this.EmployeeTotal = result.length; + const lastItemIndex = result.length - 1; + const lastItem = result[lastItemIndex]; + if (lastItem) { + if (lastItem.NO_OF_ROWS === lastItem.ROW_NUM) { + this.isReachEnd = true; + if (this.infiniteScroll) { + this.infiniteScroll.complete(); } - } - if (this.common.hasData(result)) { - this.getEmployeeSubordinatesRequestObject.P_PAGE_NUM++; - if (this.empSubordinate.length === 0) { - this.empSubordinate = result; - } else { - this.empSubordinate = this.empSubordinate.concat(result); + } else { + this.isReachEnd = false; + if (this.infiniteScroll) { + this.infiniteScroll.complete(); } + } + } + if (this.common.hasData(result)) { + this.getEmployeeSubordinatesRequestObject.P_PAGE_NUM++; + if (this.empSubordinate.length === 0) { + this.empSubordinate = result; } else { - this.empSubordinate = []; + this.empSubordinate = this.empSubordinate.concat(result); } - this.arrList = this.empSubordinate; + } else { + this.empSubordinate = []; + } + this.arrList = this.empSubordinate; } doInfinite(infiniteScroll) { if (!this.isReachEnd) { this.myTeamService.getEmployeeSubordinates(this.getEmployeeSubordinatesRequestObject).subscribe((result: any) => { - if (this.common.validResponse(result)) { - this.handleEmpResult(result.GetEmployeeSubordinatesList); - } - this.infiniteScroll.complete(); - }); + if (this.common.validResponse(result)) { + this.handleEmpResult(result.GetEmployeeSubordinatesList); + } + this.infiniteScroll.complete(); + }); } else { if (this.infiniteScroll) { - this.infiniteScroll.complete(); + this.infiniteScroll.complete(); } } } @@ -283,7 +283,7 @@ export class HomeComponent implements OnInit { } } - + // getSuborinatesAttStatus(){ // const request = { @@ -295,7 +295,7 @@ export class HomeComponent implements OnInit { // this.myTeamService.getSuborinatesAttStatus(request, ()=> {} , this.ts.trPK('general', 'retry')).subscribe((result)=> // { // this.handleRespondSuborinatesAttStatusResult(result); - + // }) // } diff --git a/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.scss b/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.scss index 6a147428..73ac05d4 100644 --- a/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.scss +++ b/Mohem/src/app/my-team/subordinate-leave/subordinate-leave.component.scss @@ -1,16 +1,16 @@ -.confirmEitOkButton{ +.confirmEitOkButton { white-space: normal !important; text-transform: capitalize !important; min-height: 45px !important; min-width: 5px !important; margin: 8px !important; - --background: #269DB8; + --background: #BE332F; width: 80% !important; - color: white!important; + color: white !important; border-radius: 16px !important; - } +} - .team-member-container{ +.team-member-container { // background: white; // border-radius: 100px 20px 20px 100px; // margin-top: 15px; @@ -50,7 +50,7 @@ // background-color: green !important; // } // } -.user-image{ +.user-image { // overflow: hidden; // position: relative; // display: block; @@ -70,10 +70,11 @@ } } -.employee-name{ +.employee-name { display: inline-block; width: 80%; - .name{ + + .name { // font-size: 16px; // color: black; // // margin: 0; @@ -84,51 +85,52 @@ // margin-left: -10px; // margin-top: -5px; // font-family: 'WorkSans-Bold'; - font-size: 16px; - text-overflow: ellipsis; - white-space: nowrap; - overflow: hidden; - margin-left: -10px; - margin-top: -5px; - text-align: left; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 25px; - letter-spacing: -0.64px; - color: #2B353E; - opacity: 1; + font-size: 16px; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + margin-left: -10px; + margin-top: -5px; + text-align: left; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 25px; + letter-spacing: -0.64px; + color: #2B353E; + opacity: 1; } - - .title{ - // font-size: 13px; - // color: #888; - // width: 100%; - // text-overflow: ellipsis; - // white-space: nowrap; - // overflow: hidden; - // display: block; - // margin-left: -10px; - // margin-top: -6px; - // color: black; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 12px; - letter-spacing: -0.56px; - color: #575757; - opacity: 1; - font-size: 14px; - width: 100%; - text-overflow: ellipsis; - white-space: nowrap; - overflow: hidden; - display: block; - margin-left: -10px; - margin-top: -10px; + + .title { + // font-size: 13px; + // color: #888; + // width: 100%; + // text-overflow: ellipsis; + // white-space: nowrap; + // overflow: hidden; + // display: block; + // margin-left: -10px; + // margin-top: -6px; + // color: black; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 12px; + letter-spacing: -0.56px; + color: #575757; + opacity: 1; + font-size: 14px; + width: 100%; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + display: block; + margin-left: -10px; + margin-top: -10px; } } -.employee-name-ar{ +.employee-name-ar { display: inline-block; width: 80%; - .name{ + + .name { // font-size: 16px; // color: black; // // margin: 0; @@ -139,61 +141,64 @@ // margin-left: -10px; // margin-top: -5px; // font-family: 'WorkSans-Bold'; - font-size: 16px; - text-overflow: ellipsis; - white-space: nowrap; - overflow: hidden; - margin-left: -10px; - margin-top: -5px; - text-align: right; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 25px; - letter-spacing: -0.64px; - color: #2B353E; - opacity: 1; + font-size: 16px; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + margin-left: -10px; + margin-top: -5px; + text-align: right; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 25px; + letter-spacing: -0.64px; + color: #2B353E; + opacity: 1; } - - .title{ - // font-size: 13px; - // color: #888; - // width: 100%; - // text-overflow: ellipsis; - // white-space: nowrap; - // overflow: hidden; - // display: block; - // margin-left: -10px; - // margin-top: -6px; - // color: black; - font-family: var(--fontFamilyPoppins-SemiBold, inherit); - line-height: 12px; - letter-spacing: -0.56px; - color: #575757; - opacity: 1; - font-size: 14px; - width: 100%; - text-overflow: ellipsis; - white-space: nowrap; - overflow: hidden; - display: block; - margin-left: -10px; - margin-top: -10px; + + .title { + // font-size: 13px; + // color: #888; + // width: 100%; + // text-overflow: ellipsis; + // white-space: nowrap; + // overflow: hidden; + // display: block; + // margin-left: -10px; + // margin-top: -6px; + // color: black; + font-family: var(--fontFamilyPoppins-SemiBold, inherit); + line-height: 12px; + letter-spacing: -0.56px; + color: #575757; + opacity: 1; + font-size: 14px; + width: 100%; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + display: block; + margin-left: -10px; + margin-top: -10px; } } -.image-container{ + +.image-container { width: 20%; display: inline-block; text-align: center; vertical-align: top; margin-top: 5px; } -.swipe-information{ + +.swipe-information { color: #888; font-size: 12px; border-top: 1px solid #ccc; padding-top: 6px; margin-top: 6px; + .check-in { font-size: 12px; - margin-right: 15px; + margin-right: 15px; } } \ No newline at end of file diff --git a/Mohem/src/app/notification/home/home.component.scss b/Mohem/src/app/notification/home/home.component.scss index cb8fedff..3949a361 100644 --- a/Mohem/src/app/notification/home/home.component.scss +++ b/Mohem/src/app/notification/home/home.component.scss @@ -270,7 +270,7 @@ ion-title { .contentBg:before { position: absolute; content: ""; - background: #269DB8; + background: #BE332F; height: 140px; width: 100%; left: 0; @@ -423,7 +423,7 @@ ion-content { border-radius: 50%; width: 15px; height: 15px; - background-color: #269db8; + background-color: #BE332F; top: 1px; } @@ -498,7 +498,7 @@ ion-content { .text-span-active { font-size: 12px; color: white; - background-color: #269DB8; + background-color: #BE332F; width: auto; height: 40px; border: 1px solid; diff --git a/Mohem/src/app/notification/work-list-action-history/work-list-action-history.component.scss b/Mohem/src/app/notification/work-list-action-history/work-list-action-history.component.scss index f9e3e21b..00563180 100644 --- a/Mohem/src/app/notification/work-list-action-history/work-list-action-history.component.scss +++ b/Mohem/src/app/notification/work-list-action-history/work-list-action-history.component.scss @@ -3,39 +3,46 @@ ion-card-content.card-content.card-content-ios { padding: 0px; margin: 0px; } + .col { //border: #dedede solid 1px; padding: 2px !important; text-align: center; font-size: 15px; } + .item-md.item-block .item-inner, .item-ios.item-block .item-inner { padding: 0px !important; } + .itemAH { - padding: 0px !important - ; + padding: 0px !important; font-size: 13px; } + .gridAH { text-align: center; padding: 5px 5px !important; border-radius: 5px; } + .rowAH { white-space: normal; + .col { border: 1px solid #d9d9d9; } } + .Header { font-weight: bold; // font-family: "WorkSans-SemiBold" !important; - color: #1a586d; + color: #c6903e; // padding: 0px !important; // margin: 0px !important; } + .titleH { //background-color:$custgreen; //height: 40px; @@ -45,18 +52,24 @@ ion-card-content.card-content.card-content-ios { border-top-right-radius: 5px; border-top-left-radius: 5px; border-bottom: 0px; + .col { border: 0px; } } + ion-label.label.label-md, ion-label.label.label-ios { margin: 0px; } -.rowAH .col{ + +.rowAH .col { border: 1px solid #d9d9d9; padding: 2px !important; text-align: center; font-size: 15px; } -.ion-card-content{padding:0;} \ No newline at end of file + +.ion-card-content { + padding: 0; +} \ No newline at end of file diff --git a/Mohem/src/app/notification/work-list-attach-view/work-list-attach-view.component.scss b/Mohem/src/app/notification/work-list-attach-view/work-list-attach-view.component.scss index 1e941e1b..4560ae98 100644 --- a/Mohem/src/app/notification/work-list-attach-view/work-list-attach-view.component.scss +++ b/Mohem/src/app/notification/work-list-attach-view/work-list-attach-view.component.scss @@ -1,3 +1,3 @@ -.header-toolbar-new{ - --background: #269DB8; - } \ No newline at end of file +.header-toolbar-new { + --background: #BE332F; +} \ No newline at end of file diff --git a/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.html b/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.html index e9146fe8..2cd2679e 100644 --- a/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.html +++ b/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.html @@ -154,7 +154,7 @@ diff --git a/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.scss b/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.scss index 2414b427..d23b5b14 100644 --- a/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.scss +++ b/Mohem/src/app/notification/work-list-replacement-itg/work-list-replacement-itg.component.scss @@ -9,7 +9,7 @@ } ion-radio { - --color-checked: #269db8; + --color-checked: #BE332F; } .center { @@ -247,7 +247,7 @@ button.item-button.button.button-md.button-clear.button-clear-md { } ion-radio { - --color-checked: #269db8; + --color-checked: #BE332F; } .center { @@ -313,7 +313,7 @@ ion-radio { } .isFavLetterActive { - color: #269db8; + color: #BE332F; display: block; width: 60%; float: right; @@ -328,7 +328,7 @@ ion-radio { .searchText { background: transparent; - color: #269db8; + color: #BE332F; font-weight: bold; text-decoration: underline; } diff --git a/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.html b/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.html index 65f597a8..6a467ad7 100644 --- a/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.html +++ b/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.html @@ -73,7 +73,7 @@ diff --git a/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.scss b/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.scss index 928c383a..14fe5335 100644 --- a/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.scss +++ b/Mohem/src/app/notification/work-list-replacement-roll/work-list-replacement-roll.component.scss @@ -160,7 +160,7 @@ button.item-button.button.button-md.button-clear.button-clear-md { } ion-radio { - --color-checked: #269db8; + --color-checked: #BE332F; } .center { @@ -228,10 +228,10 @@ ion-radio { } .isFavLetterActive { - // background: #269db8; + // background: #BE332F; // width: 55px; // border-radius: 60px; - color: #269db8; + color: #BE332F; display: block; width: 60%; float: right; @@ -253,7 +253,7 @@ ion-radio { .searchText { background: transparent; - color: #269db8; + color: #BE332F; font-weight: bold; text-decoration: underline; } diff --git a/Mohem/src/app/notification/worklist-main-ic/worklist-main-ic.component.scss b/Mohem/src/app/notification/worklist-main-ic/worklist-main-ic.component.scss index cf5e4beb..8b51a695 100644 --- a/Mohem/src/app/notification/worklist-main-ic/worklist-main-ic.component.scss +++ b/Mohem/src/app/notification/worklist-main-ic/worklist-main-ic.component.scss @@ -1,50 +1,56 @@ - .no-padding-label { - padding: 0px !important; + padding: 0px !important; } .margin-left { - margin-left: 0px; + margin-left: 0px; } .active-Segment { - font-size: 0.3cm !important; - background: #269DB8 !important; - text-transform: none; - --color-checked: none; - border-radius: 100px; - border:0; - } - .active-Segment ion-label{ - font-size: 11px; - color: white !important; - } - .normal-Segment ion-label{ - color: black !important; - font-size: 11px; - } - .normal-Segment { - font-size: 0.3cm !important; - text-transform: none; - --color-checked: none; - border: 0; - } - .action-btn { - white-space: nowrap; - font-size: 10px; - } - .name{ - color:black !important ;font-weight: bold; - } - .timeline-item{ - margin: 0; - white-space: nowrap; - font-size: 10px; - } - .req_info{ - width: 20px; - height: 20px; - display: inline-block; - margin:15px 10px 0px 0px; - } - \ No newline at end of file + font-size: 0.3cm !important; + background: #BE332F !important; + text-transform: none; + --color-checked: none; + border-radius: 100px; + border: 0; +} + +.active-Segment ion-label { + font-size: 11px; + color: white !important; +} + +.normal-Segment ion-label { + color: black !important; + font-size: 11px; +} + +.normal-Segment { + font-size: 0.3cm !important; + text-transform: none; + --color-checked: none; + border: 0; +} + +.action-btn { + white-space: nowrap; + font-size: 10px; +} + +.name { + color: black !important; + font-weight: bold; +} + +.timeline-item { + margin: 0; + white-space: nowrap; + font-size: 10px; +} + +.req_info { + width: 20px; + height: 20px; + display: inline-block; + margin: 15px 10px 0px 0px; +} \ No newline at end of file diff --git a/Mohem/src/app/notification/worklist-main-mr/worklist-main-mr.component.scss b/Mohem/src/app/notification/worklist-main-mr/worklist-main-mr.component.scss index 424d9366..aede8baa 100644 --- a/Mohem/src/app/notification/worklist-main-mr/worklist-main-mr.component.scss +++ b/Mohem/src/app/notification/worklist-main-mr/worklist-main-mr.component.scss @@ -1,27 +1,31 @@ .no-padding-label { - padding: 0px !important; + padding: 0px !important; } .margin-left { - margin-left: 0px; + margin-left: 0px; } + @media only screen and (max-width: 320px) { .active-Segment { font-size: 0.3cm !important; - background: #269DB8 !important; + background: #BE332F !important; text-transform: none; --color-checked: none; border-radius: 100px; - border:0; + border: 0; } - .active-Segment ion-label{ + + .active-Segment ion-label { font-size: 8px !important; color: white !important; } - .normal-Segment ion-label{ + + .normal-Segment ion-label { color: black; font-size: 8px !important; } + .normal-Segment { font-size: 0.3cm; text-transform: none; @@ -29,44 +33,52 @@ border: 0; } } + .active-Segment { - font-size: 0.3cm !important; - background: #269DB8 !important; - text-transform: none; - --color-checked: none; - border-radius: 100px; - border:0; - } - .active-Segment ion-label{ - font-size: 11px; - color: white !important; - } - .normal-Segment ion-label{ - color: black !important; - font-size: 11px; - } - .normal-Segment { - font-size: 0.3cm !important; - text-transform: none; - --color-checked: none; - border: 0; - } + font-size: 0.3cm !important; + background: #BE332F !important; + text-transform: none; + --color-checked: none; + border-radius: 100px; + border: 0; +} - .action-btn { - white-space: nowrap; - font-size: 10px; - } - .req_info{ - width: 20px; - height: 20px; - display: inline-block; - margin: 15px 10px 0px 0px; - } - .name{ - color:black !important ;font-weight: bold; - } - .timeline-item{ - margin: 0; - white-space: nowrap; - font-size: 10px; - } \ No newline at end of file +.active-Segment ion-label { + font-size: 11px; + color: white !important; +} + +.normal-Segment ion-label { + color: black !important; + font-size: 11px; +} + +.normal-Segment { + font-size: 0.3cm !important; + text-transform: none; + --color-checked: none; + border: 0; +} + +.action-btn { + white-space: nowrap; + font-size: 10px; +} + +.req_info { + width: 20px; + height: 20px; + display: inline-block; + margin: 15px 10px 0px 0px; +} + +.name { + color: black !important; + font-weight: bold; +} + +.timeline-item { + margin: 0; + white-space: nowrap; + font-size: 10px; +} \ No newline at end of file diff --git a/Mohem/src/app/notification/worklist-main-po/worklist-main-po.component.scss b/Mohem/src/app/notification/worklist-main-po/worklist-main-po.component.scss index 593f2549..6c3ffeb3 100644 --- a/Mohem/src/app/notification/worklist-main-po/worklist-main-po.component.scss +++ b/Mohem/src/app/notification/worklist-main-po/worklist-main-po.component.scss @@ -1,29 +1,31 @@ - .no-padding-label { - padding: 0px !important; + padding: 0px !important; } .margin-left { - margin-left: 0px; + margin-left: 0px; } @media only screen and (max-width: 320px) { .active-Segment { font-size: 0.3cm !important; - background: #269DB8 !important; + background: #BE332F !important; text-transform: none; --color-checked: none; border-radius: 100px; - border:0; + border: 0; } - .active-Segment ion-label{ + + .active-Segment ion-label { font-size: 8px !important; color: white !important; } - .normal-Segment ion-label{ + + .normal-Segment ion-label { color: black; font-size: 8px !important; } + .normal-Segment { font-size: 0.3cm; text-transform: none; @@ -33,45 +35,51 @@ } .active-Segment { - font-size: 0.3cm; - background: #269DB8 ; - text-transform: none; - --color-checked: none; - border-radius: 100px; - border:0; - } - .active-Segment ion-label{ - font-size: 11px; - color: white !important; - } - .normal-Segment ion-label{ - color: black; - font-size: 11px; - } - .normal-Segment { - font-size: 0.3cm; - text-transform: none; - --color-checked: none; - border: 0; - } - + font-size: 0.3cm; + background: #BE332F; + text-transform: none; + --color-checked: none; + border-radius: 100px; + border: 0; +} - .action-btn { - white-space: nowrap; - font-size: 10px; - } - .name{ - color:black !important ;font-weight: bold; - } - .timeline-item{ - margin: 0; - white-space: nowrap; - font-size: 10px; - } - .req_info{ - width: 20px; - height: 20px; - display: inline-block; - margin: 15px 10px 0px 0px; - } - \ No newline at end of file +.active-Segment ion-label { + font-size: 11px; + color: white !important; +} + +.normal-Segment ion-label { + color: black; + font-size: 11px; +} + +.normal-Segment { + font-size: 0.3cm; + text-transform: none; + --color-checked: none; + border: 0; +} + + +.action-btn { + white-space: nowrap; + font-size: 10px; +} + +.name { + color: black !important; + font-weight: bold; +} + +.timeline-item { + margin: 0; + white-space: nowrap; + font-size: 10px; +} + +.req_info { + width: 20px; + height: 20px; + display: inline-block; + margin: 15px 10px 0px 0px; +} \ No newline at end of file diff --git a/Mohem/src/app/notification/worklist-main-pr/worklist-main-pr.component.scss b/Mohem/src/app/notification/worklist-main-pr/worklist-main-pr.component.scss index a8895a39..f7ac309b 100644 --- a/Mohem/src/app/notification/worklist-main-pr/worklist-main-pr.component.scss +++ b/Mohem/src/app/notification/worklist-main-pr/worklist-main-pr.component.scss @@ -1,51 +1,57 @@ - .no-padding-label { - padding: 0px !important; + padding: 0px !important; } .margin-left { - margin-left: 0px; + margin-left: 0px; } .active-Segment { - font-size: 0.3cm !important; - background: #269DB8 !important; - text-transform: none; - --color-checked: none; - border-radius: 100px; - border:0; - } - .active-Segment ion-label{ - font-size: 11px; - color: white !important; - } - .normal-Segment ion-label{ - color: black !important; - font-size: 11px; - } - .normal-Segment { - font-size: 0.3cm !important; - text-transform: none; - --color-checked: none; - border: 0; - } - .action-btn { - // white-space: pre-wrap; - white-space: nowrap; - font-size: 10px; - } - -.name{ - color:black !important ;font-weight: bold; -} -.timeline-item{ + font-size: 0.3cm !important; + background: #BE332F !important; + text-transform: none; + --color-checked: none; + border-radius: 100px; + border: 0; +} + +.active-Segment ion-label { + font-size: 11px; + color: white !important; +} + +.normal-Segment ion-label { + color: black !important; + font-size: 11px; +} + +.normal-Segment { + font-size: 0.3cm !important; + text-transform: none; + --color-checked: none; + border: 0; +} + +.action-btn { + // white-space: pre-wrap; + white-space: nowrap; + font-size: 10px; +} + +.name { + color: black !important; + font-weight: bold; +} + +.timeline-item { margin: 0; white-space: nowrap; font-size: 10px; } -.req_info{ + +.req_info { width: 20px; height: 20px; display: inline-block; - margin:15px 10px 0px 0px; -} + margin: 15px 10px 0px 0px; +} \ No newline at end of file diff --git a/Mohem/src/app/notification/worklist-main/worklist-main.component.html b/Mohem/src/app/notification/worklist-main/worklist-main.component.html index 6400b618..aefc5749 100644 --- a/Mohem/src/app/notification/worklist-main/worklist-main.component.html +++ b/Mohem/src/app/notification/worklist-main/worklist-main.component.html @@ -315,12 +315,12 @@
- +

{{ 'general, current' | translate}}

- +

{{ 'general, proposed' | translate}}

diff --git a/Mohem/src/app/notification/worklist-main/worklist-main.component.scss b/Mohem/src/app/notification/worklist-main/worklist-main.component.scss index 31893558..00918629 100644 --- a/Mohem/src/app/notification/worklist-main/worklist-main.component.scss +++ b/Mohem/src/app/notification/worklist-main/worklist-main.component.scss @@ -1,264 +1,281 @@ +.actionBtn { - - .actionBtn{ - - height: auto; - min-height: 35px !important; - padding: 10px; - font-size: 12px; - white-space: normal; - - } - button.actionBtn.button.button-md, - button.actionBtn.button.button-ios, - button.actionBtn.button.button - { - width: 90%; + height: auto; + min-height: 35px !important; + padding: 10px; + font-size: 12px; + white-space: normal; + +} + +button.actionBtn.button.button-md, +button.actionBtn.button.button-ios, +button.actionBtn.button.button { + width: 90%; +} + +.actionBtnCol { + text-align: center; +} + +.actionBtnGrid { + + padding: 0px; +} + +.notColBtn { + + min-height: 150px !important; + padding: 0px; + background: transparent; + border: 2px solid #e4e5e7; + + p { + color: var(--secondary); + margin-top: 0px; + margin-bottom: 0px; + font-weight: normal; + font-size: 14px; + white-space: normal; + padding: 3px 0px; + min-height: 50px; } - .actionBtnCol{ - text-align: center; + + span { + display: block; + } - .actionBtnGrid{ - - padding:0px; + + .serviceItemImg { + min-width: 60px !important; + min-height: 70px !important; + width: 70px; + height: 70px; + margin: 10px auto; + background: transparent !important; } - .notColBtn { - - min-height: 150px !important; - padding: 0px; - background: transparent; - border: 2px solid #e4e5e7; - p{ - color: var(--secondary); - margin-top: 0px; margin-bottom:0px; - font-weight: normal; - font-size: 14px; - white-space: normal; - padding: 3px 0px; - min-height: 50px; - } - span { - display: block; - - } - - .serviceItemImg { - min-width: 60px !important; - min-height: 70px !important; - width: 70px; - height: 70px; - margin: 10px auto; - background: transparent !important; - } - - } - .notColBtn.button,.notColBtn.button-md, .notColBtn.button-ios{ - background: transparent !important; - color: var(--dark); - box-shadow: none; - -webkit-box-shadow:none; - -moz-box-shadow: none; - padding: 0px; - color: var(--secondary); - border: 2px solid var(--gray); - min-width: auto; - } + +} + +.notColBtn.button, +.notColBtn.button-md, +.notColBtn.button-ios { + background: transparent !important; + color: var(--dark); + box-shadow: none; + -webkit-box-shadow: none; + -moz-box-shadow: none; + padding: 0px; + color: var(--secondary); + border: 2px solid var(--gray); + min-width: auto; +} + //////////////////////// - .itemHISBtn{ - padding: 5px; - color: var(--light); - background: var(--darkgray); - border-radius: 3px; - width: 85%; - height: 40px; - } - - - .rowBtn{ - display: flex; - flex-direction: row; - justify-content: center; - align-items: center; - background: white; - } - - - - .rowBorder{ - border-bottom: solid 0.02cm var(--grayBG); - - - } - .colBorder{ - border-right: solid 0.02cm var(--grayBG); - - } - - .dateActionHistory{ - display: inline-block; - margin-left: 5px; - text-align: left; - } - .req_info{ - width: 25px; - height: 25px; - display: inline-block; - margin: 0; - } - - .deligate{ - margin-left: 25px; - } - .actionBtn{ - --border-radius: 50% !important; - height: 55px; - width: 55px; - --background: var(--newgreen); // will be dynamic - background: transparent; - margin:10px; - } - - .itemAttch{ - border-radius: 11px; - margin: 8px; - --min-height: 60px; - --max-height: 60px; - } - - .less { - max-height: 54px; - } - - .noDataDiv{ - background: #ffffff; - height: 11%; - text-align: center; - padding-top: 1px; - border-radius: 10px; - margin: 10px; - } - - .no-data-div{ - background: #ffffff; - height: 100%; - text-align: center; - padding-top: 1px; - border-radius: 10px; - margin: 10px; - } - - .container { - font-size: 14px; - line-height: 14px; - height: 15px; - overflow: hidden; - text-align: justify; - } - - .show { - overflow: visible; - height: auto; - } - - .showMore{ - padding: 0px; - background: transparent; - color: blue; - text-decoration: underline; - font-size: 14px; - } - - // .succssfullMSG{ - // height: 100%; - // width: 100%; - // background: var(--newgreen); - // color: white; - // font-weight: bold; - // font-size: 20px; - // text-align: center; - // vertical-align: middle; - // padding-top: 30px; - // } - - // .succssfullIcon{ - // width: 60%; - // text-align: center; - // height: 36%; - // padding-top: 100px; - // } - //////////////////////////////// - .subOrdinateList{ - // margin: 10px; - // border-top-left-radius: 45px; - // border-bottom-left-radius: 45px; - // border: var(--cusgray) 1px solid !important; - --background: transparent; - margin-left: -15px; - margin-right: 6px; - margin-bottom:8px; -} -.status{ +.itemHISBtn { + padding: 5px; + color: var(--light); + background: var(--darkgray); + border-radius: 3px; + width: 85%; + height: 40px; +} + + +.rowBtn { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + background: white; +} + + + +.rowBorder { + border-bottom: solid 0.02cm var(--grayBG); + + +} + +.colBorder { + border-right: solid 0.02cm var(--grayBG); + +} + +.dateActionHistory { + display: inline-block; + margin-left: 5px; + text-align: left; +} + +.req_info { + width: 25px; + height: 25px; + display: inline-block; + margin: 0; +} + +.deligate { + margin-left: 25px; +} + +.actionBtn { + --border-radius: 50% !important; + height: 55px; + width: 55px; + --background: var(--newgreen); // will be dynamic + background: transparent; + margin: 10px; +} + +.itemAttch { + border-radius: 11px; + margin: 8px; + --min-height: 60px; + --max-height: 60px; +} + +.less { + max-height: 54px; +} + +.noDataDiv { + background: #ffffff; + height: 11%; + text-align: center; + padding-top: 1px; + border-radius: 10px; + margin: 10px; +} + +.no-data-div { + background: #ffffff; + height: 100%; + text-align: center; + padding-top: 1px; + border-radius: 10px; + margin: 10px; +} + +.container { + font-size: 14px; + line-height: 14px; + height: 15px; + overflow: hidden; + text-align: justify; +} + +.show { + overflow: visible; + height: auto; +} + +.showMore { + padding: 0px; + background: transparent; + color: blue; + text-decoration: underline; + font-size: 14px; +} + +// .succssfullMSG{ +// height: 100%; +// width: 100%; +// background: var(--newgreen); +// color: white; +// font-weight: bold; +// font-size: 20px; +// text-align: center; +// vertical-align: middle; +// padding-top: 30px; +// } + +// .succssfullIcon{ +// width: 60%; +// text-align: center; +// height: 36%; +// padding-top: 100px; +// } +//////////////////////////////// +.subOrdinateList { + // margin: 10px; + // border-top-left-radius: 45px; + // border-bottom-left-radius: 45px; + // border: var(--cusgray) 1px solid !important; + --background: transparent; + margin-left: -15px; + margin-right: 6px; + margin-bottom: 8px; +} + +.status { text-align: center; -// background: green; -border-radius: 10px; -font-size: 10px !important; -height: 40px; -color: white; -position: relative; -} -.rowHeader{ + // background: green; + border-radius: 10px; + font-size: 10px !important; + height: 40px; + color: white; + position: relative; +} + +.rowHeader { border-bottom: 1px solid var(--cusgray); padding-bottom: 10px; margin-bottom: -17px; } -.container{ - position:relative; +.container { + position: relative; } -.overflow-hid-div{ - overflow:hidden; - margin-left:50px; - width:200px; + +.overflow-hid-div { + overflow: hidden; + margin-left: 50px; + width: 200px; height: 200px; - background-color:red; - + background-color: red; + } -.inner{ - width:50px; + +.inner { + width: 50px; height: 50px; - background-color:green; + background-color: green; position: absolute; - left:25px; - top:25px; - + left: 25px; + top: 25px; + } -.gridSubordinates{ - margin-left: 3%;//38px; - border-top-left-radius: 16px;//28px; - border-bottom-left-radius: 16px;//40px; - // padding-left: 8px; - background:var(--light); - border-top-right-radius: 16px; - border-bottom-right-radius: 16px; + +.gridSubordinates { + margin-left: 3%; //38px; + border-top-left-radius: 16px; //28px; + border-bottom-left-radius: 16px; //40px; + // padding-left: 8px; + background: var(--light); + border-top-right-radius: 16px; + border-bottom-right-radius: 16px; } -.subOrdinateDiv{ +.subOrdinateDiv { z-index: 4; - margin-left: 0px;//-32px; + margin-left: 0px; //-32px; // position: absolute; - top: 5px;//-2px; + top: 5px; //-2px; float: left; margin-right: 10px; } -.subOrdinateImg{ - width: 85px; - border: #e4e4e4 solid 2px; - -moz-border-radius: 50%; - border-radius: 50%; - border: 3px solid #f0efef; + +.subOrdinateImg { + width: 85px; + border: #e4e4e4 solid 2px; + -moz-border-radius: 50%; + border-radius: 50%; + border: 3px solid #f0efef; } -.subOrdinateRow{ +.subOrdinateRow { margin-left: 55px; } @@ -270,7 +287,8 @@ position: relative; margin-right: -13px; margin-bottom: 8px; } -.gridSubordinates-Ar{ + +.gridSubordinates-Ar { border-top-right-radius: 28px; border-bottom-right-radius: 40px; background: var(--light); @@ -289,39 +307,46 @@ position: relative; position: absolute; top: -2px; } + /////////////////////////////////////////////// -.label{ -font-size: 14px; +.label { + font-size: 14px; } -.subjectNotification{ +.subjectNotification { text-align: center; padding-top: 10px; font-weight: bold; } -.action-history ion-card-content{ - padding:0; + +.action-history ion-card-content { + padding: 0; } + ion-card.action-history { - margin:10px + margin: 10px } -.submitterInfo{ + +.submitterInfo { padding-top: 10px; padding-bottom: 10px; } -ion-card{ + +ion-card { color: black !important; } + //// -.tabBar{ - height:70px +.tabBar { + height: 70px } -.cardAlignTextEn{ +.cardAlignTextEn { text-align: left; } -.cardAlignTextAr{ + +.cardAlignTextAr { text-align: right; } @@ -331,34 +356,41 @@ ion-card{ .active-Segment { font-size: 0.3cm !important; - background: #269DB8 !important; + background: #BE332F !important; text-transform: none; --color-checked: none; border-radius: 100px; - border:0; + border: 0; } -.active-Segment ion-label{ + +.active-Segment ion-label { font-size: 11px; color: white !important; } -.normal-Segment ion-label{ + +.normal-Segment ion-label { color: black !important; font-size: 11px; } + .normal-Segment { font-size: 0.3cm !important; text-transform: none; --color-checked: none; border: 0; } + .action-btn { white-space: pre-wrap; font-size: 11px; } -.name{ - color:black !important ;font-weight: bold; + +.name { + color: black !important; + font-weight: bold; } -.timeline-item{ + +.timeline-item { margin: 0; white-space: nowrap; font-size: 10px; diff --git a/Mohem/src/app/notification/worklist-setting/worklist-setting.component.scss b/Mohem/src/app/notification/worklist-setting/worklist-setting.component.scss index 927b8dc3..2bde1681 100644 --- a/Mohem/src/app/notification/worklist-setting/worklist-setting.component.scss +++ b/Mohem/src/app/notification/worklist-setting/worklist-setting.component.scss @@ -1,7 +1,7 @@ -.header-toolbar{ - --background: #269DB8; +.header-toolbar { + --background: #BE332F; } -ion-toggle{ - --background-checked: #269DB8; +ion-toggle { + --background-checked: #BE332F; } \ No newline at end of file diff --git a/Mohem/src/app/payslip/home/home.component.scss b/Mohem/src/app/payslip/home/home.component.scss index ffb2c465..92c6a6a6 100644 --- a/Mohem/src/app/payslip/home/home.component.scss +++ b/Mohem/src/app/payslip/home/home.component.scss @@ -75,7 +75,7 @@ } .header-toolbar-new { - --background: #269DB8; + --background: #BE332F; } .colorBG { @@ -83,7 +83,7 @@ } .header-div { - background-color: #269DB8; + background-color: #BE332F; text-transform: capitalize; height: 119px; position: relative; @@ -323,7 +323,7 @@ margin-top: 0; margin-bottom: 0; /* border-radius: 12px !important; */ - background: #269DB8; + background: #BE332F; border-bottom: 1px solid #a7a4a4; border-top: 1px solid #cac8c8; margin-left: -13px; @@ -377,7 +377,7 @@ left: 83%; bottom: 117px; color: black; - background-color: #269DB8; + background-color: #BE332F; width: 16%; height: 6px; } @@ -387,13 +387,13 @@ // left: 77%; // bottom: 117px; // color: black; - // background-color: #269DB8; + // background-color: #BE332F; // width: 20%; height: 6px; position: relative; left: 4%; bottom: 117px; color: black; - background-color: #269DB8; + background-color: #BE332F; width: 15%; height: 6px; } @@ -405,7 +405,7 @@ left: 83%; bottom: 67px; color: black; - background-color: #269DB8; + background-color: #BE332F; width: 16%; height: 6px; } @@ -415,13 +415,13 @@ // left: 77%; // bottom: 67px; // color: black; - // background-color: #269DB8; + // background-color: #BE332F; // width: 20%; height: 6px; position: relative; left: 4%; bottom: 67px; color: black; - background-color: #269DB8; + background-color: #BE332F; width: 15%; height: 6px; } \ No newline at end of file diff --git a/Mohem/src/app/payslip/home/home.component.ts b/Mohem/src/app/payslip/home/home.component.ts index 8be10fe1..e8aed7a0 100644 --- a/Mohem/src/app/payslip/home/home.component.ts +++ b/Mohem/src/app/payslip/home/home.component.ts @@ -1,11 +1,11 @@ import { Component, OnInit, ViewChild, SimpleChanges } from '@angular/core'; -import {PayslipService} from '../service/payslip.service' +import { PayslipService } from '../service/payslip.service' import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service'; import { CommonService } from 'src/app/hmg-common/services/common/common.service'; import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response'; import { SharedDataService } from 'src/app/hmg-common/services/shared-data-service/shared-data.service'; import { DeductionRequest } from '../model/deductionReq'; -import { IonInfiniteScroll,IonSlides} from '@ionic/angular'; +import { IonInfiniteScroll, IonSlides } from '@ionic/angular'; import { AuthenticationService } from "src/app/hmg-common/services/authentication/authentication.service"; import { AuthenticatedUser } from "src/app/hmg-common/services/authentication/models/authenticated-user"; import { UIChart } from 'primeng/components/chart/chart'; @@ -19,99 +19,100 @@ export class HomeComponent implements OnInit { selEmp: string; respID: number; selMenu: MenuResponse; - GetPayslipList:any=''; - GetSummaryOfPaymentList:any=''; - GetPaymentInformationList:any=''; - showPaySlip:any=[]; - ActionContextID:any; + GetPayslipList: any = ''; + GetSummaryOfPaymentList: any = ''; + GetPaymentInformationList: any = ''; + showPaySlip: any = []; + ActionContextID: any; public static ACTION_CONTEXT_ID = "passActionContectID"; - GetEarningsList: any=''; - GetDeductionsList: any=''; + GetEarningsList: any = ''; + GetDeductionsList: any = ''; earingTotal: any; deductionTotal: any; firstPayslip: any; defultSelected: any; IsReachEnd: any; private deductionReq: DeductionRequest; - doinfiniteDedReq:any; - doinfinitEarReq:any; + doinfiniteDedReq: any; + doinfinitEarReq: any; personalInfo: any; - setImage:any; + setImage: any; imageSrc: any = "../assets/imgs/profile.png"; slideView: any; sliderOne: any; - payslipIndex :any; - data:any; + payslipIndex: any; + data: any; public direction: string; @ViewChild('slides') slides: IonSlides; @ViewChild('slideWithNav') slideWithNav: IonSlides; - @ViewChild('chart') chart: UIChart; + @ViewChild('chart') chart: UIChart; slideOptsOne = { initialSlide: 0, slidesPerView: 1, - autoplay:true + autoplay: true }; @ViewChild(IonInfiniteScroll) infiniteScroll: IonInfiniteScroll; - public options = { - cutoutPercentage: 85, - tooltips: { enabled: false }, - legend: { display: false }}; - gaugeType = "full"; - - // gaugeValue = 11.200; - // gaugeLabel = ""; - + public options = { + cutoutPercentage: 85, + tooltips: { enabled: false }, + legend: { display: false } + }; + gaugeType = "full"; + + // gaugeValue = 11.200; + // gaugeLabel = ""; + constructor( - public payslipService:PayslipService, + public payslipService: PayslipService, public ts: TranslatorService, public common: CommonService, public sharedData: SharedDataService, public authService: AuthenticationService, public cs: CommonService, - - - ) { - this.direction = TranslatorService.getCurrentDirection(); - } + + + ) { + this.direction = TranslatorService.getCurrentDirection(); + } ngOnInit() { this.direction = TranslatorService.getCurrentLanguageName() - // this.selEmp = this.common.sharedService.getSharedData( - // MenuResponse.SHARED_SEL_EMP, - // false - // ); - // if(this.selEmp){}else{ - // this.authService.loadAuthenticatedUser().subscribe((user: AuthenticatedUser) => { - // if (user) { - // this.selEmp = user.ASSIGNMENT_NUMBER; - - // } - // }); - // } - - // console.log(" this.selEmp" + this.selEmp); - // this.respID = this.common.sharedService.getSharedData( - // MenuResponse.SHARED_SEL_RESP_ID, - // false - // ); - // if(this.respID){}else{ - // this.respID=-999; - // } - // console.log(" this.respID" + this.respID); - - // this.selMenu = new MenuResponse(); - // this.selMenu = this.common.sharedService.getSharedData( - // MenuResponse.SHARED_DATA, - // false - // ); - // console.log(" this.selMenu" + this.selMenu); - - + // this.selEmp = this.common.sharedService.getSharedData( + // MenuResponse.SHARED_SEL_EMP, + // false + // ); + // if(this.selEmp){}else{ + // this.authService.loadAuthenticatedUser().subscribe((user: AuthenticatedUser) => { + // if (user) { + // this.selEmp = user.ASSIGNMENT_NUMBER; + + // } + // }); + // } + + // console.log(" this.selEmp" + this.selEmp); + // this.respID = this.common.sharedService.getSharedData( + // MenuResponse.SHARED_SEL_RESP_ID, + // false + // ); + // if(this.respID){}else{ + // this.respID=-999; + // } + // console.log(" this.respID" + this.respID); + + // this.selMenu = new MenuResponse(); + // this.selMenu = this.common.sharedService.getSharedData( + // MenuResponse.SHARED_DATA, + // false + // ); + // console.log(" this.selMenu" + this.selMenu); + + this.getPayslip(); - // this.getProfile(); + // this.getProfile(); } @@ -119,7 +120,7 @@ export class HomeComponent implements OnInit { if (changes.inputData.currentValue) { // update this.data here - // then chart is getting updated + // then chart is getting updated setTimeout(() => { this.chart.reinit(); }, 100); @@ -127,19 +128,19 @@ export class HomeComponent implements OnInit { } slideNext(object, slideView) { - if(this.payslipIndex!=0){ - this.payslipIndex=this.payslipIndex-1; - this.showInfo(); + if (this.payslipIndex != 0) { + this.payslipIndex = this.payslipIndex - 1; + this.showInfo(); + } } -} -slidePrev(object, slideView) { - if(this.payslipIndex {} , this.ts.trPK('general', 'retry')).subscribe((result)=> - { - this.handleRespondGetPayslipResult(result); + this.payslipService.getPayslip(request, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => { + this.handleRespondGetPayslipResult(result); } ); } - handleRespondGetPayslipResult(result){ - + handleRespondGetPayslipResult(result) { + if (result.GetPayslipList != null) { this.GetPayslipList = result.GetPayslipList; - this.firstPayslip= this.GetPayslipList[0] - this.defultSelected=this.firstPayslip.PAYSLIP_CHOICE + this.firstPayslip = this.GetPayslipList[0] + this.defultSelected = this.firstPayslip.PAYSLIP_CHOICE } this.showPaySlip = this.GetPayslipList[0]; - this.payslipIndex=0; + this.payslipIndex = 0; this.getAllPayslipData(this.GetPayslipList[0].ACTION_CONTEXT_ID); } - showInfo(){ - - //console.log(event.detail.value); - //const index = parseInt(event.detail.value); - this.showPaySlip =this.GetPayslipList[this.payslipIndex]; - this.ActionContextID=this.GetPayslipList[this.payslipIndex].ACTION_CONTEXT_ID; - this.getAllPayslipData(this.ActionContextID); + showInfo() { + + //console.log(event.detail.value); + //const index = parseInt(event.detail.value); + this.showPaySlip = this.GetPayslipList[this.payslipIndex]; + this.ActionContextID = this.GetPayslipList[this.payslipIndex].ACTION_CONTEXT_ID; + this.getAllPayslipData(this.ActionContextID); } - getAllPayslipData(ActionContextID){ - this.common.sharedService.setSharedData(ActionContextID,HomeComponent.ACTION_CONTEXT_ID); + getAllPayslipData(ActionContextID) { + this.common.sharedService.setSharedData(ActionContextID, HomeComponent.ACTION_CONTEXT_ID); this.getSummeryOfPayment(ActionContextID); this.getPaymentInfo(ActionContextID); this.getDeduction(ActionContextID); this.getEarings(ActionContextID); } - getSummeryOfPayment(ActionContextID){ + getSummeryOfPayment(ActionContextID) { const request = { P_ACTION_CONTEXT_ID: ActionContextID, }; - - this.payslipService.getSummeryOFPayment(request, ()=> {} , this.ts.trPK('general', 'retry')).subscribe((result)=> - { - this.handleSummeryOfPaymentResult(result); + + this.payslipService.getSummeryOFPayment(request, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => { + this.handleSummeryOfPaymentResult(result); } ); } - handleSummeryOfPaymentResult(result){ + handleSummeryOfPaymentResult(result) { if (result.GetSummaryOfPaymentList != null) { this.GetSummaryOfPaymentList = result.GetSummaryOfPaymentList[0]; - this.earingTotal = this.GetSummaryOfPaymentList.TOTAL_EARNINGS_AMOUNT; - this.deductionTotal = this.GetSummaryOfPaymentList.TOTAL_DEDUCTIONS_AMOUNT; + this.earingTotal = this.GetSummaryOfPaymentList.TOTAL_EARNINGS_AMOUNT; + this.deductionTotal = this.GetSummaryOfPaymentList.TOTAL_DEDUCTIONS_AMOUNT; this.data = { - + labels: ['earingTotal', 'deductionTotal'], datasets: [ - { data: [this.earingTotal,this.deductionTotal], - backgroundColor: [ - '#269DB8', - '#269DB8', ], - borderWidth: 2 - } - ] - }; } + { + data: [this.earingTotal, this.deductionTotal], + backgroundColor: [ + '#BE332F', + '#BE332F',], + borderWidth: 2 + } + ] + }; + } } -getPaymentInfo(ActionContextID){ - const request = { - P_ACTION_CONTEXT_ID: ActionContextID, - }; - - this.payslipService.getPaymentInfo(request, ()=> {} , this.ts.trPK('general', 'retry')).subscribe((result)=> - { - this.handleGetPaymentInfoResult(result); - } - ); -} + getPaymentInfo(ActionContextID) { + const request = { + P_ACTION_CONTEXT_ID: ActionContextID, + }; -handleGetPaymentInfoResult(result){ - if (result.GetPaymentInformationList != null) { - this.GetPaymentInformationList = result.GetPaymentInformationList; + this.payslipService.getPaymentInfo(request, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => { + this.handleGetPaymentInfoResult(result); + } + ); } -} -openEarings(){ - this.common.openEarningsPage(); + handleGetPaymentInfoResult(result) { + if (result.GetPaymentInformationList != null) { + this.GetPaymentInformationList = result.GetPaymentInformationList; + } + } -} -openDeductions(){ - this.common.openDeductionsPage(); -} + openEarings() { + this.common.openEarningsPage(); -getEarings(ActionContextID){ - console.log("getEarings"); - - // this.deductionReq.P_ACTION_CONTEXT_ID=ActionContextID; - // this.deductionReq.P_PAGE_NUM=1; - // this.deductionReq.P_PAGE_LIMIT=100; - const request ={ - P_ACTION_CONTEXT_ID:ActionContextID, - P_PAGE_NUM:1, - P_PAGE_LIMIT:100 - } - this.doinfinitEarReq=request; - this.payslipService.getEarings(request, ()=> {} , this.ts.trPK('general', 'retry')).subscribe((result)=> - { - this.handleGetEaringsResult(result); } - ); -} + openDeductions() { + this.common.openDeductionsPage(); + } + + getEarings(ActionContextID) { + console.log("getEarings"); -handleGetEaringsResult(result){ - if (result.GetEarningsList != null) { - this.GetEarningsList = result.GetEarningsList; + // this.deductionReq.P_ACTION_CONTEXT_ID=ActionContextID; + // this.deductionReq.P_PAGE_NUM=1; + // this.deductionReq.P_PAGE_LIMIT=100; + const request = { + P_ACTION_CONTEXT_ID: ActionContextID, + P_PAGE_NUM: 1, + P_PAGE_LIMIT: 100 + } + this.doinfinitEarReq = request; + this.payslipService.getEarings(request, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => { + this.handleGetEaringsResult(result); + } + ); } + handleGetEaringsResult(result) { + if (result.GetEarningsList != null) { + this.GetEarningsList = result.GetEarningsList; + } -} -getDeduction(ActionContextID){ - console.log("getDeduction"); - const request ={ - P_ACTION_CONTEXT_ID:ActionContextID, - P_PAGE_NUM:1, - P_PAGE_LIMIT:100 } - // this.deductionReq.P_ACTION_CONTEXT_ID=ActionContextID; - // this.deductionReq.P_PAGE_NUM=1; - // this.deductionReq.P_PAGE_LIMIT=100; - this.doinfiniteDedReq=request; - - this.payslipService.getDeduction(request, ()=> {} , this.ts.trPK('general', 'retry')).subscribe((result)=> - { - this.handleGetDeductionResult(result); + + getDeduction(ActionContextID) { + console.log("getDeduction"); + const request = { + P_ACTION_CONTEXT_ID: ActionContextID, + P_PAGE_NUM: 1, + P_PAGE_LIMIT: 100 + } + // this.deductionReq.P_ACTION_CONTEXT_ID=ActionContextID; + // this.deductionReq.P_PAGE_NUM=1; + // this.deductionReq.P_PAGE_LIMIT=100; + this.doinfiniteDedReq = request; + + this.payslipService.getDeduction(request, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => { + this.handleGetDeductionResult(result); } ); } - handleGetDeductionResult(result){ + handleGetDeductionResult(result) { if (result.GetDeductionsList != null) { this.GetDeductionsList = result.GetDeductionsList; } @@ -389,6 +387,6 @@ getDeduction(ActionContextID){ } else { if (this.infiniteScroll) this.infiniteScroll.complete(); } - } + } } diff --git a/Mohem/src/app/profile/add-address/add-address.component.scss b/Mohem/src/app/profile/add-address/add-address.component.scss index e2348ac3..47ce98e0 100644 --- a/Mohem/src/app/profile/add-address/add-address.component.scss +++ b/Mohem/src/app/profile/add-address/add-address.component.scss @@ -1,44 +1,46 @@ .footer-button { - border-radius: 2px; - padding: 0 1.1em; - min-height: 45px; - min-width: 200px; - } - - ion-label { - color: var(--customnavy) !important; - } - - .daynamicForm-Label { - font-size: 16px; - color: #a2a5a6 !important; - display: block; - overflow: hidden; - -webkit-flex: 1; - flex: 1; - font-size: inherit; - white-space: normal; - padding: 5px 0px; - margin: 10px auto; - padding-left: 10px; - } - - - .header-toolbar-new{ - --background: #269DB8; - } - .addEitOkButton{ - white-space: normal !important; - text-transform: capitalize !important; - min-height: 45px !important; - min-width: 5px !important; - margin: 8px !important; - background-color: #269DB8; - width: 80% !important; - color: white!important; - border-radius: 16px !important; - } - .country{ - margin-top: 10px; - padding: 10px; - } \ No newline at end of file + border-radius: 2px; + padding: 0 1.1em; + min-height: 45px; + min-width: 200px; +} + +ion-label { + color: var(--customnavy) !important; +} + +.daynamicForm-Label { + font-size: 16px; + color: #a2a5a6 !important; + display: block; + overflow: hidden; + -webkit-flex: 1; + flex: 1; + font-size: inherit; + white-space: normal; + padding: 5px 0px; + margin: 10px auto; + padding-left: 10px; +} + + +.header-toolbar-new { + --background: #BE332F; +} + +.addEitOkButton { + white-space: normal !important; + text-transform: capitalize !important; + min-height: 45px !important; + min-width: 5px !important; + margin: 8px !important; + background-color: #BE332F; + width: 80% !important; + color: white !important; + border-radius: 16px !important; +} + +.country { + margin-top: 10px; + padding: 10px; +} \ No newline at end of file diff --git a/Mohem/src/app/profile/add-basic-details/add-basic-details.component.scss b/Mohem/src/app/profile/add-basic-details/add-basic-details.component.scss index a6dbf815..47ce98e0 100644 --- a/Mohem/src/app/profile/add-basic-details/add-basic-details.component.scss +++ b/Mohem/src/app/profile/add-basic-details/add-basic-details.component.scss @@ -1,45 +1,46 @@ .footer-button { - border-radius: 2px; - padding: 0 1.1em; - min-height: 45px; - min-width: 200px; - } - - ion-label { - color: var(--customnavy) !important; - } - - .daynamicForm-Label { - font-size: 16px; - color: #a2a5a6 !important; - display: block; - overflow: hidden; - -webkit-flex: 1; - flex: 1; - font-size: inherit; - white-space: normal; - padding: 5px 0px; - margin: 10px auto; - padding-left: 10px; - } - - - .header-toolbar-new{ - --background: #269DB8; - } - .addEitOkButton{ - white-space: normal !important; - text-transform: capitalize !important; - min-height: 45px !important; - min-width: 5px !important; - margin: 8px !important; - background-color: #269DB8; - width: 80% !important; - color: white!important; - border-radius: 16px !important; - } + border-radius: 2px; + padding: 0 1.1em; + min-height: 45px; + min-width: 200px; +} - .country{ - margin-top: 10px; - padding: 10px; - } \ No newline at end of file +ion-label { + color: var(--customnavy) !important; +} + +.daynamicForm-Label { + font-size: 16px; + color: #a2a5a6 !important; + display: block; + overflow: hidden; + -webkit-flex: 1; + flex: 1; + font-size: inherit; + white-space: normal; + padding: 5px 0px; + margin: 10px auto; + padding-left: 10px; +} + + +.header-toolbar-new { + --background: #BE332F; +} + +.addEitOkButton { + white-space: normal !important; + text-transform: capitalize !important; + min-height: 45px !important; + min-width: 5px !important; + margin: 8px !important; + background-color: #BE332F; + width: 80% !important; + color: white !important; + border-radius: 16px !important; +} + +.country { + margin-top: 10px; + padding: 10px; +} \ No newline at end of file diff --git a/Mohem/src/app/profile/confirm-address/confirm-address.component.scss b/Mohem/src/app/profile/confirm-address/confirm-address.component.scss index 2ed98379..a53d7d25 100644 --- a/Mohem/src/app/profile/confirm-address/confirm-address.component.scss +++ b/Mohem/src/app/profile/confirm-address/confirm-address.component.scss @@ -1,263 +1,273 @@ .footer-button { - border-radius: 2px; - padding: 0 1.1em; - min-height: 45px; - min-width: 200px; - } - - .imgSize { - width: 22px; - height: 22px; - } - - .Header { - font-weight: bold; - color: #1a586d !important; - font-size: 10px; - } - - .tbData { - font-size: 10px; - } - - .btnBack { - background: transparent; - float: right; - } - - .attachmentDiv{ - background: #ffffff; - height: auto; - text-align: center; - padding-top: 1px; - margin: 10px; - border-radius: 15px; - border: 1px solid grey; - } - - .noDataDiv{ - background: #ffffff; - height: 11%; - text-align: center; - padding-top: 1px; - border-radius: 10px; - margin: 10px; - border-radius: 5px; - } - .submitNote{ - background: #ffffff; - height: 80px; - padding-top: 1px; - margin: 10px; - border-radius: 15px; - border: 1px solid grey; - } - - .approvalList{ - --background: #f0efef; - height: auto; - text-align: center; - padding-top: 1px; - border-radius: 10px; - margin: 10px; - border-radius: 5px; - } - - /************************New Design**********************************/ - .notification-list{ - background: none; - background: none; - border-radius: 32px; - ion-item{ - // margin-top: 5px; - // margin-bottom: 5px; - - background-color: transparent; - .item-date{ - width: 100%; - font-size: 16px; - font-weight: bold; - - text-align: start; - padding: 0; - margin: 0; - - position: absolute; - left: 0; - top: 12%; - } - ion-label , [item-end]{ - - white-space: normal; - font-size: 14px; - padding-top: 15%; - // :root[dir="ltr"]{ - // margin-left: 10px; - // } - // :root[dir="rtl"]{ - // margin-right: 10px; - // } - - } - + border-radius: 2px; + padding: 0 1.1em; + min-height: 45px; + min-width: 200px; +} + +.imgSize { + width: 22px; + height: 22px; +} + +.Header { + font-weight: bold; + color: #c6903e !important; + font-size: 10px; +} + +.tbData { + font-size: 10px; +} + +.btnBack { + background: transparent; + float: right; +} + +.attachmentDiv { + background: #ffffff; + height: auto; + text-align: center; + padding-top: 1px; + margin: 10px; + border-radius: 15px; + border: 1px solid grey; +} + +.noDataDiv { + background: #ffffff; + height: 11%; + text-align: center; + padding-top: 1px; + border-radius: 10px; + margin: 10px; + border-radius: 5px; +} + +.submitNote { + background: #ffffff; + height: 80px; + padding-top: 1px; + margin: 10px; + border-radius: 15px; + border: 1px solid grey; +} + +.approvalList { + --background: #f0efef; + height: auto; + text-align: center; + padding-top: 1px; + border-radius: 10px; + margin: 10px; + border-radius: 5px; +} + +/************************New Design**********************************/ +.notification-list { + background: none; + background: none; + border-radius: 32px; + + ion-item { + // margin-top: 5px; + // margin-bottom: 5px; + + background-color: transparent; + + .item-date { + width: 100%; + font-size: 16px; + font-weight: bold; + + text-align: start; + padding: 0; + margin: 0; + + position: absolute; + left: 0; + top: 12%; } + + ion-label, + [item-end] { + + white-space: normal; + font-size: 14px; + padding-top: 15%; + // :root[dir="ltr"]{ + // margin-left: 10px; + // } + // :root[dir="rtl"]{ + // margin-right: 10px; + // } + + } + } - - - - - - - .timeline { - position: relative; - margin: 15px 0 0 0; - // border-bottom: solid 1px var(--cusgray); - } - - .timeline:before { - - content: ''; - position: inherit !important; - top: 0; - bottom: 0; - width: 4px; - // background: #e4e4e4; - z-index: 1; - left: 35px; - /* margin-left: -10px; */ - /* z-index: 1; */ - } - - .timeline .timeline-thumb { - - border-radius: 500px; - width: 70px !important; - z-index: 2; - position: absolute; - left: 0px; - // :root[dir="ltr"]{ - // left: 37px; - // } - // :root[dir="rtl"]{ - // right: 37px; - // } - float: right; - top: 9px; - } - - .timeline .timeline-thumb.timeline-icon { - height: 70px; - // text-align: center; - // color: white; - // border: 5px solid #CBD0D3; - // transform: scale(0.2); - } - - - - .timeline .timeline-item { - width: 40px; - - } - - .timeline .timeline-stats { - position: relative; - font-size: 12px; - color: var(--darkgray); - - } - - .empImge{ - border-radius: 50%; - width:100%; - height: 100%; - border: #dedede solid 1px; - - } - .empImgeRep { - border-radius: 50% !important; - width: 80px; - height: 80px; - border: #dedede solid 1px; - } - - .line{ - padding-bottom:87px; - } - - .attachLable{ - position: absolute; - top: 0px; - z-index: 0; - background: #30b8c6; - color: #fff; - border-radius: 50%; - border: 0px; - width: 24px; - height: 24px; - text-align: center; - font-size: 5px; - } - - .removeLable{ - top: 0px; - z-index: 0; - background: #d8252d; - color: #fff; - border-radius: 50%; - border: 0px; - width: 20px; - height: 20px; - text-align: center; - font-size: 5px; - } - - .note-modal { - // width: 90%; - // height: 50%; - // top: 20%; - // left: 5%; - // right: 5%; - // bottom: 5%; - background: rgba(0, 0, 0, 0.5) !important; - padding: 30% 10% !important; - --height: 12cm !important; - // --width: 80% !important; - --border-radius:20px; - - } - .header-toolbar-new{ - --background: #269DB8; - } - .title{ - margin-top: -37px; - margin-left: 85px; - } - .title-ar{ - margin-top: -37px; - margin-right: 101px; - } - .confirmEitOkButton{ - white-space: normal !important; - text-transform: capitalize !important; - min-height: 45px !important; - min-width: 5px !important; - margin: 8px !important; - background-color: #269DB8; - width: 80% !important; - color: white!important; - border-radius: 16px !important; - } - - .approvalTitle-ar{ - font-weight: bold; - font-size: 16px; - text-align: right; - - } - .approvalTitle{ - font-weight: bold; - font-size: 16px; - text-align: left; - } - \ No newline at end of file +} + + + + + + +.timeline { + position: relative; + margin: 15px 0 0 0; + // border-bottom: solid 1px var(--cusgray); +} + +.timeline:before { + + content: ''; + position: inherit !important; + top: 0; + bottom: 0; + width: 4px; + // background: #e4e4e4; + z-index: 1; + left: 35px; + /* margin-left: -10px; */ + /* z-index: 1; */ +} + +.timeline .timeline-thumb { + + border-radius: 500px; + width: 70px !important; + z-index: 2; + position: absolute; + left: 0px; + // :root[dir="ltr"]{ + // left: 37px; + // } + // :root[dir="rtl"]{ + // right: 37px; + // } + float: right; + top: 9px; +} + +.timeline .timeline-thumb.timeline-icon { + height: 70px; + // text-align: center; + // color: white; + // border: 5px solid #CBD0D3; + // transform: scale(0.2); +} + + + +.timeline .timeline-item { + width: 40px; + +} + +.timeline .timeline-stats { + position: relative; + font-size: 12px; + color: var(--darkgray); + +} + +.empImge { + border-radius: 50%; + width: 100%; + height: 100%; + border: #dedede solid 1px; + +} + +.empImgeRep { + border-radius: 50% !important; + width: 80px; + height: 80px; + border: #dedede solid 1px; +} + +.line { + padding-bottom: 87px; +} + +.attachLable { + position: absolute; + top: 0px; + z-index: 0; + background: #30b8c6; + color: #fff; + border-radius: 50%; + border: 0px; + width: 24px; + height: 24px; + text-align: center; + font-size: 5px; +} + +.removeLable { + top: 0px; + z-index: 0; + background: #d8252d; + color: #fff; + border-radius: 50%; + border: 0px; + width: 20px; + height: 20px; + text-align: center; + font-size: 5px; +} + +.note-modal { + // width: 90%; + // height: 50%; + // top: 20%; + // left: 5%; + // right: 5%; + // bottom: 5%; + background: rgba(0, 0, 0, 0.5) !important; + padding: 30% 10% !important; + --height: 12cm !important; + // --width: 80% !important; + --border-radius: 20px; + +} + +.header-toolbar-new { + --background: #BE332F; +} + +.title { + margin-top: -37px; + margin-left: 85px; +} + +.title-ar { + margin-top: -37px; + margin-right: 101px; +} + +.confirmEitOkButton { + white-space: normal !important; + text-transform: capitalize !important; + min-height: 45px !important; + min-width: 5px !important; + margin: 8px !important; + background-color: #BE332F; + width: 80% !important; + color: white !important; + border-radius: 16px !important; +} + +.approvalTitle-ar { + font-weight: bold; + font-size: 16px; + text-align: right; + +} + +.approvalTitle { + font-weight: bold; + font-size: 16px; + text-align: left; +} \ No newline at end of file diff --git a/Mohem/src/app/profile/confirm-basic-details/confirm-basic-details.component.scss b/Mohem/src/app/profile/confirm-basic-details/confirm-basic-details.component.scss index 2ed98379..a53d7d25 100644 --- a/Mohem/src/app/profile/confirm-basic-details/confirm-basic-details.component.scss +++ b/Mohem/src/app/profile/confirm-basic-details/confirm-basic-details.component.scss @@ -1,263 +1,273 @@ .footer-button { - border-radius: 2px; - padding: 0 1.1em; - min-height: 45px; - min-width: 200px; - } - - .imgSize { - width: 22px; - height: 22px; - } - - .Header { - font-weight: bold; - color: #1a586d !important; - font-size: 10px; - } - - .tbData { - font-size: 10px; - } - - .btnBack { - background: transparent; - float: right; - } - - .attachmentDiv{ - background: #ffffff; - height: auto; - text-align: center; - padding-top: 1px; - margin: 10px; - border-radius: 15px; - border: 1px solid grey; - } - - .noDataDiv{ - background: #ffffff; - height: 11%; - text-align: center; - padding-top: 1px; - border-radius: 10px; - margin: 10px; - border-radius: 5px; - } - .submitNote{ - background: #ffffff; - height: 80px; - padding-top: 1px; - margin: 10px; - border-radius: 15px; - border: 1px solid grey; - } - - .approvalList{ - --background: #f0efef; - height: auto; - text-align: center; - padding-top: 1px; - border-radius: 10px; - margin: 10px; - border-radius: 5px; - } - - /************************New Design**********************************/ - .notification-list{ - background: none; - background: none; - border-radius: 32px; - ion-item{ - // margin-top: 5px; - // margin-bottom: 5px; - - background-color: transparent; - .item-date{ - width: 100%; - font-size: 16px; - font-weight: bold; - - text-align: start; - padding: 0; - margin: 0; - - position: absolute; - left: 0; - top: 12%; - } - ion-label , [item-end]{ - - white-space: normal; - font-size: 14px; - padding-top: 15%; - // :root[dir="ltr"]{ - // margin-left: 10px; - // } - // :root[dir="rtl"]{ - // margin-right: 10px; - // } - - } - + border-radius: 2px; + padding: 0 1.1em; + min-height: 45px; + min-width: 200px; +} + +.imgSize { + width: 22px; + height: 22px; +} + +.Header { + font-weight: bold; + color: #c6903e !important; + font-size: 10px; +} + +.tbData { + font-size: 10px; +} + +.btnBack { + background: transparent; + float: right; +} + +.attachmentDiv { + background: #ffffff; + height: auto; + text-align: center; + padding-top: 1px; + margin: 10px; + border-radius: 15px; + border: 1px solid grey; +} + +.noDataDiv { + background: #ffffff; + height: 11%; + text-align: center; + padding-top: 1px; + border-radius: 10px; + margin: 10px; + border-radius: 5px; +} + +.submitNote { + background: #ffffff; + height: 80px; + padding-top: 1px; + margin: 10px; + border-radius: 15px; + border: 1px solid grey; +} + +.approvalList { + --background: #f0efef; + height: auto; + text-align: center; + padding-top: 1px; + border-radius: 10px; + margin: 10px; + border-radius: 5px; +} + +/************************New Design**********************************/ +.notification-list { + background: none; + background: none; + border-radius: 32px; + + ion-item { + // margin-top: 5px; + // margin-bottom: 5px; + + background-color: transparent; + + .item-date { + width: 100%; + font-size: 16px; + font-weight: bold; + + text-align: start; + padding: 0; + margin: 0; + + position: absolute; + left: 0; + top: 12%; } + + ion-label, + [item-end] { + + white-space: normal; + font-size: 14px; + padding-top: 15%; + // :root[dir="ltr"]{ + // margin-left: 10px; + // } + // :root[dir="rtl"]{ + // margin-right: 10px; + // } + + } + } - - - - - - - .timeline { - position: relative; - margin: 15px 0 0 0; - // border-bottom: solid 1px var(--cusgray); - } - - .timeline:before { - - content: ''; - position: inherit !important; - top: 0; - bottom: 0; - width: 4px; - // background: #e4e4e4; - z-index: 1; - left: 35px; - /* margin-left: -10px; */ - /* z-index: 1; */ - } - - .timeline .timeline-thumb { - - border-radius: 500px; - width: 70px !important; - z-index: 2; - position: absolute; - left: 0px; - // :root[dir="ltr"]{ - // left: 37px; - // } - // :root[dir="rtl"]{ - // right: 37px; - // } - float: right; - top: 9px; - } - - .timeline .timeline-thumb.timeline-icon { - height: 70px; - // text-align: center; - // color: white; - // border: 5px solid #CBD0D3; - // transform: scale(0.2); - } - - - - .timeline .timeline-item { - width: 40px; - - } - - .timeline .timeline-stats { - position: relative; - font-size: 12px; - color: var(--darkgray); - - } - - .empImge{ - border-radius: 50%; - width:100%; - height: 100%; - border: #dedede solid 1px; - - } - .empImgeRep { - border-radius: 50% !important; - width: 80px; - height: 80px; - border: #dedede solid 1px; - } - - .line{ - padding-bottom:87px; - } - - .attachLable{ - position: absolute; - top: 0px; - z-index: 0; - background: #30b8c6; - color: #fff; - border-radius: 50%; - border: 0px; - width: 24px; - height: 24px; - text-align: center; - font-size: 5px; - } - - .removeLable{ - top: 0px; - z-index: 0; - background: #d8252d; - color: #fff; - border-radius: 50%; - border: 0px; - width: 20px; - height: 20px; - text-align: center; - font-size: 5px; - } - - .note-modal { - // width: 90%; - // height: 50%; - // top: 20%; - // left: 5%; - // right: 5%; - // bottom: 5%; - background: rgba(0, 0, 0, 0.5) !important; - padding: 30% 10% !important; - --height: 12cm !important; - // --width: 80% !important; - --border-radius:20px; - - } - .header-toolbar-new{ - --background: #269DB8; - } - .title{ - margin-top: -37px; - margin-left: 85px; - } - .title-ar{ - margin-top: -37px; - margin-right: 101px; - } - .confirmEitOkButton{ - white-space: normal !important; - text-transform: capitalize !important; - min-height: 45px !important; - min-width: 5px !important; - margin: 8px !important; - background-color: #269DB8; - width: 80% !important; - color: white!important; - border-radius: 16px !important; - } - - .approvalTitle-ar{ - font-weight: bold; - font-size: 16px; - text-align: right; - - } - .approvalTitle{ - font-weight: bold; - font-size: 16px; - text-align: left; - } - \ No newline at end of file +} + + + + + + +.timeline { + position: relative; + margin: 15px 0 0 0; + // border-bottom: solid 1px var(--cusgray); +} + +.timeline:before { + + content: ''; + position: inherit !important; + top: 0; + bottom: 0; + width: 4px; + // background: #e4e4e4; + z-index: 1; + left: 35px; + /* margin-left: -10px; */ + /* z-index: 1; */ +} + +.timeline .timeline-thumb { + + border-radius: 500px; + width: 70px !important; + z-index: 2; + position: absolute; + left: 0px; + // :root[dir="ltr"]{ + // left: 37px; + // } + // :root[dir="rtl"]{ + // right: 37px; + // } + float: right; + top: 9px; +} + +.timeline .timeline-thumb.timeline-icon { + height: 70px; + // text-align: center; + // color: white; + // border: 5px solid #CBD0D3; + // transform: scale(0.2); +} + + + +.timeline .timeline-item { + width: 40px; + +} + +.timeline .timeline-stats { + position: relative; + font-size: 12px; + color: var(--darkgray); + +} + +.empImge { + border-radius: 50%; + width: 100%; + height: 100%; + border: #dedede solid 1px; + +} + +.empImgeRep { + border-radius: 50% !important; + width: 80px; + height: 80px; + border: #dedede solid 1px; +} + +.line { + padding-bottom: 87px; +} + +.attachLable { + position: absolute; + top: 0px; + z-index: 0; + background: #30b8c6; + color: #fff; + border-radius: 50%; + border: 0px; + width: 24px; + height: 24px; + text-align: center; + font-size: 5px; +} + +.removeLable { + top: 0px; + z-index: 0; + background: #d8252d; + color: #fff; + border-radius: 50%; + border: 0px; + width: 20px; + height: 20px; + text-align: center; + font-size: 5px; +} + +.note-modal { + // width: 90%; + // height: 50%; + // top: 20%; + // left: 5%; + // right: 5%; + // bottom: 5%; + background: rgba(0, 0, 0, 0.5) !important; + padding: 30% 10% !important; + --height: 12cm !important; + // --width: 80% !important; + --border-radius: 20px; + +} + +.header-toolbar-new { + --background: #BE332F; +} + +.title { + margin-top: -37px; + margin-left: 85px; +} + +.title-ar { + margin-top: -37px; + margin-right: 101px; +} + +.confirmEitOkButton { + white-space: normal !important; + text-transform: capitalize !important; + min-height: 45px !important; + min-width: 5px !important; + margin: 8px !important; + background-color: #BE332F; + width: 80% !important; + color: white !important; + border-radius: 16px !important; +} + +.approvalTitle-ar { + font-weight: bold; + font-size: 16px; + text-align: right; + +} + +.approvalTitle { + font-weight: bold; + font-size: 16px; + text-align: left; +} \ No newline at end of file diff --git a/Mohem/src/app/profile/confirm-contact/confirm-contact.component.scss b/Mohem/src/app/profile/confirm-contact/confirm-contact.component.scss index 2ed98379..a53d7d25 100644 --- a/Mohem/src/app/profile/confirm-contact/confirm-contact.component.scss +++ b/Mohem/src/app/profile/confirm-contact/confirm-contact.component.scss @@ -1,263 +1,273 @@ .footer-button { - border-radius: 2px; - padding: 0 1.1em; - min-height: 45px; - min-width: 200px; - } - - .imgSize { - width: 22px; - height: 22px; - } - - .Header { - font-weight: bold; - color: #1a586d !important; - font-size: 10px; - } - - .tbData { - font-size: 10px; - } - - .btnBack { - background: transparent; - float: right; - } - - .attachmentDiv{ - background: #ffffff; - height: auto; - text-align: center; - padding-top: 1px; - margin: 10px; - border-radius: 15px; - border: 1px solid grey; - } - - .noDataDiv{ - background: #ffffff; - height: 11%; - text-align: center; - padding-top: 1px; - border-radius: 10px; - margin: 10px; - border-radius: 5px; - } - .submitNote{ - background: #ffffff; - height: 80px; - padding-top: 1px; - margin: 10px; - border-radius: 15px; - border: 1px solid grey; - } - - .approvalList{ - --background: #f0efef; - height: auto; - text-align: center; - padding-top: 1px; - border-radius: 10px; - margin: 10px; - border-radius: 5px; - } - - /************************New Design**********************************/ - .notification-list{ - background: none; - background: none; - border-radius: 32px; - ion-item{ - // margin-top: 5px; - // margin-bottom: 5px; - - background-color: transparent; - .item-date{ - width: 100%; - font-size: 16px; - font-weight: bold; - - text-align: start; - padding: 0; - margin: 0; - - position: absolute; - left: 0; - top: 12%; - } - ion-label , [item-end]{ - - white-space: normal; - font-size: 14px; - padding-top: 15%; - // :root[dir="ltr"]{ - // margin-left: 10px; - // } - // :root[dir="rtl"]{ - // margin-right: 10px; - // } - - } - + border-radius: 2px; + padding: 0 1.1em; + min-height: 45px; + min-width: 200px; +} + +.imgSize { + width: 22px; + height: 22px; +} + +.Header { + font-weight: bold; + color: #c6903e !important; + font-size: 10px; +} + +.tbData { + font-size: 10px; +} + +.btnBack { + background: transparent; + float: right; +} + +.attachmentDiv { + background: #ffffff; + height: auto; + text-align: center; + padding-top: 1px; + margin: 10px; + border-radius: 15px; + border: 1px solid grey; +} + +.noDataDiv { + background: #ffffff; + height: 11%; + text-align: center; + padding-top: 1px; + border-radius: 10px; + margin: 10px; + border-radius: 5px; +} + +.submitNote { + background: #ffffff; + height: 80px; + padding-top: 1px; + margin: 10px; + border-radius: 15px; + border: 1px solid grey; +} + +.approvalList { + --background: #f0efef; + height: auto; + text-align: center; + padding-top: 1px; + border-radius: 10px; + margin: 10px; + border-radius: 5px; +} + +/************************New Design**********************************/ +.notification-list { + background: none; + background: none; + border-radius: 32px; + + ion-item { + // margin-top: 5px; + // margin-bottom: 5px; + + background-color: transparent; + + .item-date { + width: 100%; + font-size: 16px; + font-weight: bold; + + text-align: start; + padding: 0; + margin: 0; + + position: absolute; + left: 0; + top: 12%; } + + ion-label, + [item-end] { + + white-space: normal; + font-size: 14px; + padding-top: 15%; + // :root[dir="ltr"]{ + // margin-left: 10px; + // } + // :root[dir="rtl"]{ + // margin-right: 10px; + // } + + } + } - - - - - - - .timeline { - position: relative; - margin: 15px 0 0 0; - // border-bottom: solid 1px var(--cusgray); - } - - .timeline:before { - - content: ''; - position: inherit !important; - top: 0; - bottom: 0; - width: 4px; - // background: #e4e4e4; - z-index: 1; - left: 35px; - /* margin-left: -10px; */ - /* z-index: 1; */ - } - - .timeline .timeline-thumb { - - border-radius: 500px; - width: 70px !important; - z-index: 2; - position: absolute; - left: 0px; - // :root[dir="ltr"]{ - // left: 37px; - // } - // :root[dir="rtl"]{ - // right: 37px; - // } - float: right; - top: 9px; - } - - .timeline .timeline-thumb.timeline-icon { - height: 70px; - // text-align: center; - // color: white; - // border: 5px solid #CBD0D3; - // transform: scale(0.2); - } - - - - .timeline .timeline-item { - width: 40px; - - } - - .timeline .timeline-stats { - position: relative; - font-size: 12px; - color: var(--darkgray); - - } - - .empImge{ - border-radius: 50%; - width:100%; - height: 100%; - border: #dedede solid 1px; - - } - .empImgeRep { - border-radius: 50% !important; - width: 80px; - height: 80px; - border: #dedede solid 1px; - } - - .line{ - padding-bottom:87px; - } - - .attachLable{ - position: absolute; - top: 0px; - z-index: 0; - background: #30b8c6; - color: #fff; - border-radius: 50%; - border: 0px; - width: 24px; - height: 24px; - text-align: center; - font-size: 5px; - } - - .removeLable{ - top: 0px; - z-index: 0; - background: #d8252d; - color: #fff; - border-radius: 50%; - border: 0px; - width: 20px; - height: 20px; - text-align: center; - font-size: 5px; - } - - .note-modal { - // width: 90%; - // height: 50%; - // top: 20%; - // left: 5%; - // right: 5%; - // bottom: 5%; - background: rgba(0, 0, 0, 0.5) !important; - padding: 30% 10% !important; - --height: 12cm !important; - // --width: 80% !important; - --border-radius:20px; - - } - .header-toolbar-new{ - --background: #269DB8; - } - .title{ - margin-top: -37px; - margin-left: 85px; - } - .title-ar{ - margin-top: -37px; - margin-right: 101px; - } - .confirmEitOkButton{ - white-space: normal !important; - text-transform: capitalize !important; - min-height: 45px !important; - min-width: 5px !important; - margin: 8px !important; - background-color: #269DB8; - width: 80% !important; - color: white!important; - border-radius: 16px !important; - } - - .approvalTitle-ar{ - font-weight: bold; - font-size: 16px; - text-align: right; - - } - .approvalTitle{ - font-weight: bold; - font-size: 16px; - text-align: left; - } - \ No newline at end of file +} + + + + + + +.timeline { + position: relative; + margin: 15px 0 0 0; + // border-bottom: solid 1px var(--cusgray); +} + +.timeline:before { + + content: ''; + position: inherit !important; + top: 0; + bottom: 0; + width: 4px; + // background: #e4e4e4; + z-index: 1; + left: 35px; + /* margin-left: -10px; */ + /* z-index: 1; */ +} + +.timeline .timeline-thumb { + + border-radius: 500px; + width: 70px !important; + z-index: 2; + position: absolute; + left: 0px; + // :root[dir="ltr"]{ + // left: 37px; + // } + // :root[dir="rtl"]{ + // right: 37px; + // } + float: right; + top: 9px; +} + +.timeline .timeline-thumb.timeline-icon { + height: 70px; + // text-align: center; + // color: white; + // border: 5px solid #CBD0D3; + // transform: scale(0.2); +} + + + +.timeline .timeline-item { + width: 40px; + +} + +.timeline .timeline-stats { + position: relative; + font-size: 12px; + color: var(--darkgray); + +} + +.empImge { + border-radius: 50%; + width: 100%; + height: 100%; + border: #dedede solid 1px; + +} + +.empImgeRep { + border-radius: 50% !important; + width: 80px; + height: 80px; + border: #dedede solid 1px; +} + +.line { + padding-bottom: 87px; +} + +.attachLable { + position: absolute; + top: 0px; + z-index: 0; + background: #30b8c6; + color: #fff; + border-radius: 50%; + border: 0px; + width: 24px; + height: 24px; + text-align: center; + font-size: 5px; +} + +.removeLable { + top: 0px; + z-index: 0; + background: #d8252d; + color: #fff; + border-radius: 50%; + border: 0px; + width: 20px; + height: 20px; + text-align: center; + font-size: 5px; +} + +.note-modal { + // width: 90%; + // height: 50%; + // top: 20%; + // left: 5%; + // right: 5%; + // bottom: 5%; + background: rgba(0, 0, 0, 0.5) !important; + padding: 30% 10% !important; + --height: 12cm !important; + // --width: 80% !important; + --border-radius: 20px; + +} + +.header-toolbar-new { + --background: #BE332F; +} + +.title { + margin-top: -37px; + margin-left: 85px; +} + +.title-ar { + margin-top: -37px; + margin-right: 101px; +} + +.confirmEitOkButton { + white-space: normal !important; + text-transform: capitalize !important; + min-height: 45px !important; + min-width: 5px !important; + margin: 8px !important; + background-color: #BE332F; + width: 80% !important; + color: white !important; + border-radius: 16px !important; +} + +.approvalTitle-ar { + font-weight: bold; + font-size: 16px; + text-align: right; + +} + +.approvalTitle { + font-weight: bold; + font-size: 16px; + text-align: left; +} \ No newline at end of file diff --git a/Mohem/src/app/profile/edit-profile/edit-profile.component.scss b/Mohem/src/app/profile/edit-profile/edit-profile.component.scss index 85728b60..bfeb8399 100644 --- a/Mohem/src/app/profile/edit-profile/edit-profile.component.scss +++ b/Mohem/src/app/profile/edit-profile/edit-profile.component.scss @@ -1,13 +1,15 @@ -ion-col.colBold, ion-col.colBold > label{ - font-weight:bold; +ion-col.colBold, +ion-col.colBold>label { + font-weight: bold; } -.colorBG{ ---background: #f0efef; +.colorBG { + --background: #f0efef; } -.header-div{ + +.header-div { text-transform: capitalize; - background: #269DB8; + background: #BE332F; display: block; position: relative; height: 160px; @@ -19,36 +21,38 @@ ion-col.colBold, ion-col.colBold > label{ .menubutton { -background: #f0ecec; -min-height: 39px; -width: 35px !important; -height: 20px; -border-radius: 50%; + background: #f0ecec; + min-height: 39px; + width: 35px !important; + height: 20px; + border-radius: 50%; } -.changeIcon{ - /* background: #c1c1c1; */ - width: 21px; - /* height: 26px; */ - border-radius: 50% !important; - position: relative; - color: #7f8c8d; - height: 35px; +.changeIcon { + /* background: #c1c1c1; */ + width: 21px; + /* height: 26px; */ + border-radius: 50% !important; + position: relative; + color: #7f8c8d; + height: 35px; + - } -.changeImgBtn{ +.changeImgBtn { position: absolute; top: 80%; left: 65%; } -.changeImgBtn-ar{ + +.changeImgBtn-ar { position: absolute; top: 80%; left: 66%; } -.profileImg{ + +.profileImg { width: 160px; height: 160px; display: -webkit-inline-box; @@ -73,27 +77,28 @@ border-radius: 50%; text-align: center; } -.line{ +.line { padding-top: 0px !important; /* margin-bottom: 0px; */ /* margin: 0px; */ border-right: 1px #c5c2c2 solid !important; line-height: 10px !important; - + } + .proTitles { margin: 0; padding: 0; font-size: 16px; text-align: center; font-weight: bolder; - color: white; + color: white; margin-top: -33px; } -.profileGrid{ +.profileGrid { border: #bebbbb solid 1px; border-radius: 9px; padding: 0px; @@ -110,16 +115,17 @@ border-radius: 50%; -.lebl{ +.lebl { color: black; font-size: 14px !important; font-weight: bold !important; padding-top: 9px; padding-left: 5px; - + } -.rowBolds{ + +.rowBolds { color: black !important; font-size: 14px !important; /* padding: 6px !important; */ diff --git a/Mohem/src/app/profile/home/home.component.scss b/Mohem/src/app/profile/home/home.component.scss index 8920347a..be86526a 100644 --- a/Mohem/src/app/profile/home/home.component.scss +++ b/Mohem/src/app/profile/home/home.component.scss @@ -15,14 +15,16 @@ } .header-toolbar-new { - --background: #269db8; + --background: #BE332F; } + .colorBG { --background: #f0efef; } + .header-div { text-transform: capitalize; - background: #269db8; + background: #BE332F; display: block; position: relative; height: 113px; @@ -84,6 +86,7 @@ ion-thumbnail.menu-thumb { // margin-left: 30px; // margin-right: 30px; } + .gridService-ar { // margin-top: 87px; // border-radius: 10px; @@ -101,6 +104,7 @@ ion-thumbnail.menu-thumb { // padding-top: 19px; // padding-bottom: 26px; } + .columns-ar { // margin: 10px; // background: #0B4775; @@ -119,10 +123,12 @@ ion-thumbnail.menu-thumb { // font-weight: bold; font-family: var(--fontFamilyPoppins-SemiBold, inherit); } + .services { font-size: 12px; color: white; } + .service-ar { font-size: 20px; color: white; @@ -130,6 +136,7 @@ ion-thumbnail.menu-thumb { font-weight: bold; margin-right: 10px; } + .services-ar { font-size: 20px; color: white; @@ -144,19 +151,23 @@ ion-thumbnail.menu-thumb { border: #bebbbb !important; padding: 2px; } + .p { color: black !important; font-size: medium; text-align: center; border-bottom: rgb(190, 187, 187) solid 1px; } + .itemline { border-bottom: rgb(190, 187, 187) solid 1px; } + .itemlins { border-bottom: rgb(190, 187, 187) solid 1px; margin-bottom: 209px; } + .empName { margin: 0; padding: 0; @@ -166,6 +177,7 @@ ion-thumbnail.menu-thumb { font-size: 16px; margin-top: 38px; } + .empJob { margin: 0; padding: 0; @@ -174,10 +186,12 @@ ion-thumbnail.menu-thumb { font-size: 16px; margin-top: 4px; } + .arrow { width: 20px; height: 22px !important; } + .arrow-ar { float: left; font-size: 25px; @@ -198,6 +212,7 @@ ion-thumbnail.menu-thumb { width: 85%; margin: -12px 0px 0px 25px; } + .service-row-ar { width: 104%; margin: -12px 0px 0px 0px; @@ -206,6 +221,7 @@ ion-thumbnail.menu-thumb { ion-content { --ion-background-color: whitesmoke; } + ion-title { color: white; position: absolute; @@ -218,6 +234,7 @@ ion-title { height: 100%; font-family: WorkSans-Regular; } + .contentBg { padding: 0px 20px; } @@ -225,7 +242,7 @@ ion-title { .contentBg:before { position: absolute; content: ""; - background: #269db8; + background: #BE332F; height: 140px; width: 100%; left: 0; @@ -236,6 +253,7 @@ ion-title { .user-info { text-align: center; margin-bottom: 15px; + .user-image-container { position: relative; width: 100%; @@ -245,6 +263,7 @@ ion-title { margin: 0 auto; align-items: center; } + // position: relative; // width: 80px; // height: 80px; @@ -278,6 +297,7 @@ ion-title { margin-top: -125px; } } + @media screen and (min-width: 768px) and (max-width: 1024px) { .user-image { // position: relative; @@ -307,6 +327,7 @@ ion-title { margin-top: -125px; } } + @media screen and (min-width: 768px) and (max-width: 1024px) { .user-image-ar { // position: relative; @@ -322,7 +343,9 @@ ion-title { border-radius: 80px; margin-bottom: 321px; margin-right: 52px; - }} + } +} + h1 { margin: 0; padding: 0; @@ -330,6 +353,7 @@ h1 { font-size: 18px; margin-bottom: 4px; } + span { font-size: 11px; display: block; @@ -337,11 +361,14 @@ span { } $actionBtnSize: 36px; + .user-actions { text-align: center; + .action-button { font-size: 11px; font-weight: bold; + // white-space: nowrap; // color: #888; .action-button-icon { @@ -350,9 +377,10 @@ $actionBtnSize: 36px; border-radius: $actionBtnSize; margin: 0 auto; display: block; - background-color: #269db8; + background-color: #BE332F; line-height: $actionBtnSize; margin-bottom: 3px; + img { margin: 0 auto; vertical-align: middle; @@ -360,6 +388,7 @@ $actionBtnSize: 36px; } } } + .employee-information-indetail { background: white; margin-top: 15px; @@ -367,10 +396,12 @@ $actionBtnSize: 36px; margin-bottom: 15px; border-radius: 20px; border: 1px solid #ccc; + ion-col { padding: 15px; // border-bottom: 1px solid #ccc; } + h2 { font-size: 13px; // font-family: WorkSans-Bold; @@ -378,6 +409,7 @@ $actionBtnSize: 36px; font-weight: bold; color: rgb(128, 124, 124); } + p { font-size: 13px; margin: 0; @@ -405,9 +437,10 @@ $actionBtnSize: 36px; border-radius: 50% !important; margin-right: 22px; margin-left: 22px; - background-color: #269db8; + background-color: #BE332F; } } + @media screen and (min-width: 768px) and (max-width: 1024px) { .active-Segment { width: 11%; @@ -419,7 +452,7 @@ $actionBtnSize: 36px; border-radius: 50% !important; margin-right: 62px; margin-left: 45px; - background: #269db8 !important; + background: #BE332F !important; padding-left: 17px; } } @@ -438,6 +471,7 @@ $actionBtnSize: 36px; background: #414040 !important; } } + @media screen and (min-width: 768px) and (max-width: 1024px) { .normal-Segment { width: 11%; @@ -465,6 +499,7 @@ $actionBtnSize: 36px; height: 18px; } } + @media screen and (min-width: 768px) and (max-width: 1024px) { .imgSize { position: absolute; @@ -480,6 +515,7 @@ $actionBtnSize: 36px; padding: 15px; border-bottom: 1px solid #ccc; } + .img { width: 100px; height: 100px; @@ -491,6 +527,7 @@ $actionBtnSize: 36px; background: transparent; margin-left: 119%; } + .img-ar { width: 100px; height: 100px; @@ -502,6 +539,7 @@ $actionBtnSize: 36px; background: transparent; margin-right: 119%; } + ///////////////////////// Team Members css //////////////////////@extend .filters-row { @@ -509,11 +547,13 @@ $actionBtnSize: 36px; } .search-dropdown { - background: #269db8; + background: #BE332F; + ion-select { .select-text { margin-left: -10px; } + .select-icon { .select-icon-inner { opacity: 1; @@ -526,6 +566,7 @@ $actionBtnSize: 36px; .input-container { background: white; + ion-input { border-bottom-color: transparent; } @@ -533,17 +574,20 @@ $actionBtnSize: 36px; .search-container { margin-top: 15px; + ion-col { background: white; border-radius: 12px; padding-right: 10px; flex: none; + ion-icon { margin-right: 3px; font-size: 14px; margin-left: 3px; vertical-align: middle; } + span { font-size: 12px; vertical-align: middle; @@ -567,11 +611,13 @@ $actionBtnSize: 36px; margin-top: -1px; margin-left: 43px; } + .activeArrow { height: 20px; width: 20px; - color: #269db8; + color: #BE332F; } + .disabledArrow { height: 20px; width: 20px; @@ -581,9 +627,10 @@ $actionBtnSize: 36px; .activeArrow-ar { height: 20px; width: 20px; - color: #269db8; + color: #BE332F; margin-right: 275px; } + .disabledArrow-ar { height: 20px; width: 20px; @@ -608,6 +655,7 @@ $actionBtnSize: 36px; width: 90%; left: 5%; } + .result-graph-ar { position: relative; background: white; @@ -658,6 +706,7 @@ $actionBtnSize: 36px; right: 5%; } } + .result-graph-attendence { position: relative; background: white; @@ -678,6 +727,7 @@ $actionBtnSize: 36px; margin-bottom: 10px; margin-left: 10px; } + .request-heading-ar { text-align: right; display: block; @@ -695,12 +745,14 @@ $actionBtnSize: 36px; display: block; text-align: center; transform: translate(-50%, -50%); + h2 { font-size: 38px; font-family: WorkSans-Bold; margin: 0 auto; line-height: 36px; } + span { width: 125px; display: block; @@ -709,6 +761,7 @@ $actionBtnSize: 36px; font-family: workSans-Regular; } } + .today-graph { // width: 100%; max-height: 4cm; @@ -753,6 +806,7 @@ $actionBtnSize: 36px; line-height: 11px !important; display: block; } + h2 { font-size: 25px; font-weight: bold; @@ -790,6 +844,7 @@ $actionBtnSize: 36px; margin: 0; font-size: 14px; } + span { font-size: 9px; } @@ -801,6 +856,7 @@ $actionBtnSize: 36px; margin: 0; font-size: 14px; } + span { font-size: 11px; margin-bottom: 3px; @@ -815,14 +871,14 @@ $actionBtnSize: 36px; } .green-label-container { - // border-top: 5px solid #269DB8; + // border-top: 5px solid #BE332F; // padding: 1px 0px; // margin: 15px 0px width: 12px; height: 12px; padding-right: -10px; border-radius: 100%; - background-color: #269db8; + background-color: #BE332F; } .blue-label-container { @@ -836,6 +892,7 @@ $actionBtnSize: 36px; background-color: #292f42; margin-top: 30px; } + .span-one { // display: block; // font-size: 12px; @@ -847,6 +904,7 @@ $actionBtnSize: 36px; margin-top: -2px; font-weight: bold; } + .span-two { // display: block; // font-size: 22px; @@ -870,6 +928,7 @@ $actionBtnSize: 36px; margin-top: 28px; font-weight: bold; } + .spa-two { // display: block; // font-size: 22px; @@ -881,11 +940,13 @@ $actionBtnSize: 36px; font-weight: bold; font-family: WorkSans-Bold; } + .graph-container { margin-left: -50px; position: relative; margin-right: 50px; } + .label-container { position: absolute; // width: 20%; @@ -894,12 +955,14 @@ $actionBtnSize: 36px; margin-top: -27px; left: 20px; } + .attendance-summary .attendance-information { span { height: 32px; display: block; line-height: 14px; } + h2 { // text-align: right; // font-family: WorkSans-Bold; @@ -915,6 +978,7 @@ $actionBtnSize: 36px; border-radius: 20px; border: 1px solid #ccc; padding-bottom: 25px; + span { text-align: left; display: block; @@ -923,11 +987,13 @@ $actionBtnSize: 36px; margin-left: 10px; } } + .calendar-container-ar { background: white; margin-bottom: 100px; margin-top: 20px; border-radius: 20px; + span { text-align: right; display: block; @@ -958,6 +1024,7 @@ $actionBtnSize: 36px; font-family: WorkSans-Bold; font-size: 16px; } + .stats { color: #289db8; font-size: 9px; @@ -977,7 +1044,7 @@ $actionBtnSize: 36px; height: 20px; padding-right: -10px; border-radius: 100%; - background-color: #269db8; + background-color: #BE332F; z-index: 9; margin-top: 26px; } @@ -1005,7 +1072,7 @@ $actionBtnSize: 36px; .header-background-style-card { padding-top: 1px; - background: #269db8; + background: #BE332F; height: 115px; } @@ -1013,66 +1080,63 @@ $actionBtnSize: 36px; text-align: center; width: 20px; } -@media screen and (min-width: 1px) and (max-width:766px){ -.grid-card { - right: 5px; - position: relative; - display: block; - z-index: 5; - width: 103%; -}} -@media screen and (min-width: 1px) and (max-width:766px){ -.grid-card-ar { - left: 5px; - position: relative; - display: block; - z-index: 5; - width: 103%; -}} -@media screen and (min-width: 768px) and (max-width:1050px){ -.grid-card { - right: 5px; - position: relative; - display: block; - z-index: 5; - width: 101%; -}} -@media screen and (min-width: 768px) and (max-width:1050px){ -.grid-card-ar { - left: 5px; - position: relative; - display: block; - z-index: 5; - width: 101%; -}} -@media screen and (min-width: 1px) and (max-width:766px){ -.changeImgBtn { - position: absolute; - background: #f0ecec; - min-height: 25px; - width: 24px !important; - height: 20px; - border-radius: 50%; - bottom: 55px; - right: 36%; - top: -15%; - z-index: 99; -}} -@media screen and (min-width: 768px) and (max-width:1050px){ -.changeImgBtn { - position: absolute; - background: #f0ecec; - min-height: 25px; - width: 24px !important; - height: 20px; - border-radius: 50%; - bottom: 55px; - right: 41%; - top: -10%; - z-index: 99; -}} -@media screen and (min-width: 1060px) and (max-width:1090px){ +@media screen and (min-width: 1px) and (max-width:766px) { + .grid-card { + right: 5px; + position: relative; + display: block; + z-index: 5; + width: 103%; + } +} + +@media screen and (min-width: 1px) and (max-width:766px) { + .grid-card-ar { + left: 5px; + position: relative; + display: block; + z-index: 5; + width: 103%; + } +} + +@media screen and (min-width: 768px) and (max-width:1050px) { + .grid-card { + right: 5px; + position: relative; + display: block; + z-index: 5; + width: 101%; + } +} + +@media screen and (min-width: 768px) and (max-width:1050px) { + .grid-card-ar { + left: 5px; + position: relative; + display: block; + z-index: 5; + width: 101%; + } +} + +@media screen and (min-width: 1px) and (max-width:766px) { + .changeImgBtn { + position: absolute; + background: #f0ecec; + min-height: 25px; + width: 24px !important; + height: 20px; + border-radius: 50%; + bottom: 55px; + right: 36%; + top: -15%; + z-index: 99; + } +} + +@media screen and (min-width: 768px) and (max-width:1050px) { .changeImgBtn { position: absolute; background: #f0ecec; @@ -1084,9 +1148,25 @@ $actionBtnSize: 36px; right: 41%; top: -10%; z-index: 99; - }} + } +} -@media screen and (min-width: 1px) and (max-width:766px){ +@media screen and (min-width: 1060px) and (max-width:1090px) { + .changeImgBtn { + position: absolute; + background: #f0ecec; + min-height: 25px; + width: 24px !important; + height: 20px; + border-radius: 50%; + bottom: 55px; + right: 41%; + top: -10%; + z-index: 99; + } +} + +@media screen and (min-width: 1px) and (max-width:766px) { .changeImgBtn-ar { position: absolute; background: #f0ecec; @@ -1098,8 +1178,10 @@ $actionBtnSize: 36px; left: 36%; top: -15%; z-index: 99; - }} - @media screen and (min-width: 768px) and (max-width:1050px){ + } +} + +@media screen and (min-width: 768px) and (max-width:1050px) { .changeImgBtn-ar { position: absolute; background: #f0ecec; @@ -1111,20 +1193,23 @@ $actionBtnSize: 36px; left: 41%; top: -10%; z-index: 99; - }} - @media screen and (min-width: 1060px) and (max-width:1090px){ - .changeImgBtn-ar { - position: absolute; - background: #f0ecec; - min-height: 25px; - width: 24px !important; - height: 20px; - border-radius: 50%; - bottom: 55px; - left: 46%; - top: -10%; - z-index: 99; - }} + } +} + +@media screen and (min-width: 1060px) and (max-width:1090px) { + .changeImgBtn-ar { + position: absolute; + background: #f0ecec; + min-height: 25px; + width: 24px !important; + height: 20px; + border-radius: 50%; + bottom: 55px; + left: 46%; + top: -10%; + z-index: 99; + } +} .menubutton { background: #f0ecec; @@ -1165,18 +1250,18 @@ $actionBtnSize: 36px; border: none; } -.card-size-info-en{ +.card-size-info-en { // width: 88%; // left: 2%; // width: 89%; // left: 10px; - width: 90%; - left: 5%; - padding-left: 0px; - margin-left: 0px; + width: 90%; + left: 5%; + padding-left: 0px; + margin-left: 0px; } -.card-size-info-ar{ +.card-size-info-ar { width: 90%; right: 3%; padding-right: 0px; @@ -1203,12 +1288,18 @@ $actionBtnSize: 36px; // color: #2B353E; // opacity: 1; // } -.update{ - --background: #20A169; background: white; width: 100%; +.update { + --background: #20A169; + background: white; + width: 100%; } -.add{ - --background: #00bcd4; background: white; width: 100%; + +.add { + --background: #00bcd4; + background: white; + width: 100%; } + .add-icon-styling { background-color: #191814; width: 35px; @@ -1219,7 +1310,7 @@ $actionBtnSize: 36px; right: 30px; } -.name{ +.name { text-align: center; letter-spacing: -0.84px; color: #2B353E; @@ -1228,7 +1319,8 @@ $actionBtnSize: 36px; line-height: 21px; font-size: 21px; } -.email{ + +.email { text-align: center; font-family: var(--fontFamilyPoppins-SemiBold, inherit); font-size: 13px; @@ -1239,19 +1331,19 @@ $actionBtnSize: 36px; } -.subTitle{ +.subTitle { text-align: center; letter-spacing: -0.52px; color: #A2A2A2; opacity: 1; font-family: var(--fontFamilyPoppins-SemiBold, inherit); font-size: 13px; - line-height: 0px; + line-height: 0px; margin-bottom: 7px; } -.boldText{ +.boldText { text-align: center; letter-spacing: -0.64px; color: #2B353E; @@ -1261,15 +1353,15 @@ $actionBtnSize: 36px; line-height: 19px; } -.btnTitle{ +.btnTitle { text-align: center; font-family: var(--fontFamilyPoppins-SemiBold, inherit); line-height: 10px; - font-size: 11px; + font-size: 11px; color: #4D4D4D; } -.Profileheader-label-text-form{ +.Profileheader-label-text-form { text-align: left; font-family: var(--fontFamilyPoppins-SemiBold, inherit); line-height: 30px; @@ -1281,8 +1373,8 @@ $actionBtnSize: 36px; margin-bottom: 2px; } -.header-label-text-form{ - text-align: left; +.header-label-text-form { + text-align: left; font-family: var(--fontFamilyPoppins-SemiBold, inherit); line-height: 30px; font-size: 20px; @@ -1291,10 +1383,11 @@ $actionBtnSize: 36px; opacity: 1; margin-top: -3px; margin-bottom: 2px; - margin-left: -11px;} + margin-left: -11px; +} -.type-label-text-form{ +.type-label-text-form { text-align: left; font-family: var(--fontFamilyPoppins-SemiBold, inherit); line-height: 20px; @@ -1304,7 +1397,7 @@ $actionBtnSize: 36px; opacity: 1; } -.result-label-text-form{ +.result-label-text-form { text-align: left; font-family: var(--fontFamilyPoppins-SemiBold, inherit); line-height: 20px; @@ -1315,7 +1408,7 @@ $actionBtnSize: 36px; } -.Profileheader-label-text-form-ar{ +.Profileheader-label-text-form-ar { text-align: right; font-family: var(--fontFamilyPoppins-SemiBold, inherit); line-height: 30px; @@ -1327,8 +1420,8 @@ $actionBtnSize: 36px; margin-bottom: 2px; } -.header-label-text-form-ar{ - text-align: right; +.header-label-text-form-ar { + text-align: right; font-family: var(--fontFamilyPoppins-SemiBold, inherit); line-height: 30px; font-size: 20px; @@ -1337,10 +1430,11 @@ $actionBtnSize: 36px; opacity: 1; margin-top: -3px; margin-bottom: 2px; - margin-left: -11px;} + margin-left: -11px; +} -.type-label-text-form-ar{ +.type-label-text-form-ar { text-align: right; font-family: var(--fontFamilyPoppins-SemiBold, inherit); line-height: 20px; @@ -1350,7 +1444,7 @@ $actionBtnSize: 36px; opacity: 1; } -.result-label-text-form-ar{ +.result-label-text-form-ar { text-align: right; font-family: var(--fontFamilyPoppins-SemiBold, inherit); line-height: 20px; @@ -1359,56 +1453,63 @@ $actionBtnSize: 36px; color: #2B353E; opacity: 1; } -.create-edit{ + +.create-edit { font-size: 20px; } -.profile-green{ - background: #20A16A; - margin-right: 5px; - width: 80px; - height: 8px; + +.profile-green { + background: #20A16A; + margin-right: 5px; + width: 80px; + height: 8px; border-radius: 5px; } -.profile-gray{ - background: #D9D9D9; - margin-right: 5px; - width: 80px; - height: 8px; +.profile-gray { + background: #D9D9D9; + margin-right: 5px; + width: 80px; + height: 8px; border-radius: 5px; } -.family-member-button{ - width: 115px; - height: 45px; - background-color: #F5F5F5; - display: flex; - align-items: center; - padding: 16px; + +.family-member-button { + width: 115px; + height: 45px; + background-color: #F5F5F5; + display: flex; + align-items: center; + padding: 16px; border-radius: 20px; box-shadow: 0px 0px 5px #00000029; } -.profile-note-en{ - margin-left: 20px; - margin-top: 5px; + +.profile-note-en { + margin-left: 20px; + margin-top: 5px; font-size: 13px; } -.profile-note-ar{ - margin-right: 20px; - margin-top: 5px; + +.profile-note-ar { + margin-right: 20px; + margin-top: 5px; font-size: 13px; } -.profile-compilation-en{ - margin-left: 20px; - margin-top: 5px; +.profile-compilation-en { + margin-left: 20px; + margin-top: 5px; font-size: 13px; } -.profile-compilation-ar{ - margin-left: 20px; - margin-top: 5px; + +.profile-compilation-ar { + margin-left: 20px; + margin-top: 5px; font-size: 13px; } -.disabledButton{ - opacity:.5; -pointer-events: none; -} + +.disabledButton { + opacity: .5; + pointer-events: none; +} \ No newline at end of file diff --git a/Mohem/src/app/profile/modal/edit-detail-profile/edit-detail-profile.component.html b/Mohem/src/app/profile/modal/edit-detail-profile/edit-detail-profile.component.html index 04ed513a..203320cc 100644 --- a/Mohem/src/app/profile/modal/edit-detail-profile/edit-detail-profile.component.html +++ b/Mohem/src/app/profile/modal/edit-detail-profile/edit-detail-profile.component.html @@ -34,7 +34,7 @@
- {{ts.trPK('general','next')}} + {{ts.trPK('general','next')}}
diff --git a/Mohem/src/app/profile/modal/edit-detail-profile/edit-detail-profile.component.ts b/Mohem/src/app/profile/modal/edit-detail-profile/edit-detail-profile.component.ts index 03e9ea84..2badc98d 100644 --- a/Mohem/src/app/profile/modal/edit-detail-profile/edit-detail-profile.component.ts +++ b/Mohem/src/app/profile/modal/edit-detail-profile/edit-detail-profile.component.ts @@ -16,9 +16,9 @@ export class EditDetailProfileComponent implements OnInit { public ts: TranslatorService, ) { } - colorRadio = "#269db8" + colorRadio = "#BE332F" - ngOnInit() { + ngOnInit() { console.log(this.sourceName); } diff --git a/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.scss b/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.scss index 090524b4..ae632df7 100644 --- a/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.scss +++ b/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.scss @@ -1,20 +1,18 @@ +.colorBG { + --background: #f0efef; +} +.header-div { + text-transform: capitalize; + background: #BE332F; + display: block; + position: relative; + height: 160px; + margin-bottom: 60px; + padding-top: 10px; +} - -.colorBG{ - --background: #f0efef; - } - .header-div{ - text-transform: capitalize; - background: #269DB8; - display: block; - position: relative; - height: 160px; - margin-bottom: 60px; - padding-top: 10px; - } - -.btnBack{ +.btnBack { background: var(--customnavy); white-space: normal; color: var(--light); @@ -23,11 +21,12 @@ margin-top: -8px !important; } -.profilediv{ +.profilediv { margin-left: 337px; } -.profileImg{ + +.profileImg { width: 25px; height: 24px; /* display: -webkit-inline-box; */ @@ -38,72 +37,74 @@ position: relative; top: -22px; // margin-left: 337px; - + } .proTitles { - margin: 0; - padding: 0; - font-size: 16px; - text-align: center; - font-weight: bolder; - color: white; - margin-top: -33px; - } - - .grid{ - - background-color: #f9f9f9; - margin-top: 9px; - margin-bottom: 7px !important; - border-radius: 21px; - margin-bottom: 26px; - margin-left: 14px; - margin-right: 14px; - padding-bottom: 1px; - border: solid #d7d4d4 !important; - - } - .Text { - margin: 0; - padding: 0; - text-align: center; - font-weight: bolder; - color: black; - font-size: 16px; - margin-top: 5px; - margin-bottom: 10px; - text-align: center; - // margin-left: 74px; - width: 100%; - } - .Text-ar{ - margin: 0; - padding: 0; - text-align: center; - font-weight: bolder; - color: black; - font-size: 16px; - margin-top: 5px; - margin-bottom: 10px; - text-align: center; - - margin-right: 131px; - } - - .leftgrid{ - margin-left: 10px; - background: white; - border: solid #d7d4d4; - margin: 7px; - border-radius: 24px; - width: 30% !important; - padding-bottom: 9px; - padding-top: 11px; - padding-left: 10px; -} - -.rightgrid{ + margin: 0; + padding: 0; + font-size: 16px; + text-align: center; + font-weight: bolder; + color: white; + margin-top: -33px; +} + +.grid { + + background-color: #f9f9f9; + margin-top: 9px; + margin-bottom: 7px !important; + border-radius: 21px; + margin-bottom: 26px; + margin-left: 14px; + margin-right: 14px; + padding-bottom: 1px; + border: solid #d7d4d4 !important; + +} + +.Text { + margin: 0; + padding: 0; + text-align: center; + font-weight: bolder; + color: black; + font-size: 16px; + margin-top: 5px; + margin-bottom: 10px; + text-align: center; + // margin-left: 74px; + width: 100%; +} + +.Text-ar { + margin: 0; + padding: 0; + text-align: center; + font-weight: bolder; + color: black; + font-size: 16px; + margin-top: 5px; + margin-bottom: 10px; + text-align: center; + + margin-right: 131px; +} + +.leftgrid { + margin-left: 10px; + background: white; + border: solid #d7d4d4; + margin: 7px; + border-radius: 24px; + width: 30% !important; + padding-bottom: 9px; + padding-top: 11px; + padding-left: 10px; +} + +.rightgrid { margin-left: 10px; background: white; border: solid #d7d4d4; @@ -114,10 +115,10 @@ padding-top: 11px; padding-left: 10px; margin-right: 189px; - + } -.performancecolor{ +.performancecolor { border: solid #bebbbb 1px !important; border-radius: 13px; margin-top: 0px !important; @@ -125,29 +126,31 @@ padding-right: 8px !important; width: 65px; margin-bottom: -10px; - + } -.label{ +.label { font-size: 13px !important; margin-top: -7px !important; font-weight: bold !important; } -.label-ar{ - font-size: 15px !important; - margin-top: -7px !important; - font-weight: bold !important; + +.label-ar { + font-size: 15px !important; + margin-top: -7px !important; + font-weight: bold !important; } -.labelvalue{ +.labelvalue { font-size: 25px !important; font-weight: bold !important; margin-top: 7px !important; margin-left: 90px !important; } -.labelvalue-ar{ + +.labelvalue-ar { // margin-right: 19px !important; font-size: 24px !important; font-weight: bold !important; @@ -155,29 +158,29 @@ } -.percentage{ +.percentage { font-size: 20px !important; margin-top: 15px !important; margin-left: -7px; } -.percentage-ar{ + +.percentage-ar { // margin-right: -54px; font-size: 19px !important; - margin-right: -51px; + margin-right: -51px; } -.gauge{ +.gauge { // transform: translate(-24px, -65px); margin-bottom: -140px; margin-top: -70px; } -.gauge-ar{ + +.gauge-ar { transform: translate(-24px, -65px); margin-bottom: -187px; margin-top: -20px; margin-right: -56px; -} - - +} \ No newline at end of file diff --git a/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.ts b/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.ts index a3a61872..91f49925 100644 --- a/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.ts +++ b/Mohem/src/app/profile/performance-evaluation/performance-evaluation.component.ts @@ -48,7 +48,7 @@ export class PerformanceEvaluationComponent implements OnInit { colorScheme = { - domain: ['#269DB8', '#269DB8', '#3CB9D5', '#1FA269', '#0D155E'] + domain: ['#BE332F', '#BE332F', '#3CB9D5', '#1FA269', '#0D155E'] }; ngOnInit() { diff --git a/Mohem/src/app/profile/profile-image/profile-image.component.scss b/Mohem/src/app/profile/profile-image/profile-image.component.scss index c686e7e3..2ae1509d 100644 --- a/Mohem/src/app/profile/profile-image/profile-image.component.scss +++ b/Mohem/src/app/profile/profile-image/profile-image.component.scss @@ -8,23 +8,23 @@ // background: transparent; // border-radius: 50% !important; // } -.header-toolbar-new{ - --background: #269DB8; - } +.header-toolbar-new { + --background: #BE332F; +} -.imgCircle{ -// width: 90px; -// height: 90px; -// display: inline-flex; -// overflow: hidden; -// background: transparent; -// -webkit-border-radius:50% !important; -// -moz-border-radius:50% !important; -// border-radius: 50% !important; -// // margin:0 auto 40px; +.imgCircle { + // width: 90px; + // height: 90px; + // display: inline-flex; + // overflow: hidden; + // background: transparent; + // -webkit-border-radius:50% !important; + // -moz-border-radius:50% !important; + // border-radius: 50% !important; + // // margin:0 auto 40px; -position: relative; -width: 234px; + position: relative; + width: 234px; height: 215px; margin-top: 33px !important; margin: auto; @@ -33,22 +33,23 @@ width: 234px; overflow: hidden; background: transparent; border-radius: 50% !important; - color:#fff; -// background-color: rgba(0,0,0,0.1); -// box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); + color: #fff; + // background-color: rgba(0,0,0,0.1); + // box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); - img{ - -webkit-border-radius:50% !important; - -moz-border-radius:50% !important; + img { + -webkit-border-radius: 50% !important; + -moz-border-radius: 50% !important; border-radius: 50% !important; height: auto !important; width: 70% !important; } + //box-shadow: 0px 0px 0px 10px #8c8c8c; } -.header-toolbar-new{ - --background: #269DB8; - } \ No newline at end of file +.header-toolbar-new { + --background: #BE332F; +} \ No newline at end of file diff --git a/Mohem/src/app/profile/submit-eit-modal/submit-address-modal.component.scss b/Mohem/src/app/profile/submit-eit-modal/submit-address-modal.component.scss index 5a81509a..93545e99 100644 --- a/Mohem/src/app/profile/submit-eit-modal/submit-address-modal.component.scss +++ b/Mohem/src/app/profile/submit-eit-modal/submit-address-modal.component.scss @@ -1,53 +1,52 @@ -.rowBtn{ +.rowBtn { display: flex; flex-direction: row; justify-content: center; align-items: center; } -.Header{ +.Header { color: black !important; font-size: 25px !important; - font-weight: bold !important;; + font-weight: bold !important; + ; margin: 0; text-align: center; margin-bottom: 20px; } -.labelRadio{ +.labelRadio { color: black !important; font-weight: bold !important; padding-bottom: 20px; } -.labelcheck{ +.labelcheck { color: red !important; font-weight: bold !important; margin-bottom: 10px; } -.submitOkButton{ +.submitOkButton { white-space: normal !important; text-transform: capitalize !important; min-height: 45px !important; min-width: 5px !important; margin: 8px !important; - --background:: #269DB8; + --background: #BE332F; width: 100% !important; - color: white!important; + color: white !important; border-radius: 16px !important; } -.submitCancelButton{ + +.submitCancelButton { white-space: normal !important; text-transform: capitalize !important; min-height: 45px !important; min-width: 5px !important; margin: 8px !important; - --background:: #269DB8; + --background: #BE332F; width: 100% !important; - color: white!important; + color: white !important; border-radius: 16px !important; -} - - - +} \ No newline at end of file diff --git a/Mohem/src/app/termination/confirm-termination/confirm-termination.component.scss b/Mohem/src/app/termination/confirm-termination/confirm-termination.component.scss index 2ed98379..a53d7d25 100644 --- a/Mohem/src/app/termination/confirm-termination/confirm-termination.component.scss +++ b/Mohem/src/app/termination/confirm-termination/confirm-termination.component.scss @@ -1,263 +1,273 @@ .footer-button { - border-radius: 2px; - padding: 0 1.1em; - min-height: 45px; - min-width: 200px; - } - - .imgSize { - width: 22px; - height: 22px; - } - - .Header { - font-weight: bold; - color: #1a586d !important; - font-size: 10px; - } - - .tbData { - font-size: 10px; - } - - .btnBack { - background: transparent; - float: right; - } - - .attachmentDiv{ - background: #ffffff; - height: auto; - text-align: center; - padding-top: 1px; - margin: 10px; - border-radius: 15px; - border: 1px solid grey; - } - - .noDataDiv{ - background: #ffffff; - height: 11%; - text-align: center; - padding-top: 1px; - border-radius: 10px; - margin: 10px; - border-radius: 5px; - } - .submitNote{ - background: #ffffff; - height: 80px; - padding-top: 1px; - margin: 10px; - border-radius: 15px; - border: 1px solid grey; - } - - .approvalList{ - --background: #f0efef; - height: auto; - text-align: center; - padding-top: 1px; - border-radius: 10px; - margin: 10px; - border-radius: 5px; - } - - /************************New Design**********************************/ - .notification-list{ - background: none; - background: none; - border-radius: 32px; - ion-item{ - // margin-top: 5px; - // margin-bottom: 5px; - - background-color: transparent; - .item-date{ - width: 100%; - font-size: 16px; - font-weight: bold; - - text-align: start; - padding: 0; - margin: 0; - - position: absolute; - left: 0; - top: 12%; - } - ion-label , [item-end]{ - - white-space: normal; - font-size: 14px; - padding-top: 15%; - // :root[dir="ltr"]{ - // margin-left: 10px; - // } - // :root[dir="rtl"]{ - // margin-right: 10px; - // } - - } - + border-radius: 2px; + padding: 0 1.1em; + min-height: 45px; + min-width: 200px; +} + +.imgSize { + width: 22px; + height: 22px; +} + +.Header { + font-weight: bold; + color: #c6903e !important; + font-size: 10px; +} + +.tbData { + font-size: 10px; +} + +.btnBack { + background: transparent; + float: right; +} + +.attachmentDiv { + background: #ffffff; + height: auto; + text-align: center; + padding-top: 1px; + margin: 10px; + border-radius: 15px; + border: 1px solid grey; +} + +.noDataDiv { + background: #ffffff; + height: 11%; + text-align: center; + padding-top: 1px; + border-radius: 10px; + margin: 10px; + border-radius: 5px; +} + +.submitNote { + background: #ffffff; + height: 80px; + padding-top: 1px; + margin: 10px; + border-radius: 15px; + border: 1px solid grey; +} + +.approvalList { + --background: #f0efef; + height: auto; + text-align: center; + padding-top: 1px; + border-radius: 10px; + margin: 10px; + border-radius: 5px; +} + +/************************New Design**********************************/ +.notification-list { + background: none; + background: none; + border-radius: 32px; + + ion-item { + // margin-top: 5px; + // margin-bottom: 5px; + + background-color: transparent; + + .item-date { + width: 100%; + font-size: 16px; + font-weight: bold; + + text-align: start; + padding: 0; + margin: 0; + + position: absolute; + left: 0; + top: 12%; } + + ion-label, + [item-end] { + + white-space: normal; + font-size: 14px; + padding-top: 15%; + // :root[dir="ltr"]{ + // margin-left: 10px; + // } + // :root[dir="rtl"]{ + // margin-right: 10px; + // } + + } + } - - - - - - - .timeline { - position: relative; - margin: 15px 0 0 0; - // border-bottom: solid 1px var(--cusgray); - } - - .timeline:before { - - content: ''; - position: inherit !important; - top: 0; - bottom: 0; - width: 4px; - // background: #e4e4e4; - z-index: 1; - left: 35px; - /* margin-left: -10px; */ - /* z-index: 1; */ - } - - .timeline .timeline-thumb { - - border-radius: 500px; - width: 70px !important; - z-index: 2; - position: absolute; - left: 0px; - // :root[dir="ltr"]{ - // left: 37px; - // } - // :root[dir="rtl"]{ - // right: 37px; - // } - float: right; - top: 9px; - } - - .timeline .timeline-thumb.timeline-icon { - height: 70px; - // text-align: center; - // color: white; - // border: 5px solid #CBD0D3; - // transform: scale(0.2); - } - - - - .timeline .timeline-item { - width: 40px; - - } - - .timeline .timeline-stats { - position: relative; - font-size: 12px; - color: var(--darkgray); - - } - - .empImge{ - border-radius: 50%; - width:100%; - height: 100%; - border: #dedede solid 1px; - - } - .empImgeRep { - border-radius: 50% !important; - width: 80px; - height: 80px; - border: #dedede solid 1px; - } - - .line{ - padding-bottom:87px; - } - - .attachLable{ - position: absolute; - top: 0px; - z-index: 0; - background: #30b8c6; - color: #fff; - border-radius: 50%; - border: 0px; - width: 24px; - height: 24px; - text-align: center; - font-size: 5px; - } - - .removeLable{ - top: 0px; - z-index: 0; - background: #d8252d; - color: #fff; - border-radius: 50%; - border: 0px; - width: 20px; - height: 20px; - text-align: center; - font-size: 5px; - } - - .note-modal { - // width: 90%; - // height: 50%; - // top: 20%; - // left: 5%; - // right: 5%; - // bottom: 5%; - background: rgba(0, 0, 0, 0.5) !important; - padding: 30% 10% !important; - --height: 12cm !important; - // --width: 80% !important; - --border-radius:20px; - - } - .header-toolbar-new{ - --background: #269DB8; - } - .title{ - margin-top: -37px; - margin-left: 85px; - } - .title-ar{ - margin-top: -37px; - margin-right: 101px; - } - .confirmEitOkButton{ - white-space: normal !important; - text-transform: capitalize !important; - min-height: 45px !important; - min-width: 5px !important; - margin: 8px !important; - background-color: #269DB8; - width: 80% !important; - color: white!important; - border-radius: 16px !important; - } - - .approvalTitle-ar{ - font-weight: bold; - font-size: 16px; - text-align: right; - - } - .approvalTitle{ - font-weight: bold; - font-size: 16px; - text-align: left; - } - \ No newline at end of file +} + + + + + + +.timeline { + position: relative; + margin: 15px 0 0 0; + // border-bottom: solid 1px var(--cusgray); +} + +.timeline:before { + + content: ''; + position: inherit !important; + top: 0; + bottom: 0; + width: 4px; + // background: #e4e4e4; + z-index: 1; + left: 35px; + /* margin-left: -10px; */ + /* z-index: 1; */ +} + +.timeline .timeline-thumb { + + border-radius: 500px; + width: 70px !important; + z-index: 2; + position: absolute; + left: 0px; + // :root[dir="ltr"]{ + // left: 37px; + // } + // :root[dir="rtl"]{ + // right: 37px; + // } + float: right; + top: 9px; +} + +.timeline .timeline-thumb.timeline-icon { + height: 70px; + // text-align: center; + // color: white; + // border: 5px solid #CBD0D3; + // transform: scale(0.2); +} + + + +.timeline .timeline-item { + width: 40px; + +} + +.timeline .timeline-stats { + position: relative; + font-size: 12px; + color: var(--darkgray); + +} + +.empImge { + border-radius: 50%; + width: 100%; + height: 100%; + border: #dedede solid 1px; + +} + +.empImgeRep { + border-radius: 50% !important; + width: 80px; + height: 80px; + border: #dedede solid 1px; +} + +.line { + padding-bottom: 87px; +} + +.attachLable { + position: absolute; + top: 0px; + z-index: 0; + background: #30b8c6; + color: #fff; + border-radius: 50%; + border: 0px; + width: 24px; + height: 24px; + text-align: center; + font-size: 5px; +} + +.removeLable { + top: 0px; + z-index: 0; + background: #d8252d; + color: #fff; + border-radius: 50%; + border: 0px; + width: 20px; + height: 20px; + text-align: center; + font-size: 5px; +} + +.note-modal { + // width: 90%; + // height: 50%; + // top: 20%; + // left: 5%; + // right: 5%; + // bottom: 5%; + background: rgba(0, 0, 0, 0.5) !important; + padding: 30% 10% !important; + --height: 12cm !important; + // --width: 80% !important; + --border-radius: 20px; + +} + +.header-toolbar-new { + --background: #BE332F; +} + +.title { + margin-top: -37px; + margin-left: 85px; +} + +.title-ar { + margin-top: -37px; + margin-right: 101px; +} + +.confirmEitOkButton { + white-space: normal !important; + text-transform: capitalize !important; + min-height: 45px !important; + min-width: 5px !important; + margin: 8px !important; + background-color: #BE332F; + width: 80% !important; + color: white !important; + border-radius: 16px !important; +} + +.approvalTitle-ar { + font-weight: bold; + font-size: 16px; + text-align: right; + +} + +.approvalTitle { + font-weight: bold; + font-size: 16px; + text-align: left; +} \ No newline at end of file diff --git a/Mohem/src/app/time-card/time-card-details/time-card-details.component.scss b/Mohem/src/app/time-card/time-card-details/time-card-details.component.scss index 5cd0e320..bee7b60e 100644 --- a/Mohem/src/app/time-card/time-card-details/time-card-details.component.scss +++ b/Mohem/src/app/time-card/time-card-details/time-card-details.component.scss @@ -99,7 +99,7 @@ // color: #606161; // font-family: WorkSans-Bold; // } - + // .card-summary-heading-hours-extended-heading{ // color: #D3D3D3; // font-family: WorkSans-Bold; @@ -185,7 +185,7 @@ // .header-div { -// background-color: #269DB8; +// background-color: #BE332F; // text-transform: capitalize; // height: 180px; // position: relative; @@ -209,12 +209,12 @@ // --border-color:white!important ; // width: 85%!important ; // height: 40px !important ; - + // } // .navbar{ // font-size: 10px !important; -// --background: #269DB8 !important; +// --background: #BE332F !important; // color: aliceblue !important; // // margin-top: 10px !important; @@ -224,20 +224,20 @@ // // margin-left:330px !important; // margin-top: 0px !important; // font-size: 35px !important; -// background: #269DB8; +// background: #BE332F; // color: aliceblue; // margin-left: 0px !important; // } // .person{ - + // margin-left:100px !important; // margin-top: 0px !important; // font-size: 23px !important; -// background: #269DB8 !important; +// background: #BE332F !important; // color: aliceblue !important; - + // } // .grid{ @@ -264,24 +264,24 @@ // font-size: 12px; // margin-top: -13px; // } - + // .green-amount{ // font-size: 17px; // font-family: WorkSans-Bold; // margin-top: -3px; // } - + // .blue-label{ // font-size: 12px; // margin-top: -13px; // } - + // .blue-amount{ // font-size: 17px; // font-family: WorkSans-Bold; // margin-top: -4px; // } - + // .today-graph{ // display:block !important; // height: 150px !important; @@ -297,7 +297,7 @@ // // border-radius: 20px !important; // // height: 270px !important; // // border: 1px solid #d6d4d4 !important; - + // margin-top: 7px !important; // margin-left: 15px !important; // margin-right: 15px !important; @@ -305,7 +305,7 @@ // border-radius: 20px !important; // height: 321px !important; // border: 1px solid #d6d4d4 !important; - + // } // .labelGrid{ // // margin-top: -30px !important; @@ -374,11 +374,11 @@ // 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: #269DB8; +// background: #BE332F; // // background: linear-gradient(90deg, #85C48D 0%, #85C48D 13%, #2BB5C6 98%, #2BB5C6 100%); // color:var(--light); // text-transform: capitalize; - + // display: block; // position: relative; // height: 210px; @@ -389,13 +389,13 @@ // .request-heading { // span { - + // // text-align: center; - + // // display: block; - + // // padding-top: 8px; - + // // font-family: workSans-Regular; // // text-align: center; // display: block; @@ -404,81 +404,81 @@ // margin-left: -157px; // margin-top: -19px; // padding-bottom: 16px; - + // } - + // } - - - + + + // .result-graph { - + // position: relative; - + // background: white; - + // margin-right: 20px; - + // margin-left: 20px; - + // margin-top: 20px; - + // padding-bottom: 20px; - + // border-radius: 20px; - + // } - - - + + + // .result-text-container { - + // padding: 0; - + // margin: 0; - + // position: absolute; - + // left: 38%; // top: 60%; - + // display: block; - + // text-align: center; - + // transform: translate(-50%, -50%); - + // h2 { - + // font-size: 25px; - + // font-family: WorkSans-Bold; // color: black !important; // margin: 0 auto; - + // line-height: 36px; - + // } // p { - + // font-size: 20px; // color: black !important; // // font-family: WorkSans-Bold; - + // margin: 0 auto; - + // line-height: 36px; - + // } - + // span { - + // width: 125px; - + // display: block; - + // margin: 0 auto; - + // font-size: 12px; // color: black !important; // font-family: workSans-Regular; @@ -490,7 +490,8 @@ ion-content { --ion-background-color: whitesmoke; } -ion-title{ + +ion-title { color: white; position: absolute; top: 0; @@ -501,109 +502,123 @@ ion-title{ font-weight: bold; height: 100%; } -.contentBg{ + +.contentBg { padding: 0px 20px; } .contentBg:before { position: absolute; -content: ""; -background: #269DB8; -height: 140px; -width: 100%; -left: 0; -top: 0px; -z-index: 1; -} - -.user-info{ - text-align: center; - margin-bottom: 15px; - .user-image-container{ - position: relative; - width: 80px; - height: 80px; - display: block; - margin: 0 auto; - // &:before{ - // position: absolute; - // content: ""; - // width: 20px; - // height: 20px; - // border-radius: 20px; - // border: 1px solid white; - // top: 0; - // right: 0; - // background-color: red; - // z-index: 9; - // } - // &.present:before{ - // background-color: green !important; - // } - } - .user-image{ - overflow: hidden; - position: relative; - display: block; - width: 100%; - height: 100%; - border-radius: 80px; - border: 1px solid #ccc; - margin: 0px auto 6px; - } - h1{ - margin: 0; - padding: 0; - font-family: WorkSans-Bold; - font-size: 18px; - margin-bottom: 4px; - } - span{ - font-size: 14px; - display: block; - color: #888 - } + content: ""; + background: #BE332F; + height: 140px; + width: 100%; + left: 0; + top: 0px; + z-index: 1; +} + +.user-info { + text-align: center; + margin-bottom: 15px; + + .user-image-container { + position: relative; + width: 80px; + height: 80px; + display: block; + margin: 0 auto; + // &:before{ + // position: absolute; + // content: ""; + // width: 20px; + // height: 20px; + // border-radius: 20px; + // border: 1px solid white; + // top: 0; + // right: 0; + // background-color: red; + // z-index: 9; + // } + // &.present:before{ + // background-color: green !important; + // } + } + + .user-image { + overflow: hidden; + position: relative; + display: block; + width: 100%; + height: 100%; + border-radius: 80px; + border: 1px solid #ccc; + margin: 0px auto 6px; + } + + h1 { + margin: 0; + padding: 0; + font-family: WorkSans-Bold; + font-size: 18px; + margin-bottom: 4px; + } + + span { + font-size: 14px; + display: block; + color: #888 + } } + $actionBtnSize : 36px; -.user-actions{ - text-align: center; - .action-button{ - font-size: 11px; - white-space: nowrap; - color: #888; - .action-button-icon{ - width: $actionBtnSize; - height: $actionBtnSize; - border-radius: $actionBtnSize; - margin: 0 auto; - display: block; - background-color: #269DB8; - line-height: $actionBtnSize; - margin-bottom: 3px; - img{ - margin: 0 auto; - vertical-align: middle; - } - } + +.user-actions { + text-align: center; + + .action-button { + font-size: 11px; + white-space: nowrap; + color: #888; + + .action-button-icon { + width: $actionBtnSize; + height: $actionBtnSize; + border-radius: $actionBtnSize; + margin: 0 auto; + display: block; + background-color: #BE332F; + line-height: $actionBtnSize; + margin-bottom: 3px; + + img { + margin: 0 auto; + vertical-align: middle; + } } + } } -.employee-information-indetail{ + +.employee-information-indetail { background: white; margin-top: 15px; border-radius: 20px; margin-bottom: 15px; - ion-col{ - padding: 15px; - border-bottom: 1px solid #ccc; + + ion-col { + padding: 15px; + border-bottom: 1px solid #ccc; } - h2{ - font-size: 13px; - font-family: WorkSans-Bold; - margin: 0; + + h2 { + font-size: 13px; + font-family: WorkSans-Bold; + margin: 0; } - p{ - font-size: 13px; - margin: 0; + + p { + font-size: 13px; + margin: 0; } } @@ -617,27 +632,31 @@ $actionBtnSize : 36px; .active-Segment { font-size: 0.3cm !important; - background: #269DB8 !important; + background: #BE332F !important; text-transform: none; --color-checked: none; border-radius: 100px; - border:0; + border: 0; } -.active-Segment ion-label{ + +.active-Segment ion-label { font-size: 11px; color: white !important; } -.normal-Segment ion-label{ + +.normal-Segment ion-label { color: black !important; font-size: 11px; } + .normal-Segment { font-size: 0.3cm !important; text-transform: none; --color-checked: none; border: 0; } -.colum-container{ + +.colum-container { padding: 15px; border-bottom: 1px solid #ccc; } @@ -648,72 +667,80 @@ $actionBtnSize : 36px; margin-top: 10px; } -.search-dropdown{ - background: #269DB8; +.search-dropdown { + background: #BE332F; + ion-select { - .select-text{ - margin-left: -10px; - } - .select-icon{ - .select-icon-inner{ - opacity: 1; - color: white; - margin-top: -1px; - } + .select-text { + margin-left: -10px; + } + + .select-icon { + .select-icon-inner { + opacity: 1; + color: white; + margin-top: -1px; } + } } } -.input-container{ +.input-container { background: white; - ion-input{ - border-bottom-color: transparent; + + ion-input { + border-bottom-color: transparent; } } -.search-container{ +.search-container { margin-top: 15px; - ion-col{ - background: white; - border-radius: 12px; - padding-right: 10px; - flex: none; - ion-icon{ - margin-right: 3px; - font-size: 14px; - margin-left: 3px; - vertical-align: middle; - } - span{ - font-size: 12px; - vertical-align: middle; - } + + ion-col { + background: white; + border-radius: 12px; + padding-right: 10px; + flex: none; + + ion-icon { + margin-right: 3px; + font-size: 14px; + margin-left: 3px; + vertical-align: middle; + } + + span { + font-size: 12px; + vertical-align: middle; + } } } /////////////////////////////////////////////////////// Attendance /////////////////////// -.header{ +.header { position: relative; z-index: 999; } -.slidPrev{ +.slidPrev { margin-left: 10px; background: transparent; } -.slidNext{ +.slidNext { background: transparent; margin-top: -1px; margin-left: 43px; } -.activeArrow{ + +.activeArrow { height: 20px; width: 20px; color: white; } -.disabledArrow{ + +.disabledArrow { height: 20px; width: 20px; color: gray; @@ -729,14 +756,16 @@ $actionBtnSize : 36px; z-index: 1; margin-bottom: 10px; } + .request-heading { - text-align: left; - display: block; - padding-top: 8px; - margin-bottom: 10px; - margin-left: 10px; + text-align: left; + display: block; + padding-top: 8px; + margin-bottom: 10px; + margin-left: 10px; } -.request-heading-ar{ + +.request-heading-ar { text-align: right; display: block; padding-top: 8px; @@ -753,48 +782,51 @@ $actionBtnSize : 36px; display: block; text-align: center; transform: translate(-50%, -50%); + h2 { - font-size: 38px; - font-family: WorkSans-Bold; - margin: 0 auto; - line-height: 36px; + font-size: 38px; + font-family: WorkSans-Bold; + margin: 0 auto; + line-height: 36px; } + span { - width: 125px; - display: block; - margin: 0 auto; - font-size: 12px; - font-family: workSans-Regular; + width: 125px; + display: block; + margin: 0 auto; + font-size: 12px; + font-family: workSans-Regular; } } + .today-graph { width: 100%; max-height: 4cm; } -.green-label{ +.green-label { font-size: 12px; margin-top: -13px; } - -.green-amount{ + +.green-amount { font-size: 17px; font-family: WorkSans-Bold; margin-top: -3px; } - -.blue-label{ + +.blue-label { font-size: 12px; margin-top: -13px; } - -.blue-amount{ + +.blue-amount { font-size: 17px; font-family: WorkSans-Bold; margin-top: -4px; } -.labelGrid{ +.labelGrid { background-color: white !important; border-radius: 20px !important; height: 88px !important; @@ -803,25 +835,26 @@ $actionBtnSize : 36px; padding: 10px; label { - font-size: 9px; - line-height: 11px !important; - display: block; + font-size: 9px; + line-height: 11px !important; + display: block; } + h2 { - font-size: 25px; - font-weight: bold; - display: block; - text-align: right; - margin:0; - position: absolute; - bottom: 0; - left:0; - width: 100%; - padding: 10px; + font-size: 25px; + font-weight: bold; + display: block; + text-align: right; + margin: 0; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + padding: 10px; } } -.bodyGrid{ +.bodyGrid { margin-top: 7px !important; margin-left: 15px !important; margin-right: 15px !important; @@ -830,29 +863,33 @@ $actionBtnSize : 36px; height: 321px !important; border: 1px solid #d6d4d4 !important; } -.attendance-information{ + +.attendance-information { background: white; border-radius: 20px; padding: 10px; + @media screen and (min-width: 300px) and (max-width:359px) { - h2{ - padding: 0; - margin: 0; - font-size: 14px; - } - span{ - font-size: 9px; - } + h2 { + padding: 0; + margin: 0; + font-size: 14px; + } + + span { + font-size: 9px; + } } @media screen and (min-width: 360px) { - h2{ + h2 { padding: 0; margin: 0; font-size: 18px; } - span{ - font-size: 9px; + + span { + font-size: 9px; } } } @@ -863,79 +900,84 @@ $actionBtnSize : 36px; color: #0a5d53; } -.green-label-container{ - border-top: 5px solid #269DB8; +.green-label-container { + border-top: 5px solid #BE332F; padding: 1px 0px; margin: 15px 0px } -.blue-label-container{ +.blue-label-container { border-top: 5px solid #292F42; padding: 1px 0px; margin: 15px 0px } -.span-one{ + +.span-one { display: block; font-size: 12px; color: black; } -.span-two{ + +.span-two { display: block; font-size: 22px; font-family: WorkSans-Bold; } -.graph-container{ + +.graph-container { margin-left: -50px; position: relative; margin-right: 50px; } -.label-container{ + +.label-container { position: absolute; width: 20%; right: 30px; top: 50%; margin-top: -60px; } + .attendance-summary .attendance-information { - span{ - height: 32px; - display: block; - line-height: 14px; + span { + height: 32px; + display: block; + line-height: 14px; } - h2{ - text-align: right; - font-family: WorkSans-Bold; + + h2 { + text-align: right; + font-family: WorkSans-Bold; } - + } -.calendar-container{ + +.calendar-container { background: white; margin-bottom: 100px; margin-top: 20px; border-radius: 20px; - span{ - text-align: left; - display: block; - padding-top: 8px; - margin-bottom: 10px; - margin-left: 10px; + + span { + text-align: left; + display: block; + padding-top: 8px; + margin-bottom: 10px; + margin-left: 10px; } } -.calendar-container-ar{ + +.calendar-container-ar { background: white; margin-bottom: 100px; margin-top: 20px; border-radius: 20px; - span{ + + span { text-align: right; display: block; padding-top: 8px; margin-bottom: 6px; margin-right: 12px; } -} - - - - - \ No newline at end of file +} \ No newline at end of file diff --git a/Mohem/src/app/time-card/time-card-details/time-card-details.component.ts b/Mohem/src/app/time-card/time-card-details/time-card-details.component.ts index 98f15742..4a7ea622 100644 --- a/Mohem/src/app/time-card/time-card-details/time-card-details.component.ts +++ b/Mohem/src/app/time-card/time-card-details/time-card-details.component.ts @@ -82,7 +82,7 @@ export class TimeCardDetailsComponent implements OnInit { this.preMonth = new Date().getMonth(); const monthIndex = new Date().getMonth() + 1; this.currentMonthName = this.direction === 'ltr' ? this.common.getMonthName(monthIndex) : this.common.getMonthNameAr(monthIndex); - this.calendarConfig(this.common.getMonthName(new Date().getMonth() + 1) , new Date().getFullYear()); + this.calendarConfig(this.common.getMonthName(new Date().getMonth() + 1), new Date().getFullYear()); } calendarConfig(month?, year?) { @@ -102,7 +102,7 @@ export class TimeCardDetailsComponent implements OnInit { this.selMenu = this.common.sharedService.getSharedData(MenuResponse.SHARED_DATA, false); this.menuType = this.selMenu.List_Menu.MENU_TYPE; - + dayAndHoursReqObj.P_SELECTED_EMPLOYEE_NUMBER = this.selEmp; dayAndHoursReqObj.P_MENU_TYPE = this.menuType; dayAndHoursReqObj.P_SELECTED_RESP_ID = this.respID; @@ -130,14 +130,14 @@ export class TimeCardDetailsComponent implements OnInit { allDays[i].customDaysOff = false; allDays[i].customSchedule = false; allDays[i].customScheduleDate = new Date(allDays[i].SCHEDULE_DATE); - // tslint:disable-next-line: triple-equals + // tslint:disable-next-line: triple-equals } else if (allDays[i].ATTENDED_FLAG == 'N' && allDays[i].ABSENT_FLAG == 'Y') { allDays[i].customPresent = false; allDays[i].customAbsent = true; allDays[i].customDaysOff = false; allDays[i].customSchedule = false; allDays[i].customScheduleDate = new Date(allDays[i].SCHEDULE_DATE); - // tslint:disable-next-line: triple-equals + // tslint:disable-next-line: triple-equals } else if (allDays[i].ATTENDED_FLAG == 'N' && allDays[i].DAY_TYPE === 'OFF') { allDays[i].customPresent = false; allDays[i].customAbsent = false; @@ -185,7 +185,7 @@ export class TimeCardDetailsComponent implements OnInit { data: [this.absentDays, this.attendedDays], backgroundColor: [ '#292F42', - '#269DB8' + '#BE332F' ], borderWidth: 2 }] @@ -197,16 +197,16 @@ export class TimeCardDetailsComponent implements OnInit { nextSlide() { if (this.currentMonthName !== this.month) { - this.common.startLoading(); - this.showData = false; - if (this.nextMonth > 12) { - this.currentYear = this.currentYear + 1; - this.nextMonth = 1; - } - this.currentDate = new Date(this.currentYear, (this.nextMonth - 1), 1); - this.calendarConfig(this.common.getMonthName(this.nextMonth) , this.currentYear); - this.nextMonth = this.nextMonth + 1; - this.preMonth = this.nextMonth - 2; + this.common.startLoading(); + this.showData = false; + if (this.nextMonth > 12) { + this.currentYear = this.currentYear + 1; + this.nextMonth = 1; + } + this.currentDate = new Date(this.currentYear, (this.nextMonth - 1), 1); + this.calendarConfig(this.common.getMonthName(this.nextMonth), this.currentYear); + this.nextMonth = this.nextMonth + 1; + this.preMonth = this.nextMonth - 2; } } @@ -214,11 +214,11 @@ export class TimeCardDetailsComponent implements OnInit { this.common.startLoading(); this.showData = false; if (this.preMonth === 0) { - this.currentYear = this.currentYear - 1; - this.preMonth = 12; + this.currentYear = this.currentYear - 1; + this.preMonth = 12; } this.currentDate = new Date(this.currentYear, (this.preMonth - 1), 1); - this.calendarConfig(this.common.getMonthName(this.preMonth) , this.currentYear); + this.calendarConfig(this.common.getMonthName(this.preMonth), this.currentYear); this.preMonth = this.preMonth - 1; this.nextMonth = this.preMonth + 2; } diff --git a/Mohem/src/app/vacation-rule/home/home.component.scss b/Mohem/src/app/vacation-rule/home/home.component.scss index bf5c0751..bbbc0b93 100644 --- a/Mohem/src/app/vacation-rule/home/home.component.scss +++ b/Mohem/src/app/vacation-rule/home/home.component.scss @@ -2,13 +2,16 @@ .item-md ios { white-space: normal; } + .col { white-space: normal; font-size: 14px; } + ion-col.colBold { - color: #1a586d; + color: #c6903e; } + .imgSize { width: 22px; height: 22px; @@ -24,7 +27,7 @@ ion-card-header { } .header-toolbar { - --background: linear-gradient(45deg, #3ac1f1 0%, #19a163 36%, #19a163 59%, #1a586d 100%); + --background: linear-gradient(45deg, #3ac1f1 0%, #19a163 36%, #19a163 59%, #c6903e 100%); } .btnBack { @@ -49,6 +52,7 @@ ion-card-header { border-top-left-radius: 10px; border-top-right-radius: 10px; background: #acacac; + .hrTitle { white-space: normal; padding: 5px; @@ -57,6 +61,7 @@ ion-card-header { min-height: 45px; line-height: 1.2; } + .button, .button-md, button-ios { @@ -71,62 +76,65 @@ ion-card-header { } //////////new design//////////////////////// -.itemVR -{ - background: #f0efef !important; - --background: #f0efef !important; - border: #dbdbdb 1px solid; - border-radius: 10px; - margin-bottom: 7px; -} -.listVR{ +.itemVR { + background: #f0efef !important; + --background: #f0efef !important; + border: #dbdbdb 1px solid; + border-radius: 10px; + margin-bottom: 7px; +} + +.listVR { background: transparent !important; } -.red-status{ - color: var(--light) !important; - font-weight:bold; - background: var( --red); - border-radius: 9px; - text-align: center; - margin-top: 10px; - position: relative; - width: auto; - height: 100%; - display: inline-block !important; - padding: 0px 15px 0px 15px; -} - -.green-status{ - color: var(--light) !important; - font-weight:bold; - background: var( --custgreen); - border-radius: 9px; - text-align: center; - margin-top: 10px; - position: relative; - width: auto; - height: 100%; - display: inline-block !important; - padding: 0px 15px 0px 15px; -} - -.textBold{ +.red-status { + color: var(--light) !important; + font-weight: bold; + background: var(--red); + border-radius: 9px; + text-align: center; + margin-top: 10px; + position: relative; + width: auto; + height: 100%; + display: inline-block !important; + padding: 0px 15px 0px 15px; +} + +.green-status { + color: var(--light) !important; + font-weight: bold; + background: var(--custgreen); + border-radius: 9px; + text-align: center; + margin-top: 10px; + position: relative; + width: auto; + height: 100%; + display: inline-block !important; + padding: 0px 15px 0px 15px; +} + +.textBold { color: black; font-weight: bold; font-size: 17px; } -.label{ + +.label { margin-top: -19px; // border-bottom: #eaeaea solid; padding-bottom: 8px; color: black !important; } -.createdOn{ + +.createdOn { margin: -12px 0px -14px 0px; } -.optionBtn{ -background: transparent !important; -} + +.optionBtn { + background: transparent !important; +} \ No newline at end of file diff --git a/Mohem/src/theme/styles.scss b/Mohem/src/theme/styles.scss index 80f3e75f..31e81fb8 100644 --- a/Mohem/src/theme/styles.scss +++ b/Mohem/src/theme/styles.scss @@ -40,7 +40,7 @@ button { } .header-toolbar { - --background: linear-gradient(45deg, #3ac1f1 0%, #19a163 36%, #19a163 59%, #1a586d 100%); + --background: linear-gradient(45deg, #3ac1f1 0%, #19a163 36%, #19a163 59%, #c6903e 100%); } ion-label { @@ -114,7 +114,7 @@ ion-label { } .header-toolbar { - --background: linear-gradient(45deg, #3ac1f1 0%, #19a163 36%, #19a163 59%, #1a586d 100%); + --background: linear-gradient(45deg, #3ac1f1 0%, #19a163 36%, #19a163 59%, #c6903e 100%); } .btnBack { @@ -1481,7 +1481,7 @@ div.no-dataDiv { } .header-toolbar-new { - --background: #269DB8; + --background: #BE332F; } @@ -1501,7 +1501,7 @@ div.no-dataDiv { // margin-left:0; // } // .search-dropdown{ -// background: #269DB8; +// background: #BE332F; // ion-select { // .select-text{ // margin-left: -10px; @@ -1591,7 +1591,7 @@ div.no-dataDiv { color: #fff !important; &:before { - background-color: #269DB8 !important; + background-color: #BE332F !important; } } @@ -1655,7 +1655,7 @@ div.no-dataDiv { // border-radius: 50%; // } // .absent::after{ -// background: #269DB8; +// background: #BE332F; // } // .present::after{ @@ -1705,7 +1705,7 @@ table.monthview-datetable th small { bottom: -8px; .swiper-pagination-bullet-active { - background: #269DB8; + background: #BE332F; } } @@ -1846,4 +1846,8 @@ ion-app[dir="rtl"] { .iconBox img { margin: 5px !important; } + + .pClass { + text-align: right !important; + } } \ No newline at end of file diff --git a/Mohem/src/theme/variables.scss b/Mohem/src/theme/variables.scss index 9bca9b5c..40ecc2e0 100644 --- a/Mohem/src/theme/variables.scss +++ b/Mohem/src/theme/variables.scss @@ -1,43 +1,53 @@ -@font-face { +@font-face { font-family: WorkSans-Light; src: url('../assets/font/WorkSans-Light.otf'); } + @font-face { font-family: GE_SS_TWO_MEDIUM; src: url('../assets/font/GE_SS_TWO_MEDIUM.otf'); } + @font-face { font-family: WorkSans-Medium; src: url('../assets/font/WorkSans-Medium.otf'); } + @font-face { font-family: GE_SS_Two_Light; src: url('../assets/font/GE_SS_Two_Light.otf'); } + @font-face { font-family: WorkSans-Regular; src: url('../assets/font/WorkSans-Regular.otf'); } + @font-face { font-family: GE_SS_Two_Bold; src: url('../assets/font/GE_SS_Two_Bold.otf'); } + @font-face { font-family: WorkSans-SemiBold; src: url('../assets/font/WorkSans-SemiBold.otf'); } + @font-face { font-family: GE_SS_Two_Bold; src: url('../assets/font/GE_SS_Two_Bold.otf'); } + @font-face { font-family: WorkSans-Bold; src: url('../assets/font/WorkSans-Bold.otf'); } + @font-face { font-family: Poppins-SemiBold; src: url('../assets/font/Poppins-SemiBold.ttf'); } + @font-face { font-family: Poppins-Medium; src: url('../assets/font/Poppins-Medium.ttf'); @@ -47,52 +57,55 @@ font-family: Poppins-Bold; src: url('../assets/font/Poppins/Poppins-Bold.ttf'); } + @font-face { font-family: Poppins-Medium; src: url('../assets/font/Poppins/Poppins-Medium.ttf'); } + @font-face { font-family: Poppins; src: url('../assets/font/Poppins/Poppins-Regular.ttf'); } + :root { ---ion-font-family: 'Poppins'; ---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; - --secondary: #19a163; - --danger: #f53d3d; - --customnavy: #1a586d; - --light: #ffffff; - --dark: #000000; - --gray: #e4e5e7; + --ion-font-family: 'Poppins'; + --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; + --secondary: #19a163; + --danger: #f53d3d; + --customnavy: #c6903e; + --light: #ffffff; + --dark: #000000; + --gray: #e4e5e7; --custgreen: #209a83; - --cusgray:#d9d9d9; - --darkgray:#7F8C8D; - --grayBG:#acacac; - --labelColor:#999; - --orange:#F7941D; - --green:#209B48; - --red:#BE1E2D; - --blue:#223262; - --cyanblue:#1b75bc; - --newgreen:#269DB8; - --darkblue:#269DB8; - --lightblue:#3cb9d5; - --newred:#cb3232; + --cusgray: #d9d9d9; + --darkgray: #7F8C8D; + --grayBG: #acacac; + --labelColor: #999; + --orange: #F7941D; + --green: #209B48; + --red: #BE1E2D; + --blue: #223262; + --cyanblue: #1b75bc; + --newgreen: #BE332F; + --darkblue: #BE332F; + --lightblue: #3cb9d5; + --newred: #cb3232; --fontFamilyPoppins-SemiBold: 'Poppins-SemiBold'; --fontFamilyPoppins-Medium: 'Poppins-Medium'; // $font-family-base: $fontFamilyMediumEN !default; @@ -104,7 +117,7 @@ // font-size: 1.4rem; // background-color: #fff; // } - + // ion-app.md { // font-family: "Roboto", "Helvetica Neue", sans-serif; // font-size: 1.4rem; @@ -113,43 +126,43 @@ // $text-input-md-highlight-color:--primary; // $text-input-ios-highlight-color:--primary; - + // $label-md-text-color-focused:--primary; // $label-ios-text-color-focused:--primary; - + // $alert-md-button-text-color:--primary; // $alert-ios-button-text-color:--primary; - + // $alert-md-input-border-color-focused:--primary; // $alert-ios-checkbox-background-color-on:--primary; // $alert-ios-checkbox-border-color-on:--primary; - + // $checkbox-md-icon-background-color-on:$primary; // $checkbox-ios-background-color-on:$primary; // $checkbox-md-icon-border-color-on:$primary; - + // $toggle-ios-background-color-on:$primary; // $toggle-md-active-color:$primary; - + // $radio-md-color-on:$primary; // $radio-ios-color-on:$primary; - + // $button-ios-background-color:$primary; - + // $picker-md-button-text-color:$primary; // $picker-md-option-selected-color:$primary; // $picker-ios-button-text-color:$primary; - + // $range-md-bar-active-background-color:$primary; // $range-ios-bar-active-background-color:$primary; // $text-input-ios-highlight-color:$primary; - - + + // $loading-md-spinner-color:$primary; - - + + // $text-input-highlight-color-invalid:$danger; // $text-input-ios-highlight-color-invalid:$danger; // $text-input-md-highlight-color-invalid:$danger; // $text-input-ios-show-focus-highlight: true; - } \ No newline at end of file +} \ No newline at end of file