Skip to content
This repository has been archived by the owner on Jun 29, 2024. It is now read-only.

All Tasks are completed! #50

Open
wants to merge 4 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
178 changes: 178 additions & 0 deletions ShaikShakeer/Task-1/index.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,178 @@
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

body {
font-family: Arial, sans-serif;
line-height: 1.6;
background: #f8f9fa;
color: #333;
}

.container {
width: 80%;
margin: auto;
overflow: hidden;
}

header {
background-color: rgb(15, 15, 15);
color: #fff;
padding: 20px 0;
}

header .container {
display: flex;
justify-content: space-between;
align-items: center;
}

header .logo {
font-size: 1.5em;
font-weight: bold;
}

header nav ul {
display: flex;
list-style: none;
}

header nav ul li {
margin-left: 20px;
}

header nav ul li a {
color: #fff;
text-decoration: none;
font-weight: bold;
transition: color 0.3s;
}

header nav ul li a:hover {
color: #ffcb05;
}

#hero {
background: linear-gradient(to right, #0062E6, #33AEFF);

height: 100vh;
color: #fff;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
}

#hero .hero-content {
max-width: 600px;
background: rgba(0, 0, 0, 0.6);
padding: 20px;
border-radius: 10px;
}

#features, #testimonials, #contact {
padding: 40px 0;
background: #f8f9fa;
}

#features h2, #testimonials h2, #contact h2 {
text-align: center;
margin-bottom: 20px;
font-size: 2em;
color: #0062E6;
}

.features {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

.feature {
width: 22%;
background: #fff;
padding: 20px;
margin: 10px 0;
text-align: center;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.feature h3 {
margin-bottom: 10px;
color: #0062E6;
}

.testimonial {
background: #fff;
padding: 20px;
margin: 20px 0;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.testimonial p {
font-style: italic;
}

.testimonial h4 {
margin-top: 10px;
color: #0062E6;
}

#contact form {
display: flex;
flex-direction: column;
align-items: center;
}

#contact form input, #contact form textarea {
width: 80%;
margin-bottom: 10px;
padding: 10px;
border: 1px solid #ccc;
border-radius: 5px;
}

#contact form button {
padding: 10px 20px;
background: linear-gradient(to right, #0062E6, #33AEFF);
color: #fff;
border: none;
cursor: pointer;
border-radius: 5px;
transition: background 0.3s;
}

#contact form button:hover {
background: linear-gradient(to right, #0052CC, #1A9FFF);
}

.social-media {
text-align: center;
margin-top: 20px;
}

.social-media a {
margin: 0 10px;
text-decoration: none;
color: #0062E6;
font-weight: bold;
transition: color 0.3s;
}

.social-media a:hover {
color: #ffcb05;
}

footer {
text-align: center;
padding: 20px 0;
background: #333;
color: #fff;
margin-top: 40px;
}
index.css
Displaying index.html.
85 changes: 85 additions & 0 deletions ShaikShakeer/Task-1/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,85 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CSEdge Landing Page</title>
<link rel="stylesheet" href="index.css">
</head>
<body>
<header>
<div class="container">
<div class="logo">CSEdge</div>
<nav>
<ul>
<li><a href="#hero">Home</a></li>
<li><a href="#features">Features</a></li>
<li><a href="#testimonials">Testimonials</a></li>
<li><a href="#contact">Contact Us</a></li>
</ul>
</nav>
</div>
</header>

<section id="hero">
<div class="bg">
<div class="hero-content">
<h1>Welcome to CSEdge</h1>
<p>Leading the way in computer science education.</p>
</div>
</section>

<section id="features" class="container">
<h2>Our Features</h2>
<div class="features">
<div class="feature">
<h3>Feature 1</h3>
<p>Cutting-edge curriculum designed by industry experts.</p>
</div>
<div class="feature">
<h3>Feature 2</h3>
<p>Hands-on projects to build real-world skills.</p>
</div>
<div class="feature">
<h3>Feature 3</h3>
<p>Interactive learning with personalized feedback.</p>
</div>
<div class="feature">
<h3>Feature 4</h3>
<p>Access to a global community of learners and professionals.</p>
</div>
</div>
</section>

<section id="testimonials" class="container">
<h2>Testimonials</h2>
<div class="testimonial">
<p>"CSEdge has transformed my career. The curriculum is top-notch and the support is amazing!"</p>
<h4>- CHANDU </h4>
</div>
<div class="testimonial">
<p>"The projects I worked on at CSEdge gave me the confidence and skills to land my dream job."</p>
<h4>- HARSHA </h4>
</div>
</section>

<section id="contact" class="container">
<h2>Contact Us</h2>
<form>
<input type="text" placeholder="Your Name" required>
<input type="email" placeholder="Your Email" required>
<textarea placeholder="Your Message" required></textarea>
<button type="submit">Send Message</button>
</form>
<div class="social-media">
<a href="#">Facebook</a>
<a href="#">Twitter</a>
<a href="#">LinkedIn</a>
</div>
</section>

<footer>
<p>&copy; 2024 CSEdge. All rights reserved.</p>
</footer>
</body>
</html>
Loading