Skip to content

Commit b678042

Browse files
GoJo-RikaGoJo-Rika
committed
updated blog and contact template
1 parent 9422d46 commit b678042

4 files changed

Lines changed: 92 additions & 50 deletions

File tree

‎blog.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@
4040
<link rel="stylesheet" href="css/modern_normalize.css" />
4141
<link rel="stylesheet" href="css/html5bp.css">
4242
<link rel="stylesheet" href="css/main.css">
43-
<link rel="stylesheet" href="css/resume.css">
43+
<!-- <link rel="stylesheet" href="css/resume.css"> -->
4444

4545
<!-- Set a theme color that matches your website's primary color -->
4646
<meta name="theme-color" content="#fafafa">

‎blog_template.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@
4040
<link rel="stylesheet" href="css/modern_normalize.css" />
4141
<link rel="stylesheet" href="css/html5bp.css">
4242
<link rel="stylesheet" href="css/main.css">
43-
<link rel="stylesheet" href="css/resume.css">
43+
<!-- <link rel="stylesheet" href="css/resume.css"> -->
4444

4545
<!-- Set a theme color that matches your website's primary color -->
4646
<meta name="theme-color" content="#fafafa">

‎contact.html‎

Lines changed: 47 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<!DOCTYPE html>
22
<html lang="en">
3+
34
<head>
45
<meta charset="utf-8">
56
<meta name="viewport" content="width=device-width, initial-scale=1">
@@ -8,11 +9,15 @@
89
<base href="./">
910
<link rel="preconnect" href="https://fonts.googleapis.com">
1011
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
11-
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap" rel="stylesheet">
12+
<link
13+
href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap"
14+
rel="stylesheet">
1215
<link rel="stylesheet" href="css/modern_normalize.css" />
1316
<link rel="stylesheet" href="css/html5bp.css">
1417
<link rel="stylesheet" href="css/main.css">
15-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
18+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
19+
integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA=="
20+
crossorigin="anonymous" referrerpolicy="no-referrer" />
1621
<!-- Favicon links etc. -->
1722
</head>
1823

@@ -26,9 +31,9 @@ <h1>Mit Patel</h1>
2631
<ul class="inline-list flex-responsive">
2732
<li><a href="index.html">Home</a></li>
2833
<li><a href="resume.html">Resume</a></li>
29-
<li><a href="blog.html">Blog</a></li>
3034
<li><a href="projects.html">Projects</a></li>
3135
<li><a href="tech-stack.html">Tech Stack</a></li>
36+
<li><a href="blog.html">Blog</a></li>
3237
<li><a href="contact.html">Contact</a></li>
3338
</ul>
3439
</nav>
@@ -42,7 +47,8 @@ <h1>Mit Patel</h1>
4247
<main>
4348
<section>
4449
<h2 class="section-heading">Get In Touch</h2>
45-
<p class="contact-intro">I'm always open to discussing new projects, creative ideas, or opportunities to be part of an ambitious vision. Feel free to reach out.</p>
50+
<p class="contact-intro">I'm always open to discussing new projects, creative ideas, or
51+
opportunities to be part of an ambitious vision. Feel free to reach out.</p>
4652
</section>
4753

4854
<section>
@@ -58,12 +64,12 @@ <h3 class="contact-subheading">Connect With Me On</h3>
5864
<i class="fab fa-linkedin"></i>
5965
6066
-->
61-
</div>
67+
</div>
6268

6369
<div class="contact-icon">
6470
<!-- This now uses the SVG data read by the Python script -->
6571

66-
<svg aria-hidden="true"
72+
<svg aria-hidden="true"
6773
xmlns="http://www.w3.org/2000/svg"
6874
role="img"
6975
width="16"
@@ -89,12 +95,12 @@ <h3 class="contact-subheading">Connect With Me On</h3>
8995
<i class="fab fa-github"></i>
9096
9197
-->
92-
</div>
98+
</div>
9399

94100
<div class="contact-icon">
95101
<!-- This now uses the SVG data read by the Python script -->
96102

97-
<svg aria-hidden="true"
103+
<svg aria-hidden="true"
98104
xmlns="http://www.w3.org/2000/svg"
99105
role="img"
100106
width="16"
@@ -120,12 +126,12 @@ <h3 class="contact-subheading">Connect With Me On</h3>
120126
<i class="fas fa-link"></i>
121127
122128
-->
123-
</div>
129+
</div>
124130

125131
<div class="contact-icon">
126132
<!-- This now uses the SVG data read by the Python script -->
127133

128-
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>LeetCode</title><path d="M13.483 0a1.374 1.374 0 0 0-.961.438L7.116 6.226l-3.854 4.126a5.266 5.266 0 0 0-1.209 2.104 5.35 5.35 0 0 0-.125.513 5.527 5.527 0 0 0 .062 2.362 5.83 5.83 0 0 0 .349 1.017 5.938 5.938 0 0 0 1.271 1.818l4.277 4.193.039.038c2.248 2.165 5.852 2.133 8.063-.074l2.396-2.392c.54-.54.54-1.414.003-1.955a1.378 1.378 0 0 0-1.951-.003l-2.396 2.392a3.021 3.021 0 0 1-4.205.038l-.02-.019-4.276-4.193c-.652-.64-.972-1.469-.948-2.263a2.68 2.68 0 0 1 .066-.523 2.545 2.545 0 0 1 .619-1.164L9.13 8.114c1.058-1.134 3.204-1.27 4.43-.278l3.501 2.831c.593.48 1.461.387 1.94-.207a1.384 1.384 0 0 0-.207-1.943l-3.5-2.831c-.8-.647-1.766-1.045-2.774-1.202l2.015-2.158A1.384 1.384 0 0 0 13.483 0zm-2.866 12.815a1.38 1.38 0 0 0-1.38 1.382 1.38 1.38 0 0 0 1.38 1.382H20.79a1.38 1.38 0 0 0 1.38-1.382 1.38 1.38 0 0 0-1.38-1.382z"/></svg>
134+
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>LeetCode</title><path d="M13.483 0a1.374 1.374 0 0 0-.961.438L7.116 6.226l-3.854 4.126a5.266 5.266 0 0 0-1.209 2.104 5.35 5.35 0 0 0-.125.513 5.527 5.527 0 0 0 .062 2.362 5.83 5.83 0 0 0 .349 1.017 5.938 5.938 0 0 0 1.271 1.818l4.277 4.193.039.038c2.248 2.165 5.852 2.133 8.063-.074l2.396-2.392c.54-.54.54-1.414.003-1.955a1.378 1.378 0 0 0-1.951-.003l-2.396 2.392a3.021 3.021 0 0 1-4.205.038l-.02-.019-4.276-4.193c-.652-.64-.972-1.469-.948-2.263a2.68 2.68 0 0 1 .066-.523 2.545 2.545 0 0 1 .619-1.164L9.13 8.114c1.058-1.134 3.204-1.27 4.43-.278l3.501 2.831c.593.48 1.461.387 1.94-.207a1.384 1.384 0 0 0-.207-1.943l-3.5-2.831c-.8-.647-1.766-1.045-2.774-1.202l2.015-2.158A1.384 1.384 0 0 0 13.483 0zm-2.866 12.815a1.38 1.38 0 0 0-1.38 1.382 1.38 1.38 0 0 0 1.38 1.382H20.79a1.38 1.38 0 0 0 1.38-1.382 1.38 1.38 0 0 0-1.38-1.382z"/></svg>
129135

130136
</div>
131137

@@ -141,12 +147,12 @@ <h3 class="contact-subheading">Connect With Me On</h3>
141147
<i class="fas fa-link"></i>
142148
143149
-->
144-
</div>
150+
</div>
145151

146152
<div class="contact-icon">
147153
<!-- This now uses the SVG data read by the Python script -->
148154

149-
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>HackerRank</title><path d="M0 0v24h24V0zm9.95 8.002h1.805c.061 0 .111.05.111.111v7.767c0 .061-.05.111-.11.111H9.95c-.061 0-.111-.05-.111-.11v-2.87H7.894v2.87c0 .06-.05.11-.11.11H5.976a.11.11 0 01-.11-.11V8.112c0-.06.05-.11.11-.11h1.806c.061 0 .11.05.11.11v2.869H9.84v-2.87c0-.06.05-.11.11-.11zm2.999 0h5.778c.061 0 .111.05.111.11v7.767a.11.11 0 01-.11.112h-5.78a.11.11 0 01-.11-.11V8.111c0-.06.05-.11.11-.11z"/></svg>
155+
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>HackerRank</title><path d="M0 0v24h24V0zm9.95 8.002h1.805c.061 0 .111.05.111.111v7.767c0 .061-.05.111-.11.111H9.95c-.061 0-.111-.05-.111-.11v-2.87H7.894v2.87c0 .06-.05.11-.11.11H5.976a.11.11 0 01-.11-.11V8.112c0-.06.05-.11.11-.11h1.806c.061 0 .11.05.11.11v2.869H9.84v-2.87c0-.06.05-.11.11-.11zm2.999 0h5.778c.061 0 .111.05.111.11v7.767a.11.11 0 01-.11.112h-5.78a.11.11 0 01-.11-.11V8.111c0-.06.05-.11.11-.11z"/></svg>
150156

151157
</div>
152158

@@ -159,7 +165,8 @@ <h3 class="contact-subheading">Connect With Me On</h3>
159165

160166
<section>
161167
<h3 class="contact-subheading">Send Me An Email</h3>
162-
<p class="contact-intro">The best way to reach me is by email. I'm very responsive and will get back to you as soon as possible.</p>
168+
<p class="contact-intro">The best way to reach me is by email. I'm very responsive and will get back
169+
to you as soon as possible.</p>
163170
<a href="mailto:patel.m9521@gmail.com" class="email-button">patel.m9521@gmail.com</a>
164171
</section>
165172
</main>
@@ -174,33 +181,39 @@ <h3 class="contact-subheading">Send Me An Email</h3>
174181

175182
<!-- ===== Style Switcher & JS ===== -->
176183
<div class="theme-toggle-container">
177-
<div id="theme-toggle-icon" class="theme-icon"><i class="fas"></i></div>
184+
<div id="theme-toggle-icon" class="theme-icon"><i class="fas"></i></div>
178185
</div>
179186
<script src="js/app.js"></script>
180187

181188
<!-- ===== In-house CSS for this page ===== -->
182189
<style>
183190
.contact-container {
184-
max-width: 800px; /* Center the content in a readable column */
185-
display: block; /* Override the grid layout for a single column */
191+
max-width: 800px;
192+
/* Center the content in a readable column */
193+
display: block;
194+
/* Override the grid layout for a single column */
186195
}
196+
187197
.contact-intro {
188198
text-align: center;
189199
font-size: 1.1rem;
190200
margin-bottom: 2.5rem;
191201
}
202+
192203
.contact-subheading {
193204
text-align: center;
194205
font-size: 1.2rem;
195206
margin-bottom: 1.5rem;
196207
font-weight: 500;
197208
}
209+
198210
.contact-links {
199211
display: flex;
200212
justify-content: center;
201213
gap: 1.5rem;
202214
margin-bottom: 3rem;
203215
}
216+
204217
.contact-card {
205218
background-color: var(--card-bg-color);
206219
border: 1px solid var(--border-color);
@@ -212,40 +225,46 @@ <h3 class="contact-subheading">Send Me An Email</h3>
212225
color: var(--text-color) !important;
213226
transition: all 0.2s ease-in-out;
214227
}
228+
215229
.contact-card:hover {
216230
transform: translateY(-5px);
217231
border-color: var(--link-color);
218232
}
219-
<!--
220-
.contact-icon {
233+
234+
< !-- .contact-icon {
221235
font-size: 2.5rem;
222236
margin-bottom: 0.75rem;
223237
color: var(--link-color);
224-
}
225-
-->
238+
}
226239

227-
.contact-icon {
240+
-->.contact-icon {
228241
/* Use flexbox to perfectly center the SVG inside */
229242
display: flex;
230243
align-items: center;
231244
justify-content: center;
232-
height: 48px; /* Give the container a fixed height */
245+
height: 48px;
246+
/* Give the container a fixed height */
233247
margin-bottom: 0.75rem;
234248
}
235249

236250
/* This is the key: it targets and styles the SVG element itself */
237251
.contact-icon svg {
238-
height: 100%; /* Make the SVG fill the container's height */
239-
width: auto; /* Let the width adjust automatically */
240-
max-width: 48px; /* Prevent wide icons from stretching too far */
241-
fill: var(--link-color); /* Make the icon's color match the theme */
252+
height: 100%;
253+
/* Make the SVG fill the container's height */
254+
width: auto;
255+
/* Let the width adjust automatically */
256+
max-width: 48px;
257+
/* Prevent wide icons from stretching too far */
258+
fill: var(--link-color);
259+
/* Make the icon's color match the theme */
242260
}
243261

244262

245263

246264
.contact-label {
247265
font-weight: 600;
248266
}
267+
249268
.email-button {
250269
display: block;
251270
width: fit-content;
@@ -258,10 +277,12 @@ <h3 class="contact-subheading">Send Me An Email</h3>
258277
font-weight: bold;
259278
transition: background-color 0.2s;
260279
}
280+
261281
.email-button:hover {
262282
background-color: var(--link-color-hover);
263283
}
264284
</style>
265285

266286
</body>
287+
267288
</html>

0 commit comments

Comments
 (0)