Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

added the gift store page #1532

Merged
merged 1 commit into from
Aug 4, 2024
Merged

added the gift store page #1532

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion account/notifications.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ <h4>Hello</h4>
<div class="options-heading">PAYMENTS</div>
</div>
<ul class="lists">
<li><a href="">Gift Cards</a>
<li><a href="/the-gift-card-store/index.html">Gift Cards</a>
<p>₹0</p></li>
<li><a href="">Saved UPI</a></li>
<li><a href="">Saved Cards</a></li>
Expand Down
2 changes: 1 addition & 1 deletion account/rewards.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -339,7 +339,7 @@ <h3>PAYMENTS</h3>
</div>
<div class="nav-list">
<ul>
<li><a href="#">Gift Cards</a></li>
<li><a href="/the-gift-card-store/index.html">Gift Cards</a></li>
<li><a href="#">Saved UPI</a></li>
<li><a href="#">Saved Cards</a></li>
</ul></div>
Expand Down
2 changes: 1 addition & 1 deletion components/footer.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -95,7 +95,7 @@
<div class="c4gehN"><img
src="https://static-assets-web.flixcart.com/batman-returns/batman-returns/p/images/gift-cards-image-d7ff24.svg"
alt="Gift Cards" width="13" height="13"><a
href="/the-gift-card-store?otracker=${otracker}_footer_navlinks" aria-label="Gift Cards"><span>Gift
href="/the-gift-card-store/index.html" aria-label="Gift Cards"><span>Gift
Cards</span></a></div>
<div class="c4gehN"><img
src="https://static-assets-web.flixcart.com/batman-returns/batman-returns/p/images/help-centre-image-c4ace8.svg"
Expand Down
2 changes: 1 addition & 1 deletion footer/footer.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@ <h5>Registered Office Address:</h5>
<div class="col-auto">
<img src="https://static-assets-web.flixcart.com/batman-returns/batman-returns/p/images/gift-cards-image-d7ff24.svg"
alt="Gift Cards" width="13" height="13">
<a href="https://www.flipkart.com/the-gift-card-store?otracker=${otracker}_footer_navlinks"
<a href="../the-gift-card-store/index.html"
aria-label="Gift Cards"><span>Gift Cards</span></a>
</div>
<div class="col-auto">
Expand Down
2 changes: 1 addition & 1 deletion helpcenter.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -103,7 +103,7 @@
<a class="dropdown-item" href="account/rewards.html">
<img width="20" src="img/svg/rewards.svg" alt="flipKart">
Rewards</a>
<a class="dropdown-item" href="the-gift-card-store/">
<a class="dropdown-item" href="./the-gift-card-store/index.html">
<img width="20" src="img/svg/giftCard.svg" alt="flipKart">
Gift Cards</a>
<a class="dropdown-item" href="account/contact.html">
Expand Down
2 changes: 1 addition & 1 deletion index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -440,7 +440,7 @@ <h4>Login</h4>
Notifications</a>
<a class="dropdown-item d-flex gap-2" href="account/rewards.html"><img width="20"
src="img/svg/rewards.svg" alt="flipKart" style="margin-right: 5px;"> Rewards</a>
<a class="dropdown-item d-flex gap-2" href="the-gift-card-store/"><img width="20"
<a class="dropdown-item d-flex gap-2" href="./the-gift-card-store/index.html"><img width="20"
src="img/svg/giftCard.svg" alt="flipKart" style="margin-right: 5px;"> Gift Cards</a>
<a class="dropdown-item d-flex gap-2" href="account/contact.html"><img width="20" height="10"
src="https://pngimg.com/uploads/phone/phone_PNG48988.png" alt="flipKart"
Expand Down
163 changes: 132 additions & 31 deletions the-gift-card-store/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,28 +6,132 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Flipkart Gift Card</title>
<link rel="shortcut icon" href="../img/flipkart_favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="giftcard.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<style>
#progress-container {
position: fixed ;
top: 0px;
left: 0;
width: 100%;
height: 15px;
z-index: 99990;
/* background: #f3f3f3; */
}

#progress-bar {
height: 53%;
width: 0;
background: linear-gradient(90deg, rgb(0, 72, 255) 0%, rgb(153, 187, 255) 50%, rgb(0, 184, 250) 100%);
box-shadow: 0 0 4px rgba(0, 166, 255, 0.7), 0 0 10px rgba(255, 255, 255, 0.7);
transition: width 0.09s ease-in-out;
border-radius: 10px;
}
/* Progress Bar Styles */
#progress-container {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 15px;
z-index: 99990;
}

#progress-bar {
height: 53%;
width: 0;
background: linear-gradient(90deg, rgb(0, 72, 255) 0%, rgb(153, 187, 255) 50%, rgb(0, 184, 250) 100%);
box-shadow: 0 0 4px rgba(0, 166, 255, 0.7), 0 0 10px rgba(255, 255, 255, 0.7);
transition: width 0.09s ease-in-out;
border-radius: 10px;
}

/* Navbar Styles */
.navbar {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 20px;
background-color: #f8f9fa;
border-bottom: 1px solid #e5e5e5;
}

.navbar .logo .title {
font-size: 24px;
font-weight: bold;
color: #007bff;
}

.navbar .search-bar input {
padding: 5px 10px;
width: 300px;
border-radius: 5px;
border: 1px solid #ddd;
}

.navbar .links a {
margin: 0 10px;
text-decoration: none;
color: #007bff;
font-size: 16px;
}

.navbar .links a:hover {
text-decoration: underline;
}

/* Info Section Styles */
.info {
padding: 20px;
background-color: #f4f4f4;
}

.info .head {
font-size: 28px;
margin-bottom: 20px;
}

.info .detail {
font-size: 16px;
line-height: 1.6;
}

/* Gift Card Section Styles */
.gift-card-section {
padding: 20px;
background-color: #fff;
}

.gift-card-section h1 {
font-size: 24px;
margin-bottom: 20px;
}

.gift-card-section form {
margin-bottom: 20px;
}

.gift-card-section label {
display: block;
margin-bottom: 5px;
font-weight: bold;
}

.gift-card-section select {
padding: 5px;
border-radius: 5px;
border: 1px solid #ddd;
margin-bottom: 10px;
}

.gift-card-section button {
padding: 10px 20px;
background-color: #007bff;
color: #fff;
border: none;
border-radius: 5px;
cursor: pointer;
}

.gift-card-section button:hover {
background-color: #0056b3;
}

.gift-card-section .preview {
margin-top: 20px;
}

.gift-card-section .preview h2 {
font-size: 20px;
}

/* Footer Styles */
#footer-giftCard {
height: 100px;
background-color: #292d33;
margin-top: 20px;
}
</style>
</head>

Expand All @@ -37,15 +141,13 @@
</div>

<script>

window.addEventListener('scroll', function() {
const winScroll = document.body.scrollTop || document.documentElement.scrollTop;
const height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
const scrolled = (winScroll / height) * 100;
document.getElementById('progress-bar').style.width = scrolled + '%';
const winScroll = document.body.scrollTop || document.documentElement.scrollTop;
const height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
const scrolled = (winScroll / height) * 100;
document.getElementById('progress-bar').style.width = scrolled + '%';
});
</script>

</script>

<div class="navbar">
<div class="logo">
Expand All @@ -61,6 +163,7 @@
<a href="../helpcentre/index.html">Support</a>
</div>
</div>

<div class="info">
<h1 class="head">Gift Card Store</h1>
<div class="detail">
Expand All @@ -76,6 +179,7 @@ <h1 class="head">Gift Card Store</h1>
special!. The information you are reading has been last updated on 17-May-24.
</div>
</div>

<div class="gift-card-section">
<h1>Flipkart Gift Card</h1>
<form id="giftCardForm">
Expand All @@ -94,10 +198,7 @@ <h2>Gift Card Preview</h2>
</div>
</div>



<div id="footer-giftCard" style="background-color: #292d33;"></div>
<script src="../js/giftCard.js"></script>
<div id="footer-giftCard"></div>
</body>

</html>
</html>
Loading