fixed css ios issues

MOHEMM-SFH-COLORS
haroon amjad 4 years ago
parent 6eca298b99
commit f326278951

@ -28,7 +28,7 @@ export class GenericHeaderComponent implements OnInit {
}
openProfilePage() {
this.common.openEditProfile();
this.common.openProfile('sideMenu');
}
closeModal() {

@ -5,6 +5,11 @@
<div class="header-background-style-card">
</div>
<div [ngClass]="direction == 'ltr' ? 'result-graph' : 'result-graph-ar'" style="margin-top: -50px;">
<div [ngClass]=" direction == 'ltr' ? 'changeImgBtn' : 'changeImgBtn-ar'" (click)="updateImageProfile()">
<!-- <button ion-button icon-only menuToggle class="menubutton" (click)="updateImageProfile()"> -->
<img style="margin: 0px 5px;" class="changeIcon" src="../assets/imgs/edit_icon.png">
<!-- </button> -->
</div>
<div class="user-info">
<div class="user-image-container">
<div [ngClass]=" direction == 'ltr' ? 'user-image' : 'user-image-ar'" >
@ -12,13 +17,7 @@
[src]="personalInfo.EMPLOYEE_IMAGE ? 'data:image/png;base64,'+personalInfo.EMPLOYEE_IMAGE : '../assets/imgs/profile.png'"
alt="Team Member Image" />
</div>
<div [ngClass]=" direction == 'ltr' ? 'changeImgBtn' : 'changeImgBtn-ar'">
<button ion-button icon-only menuToggle class="menubutton" (click)="updateImageProfile()">
<img class="changeIcon" src="../assets/imgs/edit_icon.png">
</button>
</div>
</div>
<div style="margin-top: 25px;">
<h1 class="name">{{personalInfo.EMPLOYEE_NAME}}</h1>
<span class="email">{{personalInfo.EMPLOYEE_EMAIL_ADDRESS}}</span>

@ -1049,33 +1049,82 @@ $actionBtnSize: 36px;
@media screen and (min-width: 1px) and (max-width:766px){
.changeImgBtn {
position: absolute;
left: 60%;
bottom: 230%;
display: flex;
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;
left: 55%;
display: flex;
margin-bottom: 44%;
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){
.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;
left: 60%;
bottom: 150%;
display: flex;
background: #f0ecec;
min-height: 25px;
width: 24px !important;
height: 20px;
border-radius: 50%;
bottom: 55px;
left: 36%;
top: -15%;
z-index: 99;
}}
@media screen and (min-width: 768px) and (max-width:1050px){
.changeImgBtn-ar {
position: absolute;
left: 55%;
// margin-bottom: 15%;
display: flex;
margin-bottom: 44%;
background: #f0ecec;
min-height: 25px;
width: 24px !important;
height: 20px;
border-radius: 50%;
bottom: 55px;
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;
}}
.menubutton {
background: #f0ecec;

Loading…
Cancel
Save