Skip to content

Commit cac5d2f

Browse files
committed
Fix: iphone contact page
1 parent 1f1ba09 commit cac5d2f

File tree

6 files changed

+53
-60
lines changed

6 files changed

+53
-60
lines changed

iPhone/contact.html

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,9 +26,9 @@
2626
</div>
2727

2828
<!-- Contact Page -->
29-
<div class="page app-page contact-page">
29+
<div class="page app-page ">
3030
<a href="home.html" class="back-button"></a>
31-
31+
<div class="contact-page">
3232
<h2>Contact Me</h2>
3333
<p>If you'd like to get in touch,
3434
feel free to reach out or download my resume.
@@ -63,7 +63,9 @@ <h2>Contact Me</h2>
6363
<i class="fa-brands fa-square-instagram"></i>
6464
</a>
6565
</div>
66+
6667
</div>
68+
</div>
6769

6870

6971

iPhone/home.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ <h1>
7272
<div class="app-icon">
7373
<i class="fa-solid fa-code"></i> <!-- Projects Icon -->
7474
</div>
75-
<span>Projects</span>
75+
<span>Apps</span>
7676
</a>
7777
<a href="contact.html" class="app">
7878
<div class="app-icon">

iPhone/project-details.html

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,11 @@
3737
<div class="app-info">
3838
<span id="app-name" class="app-name"></span>
3939
<span id="app-category" class="app-category"></span>
40-
<span id="app-rating" class="app-rating"></span>
40+
<!-- <span id="app-rating" class="app-rating"></span> -->
41+
<!-- Action Button -->
42+
<div class="Action-button-container">
43+
<a id="action-button" href="#" target="_blank" class="btn">OPEN</a>
44+
</div>
4145
</div>
4246
</div>
4347
<!-- Screenshots Section -->
@@ -56,10 +60,7 @@
5660
<p id="description" class="description"></p>
5761
</div>
5862

59-
<!-- Action Button -->
60-
<div class="Action-button-container">
61-
<a id="action-button" href="#" target="_blank" class="btn">Open Project</a>
62-
</div>
63+
6364
</div>
6465
</div>
6566
</div>

iPhone/scripts/project-details.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,11 @@ document.addEventListener("DOMContentLoaded", async () => {
33
const projectId = urlParams.get("id"); // Keep it as a string
44
const osType = urlParams.get("os"); // Get OS type from URL
55

6-
console.log("🔹 Project ID from URL:", projectId);
7-
console.log("🔹 OS Type from URL:", osType);
6+
console.log("Project ID from URL:", projectId);
7+
console.log("OS Type from URL:", osType);
88

99
if (!projectId || !osType) {
10-
console.error("Missing project ID or OS type in URL.");
10+
console.error("Missing project ID or OS type in URL.");
1111
document.querySelector(".app-container").innerHTML = `<p>Invalid request.</p>`;
1212
return;
1313
}
@@ -29,12 +29,12 @@ document.addEventListener("DOMContentLoaded", async () => {
2929
throw new Error(`Invalid OS type: ${osType}`);
3030
}
3131

32-
console.log("🔹 List of Apps for OS:", osType, apps);
32+
console.log("List of Apps for OS:", osType, apps);
3333

3434
// Find the project by ID (convert both to strings for consistency)
3535
const project = apps.find(app => String(app.app_id) === String(projectId));
3636

37-
console.log("🔹 Found Project:", project);
37+
console.log("Found Project:", project);
3838

3939
if (!project) {
4040
throw new Error("Project not found.");
@@ -44,7 +44,7 @@ document.addEventListener("DOMContentLoaded", async () => {
4444
document.getElementById("app-icon").src = project.icon;
4545
document.getElementById("app-name").textContent = project.name;
4646
document.getElementById("app-category").textContent = project.category;
47-
document.getElementById("app-rating").textContent = `Rating: ${project.rating}/5`;
47+
// document.getElementById("app-rating").textContent = `Rating: ${project.rating}/5`;
4848
document.getElementById("description").textContent = project.description;
4949
document.getElementById("action-button").href = project.app_store_link;
5050

iPhone/styles/contact.css

Lines changed: 15 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -4,24 +4,19 @@
44
flex-direction: column;
55
align-items: center;
66
justify-content: center;
7-
padding: 20px;
7+
padding-top: 6rem;
88
background-color: var(--bg-color, #fff); /* Dark/light mode background */
99
}
1010

11-
.contact-page a {
12-
color: inherit; /* Inherit color from parent, ensuring links don’t appear blue */
13-
text-decoration: none !important; /* Remove underlines if needed */
14-
}
15-
16-
.contact-page a:hover {
17-
color: #6eb2fb; /* You can change this to any color you like *//* Optional: Add underline on hover */
18-
}
11+
.contact-page * {
12+
text-decoration: none !important;
13+
}
1914

2015
/* Contact Section Header */
2116
.contact-page h2 {
2217
font-size: 1.5rem;
2318
margin-bottom: 1rem;
24-
margin-top: 0;
19+
margin-top: 10;
2520
text-align: left; /* Aligns text to the left */
2621
width: 100%;
2722
}
@@ -39,37 +34,36 @@
3934
margin: 5px 0;
4035
width: 100%;
4136
text-align: center;
37+
background-color: #333;
38+
39+
border-radius: 5px;
4240
}
4341

4442
/* Email Link Styling */
4543
.contact-page .contact-link {
4644
font-size: 18px;
47-
text-decoration: none; /* Remove underline */
48-
color: #333;
4945
font-weight: bold;
50-
display: inline-flex;
46+
display: inline;
5147
align-items: center;
5248
gap: 10px;
5349
transition: color 0.3s;
5450
padding: 8px 15px;
5551
}
5652

5753
/* Email link hover color */
58-
.contact-page .contact-link:hover {
59-
color: #007bff; /* Hover color for email link */
54+
.contact-page .contact-item:hover {
55+
background-color: #007bff;
6056
}
6157

6258
/* Resume Button Styling */
6359
.contact-page .resume-btn {
60+
color: #f0f0f0;
6461
display: inline-flex;
6562
align-items: center;
6663
padding: 10px 20px;
67-
background-color: #f0f0f0;
6864
border-radius: 8px;
69-
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
7065
font-size: 16px;
7166
gap: 10px;
72-
text-decoration: none; /* Ensure no underline */
7367
}
7468

7569
/* Resume Button Hover Styling */
@@ -80,17 +74,16 @@
8074

8175
/* Social Media Icons (interactive) */
8276
.contact-page .social-links {
83-
display: flex;
77+
display: inline;
8478
justify-content: center;
85-
gap: 15px;
79+
gap: 3rem;
8680
margin-top: 20px;
8781
}
8882

8983
.contact-page .social-icon {
9084
font-size: 30px;
9185
transition: transform 0.3s;
9286
color: #333;
93-
text-decoration: none; /* Remove underline */
9487
}
9588

9689
/* Hover effect for social media icons */
@@ -103,18 +96,14 @@
10396
.contact-page .back-button {
10497
color: #333;
10598
font-size: 18px;
106-
text-decoration: none; /* Remove underline */
10799
}
108100

109101
.contact-page .back-button:hover {
110102
color: #333; /* Ensure no hover effect on back button */
111103
}
112104

113105
/* Avoid hover effect on all other non-interactive text */
114-
.contact-page p,
115-
.contact-page h2 {
116-
text-decoration: none; /* Ensure no underline on any text */
117-
}
106+
118107

119108
@media screen and (max-width: 600px) {
120109
.contact-page {

iPhone/styles/project-details.css

Lines changed: 21 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,13 @@
33
max-width: 240px;
44
margin-top: 2rem;
55
width: 100%;
6+
text-decoration: none !important;
67
}
78

89
.app-header {
910
display: flex;
10-
align-items: top;
11+
margin-top: 0;
12+
/* align-items: top; */
1113
gap: 0.5rem;
1214
}
1315

@@ -19,9 +21,7 @@
1921
align-items: center;
2022
justify-content: center;
2123
background: linear-gradient(145deg, #ffffff, #e6e6e6); /* Gradient background for depth */
22-
box-shadow:
23-
0 4px 6px rgba(0, 0, 0, 0.1),
24-
inset 0 1px 2px rgba(255, 255, 255, 0.5);
24+
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1),inset 0 1px 2px rgba(255, 255, 255, 0.5);
2525
}
2626

2727
.screenshot-container {
@@ -32,29 +32,27 @@
3232
}
3333

3434
.screenshot-container img {
35-
width: 150px;
35+
width: 130px;
3636
height: 250px;
3737
border-radius: 10px;
3838
flex-shrink: 0;
3939
}
4040

4141
.app-info {
42-
flex-grow: 0.5;
42+
display: grid;
4343
}
4444

4545
.app-name {
46-
display: inline-block;
47-
font-size: 1.2rem;
46+
font-size: 1rem;
4847
color: #1d1d1f;
49-
display: block;
50-
vertical-align: top;
48+
align-items: top !important;
49+
text-align: top !important;
5150
}
5251

5352
.app-category {
5453
font-size: 0.6rem;
5554
color: #6e6e73;
56-
display: block;
57-
padding: 0;
55+
margin-top: 0;
5856
}
5957

6058
.app-rating {
@@ -68,16 +66,19 @@
6866
}
6967

7068
.description {
71-
font-size: 1rem;
69+
font-size: 0.8rem !important;
7270
color: #333;
7371
}
7472

7573
.Action-button-container .btn {
76-
display: inline-block;
77-
padding: 10px 20px;
74+
border: 0;
75+
outline: 0;
76+
cursor: pointer;
77+
color: white;
7878
background-color: #007aff;
79-
color: #fff;
80-
text-decoration: none;
81-
border-radius: 5px;
82-
text-align: center;
83-
}
79+
border-radius: 10px;
80+
font-size: 0.6rem;
81+
font-weight: 300;
82+
padding: 4px 8px;
83+
max-height: 28px;
84+
}

0 commit comments

Comments
 (0)