Skip to content

Commit

Permalink
Merge branch 'arghadipmanna101:main' into main
Browse files Browse the repository at this point in the history
  • Loading branch information
purvathnere authored Jun 16, 2024
2 parents 05344fb + a5549b5 commit 4d52bdc
Show file tree
Hide file tree
Showing 13 changed files with 586 additions and 24 deletions.
72 changes: 72 additions & 0 deletions account/contact.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Contact Us - Your Website</title>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" rel="stylesheet">
<link rel="stylesheet" href="../css/footer.css">
<link rel="stylesheet" href="../css/contact.css">

</head>
<body>

<!-- Header -->
<div class="contact-header text-center">
<a href="../">Home</a>
<a href="../helpcentre/index.html">Help Centre</a>
<a href="../sell-online/index.html">Become a Seller</a>
<a href="../account/orders.html">Orders</a>
</div>

<!-- Main Content -->
<div class="container contact-section">
<h1 class="text-center mb-5">Contact Us</h1>

<div class="row mb-5">
<div class="col-md-6 contact-info">
<h2><img src="https://img.icons8.com/ios-filled/50/000000/map-marker.png" alt="Address Icon"> Mail Us:</h2>
<address>
Company Private Limited,<br>
1234 Street,<br>
City, 56789,<br>
State, Country
</address>
<h2><img src="https://img.icons8.com/ios-filled/50/000000/phone.png" alt="Phone Icon"> Registered Office Address:</h2>
<address>
Company Private Limited,<br>
1234 Your Street,<br>
City, 56789,<br>
State, Country<br>
CIN: U12345ABC12345<br>
Telephone: 123-456-7890
</address>
</div>
<div class="col-md-6 contact-form">
<form>
<div class="form-group">
<label for="name">Name</label>
<input type="text" class="form-control" id="name" placeholder="Your Name">
</div>
<div class="form-group">
<label for="email">Email address</label>
<input type="email" class="form-control" id="email" placeholder="Your Email">
</div>
<div class="form-group">
<label for="message">Message</label>
<textarea class="form-control" id="message" rows="5" placeholder="Your Message"></textarea>
</div>
<button type="submit" class="btn btn-primary btn-block">Submit</button>
</form>
</div>
</div>
</div>

<!-- Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.5.4/dist/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</body>
</html>
48 changes: 48 additions & 0 deletions css/contact.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
.contact-header {
background-color: #007bff;
color: white;
padding: 15px 0;
}
.contact-header a {
color: white;
text-decoration: none;
margin: 0 20px;
transition: color 0.3s;
}
.contact-header a:hover {
color: #ffd700;
}
.contact-section {
padding: 60px 0;
}
.contact-section h2 {
animation: fadeInDown 1s;
}
.contact-info,
.contact-form {
animation: fadeInUp 1s;
}
@keyframes fadeInDown {
from { opacity: 0; transform: translateY(-20px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(20px); }
to { opacity: 1; transform: translateY(0); }
}
.contact-info img {
width: 30px;
margin-right: 10px;
}
.footer {
background-color: #f1f1f1;
padding: 20px 0;
}
.footer a {
color: #007bff;
text-decoration: none;
transition: color 0.3s;
}
.footer a:hover {
color: #0056b3;
}
177 changes: 177 additions & 0 deletions css/contactus.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,177 @@
body {
font-family: 'Arial', sans-serif;
background: linear-gradient(180deg, #FDD86C 8.1%, #FF7D1F 100%);
}
.container {
display: flex;
justify-content: center;
align-items: center;
margin-top: 28px;
margin-bottom: 100px;
gap: 200px;
}
#error{
color: red;
font-size: 18px;
text-align: center;
}
input::placeholder{
margin: 0px;
font-family: Poppins;
font-size: 20px;
font-weight: 400;
line-height: 30px;
text-align: left;

}
::placeholder{
color: #0000006B;
}
.form-container {
background: #FF7D1F63;

padding: 20px;
border-radius: 20px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
width: 400px;
}

.form-container h1 {
text-align: center;
margin-bottom: 20px;
font-family: Poppins;
color: white;
font-size: 30px;
font-weight: 400;
line-height: 45px;

}

form label {
display: block;
margin-bottom: 5px;
font-weight: bold;
}
.container img{
width: 25%;
}
.main{
min-height: 70vh;
height: auto;
display: flex;
justify-content: center;
align-items: center;
width:85vw ;
border-radius: 20px;
margin-bottom: 50px !important;
margin:auto;
background-image: linear-gradient(to right , red 1%, orange 99%) !important;
}

@media only screen and (max-width:1212px){
.container img{
width: 40%;
}
.container {
gap: 100px;
}
}
@media only screen and (max-width:958px){
.container img{
width: 50%;
}
.container {
gap: 10px;
}
}
@media only screen and (max-width:558px){
.container img{
width: 70% !important;
}
.container{
margin-top: 120px !important;
}

}
.container{
margin-top: 50px;
}
@media only screen and (max-width:781px){
.container img{
width: 50%;
}
.container {
flex-direction: column;
gap: 100px;
}
.form-container{
width: 70vw !important;
}
}
form input,
form textarea {
width: 100%;
padding: 10px;
margin-bottom: 15px;
border: none;
/* border-radius: 5px; */
box-sizing: border-box;
background-color: transparent;
border-bottom: solid 2px;
font-family: Poppins;
font-size: 20px;
font-weight: 400;
line-height: 30px;
text-align: left;
}

form textarea {
resize: none;
height: 80px;
color: #0000006B;
border-bottom: solid 1px;

}
textarea::placeholder{
color: #0000006B;
}

#rating {
display: flex;
justify-content: space-between;
margin-bottom: 15px;
}
#comment {
border-bottom: solid 1px;
}


.star {
font-size: 2rem;
cursor: pointer;
color: black;

}
#rate{
font-family: Poppins;
font-size: 20px;
font-weight: 400;
line-height: 30px;
text-align: left;

}
#button {
width: 100%;
padding: 10px;
border: none;
border-radius: 5px;
background-color: black;
color: #FF7D1F;
cursor: pointer;
font-size: 1rem;
}

#button:hover {
background-color: #333;
}

4 changes: 4 additions & 0 deletions css/footer.css
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,10 @@ footer .social li{
margin: 5px;
opacity: 0.75;
}
footer .social a:hover img{
transform: scale(1.5);
transition: .3s;
}
footer .footerEnd{
border-top: 1px solid #454d5e;
padding: 25px 0;
Expand Down
16 changes: 8 additions & 8 deletions css/index.css
Original file line number Diff line number Diff line change
Expand Up @@ -720,15 +720,15 @@ Search Bar
font-weight: 500;
font-size: 16px;
color: #878787;
}

.brand-directory{
background-color: white;
padding: 20px 30px;
color: #878787;
letter-spacing: 0;

.banner{
object-fit: cover;
width: 100%;
margin: 15px 0px;
}
.brand-directory-heading{
font-weight: 24px;
color:black ;

.searchbar{
width:40%;
}
5 changes: 3 additions & 2 deletions footer/footer.html
Original file line number Diff line number Diff line change
Expand Up @@ -88,7 +88,7 @@ <h5>Social</h5>
src="https://static-assets-web.flixcart.com/batman-returns/batman-returns/p/images/YoutubeLogo-8425c4.svg"
alt=""></a></li>
<li><a href="https://www.instagram.com/flipkart/"><img
src="https://img.icons8.com/?size=20&id=32292&format=png&color=FFFFFF"
src="/Flipkart_Clone/img/instagram.png" style="width:34px"
alt=""></a></li>

</ul>
Expand All @@ -104,6 +104,7 @@ <h5>Registered Office Address:</h5>
<p>CIN : U51109KA2012PTC066107</p>
<P>Telephone: <a class="text-primary" href="tel:044-45614700">044-45614700</a>&nbsp/&nbsp<a
class="text-primary" href="tel:044-67415800">044-67415800</a></P>
<p>mail to : <a class="text-primary" href="mailto:support@flipkart.com">support@flipkart.com</a></p>
</div>
</div>
</div>
Expand Down Expand Up @@ -150,4 +151,4 @@ <h5>Registered Office Address:</h5>

</body>

</html>
</html>
Binary file added img/instagram.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit 4d52bdc

Please sign in to comment.