Skip to content

Jay Mehta / zango-frontend

Go to a project
Toggle navigation
Toggle navigation pinning
Commit c711cc65 by Ravindra Kanojiya
Options

updated

1 parent 9a1b54d9
Inline Side-by-side
Showing 3 changed files with 40 additions and 35 deletions
components/gift-card/GiftCard.js
...@@ -61,7 +61,7 @@ const GiftCard = () => { ...@@ -61,7 +61,7 @@ const GiftCard = () => {
<div className="container"> <div className="container">
<div className="row justify-content-center"> <div className="row justify-content-center">
<div className="col-md-10"> <div className="col-md-10">
<div> <div className="see-my-gift-cards-row">
<Button <Button
onClick={() => { onClick={() => {
if (!session) { if (!session) {
......
components/user/MyGiftCard.js
...@@ -7,29 +7,6 @@ import { useSelector } from "react-redux"; ...@@ -7,29 +7,6 @@ import { useSelector } from "react-redux";
const MyGiftCard = () => { const MyGiftCard = () => {
const { giftCard } = useSelector(state => state.giftCard); const { giftCard } = useSelector(state => state.giftCard);
console.log("giftCard >>>>>", giftCard) console.log("giftCard >>>>>", giftCard)
const giftCardData = [
{
id: "0",
sender_email: "John@gmail.com",
receiver_email: "martha@gmail.com",
gift_amount: "$750",
image: "/images/zango-logo.svg"
},
{
id: "1",
sender_email: "John@gmail.com",
receiver_email: "martha@gmail.com",
gift_amount: "$750",
image: "/images/zango-logo.svg"
},
{
id: "2",
sender_email: "John@gmail.com",
receiver_email: "martha@gmail.com",
gift_amount: "$750",
image: "/images/zango-logo.svg"
},
]
return ( return (
<Fragment> <Fragment>
...@@ -43,7 +20,7 @@ const MyGiftCard = () => { ...@@ -43,7 +20,7 @@ const MyGiftCard = () => {
<div className="card-booking"> <div className="card-booking">
<div className="card-booking-img bgGrey"> <div className="card-booking-img bgGrey">
<span className="image-container"> <span className="image-container">
<Image src={cleanImage(data.attributes.image.data.attributes)} layout="fill" className="image" /> <Image src="/images/zango-logo.svg" layout="fill" className="image" />
</span> </span>
</div> </div>
<div className="card-booking-content details-wrapper"> <div className="card-booking-content details-wrapper">
...@@ -60,7 +37,7 @@ const MyGiftCard = () => { ...@@ -60,7 +37,7 @@ const MyGiftCard = () => {
</div> </div>
<div className="details-div"> <div className="details-div">
<p>Gift Amount</p> <p>Gift Amount</p>
<p>{data.attributes.amount}</p> <p>${data.attributes.amount}</p>
</div> </div>
</div> </div>
</div> </div>
......
styles/globals.css
...@@ -1051,7 +1051,7 @@ span.form-error, ...@@ -1051,7 +1051,7 @@ span.form-error,
} }
.card-booking-img img { .card-booking-img img {
border-radius: 27px 27px 0 0; border-radius: 0;
} }
.card-booking-content { .card-booking-content {
...@@ -1154,7 +1154,7 @@ span.form-error, ...@@ -1154,7 +1154,7 @@ span.form-error,
.card-booking-img.bgGrey { .card-booking-img.bgGrey {
background: #f7f5f1; background: #f7f5f1;
border-radius: 13px 13px 0 0; border-radius: 13px 13px 0 0;
padding: 3rem; padding: 5rem 7rem;
} }
.card-booking-content.details-wrapper { .card-booking-content.details-wrapper {
...@@ -3453,8 +3453,9 @@ input[type="number"]::-webkit-outer-spin-button { ...@@ -3453,8 +3453,9 @@ input[type="number"]::-webkit-outer-spin-button {
} }
.gift-card-lt { .gift-card-lt {
text-align: center; text-align: center;
width: 354px; width: 100%;
height: 228px; height: 260px;
padding-right: 3rem;
} }
.gift-card-lt .gift-box { .gift-card-lt .gift-box {
height: 100%; height: 100%;
...@@ -3490,7 +3491,6 @@ input[type="number"]::-webkit-outer-spin-button { ...@@ -3490,7 +3491,6 @@ input[type="number"]::-webkit-outer-spin-button {
font-size: 1.146vw; font-size: 1.146vw;
line-height: 22px; line-height: 22px;
margin: 0.5rem; margin: 0.5rem;
min-width: 9vw;
text-align: center; text-align: center;
background: #f7f5f1; background: #f7f5f1;
display: flex; display: flex;
...@@ -3500,6 +3500,11 @@ input[type="number"]::-webkit-outer-spin-button { ...@@ -3500,6 +3500,11 @@ input[type="number"]::-webkit-outer-spin-button {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.gift-card-amt>ul{
display: grid;
grid-gap: 20px;
grid-template-columns: repeat(auto-fill, minmax(calc(33.33% - 15px), 1fr));
}
.gift-card-amt ul li a, .gift-card-amt ul li a,
.gift-card-amt ul li label > span { .gift-card-amt ul li label > span {
font-size: 14px; font-size: 14px;
...@@ -3718,6 +3723,9 @@ img:hover { ...@@ -3718,6 +3723,9 @@ img:hover {
font-size: 16px; font-size: 16px;
border-radius: 5px; border-radius: 5px;
} }
.see-my-gift-cards-row{
margin-bottom: 4rem;
}
@media (min-width: 992px) { @media (min-width: 992px) {
.navbar-expand-lg .navbar-nav .nav-link { .navbar-expand-lg .navbar-nav .nav-link {
...@@ -3807,6 +3815,14 @@ img:hover { ...@@ -3807,6 +3815,14 @@ img:hover {
} }
} }
@media (max-width: 1023px) { @media (max-width: 1023px) {
.gift-card-amt ul li a, .gift-card-amt ul li label {
padding: 1.5rem 2.8rem;
}
.gift-card-lt {
width: 100%;
height: 200px;
padding-right: 0;
}
.swiper-nav, .swiper-nav,
.home_nav { .home_nav {
margin-left: -33px; margin-left: -33px;
...@@ -3862,6 +3878,22 @@ img:hover { ...@@ -3862,6 +3878,22 @@ img:hover {
} }
@media (max-width: 767px) { @media (max-width: 767px) {
.gift-card-rt .title {
font-size: 4.667vw;
}
.gift-card-amt>ul {
grid-gap: 10px;
}
.gift-card-amt ul li a, .gift-card-amt ul li label {
padding: 1rem;
}
.see-my-gift-cards-row{
text-align: center;
margin-bottom: 3rem;
}
.card-booking-img.bgGrey {
padding: 4rem 4rem;
}
.rightContent h2 { .rightContent h2 {
font-size: 4.172vw; font-size: 4.172vw;
line-height: 4.172vw; line-height: 4.172vw;
...@@ -3872,10 +3904,6 @@ img:hover { ...@@ -3872,10 +3904,6 @@ img:hover {
.header-search .rbt .rbt-input-main { .header-search .rbt .rbt-input-main {
font-size: 1rem; font-size: 1rem;
} }
.gift-card-amt ul li a,
.gift-card-amt ul li label {
min-width: 40vw;
}
.blog-detail-inner-session h2 { .blog-detail-inner-session h2 {
font-size: 4.867vw; font-size: 4.867vw;
line-height: 6.967vw; line-height: 6.967vw;
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!