profile page updated

MOE_DEV_NEW_TEMPORARY_DESIGN
Sultan Khan 3 years ago
parent a78efed0d1
commit c4d199c62b

@ -170,18 +170,19 @@
<ion-card *ngIf="basicDetailsSegment" [ngClass]="direction === 'ltr'? 'card-size-info-en': 'card-size-info-ar' ">
<ion-card-content *ngIf="!editBasic && employeeBasicDetails">
<ion-grid>
<ion-row [style]="direction == 'ltr' ? 'width: 113%;' : 'width:95%'">
<ion-row >
<ion-col size="10">
<ion-label>
<h1 [ngClass]="direction === 'ltr'? 'header-label-text-form': 'header-label-text-form-ar' ">{{ts.trPK('general','basic-details')}}</h1>
</ion-label>
</ion-col>
<ion-col size="2" *ngIf="basicDetailsSubMenu && basicDetailsSubMenu.UPDATE_BUTTON === 'Y'">
<img style="width: 18px;height: 18px;" src="../assets/imgs/profile-icons/editing@2x.png"
<!-- -->
<ion-col size="2" *ngIf="basicDetailsSubMenu && basicDetailsSubMenu.UPDATE_BUTTON === 'Y'" >
<img class="icon-img" src="../assets/imgs/profile-icons/editing@2x.png"
(click)="allowEdit('basic')">
</ion-col>
<ion-col size="2" *ngIf="basicDetailsSubMenu && basicDetailsSubMenu.ADD_BUTTON === 'Y'">
<!-- -->
<ion-col size="2" *ngIf="basicDetailsSubMenu && basicDetailsSubMenu.ADD_BUTTON === 'Y'">
<ion-icon class="add-icon-styling" name="add"></ion-icon>
</ion-col>
</ion-row>
@ -213,16 +214,17 @@
<ion-card *ngIf="contactSegment" [ngClass]="direction === 'ltr'? 'card-size-info-en': 'card-size-info-ar' ">
<ion-card-content *ngIf="!editAddress && employeeAdress">
<ion-grid>
<ion-row style="width: 113%;">
<ion-row>
<ion-col size="10">
<ion-label>
<h1 [ngClass]="direction === 'ltr'? 'header-label-text-form': 'header-label-text-form-ar' ">{{ts.trPK('userProfile','phone-no')}}</h1>
</ion-label>
</ion-col>
<ion-col size="2" *ngIf="phoneSubMenu && phoneSubMenu.UPDATE_BUTTON === 'Y'" (click)="allowEdit('contact')">
<img style="width: 18px; height: 18px;" src="../assets/imgs/profile-icons/editing@2x.png">
<!-- -->
<ion-col size="2" *ngIf="phoneSubMenu && phoneSubMenu.UPDATE_BUTTON === 'Y'" (click)="allowEdit('contact')">
<img class="icon-img" src="../assets/imgs/profile-icons/editing@2x.png">
</ion-col>
<!-- -->
<ion-col size="2" *ngIf="phoneSubMenu && phoneSubMenu.ADD_BUTTON === 'Y'" (click)="allowEdit('contact')">
<ion-icon class="add-icon-styling" name="add"></ion-icon>
</ion-col>
@ -249,16 +251,17 @@
<ion-card *ngIf="addressSegment" [ngClass]="direction === 'ltr'? 'card-size-info-en': 'card-size-info-ar' ">
<ion-card-content *ngIf="!editAddress && employeeAdress">
<ion-grid>
<ion-row style="width: 113%;">
<ion-row>
<ion-col size="10">
<ion-label>
<h1 [ngClass]="direction === 'ltr'? 'header-label-text-form': 'header-label-text-form-ar' ">{{ts.trPK('general','main-address')}}</h1>
</ion-label>
</ion-col>
<!-- -->
<ion-col size="2" *ngIf="addressSubMenu && addressSubMenu.UPDATE_BUTTON === 'Y'" (click)="allowEdit('address')">
<img style="width: 18px; height: 18px;" src="../assets/imgs/profile-icons/editing@2x.png">
<img class="icon-img" src="../assets/imgs/profile-icons/editing@2x.png">
</ion-col>
<!-- -->
<ion-col size="2" *ngIf="addressSubMenu && addressSubMenu.ADD_BUTTON === 'Y'" (click)="allowEdit('address')">
<ion-icon class="add-icon-styling" name="add"></ion-icon>
</ion-col>

@ -17,9 +17,11 @@
.header-toolbar-new {
--background: #024d71;
}
.colorBG {
--background: #f0efef;
}
.header-div {
text-transform: capitalize;
background: #024d71;
@ -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;
}
@ -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 {
@ -353,6 +380,7 @@ $actionBtnSize: 36px;
background-color: #024d71;
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;
@ -408,6 +440,7 @@ $actionBtnSize: 36px;
background-color: #024d71;
}
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
.active-Segment {
width: 11%;
@ -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 {
@ -510,10 +548,12 @@ $actionBtnSize: 36px;
.search-dropdown {
background: #024d71;
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: #024d71;
}
.disabledArrow {
height: 20px;
width: 20px;
@ -584,6 +630,7 @@ $actionBtnSize: 36px;
color: #024d71;
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;
@ -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;
@ -1013,66 +1080,78 @@ $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;
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;
@ -1084,9 +1163,10 @@ $actionBtnSize: 36px;
right: 41%;
top: -10%;
z-index: 99;
}}
}
}
@media screen and (min-width: 1px) and (max-width:766px){
@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;
@ -1216,10 +1307,11 @@ $actionBtnSize: 36px;
color: white;
border-radius: 50%;
position: absolute;
right: 30px;
left: 20px;
right: 20px;
}
.name{
.name {
text-align: center;
letter-spacing: -0.84px;
color: #2B353E;
@ -1228,7 +1320,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 +1332,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 +1354,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 +1374,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 +1384,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 +1398,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 +1409,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 +1421,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 +1431,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 +1445,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 +1454,71 @@ $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;
}
.icon-img {
width: 20px;
height: 20px;
position: relative;
left: 20px;
right: 20px;
}
Loading…
Cancel
Save