Skip to content

Commit bc98111

Browse files
dharmviro1dharmviro1
committed
Commit added site for hosting.
1 parent ced8b5b commit bc98111

File tree

7 files changed

+240
-0
lines changed

7 files changed

+240
-0
lines changed

‎site/assets/images/devgit.png‎

1.98 MB
Loading

‎site/assets/images/dharmvir.jpg‎

53.3 KB
Loading

‎site/assets/images/friend1.jpg‎

112 KB
Loading

‎site/assets/images/friend2.jpg‎

54.1 KB
Loading

‎site/index.html‎

Lines changed: 131 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,131 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>DevOps Project</title>
7+
<link rel="stylesheet" href="style.css" />
8+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"/>
9+
</head>
10+
<body>
11+
12+
<!-- Navbar -->
13+
<nav>
14+
<div class="nav-container">
15+
<div class="logo">DevOps Project</div>
16+
<ul class="nav-links">
17+
<li><a href="#home">Home</a></li>
18+
<li><a href="#about">About</a></li>
19+
<li><a href="#team">Team</a></li>
20+
<li><a href="#links">Links</a></li>
21+
</ul>
22+
</div>
23+
</nav>
24+
25+
<!-- Hero / Home Section -->
26+
<section id="home" class="section home">
27+
<div class="hero-container">
28+
<h1>Welcome to Our DevOps Git Project</h1>
29+
<p>Collaborating on Git, Branches, Pull Requests & GitHub Pages Hosting.</p>
30+
<img src="assets/images/devgit.png" alt="DevOps illustration" class="home-img"/>
31+
</div>
32+
</section>
33+
34+
<!-- About Section -->
35+
<section id="about" class="section about">
36+
<div class="container">
37+
<h2>About the Project</h2>
38+
<p>This repository was created as part of a DevOps/GitHub assignment. It demonstrates collaboration, branches, pull requests, and hosting via GitHub Pages.</p>
39+
</div>
40+
</section>
41+
42+
<!-- Team Section -->
43+
<section id="team" class="section team">
44+
<div class="container">
45+
<h2>Team Members</h2>
46+
<div class="team-grid">
47+
<!-- Owner -->
48+
<div class="member-card">
49+
<img src="assets/images/dharmvir.jpg" alt="DHARMVIR SINGH">
50+
<h3>DHARMVIR SINGH</h3>
51+
<p>Owner / Developer</p>
52+
<div class="social-links">
53+
<a href="https://github.com/dharmviro1" target="_blank"><i class="fab fa-github"></i></a>
54+
55+
<a href="https://www.linkedin.com/in/dharmvir-singh-1149b1254?lipi=urn%3Ali%3Apage%3Ad_
56+
flagship3_profile_view_base_contact_details%3BdG1c6Oa4To6n0zX3FxlA7w%3D%3D" target="_blank">
57+
<i class="fab fa-linkedin"></i></a>
58+
59+
</div>
60+
</div>
61+
<!-- Collaborator 1 -->
62+
<div class="member-card">
63+
<img src="assets/images/friend1.jpg" alt="Friend 1">
64+
<h3>SOURAV KUMAR</h3>
65+
<p>Collaborator</p>
66+
<div class="social-links">
67+
<a href="https://github.com/souravo1" target="_blank"><i class="fab fa-github"></i></a>
68+
69+
<a href="https://www.linkedin.com/in/sourav-kumar-114076255?lipi=urn%3Ali%3Apage%3Ad_
70+
flagship3_profile_view_base_contact_details%3BhSGFesENQvGcf%2BPfvJJFWQ%3D%3D" target="_blank">
71+
<i class="fab fa-linkedin"></i></a>
72+
73+
</div>
74+
</div>
75+
<!-- Collaborator 2 -->
76+
<div class="member-card">
77+
<img src="assets/images/friend2.jpg" alt="Friend 2">
78+
<h3>ARSH SHARMA</h3>
79+
<p>Collaborator</p>
80+
<div class="social-links">
81+
<a href="https://github.com/friend2username" target="_blank"><i class="fab fa-github"></i></a>
82+
83+
<a href="https://www.linkedin.com/in/arsh-sharma-b2a163255?lipi=urn%3Ali%3Apage%3Ad_
84+
flagship3_profile_view_base_contact_details%3BdZ7gSYpYSk6Xoltxz1A2ow%3D%3D" target="_blank">
85+
<i class="fab fa-linkedin"></i></a>
86+
87+
</div>
88+
</div>
89+
</div>
90+
</div>
91+
</section>
92+
93+
<!-- Links Section -->
94+
<section id="links" class="section links">
95+
<div class="container">
96+
<h2>Project Links</h2>
97+
<div class="links-grid">
98+
<!-- README -->
99+
<a href="README.md" target="_blank" class="link-card">
100+
<i class="fas fa-file-alt fa-2x"></i>
101+
<span>README.md</span>
102+
</a>
103+
104+
<!-- GitHub Repo -->
105+
<a href="https://github.com/dharmviro1/devops-git-project" target="_blank" class="link-card">
106+
<i class="fab fa-github fa-2x"></i>
107+
<span>GitHub Repo</span>
108+
</a>
109+
110+
<!-- Optional: Add more project links -->
111+
<!-- Example: -->
112+
<!--
113+
<a href="docs/assignment.pdf" target="_blank" class="link-card">
114+
<i class="fas fa-book fa-2x"></i>
115+
<span>Assignment PDF</span>
116+
</a>
117+
-->
118+
</div>
119+
</div>
120+
</section>
121+
122+
<!-- Footer -->
123+
<footer>
124+
<div class="container">
125+
<p>© 2025 DevOps Git Project</p>
126+
</div>
127+
</footer>
128+
129+
<script src="script.js"></script>
130+
</body>
131+
</html>

‎site/script.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
// Smooth scroll for navigation links
2+
document.querySelectorAll('nav a').forEach(anchor => {
3+
anchor.addEventListener('click', function(e) {
4+
e.preventDefault();
5+
document.querySelector(this.getAttribute('href')).scrollIntoView({ behavior: 'smooth' });
6+
});
7+
});

‎site/style.css‎

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
/* General resets */
2+
* { margin: 0; padding: 0; box-sizing: border-box; }
3+
body { font-family: 'Segoe UI', Roboto, Arial, sans-serif; line-height: 1.6; color: #333; }
4+
5+
/* Navbar */
6+
nav {
7+
background: linear-gradient(90deg, #1e3c72, #2a5298);
8+
color: white;
9+
padding: 0.75rem 0;
10+
position: sticky;
11+
top: 0;
12+
z-index: 100;
13+
}
14+
.nav-container { max-width: 1100px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; }
15+
.nav-links { list-style: none; display: flex; gap: 1.5rem; }
16+
.nav-links li a { color: white; text-decoration: none; font-weight: bold; }
17+
.nav-links li a:hover { color: #ffcc00; }
18+
19+
/* Sections */
20+
.section { padding: 4rem 1rem; }
21+
.container { max-width: 1100px; margin: 0 auto; }
22+
23+
/* Home / Hero */
24+
.home { background: linear-gradient(to right, #a1c4fd, #c2e9fb); text-align: center; padding-top: 6rem; padding-bottom: 6rem; }
25+
.home h1 { font-size: 3rem; margin-bottom: 1rem; color: #1e3c72; }
26+
.home p { font-size: 1.2rem; margin-bottom: 2rem; color: #333; }
27+
.home-img {
28+
width: 180px;
29+
height: 120px;
30+
object-fit: cover;
31+
border-radius: 20px;
32+
box-shadow: 0 6px 15px rgba(0,0,0,0.3);
33+
transition: transform 0.3s, box-shadow 0.3s;
34+
}
35+
.home-img:hover {
36+
transform: scale(1.1);
37+
box-shadow: 0 10px 25px rgba(0,0,0,0.4);
38+
}
39+
40+
41+
/* About */
42+
.about { background-color: #f0f8ff; }
43+
.about h2 { color: #1e3c72; margin-bottom: 1rem; }
44+
.about p { font-size: 1.1rem; }
45+
46+
/* Team */
47+
.team { background-color: #e8f0fe; }
48+
.team h2 { color: #1e3c72; margin-bottom: 2rem; text-align: center; }
49+
.team-grid { display: flex; flex-wrap: wrap; gap: 2rem; justify-content: center; }
50+
.member-card { text-align: center; background: #ffffff; padding: 1.25rem; border-radius: 12px; width: 220px; transition: transform 0.3s, box-shadow 0.3s; }
51+
.member-card:hover { transform: translateY(-5px); box-shadow: 0 10px 25px rgba(0,0,0,0.2); }
52+
.member-card img { width: 120px; height: 120px; border-radius: 50%; object-fit: cover; margin-bottom: 0.5rem; }
53+
.member-card h3 { margin-bottom: 0.25rem; color: #1e3c72; }
54+
.member-card a { margin: 0 0.25rem; font-size: 1.2rem; color: #1e3c72; text-decoration: none; }
55+
.member-card a:hover { color: #ffcc00; }
56+
57+
/* Links Section - card style */
58+
.links-grid {
59+
display: flex;
60+
flex-wrap: wrap;
61+
gap: 1.5rem;
62+
justify-content: center;
63+
margin-top: 2rem;
64+
}
65+
66+
.link-card {
67+
display: flex;
68+
flex-direction: column;
69+
align-items: center;
70+
justify-content: center;
71+
text-align: center;
72+
background: #f0f8ff;
73+
color: #1e1e2f;
74+
padding: 1.5rem;
75+
border-radius: 12px;
76+
width: 180px;
77+
height: 150px;
78+
text-decoration: none;
79+
font-weight: bold;
80+
box-shadow: 0 6px 15px rgba(0,0,0,0.1);
81+
transition: transform 0.3s, box-shadow 0.3s;
82+
}
83+
84+
.link-card i {
85+
margin-bottom: 0.75rem;
86+
color: #00aaff;
87+
}
88+
89+
.link-card span {
90+
font-size: 1.1rem;
91+
}
92+
93+
.link-card:hover {
94+
transform: translateY(-5px);
95+
box-shadow: 0 10px 25px rgba(0,0,0,0.2);
96+
}
97+
98+
/* Footer */
99+
footer { background: linear-gradient(90deg, #1e3c72, #2a5298); color: white; text-align: center; padding: 1rem 0; margin-top: 2rem; font-size: 0.9rem; }
100+
101+
/* Hero / container adjustments */
102+
.hero-container { max-width: 900px; margin: 0 auto; }

0 commit comments

Comments
 (0)