hnasheralneam/profile-site
1
0
Fork 0
mirror of https://github.com/hnasheralneam/hnasheralneam.github.io.git synced 2025-05-13 02:15:21 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add projects page, move guestbook to new page, add navigation menu, made menu and footer partials

Browse source
This commit is contained in:
Hamza Nasher-Alneam 2025-05-05 12:04:00 -04:00
parent bea621a82d
commit 3f7805278d
27 changed files with 521 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
documents/developer_jokes.pdf
View file

Binary file not shown.

BIN
documents/resume.pdf Normal file
View file

Binary file not shown.

BIN
documents/situation_in_gaza.pdf
View file

Binary file not shown.

63
guestbook.html Normal file
View file

@ -0,0 +1,63 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width">
<meta name="description" content="Hamza Nasher-Alneam's developer profile website!">
<meta name="theme-color" content="#f69b46">
<link rel="shortcut icon" type="image/x-icon" href="icons/race.png">
<link
href="https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&amp;display=swap"
rel="stylesheet">
<link rel="stylesheet" href="styles/home.css">
<link rel="stylesheet" href="styles/styles.css">
<link rel="stylesheet" href="styles/guestbook.css">
<title>Guestbook | Hamza Nasher-Alneam</title>
</head>
<body>
<div class="progress-parent">
<div class="progress"></div>
</div>
<br><br>
<div class="content" style="min-height: 60vh">
<div class="main-text">
<div>
<!-- Guestbook -->
<div class="guestbook">
<h2 class="guestbook-title">Guest book - leave a note!</h2>
<div class="messages"></div>
<div class="show-all-messages">
<button onclick="this.remove(); showAll()">Show all messages</button>
</div>
<br>
<button class="post-button" onclick="toggleElement('new-message')">Post a message</button>
<div class="new-message-container"
onclick="if (event.target.classList.contains('new-message-container')) toggleElement('new-message')">
<div class="new-message">
<form class="new-message-form" method="POST"
action="https://guestbook-api.hnasheralneam.dev/message">
<label class="message-header" for="message">Your message for the world</label><br>
<textarea type="text" name="message" placeholder="your post"></textarea><br>
<label class="text-label" for="github">Your GitHub username</label><br>
<input class="text" type="text" name="github" placeholder="github username">
<input type="submit" value="Post" onclick="checkSubmissionValid(event)">
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<br><br>
<div w3-include-html="partials/footer.html"></div>
<div w3-include-html="partials/menu.html"></div>
</body>
<script src="scripts/include-html.js"></script>
<script defer src="https://umami.hnasheralneam.dev/script.js"
data-website-id="22e45953-378d-4e42-afe7-b31c197d3105"></script>
<script src="https://hnasheralneam.github.io/digit/main.js"></script>
<script src="scripts/guestbook.js"></script>
</html>

1
icons/developer_guide.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e3e3e3"><path d="M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-640v560h560v-560h-80v245q0 12-10 17.5t-20-.5l-49-30q-10-6-21-6t-21 6l-49 30q-10 6-20 .5T480-515v-245H200Zm0 560v-560 560Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 368 B

1
icons/home.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e3e3e3"><path d="M240-200h120v-200q0-17 11.5-28.5T400-440h160q17 0 28.5 11.5T600-400v200h120v-360L480-740 240-560v360Zm-80 0v-360q0-19 8.5-36t23.5-28l240-180q21-16 48-16t48 16l240 180q15 11 23.5 28t8.5 36v360q0 33-23.5 56.5T720-120H560q-17 0-28.5-11.5T520-160v-200h-80v200q0 17-11.5 28.5T400-120H240q-33 0-56.5-23.5T160-200Zm320-270Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 441 B

1
icons/rss_feed.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e3e3e3"><path d="M200-120q-33 0-56.5-23.5T120-200q0-33 23.5-56.5T200-280q33 0 56.5 23.5T280-200q0 33-23.5 56.5T200-120Zm540 0q-26 0-43.5-19T676-184q-11-97-52.5-181.5T516-516q-66-66-150.5-107.5T184-676q-26-3-45-20.5T120-740q0-26 18-42.5t43-14.5q123 11 230.5 62.5T601-601q82 82 133.5 189.5T797-181q2 25-14.5 43T740-120Zm-240 0q-25 0-43-17.5T434-180q-9-49-31.5-90.5T346-346q-34-34-75.5-56.5T180-434q-25-5-42.5-23T120-500q0-26 18-43t43-13q73 10 136.5 42.5T431-431q50 50 82.5 113.5T556-181q4 25-13 43t-43 18Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 611 B

1
icons/web_stories.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e3e3e3"><path d="M680-160v-640q33 0 56.5 23.5T760-720v480q0 33-23.5 56.5T680-160ZM160-80q-33 0-56.5-23.5T80-160v-640q0-33 23.5-56.5T160-880h360q33 0 56.5 23.5T600-800v640q0 33-23.5 56.5T520-80H160Zm680-160v-480q25 0 42.5 17.5T900-660v360q0 25-17.5 42.5T840-240Zm-680 80h360v-640H160v640Zm0-640v640-640Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 410 B

BIN
images/projects/activitylog.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 179 KiB

BIN
images/projects/fetchcv.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 221 KiB

BIN
images/projects/gitorganized.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 179 KiB

BIN
images/projects/gitorganizedalt.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 167 KiB

BIN
images/projects/goldrush.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.8 MiB

BIN
images/projects/mediumrare.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 59 KiB

BIN
images/projects/produceddemand.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 184 KiB

BIN
images/projects/sleepwalker.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 383 KiB

BIN
images/projects/vegetabledash.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.3 MiB

35
index.html
View file

@ -67,7 +67,7 @@
</div>
<br><br>
<!-- Guestbook -->
<div class="guestbook">
<!-- <div class="guestbook">
<h2 class="guestbook-title">Guest book - leave a note!</h2>
<div class="messages"></div>
<div class="show-all-messages">
@ -86,9 +86,9 @@
</form>
</div>
</div>
</div>
</div> -->
</div>
<div class="thoughts-preview">
<!-- <div class="thoughts-preview">
<h2>Thoughts</h2>
<a hre="articles/plasma-widgets.html#publish-widget">
<div class="thoughts-bit"
@ -98,7 +98,7 @@
hopefully!</p>
</div>
</a>
<!-- <a href="thoughts.html#imessage-lockin">
<a href="thoughts.html#imessage-lockin">
<div class="thoughts-bit">
<h4>The social issues with iMessage</h4>
<i>Dec 1 2022</i>
@ -111,29 +111,18 @@
<i>Dec 1 2022</i>
<p>I mention the impracticalities in more words than strictly necessary.</p>
</div>
</a> -->
</div>
</a>
</div> -->
</div>
</div>
<br><br>
<div class="footer">
<div>
<h2>Social</h2>
<p>GitHub -> <a href="https://github.com/hnasheralneam">@hnasheralneam</a></p>
<p class="faded-footer">See what I'm working on</p>
<p>LinkedIn - > <a href="https://www.linkedin.com/in/hamza-nasher-alneam-8b6b6a338/">LinkedIn</a></p>
<p class="faded-footer">For professional connections</p>
</div>
<div>
<h2>Contact</h2>
<p>Email account -> <a href="mailto:hnasheralneam@gmail.com">hnasheralneam@gmail.com</a></p>
<p>Discord account -> <a href="#">namegoes.here</a></p>
</div>
</div>
<div w3-include-html="partials/footer.html"></div>
<div w3-include-html="partials/menu.html"></div>
</body>
<script defer src="https://umami.hnasheralneam.dev/script.js" data-website-id="22e45953-378d-4e42-afe7-b31c197d3105"></script>
<script src="main.js"></script>
<script src="scripts/include-html.js"></script>
<script src="scripts/main.js"></script>
<script src="https://hnasheralneam.github.io/digit/main.js"></script>
<script src="scripts/guestbook.js"></script>
<script defer src="https://umami.hnasheralneam.dev/script.js"
data-website-id="22e45953-378d-4e42-afe7-b31c197d3105"></script>
</html>

14
partials/footer.html Normal file
View file

@ -0,0 +1,14 @@
<div class="footer">
<div>
<h2>Social</h2>
<p>GitHub -> <a href="https://github.com/hnasheralneam">@hnasheralneam</a></p>
<p class="faded-footer">See what I'm working on</p>
<p>LinkedIn - > <a href="https://www.linkedin.com/in/hnasheralneam">LinkedIn</a></p>
<p class="faded-footer">For professional connections</p>
</div>
<div>
<h2>Contact</h2>
<p>Email -> <a href="mailto:hnasheralneam@gmail.com">hnasheralneam@gmail.com</a></p>
<p>Discord -> <a href="#">namegoes.here</a></p>
</div>
</div>

24
partials/menu.html Normal file
View file

@ -0,0 +1,24 @@
<div class="menu">
<div>
<div class="item">
<a href="index.html" title="home">
<img src="icons/home.svg" alt="home">
</a>
</div>
<div class="item">
<a href="projects.html" title="projects">
<img src="icons/web_stories.svg" alt="projects">
</a>
</div>
<div class="item">
<a href="thoughts.html" title="thoughts">
<img src="icons/rss_feed.svg" alt="thoughts">
</a>
</div>
<div class="item">
<a href="guestbook.html" title="guestbook">
<img src="icons/developer_guide.svg" alt="guestbook">
</a>
</div>
</div>
</div>

27
projects.html Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width">
<meta name="description" content="Hamza Nasher-Alneam's developer profile website!">
<meta name="theme-color" content="#f69b46">
<link rel="shortcut icon" type="image/x-icon" href="icons/race.png">
<link
href="https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&amp;display=swap"
rel="stylesheet">
<link rel="stylesheet" href="styles/styles.css">
<link rel="stylesheet" href="styles/projects.css">
<title>Projects | Hamza Nasher-Alneam</title>
</head>
<body>
<div class="carousel">
<h2 class="title">My Projects</h2>
<div class="carousel-inner"></div>
</div>
<div w3-include-html="partials/footer.html"></div>
<div w3-include-html="partials/menu.html"></div>
</body>
<script src="scripts/include-html.js"></script>
<script src="scripts/projects.js"></script>
<script defer src="https://umami.hnasheralneam.dev/script.js"
data-website-id="22e45953-378d-4e42-afe7-b31c197d3105"></script>
</html>

28
scripts/include-html.js Normal file
View file

@ -0,0 +1,28 @@
function includeHTML() {
var z, i, elmnt, file, xhttp;
/* Loop through a collection of all HTML elements: */
z = document.getElementsByTagName("*");
for (i = 0; i < z.length; i++) {
elmnt = z[i];
/*search for elements with a certain atrribute:*/
file = elmnt.getAttribute("w3-include-html");
if (file) {
/* Make an HTTP request using the attribute value as the file name: */
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
if (this.readyState == 4) {
if (this.status == 200) { elmnt.innerHTML = this.responseText; }
if (this.status == 404) { elmnt.innerHTML = "Page not found."; }
/* Remove the attribute, and call this function once more: */
elmnt.removeAttribute("w3-include-html");
includeHTML();
}
}
xhttp.open("GET", file, true);
xhttp.send();
/* Exit the function: */
return;
}
}
}
includeHTML();

0
main.js → scripts/main.js
View file

139
scripts/projects.js Normal file
View file

@ -0,0 +1,139 @@
const data = [{
title: "Gold Rush",
description: "A web-based incremental game about collecting gold",
date: "2019",
image: "../images/projects/goldrush.png",
link: "https://goldrush.hnasheralneam.dev",
github: "https://github.com/hnasheralneam/gold-rush"
},
{
title: "Vegetable Dash",
description: "A farming game built for the browser",
date: "2020",
image: "../images/projects/vegetabledash.png",
link: "https://vegetabledash.hnasheralneam.dev",
github: "https://github.com/hnasheralneam/vegetable-dash"
},
{
title: "Git Organized",
description: "A project management app built around managing cards",
date: "2022",
image: "../images/projects/gitorganized.png",
link: "https://gitorganized.hnasheralneam.dev",
github: "https://github.com/hnasheralneam/git-organized"
},
{
title: "FetchCV",
description: "Your centralized developer profile",
date: "2024",
image: "../images/projects/fetchcv.png",
link: "https://fetchcv.hnasheralneam.dev",
github: "https://github.com/FetchCV/fetchcv"
},
{
title: "Activity Log",
description: "A time tracking application",
date: "2022",
image: "../images/projects/activitylog.png",
link: "https://activitylog.hnasheralneam.dev",
github: "https://github.com/hnasheralneam/activity-log"
},
{
title: "Medium Rare",
description: "A multiplayer co-op cooking game made for a hackathon",
date: "2024",
image: "../images/projects/mediumrare.png",
link: "https://mediumrare.hnasheralneam.dev/",
github: "https://github.com/hnasheralneam/medium-rare"
},
{
title: "Sleepwalker",
description: "A terminal-looking web game, built for an overnight hackathon",
date: "2024",
image: "../images/projects/sleepwalker.png",
link: "https://sleepwalker.quest",
github: "https://github.com/MichaByte/sleepwalker"
},
{
title: "Produced Demand",
description: "A bus maanagement game",
date: "2025",
image: "../images/projects/produceddemand.png",
link: "https://hnasheralneam.itch.io/produced-demand",
github: "https://github.com/produced-demand/produced-demand"
}
];
data.forEach((item) => {
let element = document.createElement("div");
element.classList.add("carousel-item");
element.innerHTML = `
<div class="carousel-item-inner">
<img src="${item.image}">
<div class="text-items">
<h2>${item.title}</h2>
<p>${item.description}</p>
<p class="more">
<span class="started">Started ${item.date}</span>&nbsp;|&nbsp;
<a href="${item.link}">Try it</a>&nbsp;|&nbsp;
<a href="${item.github}">GitHub Repository</a>
</p>
</div>
</div>`;
document.querySelector(".carousel-inner").append(element);
});
// + prayertimes
const items = document.querySelectorAll(".carousel-item");
let activeIndex = 1;
let carouselLoop;
let lastChange = Date.now();
function updateCarousel() {
const total = items.length;
items.forEach((item, index) => {
item.classList.remove("prev", "active", "next", "hidden-left", "hidden-right");
const diff = (index - activeIndex + total) % total;
if (index === activeIndex) item.classList.add("active");
else if (diff === total - 1) item.classList.add("prev");
else if (diff === 1) item.classList.add("next");
else if (diff < total / 2) item.classList.add("hidden-right");
else item.classList.add("hidden-left");
});
}
document.querySelector(".carousel").addEventListener("click", (event) => {
if (event.target.parentElement.parentElement.classList.contains("next")) {
if ((Date.now() - lastChange) < 500) return;
nextSlide();
resetCarouselLoop();
lastChange = Date.now();
} else if (event.target.parentElement.parentElement.classList.contains("prev")) {
if ((Date.now() - lastChange) < 500) return;
lastSlide();
resetCarouselLoop();
lastChange = Date.now();
}
});
function nextSlide() {
activeIndex = (activeIndex + 1) % items.length;
updateCarousel();
}
function lastSlide() {
activeIndex = (activeIndex - 1 + items.length) % items.length;
updateCarousel();
}
updateCarousel();
carouselLoop = setInterval(nextSlide, 2000);
function resetCarouselLoop() {
lastChange = Date.now();
clearInterval(carouselLoop);
carouselLoop = setInterval(nextSlide, 2000);
}

145
styles/projects.css Normal file
View file

@ -0,0 +1,145 @@
.carousel {
height: 100vh;
width: 100vw;
padding: 0 0;
overflow: hidden;
}
.carousel-inner {
position: relative;
width: 100%;
max-width: 900px;
height: 300px;
margin: auto;
overflow: visible;
display: flex;
justify-content: center;
align-items: center;
white-space: nowrap;
scrollbar-width: none;
}
.carousel-inner::-webkit-scrollbar {
display: none;
}
.carousel-item {
position: absolute;
top: 10%;
left: 50%;
margin: auto;
height: 90vh;
width: 85vh;
display: inline-flex;
justify-content: center;
align-items: center;
text-align: center;
transition: 0.6s;
opacity: 0.1;
}
.carousel-item.active {
transform: translateX(-50%) scale(1);
opacity: 1;
z-index: 3;
}
.carousel-item.prev {
transform: translateX(-120%) scale(0.8);
opacity: 0.8;
filter: blur(2px);
z-index: 2;
}
.carousel-item.next {
transform: translateX(20%) scale(0.8);
opacity: 0.8;
filter: blur(2px);
z-index: 2;
}
.carousel-item.hidden-left {
transform: translateX(-120%) scale(0.8);
opacity: 0;
pointer-events: none;
z-index: 1;
}
.carousel-item.hidden-right {
transform: translateX(20%) scale(0.8);
opacity: 0;
pointer-events: none;
z-index: 1;
}
/* .carousel-item:hover {
transform: scale(1.05);
}
.carousel-item-last:hover,
.carousel-item-next:hover {
transform: scale(0.95);
} */
.carousel-item-inner {
background-color: #f5f5f5;
border-radius: 2rem;
padding: 0.5rem 0.5rem 1.5rem;
transition: 0.2s;
border: 0.2rem solid #ddd;
}
.carousel-item-inner:hover img {
box-shadow: 0 0.2rem 0.5rem #111;
transform: translateY(-0.3rem);
}
.carousel-item img {
width: 78vh;
border-radius: 1.6rem;
transition: 0.2s;
}
.carousel-item .text-items {
margin: 1rem 0;
}
.carousel-item h2 a {
text-decoration: none;
cursor: pointer;
}
.carousel-item h2 a:hover {
text-decoration: underline;
}
.carousel-item p {
margin: 0.2rem 0;
color: #222;
}
.title {
text-align: center;
font-size: 5rem;
margin-bottom: -3rem;
color: #333;
text-shadow: 0 0 .2rem #fff, .2rem .2rem cyan,
-.2rem -.2rem magenta;
}
@media (prefers-color-scheme: dark) {
.title {
color: #fff;
text-shadow: 0 0 .2rem #888, .2rem .2rem cyan,
-.2rem -.2rem magenta;
}
.carousel-item-inner {
background-color: #333;
border: 0.2rem solid #666;
}
.carousel-item p {
color: #ddd;
}
}

61
styles/styles.css
View file

@ -75,4 +75,65 @@ a {
.footer {
background-color: #000;
}
}
/* menu */
.menu {
position: fixed;
top: 0;
left: .2rem;
bottom: 0;
width: 10rem;
display: flex;
justify-items: center;
align-items: center;
transition: .2s;
z-index: 10;
}
.menu:hover {
left: .6rem;
}
.menu .item {
height: 3rem;
width: 3rem;
background-color: #f4f4f4;
border: solid .2rem #ebebeb;
border-radius: 50%;
transition: .2s;
margin: .5rem auto;
display: flex;
justify-content: center;
align-items: center;
line-height: 1em;
}
.menu .item img {
filter: invert(80%);
transition: .2s;
}
.menu .item:hover img {
filter: none;
}
.menu .item:hover {
background-color: var(--theme-color);
transform: scale(1.15);
margin: 1rem auto;
}
@media (prefers-color-scheme: dark) {
.menu .item {
background-color: #333;
border: solid .2rem #444;
}
.menu .item img {
filter: none;
}
}

19
thoughts.html
View file

@ -11,9 +11,7 @@
<title>Thoughts | Hamza Nasher-Alneam</title>
</head>
<body>
<a class="home" href="index.html">Home</a>
<br><br>
<div class="content thoughtsblock">
<div class="article">
<h1 id="imessage-lockin" onclick="copy('imessage-lockin')">iMessage Lockin</h1>
@ -34,23 +32,14 @@
<p>In 2019 Samsung revealed the Galaxy Fold to the world. This may have been the first, but in their folly other companies were quick to follow. These weren't flip phones, they were smartphones that folded, a phone that looks like an ordinary or irritatingly skinny phone, until <i>wow, it flips open</i>, giving <i>twice the screen space</i>. How could this be less than perfect? It's the future! Well, sorry to break it to you, even with practical inconsistencies set aside (who has the time to flip their phone open every time they get a message? Most of the time the phone will stay closed, leaving you with a very thick but normal device), this is a developing nightmare. <i>Another</i> screen size to optimize for? So that's monitors, desktops, laptops, phones, and folding phones? Sure, a square screen looks nice, but not nearly enough people use it to make it worth developing for. Which brings us to the user.</p>
<p>User experience is everything. You might have a great device or operating system, but if you can't easily access the content you need it isn't worth it. Which is why people don't use Linux. Here was a bold new device, but it was about to face a greater challenge than the dubious press: getting developers to make apps and websites for their screens. Apple had great success getting developers to optimize for the iPhone and tablet, but that's not the whole story. Do you remember the Macbook Pro touchbar? Here's how that went down. In 2016 Apple unveiled the new Macbook Pro with a touch bar display where the command keys used to be. They flaunted how the benefits were unimaginable, with every app adding custom controls for easy use. But in 2022, Apple removed it from most of its Pro lineup. Why? Because the biggest feature, custom app controls, was never used by developers. Macbooks already have such a small market share, but for creators it might still make sense. But the fact that it was only on the Pro lineup, such an insignificant amount of users would have been affected that developers decided not to build for it. And <i>that</i> is the reason it was removed, not battery efficiency or whatever excuse they used. The new Dynamic Island feature on their Pro phones is the same mistake, and while there is a larger number of users, if they don't convince developers to build for this it will go the way of the touchbar and 3d touch.</p>
<p>So <i>what</i> was Samsung thinking? The phones are so expensive and niche that it makes nearly no sense to develop for them. If Android tablets had ever become a thing, then maybe apps would have been ready for that screen size and aspect ratio. But instead, Android apps are optimized for a normal phone screen, so opening nearly any website or app at full size is sure to be a bad experience. Why would someone buy a device where the core feature is extra screen if all their favorite apps and sites are warped and unusable? It just doesn't make sense. So you'd think that at least <i>some</i> phone manufacturers asked the geniuses behind their product design if this was a good idea. But <i>no</i>, everyone wants to get in on it. They think this is the Next Big Thing, and just about every phone maker has made or is rumored to be making a folding phone. But even with all of this aside, folding phones are <i>expensive</i>. The Samsung Galaxy Fold 4 starts at <i>1,799</i> US dollars. That is <i>not</i> a price most ordinary users are going to be willing to pay for a gimmick.</p>
<p>So, the folding phone. Smartphone makers are betting big when they keep making these, hoping that developers will build for them and consumers will buy. But the simple fact is, the smartphone market doesn't need disruption. The design we've reached, a flat rectangle, is basically perfect. It fits in your pocket, has an all-day battery life, and can run basically any task you want it to. And people are keeping their phones for longer, unwilling to buy another expensive phone that isn't noticeably better than their current one. I think this is the smartphone industry desperately scrambling to find some way to keep their exponential growth. But hey, that's just my opinion.</p>
<p>So, the folding phone. Smartphone makers are betting big when they keep making these, hoping that developers will build for them and consumers will buy. But the simple fact is, the smartphone market doesn't need disruption. The design we've reached, a flat rectangle, is basically perfect. It fits in your pocket, has an all-day battery life, and can run basically any task you want it to. And people are keeping their phones for longer, unwilling to buy another expensive phone that isn't noticeably better than their current one. I think this is the smartphone industry desperately scrambling to find some way to keep their exponential growth. But hey, that's just my opinion.</p>
</div>
</div>
<br><br>
<div class="footer">
<div>
<h2>Find me</h2>
<p>Github -> <a href="https://github.com/hnasheralneam">GitHub</a></p>
<p class="faded-footer">Many of my projects are on GitHub</p>
</div>
<div>
<h2>Contact me</h2>
<p>Email account -> <a href="mailto:hnasheralneam@gmail.com">hnasheralneam at google mail</a></p>
<p>Discord account -> <a href="#">namegoes.here</a></p>
</div>
</div>
<div w3-include-html="partials/footer.html"></div>
<div w3-include-html="partials/menu.html"></div>
</body>
<script src="scripts/include-html.js"></script>
<script>
let url = document.location.href;