-
Notifications
You must be signed in to change notification settings - Fork 140
/
about.html
237 lines (226 loc) · 8.55 KB
/
about.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="shortcut icon" type="image/jpg" href="/images/clipboard.png" />
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"
integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
crossorigin="anonymous"
/>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
crossorigin="anonymous"
></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.3/gsap.min.js"></script>
<link rel="stylesheet" href="style.css" />
<title>Frontend Projects | Rajeev</title>
<style>
main {
padding: 40px;
text-align: center;
background: linear-gradient(to right, #e0eafc, #cfdef3);
border-radius: 10px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
main h1 {
font-size: 3rem; /* Increased font size */
color: #2c3e50; /* Darker color for better contrast */
margin-bottom: 30px; /* Adjusted margin */
}
main p {
font-size: 1.2rem; /* Increased font size */
line-height: 1.8; /* Improved line height */
color: #34495e; /* Darker color */
max-width: 900px; /* Increased max width */
margin: 0 auto 20px; /* Adjusted margins */
padding: 0 20px; /* Added horizontal padding */
}
main h2 {
font-size: 2.5rem; /* Increased font size */
color: #2980b9; /* Changed color */
margin: 50px 0 25px; /* Adjusted margins */
}
main p:last-child {
font-size: 1.1rem; /* Adjusted font size */
color: #7f8c8d; /* Lighter color */
margin-top: 15px; /* Increased margin */
}
main ul {
list-style-type: disc; /* Use round bullets */
padding-left: 20px; /* Add padding to the left */
text-align: left; /* Align text to the left */
max-width: 800px; /* Set a max width for better alignment */
margin: 0 auto; /* Center the list in the main section */
}
main li {
font-size: 1.1rem; /* Set font size for list items */
line-height: 1.6; /* Increase line height for readability */
color: #555; /* Color for bullet points */
margin-bottom: 10px; /* Space between list items */
padding-left: 5px; /* Space before text */
}
</style>
</head>
<body>
<!-- Scroll-to-Top Button -->
<button class="scroll-up-btn">
<i class="arrow-up"></i>
</button>
<!-- Header with Navbar -->
<nav class="navbar">
<div class="logo">
<img src="logo.png" alt="Logo" />
<a href="index.html">Frontend Mentor</a>
</div>
<div class="navbar-function">
<div class="nav-elements">
<a href="index.html">Home</a>
<a href="index.html">Project</a>
<a href="index.html">Challenge</a>
</div>
<div class="nav-buttons">
<a href="signUp.html"><button class="btn-1">Sign Up</button></a>
<a href="login.html"><button class="btn-2">Login</button></a>
</div>
<div class="gitstatus">
<a href="https://github.com/beRajeevKumar/Frontend_Mentor">
<i class="fab fa-github"></i
></a>
</div>
</div>
<div class="menu-toggle">
<span></span>
<span></span>
<span></span>
</div>
</nav>
<!-- Main Content -->
<main>
<h1>Frontend Mentor Projects 🚀</h1>
<p>
Frontend Mentor is an excellent platform for front-end developers who
want to improve their skills and build real-world projects. It offers a
range of challenges that cater to different skill levels and provides
resources and support to help developers learn and grow their skills in
HTML, CSS, and JavaScript.
</p>
<h2>Continuous Learning & Development</h2>
<p>
We am committed to an ongoing journey of improvement and expansion of
our skills. To become a well-rounded full-stack developer, We will all
take a pledge that I will:
</p>
<ul>
<li>
Deepen my proficiency in HTML, CSS, and JavaScript by working on
additional projects and challenges. This will solidify my foundation
in core web technologies.
</li>
<li>
Learn new frameworks and technologies to stay up-to-date and increase
my versatility. This includes exploring JavaScript frameworks like
React, Angular, and Vue to build interactive and dynamic web
applications.
</li>
<li>
Focus on backend development by learning technologies such as Node.js,
Express.js, and MongoDB. This will enable me to build
fully-functional, full-stack applications.
</li>
<li>
Prioritize responsive design, accessibility, and SEO best practices to
ensure the websites I build are high-quality, user-friendly, and
optimized for search engines.
</li>
<li>
Continually challenge myself to expand my knowledge and skills,
pushing the boundaries of what I'm capable of as a developer. This
commitment to lifelong learning will be a driving force in my
professional growth.
</li>
<li>
By consistently investing in my development and exploring new
technologies, I will position myself as a well-rounded, adaptable, and
highly valuable full-stack developer.
</li>
</ul>
</main>
<!-- Footer -->
<footer class="footer">
<div class="footer-section">
<h1>Contact Us</h1>
<ul class="footer-list">
<li>
<a href="mailto:[email protected]"
>
</li>
<li>2nd Floor, Bandra West, Mumbai, Maharashtra 400050, India</li>
<li><a href="tel:+91xxxxxxxx2020">+91 xxxxxx2020</a></li>
<li class="border-list"></li>
<li class="socials">
<a
href="https://www.linkedin.com/in/berajeevkumar/"
id="linkedin"
target="_blank"
>
<i class="fa-brands fa-linkedin"></i>
</a>
<a
href="https://github.com/beRajeevKumar/Frontend_Mentor"
id="github"
target="_blank"
>
<i class="fa-brands fa-github"></i>
</a>
<a href="https://x.com/be_rajeevkumar" id="twitter" target="_blank">
<i class="fa-brands fa-x-twitter"></i>
</a>
<a
href="https://www.instagram.com/your_instagram"
id="instagram"
target="_blank"
>
<i class="fa-brands fa-instagram"></i>
</a>
</li>
</ul>
</div>
<div class="footer-section">
<h1>Quick Links</h1>
<ul class="footer-list">
<li><a href="about.html">About Us</a></li>
<li><a href="/terms-conditions">Terms & Conditions</a></li>
<li><a href="/return-policy">Return Policy</a></li>
<li><a href="contact.html">Contact Us</a></li>
</ul>
</div>
<div class="footer-section">
<h1>Subscribe to Newsletter</h1>
<ul class="footer-list">
<li>
Get the latest updates, exclusive offers, and industry insights
delivered straight to your inbox.
</li>
<li class="sub">
<input type="text" placeholder="Enter your email" />
<button class="btn-sub">Subscribe</button>
</li>
</ul>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>