fixed css for business card

enad-Q3
enadhilal 4 years ago
parent d624f0794c
commit 016bd83b81

@ -9,16 +9,16 @@
</ion-col>
</ion-row>
<ion-row>
<ion-col size='6'>
<ion-col size='12'>
<ion-label>
<h1 class='font-text-style' style="font-size: 20px !important; width: 200%;">{{userInfo.name_en}}</h1>
</ion-label>
</ion-col>
<ion-col size='6'>
<!-- <ion-col size='6'>
<ion-label>
<h1 class='font-text-style name-ar-style'>{{userInfo.name_ar}}</h1>
</ion-label>
</ion-col>
</ion-col> -->
</ion-row>
<ion-row>
<ion-col>
@ -79,7 +79,7 @@
</ion-label>
</ion-col>
</ion-row>
<ion-row>
<ion-row class="name-div">
<ion-col>
<ion-label>
<h5 class='font-text-style'>{{userInfo.job_en}}</h5>

@ -38,10 +38,9 @@
// CS
.card-size{
transform: rotate(90deg) !important;
// padding: 5% !important;
// padding-right: 0px !important;
padding-right: 0px !important;
padding-left: 15% !important;
padding: 8% !important;
}
.qr-style{
left: 260% !important;
@ -57,6 +56,9 @@
.qr-img-hmg-style{
left: 580px !important;
}
.cs-card-size{
padding: 15px !important;
}
}
@media screen and (min-width: 400px) and (min-height:700px) and (max-height: 799px){
@ -81,6 +83,9 @@
.qr-img-hmg-style{
left: 495px !important;
}
.cs-card-size{
padding: 20px !important;
}
}
@media screen and (min-width: 325px) and (max-width:399px) and (max-height: 812px){
@ -103,6 +108,9 @@
.qr-img-hmg-style{
left: 550px !important;
}
.cs-card-size{
padding: 10px !important;
}
}
@media screen and (min-width: 325px) and (max-width:399px) and (max-height: 700px){
@ -140,18 +148,25 @@
}
// HMG
.logo-img-hmg-style{
left: 245px !important;
left: 225px !important;
}
.qr-img-hmg-style{
left: 430px !important;
}
.cs-card-size{
padding:5px !important;
}
.name-div{
padding: 3px !important;
}
}
@media screen and (min-width: 1px) and (max-width:320px) {
.card-size{
transform: rotate(90deg) !important;
position: relative;
bottom: 3%;
bottom: 10%;
left: 8%;
padding: 10% !important
}
.qr-style{
width: 70% !important;
@ -176,34 +191,47 @@
.logo-img-hmg-style{
width: 380px !important;
position: fixed !important;
left: 200px !important;
left: 240px !important;
height: 81px !important;
bottom: 205px !important;
bottom: 175px !important;
}
.qr-img-hmg-style{
width: 105px !important;
margin-top: 0px !important;
position: relative !important;
left: 390px !important;
top: 160px !important;
top: 150px !important;
}
.cs-card-size{
padding: 15px !important;
padding: 0px !important;
padding-top: 0px !important;
padding-left: 1px !important;
}
}
@media screen and (min-width: 200px) and (max-width: 300px) and (max-height: 700px){
.font-text-style{
font-size: 11px !important;
}
.card-size{
padding: 0% !important;
left: 7% !important;
bottom: 0% !important;
position: relative;
}
}
.card-size{
transform: rotate(90deg);
padding: 6%;
padding: 18%;
}
.qr-style{
width: 70%;
margin-top: 0px;
position: relative;
left: 200%;
left: 135%;
}
.name-ar-style{
font-size: 20px;
@ -234,5 +262,5 @@
.cs-card-size{
transform: rotate(90deg);
padding: 25px;
padding: 0px;
}
Loading…
Cancel
Save