Skip to content

Commit

Permalink
Dev-Club site BETA
Browse files Browse the repository at this point in the history
  • Loading branch information
AryanVBW authored Nov 12, 2024
1 parent 218ad16 commit 19b27e7
Show file tree
Hide file tree
Showing 34 changed files with 1,833 additions and 1 deletion.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1 +1 @@
# DevClub-Site
# Newton-SDC
165 changes: 165 additions & 0 deletions about.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,165 @@
body {
background-image: url('/photos/background.gif');
background-size: cover;
background-repeat: no-repeat;
color: #f0f0f0;
font-family: 'Roboto', sans-serif;
margin: 0;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}

.body {
max-width: 1200px;
width: 100%;
padding: 20px;
background: rgba(30, 30, 30, 0.85);
border-radius: 15px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}

/* Header */
header {
text-align: center;
color: #00bcd4;
}

header h1 {
font-size: 2.5rem;
margin: 0;
}

header h3 {
font-size: 1.2rem;
margin: 10px 0;
color: #e0e0e0;
}

/* Navigation */
.nav {
display: flex;
justify-content: center;
gap: 20px;
margin: 15px 0;
}

.nav-item a {
text-decoration: none;
color: #00bcd4;
font-weight: bold;
padding: 10px 20px;
border-radius: 8px;
transition: background-color 0.3s;
}

.nav-item a:hover {
background-color: #0097a7;
color: #ffffff;
}

/* Aim & Motive Section */
.aim {
max-width: 800px;
background: rgba(30, 30, 30, 0.85);
padding: 20px;
border-radius: 15px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
margin:20px;
text-align: left;
}

.aim h4 {
color: #00bcd4;
font-size: 1.5rem;
margin-bottom: 15px;
}

.aim p {
font-size: 1rem;
line-height: 1.6;
color: #e0e0e0;
}

.aim b {
color: #00bcd4;
}

/* Team Section */
.team {
text-align: center;
margin: 20px 0;
}

.team h4 {
color: #00bcd4;
font-size: 1.8rem;
margin-bottom: 20px;
}

.team-member, .students {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 15px;
}

.team img {
width: 100px;
height: 100px;
border-radius: 50%;
border: 2px solid #00bcd4;
transition: transform 0.3s, border-color 0.3s;
}

.team img:hover {
transform: scale(1.1);
border-color: #0097a7;
}

/* Footer */
.footer {
width: 100%;
display: flex;
justify-content: center;
padding: 20px 0;
background: rgba(20, 20, 20, 0.9);
border-top: 2px solid #444;
margin-top: 40px;
}

.footer-content {
display: flex;
flex-direction: column;
align-items: center;
color: #e0e0e0;
}

.footer-content p {
margin: 0;
font-size: 1rem;
color: #e0e0e0;
}

.social-icons {
display: flex;
gap: 15px;
margin-top: 10px;
}

.social-icons img {
width: 30px;
height: 30px;
transition: transform 0.3s;
cursor: pointer;
}

.social-icons img:hover {
transform: scale(1.1);
}
#date-time {
font-size: 1rem;
color: #e0e0e0;
margin-top: 5px;
}
134 changes: 134 additions & 0 deletions about.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,134 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>NST-SDC</title>
<link rel="stylesheet" href="/about.css">
</head>
<body>
<div class="body">
<!-------------header------------>
<header>
<h1>NST-SDC</h1>
<h3>Code, Create, Connect!</h3>
<div id="date-time"></div>
</header>
<hr>
<div class="nav">
<div class="nav-item">
<a href="/home.html">Home</a>
</div>
<div class="nav-item">
<a href="/about.html">About</a>
</div>
<div class="nav-item">
<a href="/events.html">Events</a>
</div>
<div class="nav-item">
<a href="/gallery.html">Gallery</a>
</div>
<div class="nav-item">
<a href="/contact.html">Contact</a>
</div>
</div>
<!-------------/header/------------>
<hr>
<!-- Aim And Motive -->
<div class="aim"><u><h4>Aims & Motives</h4></u>
<p><b>•Encourage Collaboration:</b>Promote teamwork through group projects and collaborative coding sessions.
</p>
<p><b>•Enhance Skills:</b>Organize workshops and training sessions to improve technical skills and knowledge in software development.
</p>
<p><b>•Create Projects:</b>Develop real-world applications and projects that can be showcased in portfolios or competitions.
</p>
<p><b>•Networking Opportunities: </b>Facilitate connections with industry professionals and alumni to enhance career prospects.
</p>
<p><b>•Host Events:</b>Organize hackathons, coding competitions, and guest speaker events to engage members and the wider community.
</p>
<p><b>•Promote Innovation:</b> Encourage members to explore new technologies and creative solutions to problems.
</p>
</div>
<!--/Aim And Motive -->
<hr>
<!-- Team -->
<div class="team">
<h4>Meet Our Team</h4>
<div class="team-member">
<div class="mentors">
<img src="/NST_SDC/photos/profile.jpeg" alt="Mentor Profile 1">
<img src="/NST_SDC/photos/profile.jpeg" alt="Mentor Profile 2">
</div>
</div>
<div class="students">
<img src="/photos/profile.jpg" alt="Student Profile 1">
<img src="/photos/profile.jpg" alt="Student Profile 2">
<img src="/photos/profile.jpg" alt="Student Profile 3">
<img src="/photos/profile.jpg" alt="Student Profile 4">
<img src="/photos/profile.jpg" alt="Student Profile 5">
<img src="/photos/profile.jpg" alt="Student Profile 6">
<img src="/photos/profile.jpg" alt="Student Profile 7">
<img src="/photos/profile.jpg" alt="Student Profile 8">
<img src="/photos/profile.jpg" alt="Student Profile 9">
<img src="/photos/profile.jpg" alt="Student Profile 10">
<img src="/photos/profile.jpg" alt="Student Profile 11">
<img src="/photos/profile.jpg" alt="Student Profile 12">
<img src="/photos/profile.jpg" alt="Student Profile 13">
<img src="/photos/profile.jpg" alt="Student Profile 14">
<img src="/photos/profile.jpg" alt="Student Profile 15">
<img src="/photos/profile.jpg" alt="Student Profile 16">
<img src="/photos/profile.jpg" alt="Student Profile 17">
<img src="/photos/profile.jpg" alt="Student Profile 18">
<img src="/photos/profile.jpg" alt="Student Profile 19">
<img src="/photos/profile.jpg" alt="Student Profile 20">
<img src="/photos/profile.jpg" alt="Student Profile 21">
<img src="/photos/profile.jpg" alt="Student Profile 22">
<img src="/photos/profile.jpg" alt="Student Profile 23">
<img src="/photos/profile.jpg" alt="Student Profile 24">
<img src="/photos/profile.jpg" alt="Student Profile 25">
<img src="/photos/profile.jpg" alt="Student Profile 26">
<img src="/photos/profile.jpg" alt="Student Profile 27">
<img src="/photos/profile.jpg" alt="Student Profile 28">
</div>

<!-- footer -->
<div class="footer">
<footer>
<div class="footer-content">
<p>© 2024 NST-SDC: All rights reserved</p>
<div class="social-icons">
<img src="/photos/github.png" alt="GitHub" class="img">
<img src="/NST_SDC/photos/instagram.png" alt="Instagram" class="img">
<img src="/photos/discord.png" alt="Discord" class="img">
<img src="/photos/youtube.png" alt="YouTube" class="img">
</div>
</div>
</footer>
</div>
<!-- /footer -->
</div>
</body>
<script>
// Function to update date and time
function updateDateTime() {
const now = new Date();
const options = {
weekday: 'long',
year: 'numeric',
month: 'long',
day: 'numeric',
hour: '2-digit',
minute: '2-digit',
second: '2-digit'
};
document.getElementById('date-time').textContent = now.toLocaleDateString('en-US', options);
}

// Initial call to set the date and time
updateDateTime();

// Update the time every second
setInterval(updateDateTime, 1000);

</script>
</html>
Loading

0 comments on commit 19b27e7

Please sign in to comment.