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

Save theme color across pages

Browse source
This commit is contained in:
Hamza Nasher-Alneam 2025-05-05 18:15:42 -04:00
parent 9c0a834c71
commit ebb8568ca1
8 changed files with 46 additions and 85 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
guestbook.html
View file

@ -1,6 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<meta name="description" content="Hamza Nasher-Alneam's developer profile website!"> <meta name="description" content="Hamza Nasher-Alneam's developer profile website!">
@ -51,6 +50,7 @@
<div w3-include-html="partials/menu.html"></div> <div w3-include-html="partials/menu.html"></div>
</body> </body>
<script src="scripts/include-html.js"></script> <script src="scripts/include-html.js"></script>
<script src="scripts/script.js"></script>
<script defer src="https://umami.hnasheralneam.dev/script.js" <script defer src="https://umami.hnasheralneam.dev/script.js"
data-website-id="22e45953-378d-4e42-afe7-b31c197d3105"></script> data-website-id="22e45953-378d-4e42-afe7-b31c197d3105"></script>
<script src="https://hnasheralneam.github.io/digit/main.js"></script> <script src="https://hnasheralneam.github.io/digit/main.js"></script>

55
index.html
View file

@ -12,9 +12,7 @@
<title>Hamza Nasher-Alneam</title> <title>Hamza Nasher-Alneam</title>
</head> </head>
<body> <body>
<div class="progress-parent"> <div class="progress-parent"><div class="progress"></div></div>
<div class="progress"></div>
</div>
<br><br> <br><br>
<div class="content"> <div class="content">
@ -64,63 +62,18 @@
<p>Change the website color theme</p> <p>Change the website color theme</p>
<button onclick="changeTheme()">Random</button> <button onclick="changeTheme()">Random</button>
<button onclick="changeThemeHex()" class="hex-code-label">Hex code</button> <button onclick="changeThemeHex()" class="hex-code-label">Hex code</button>
<button onclick="resetTheme()">Reset</button>
</div> </div>
<br><br>
<!-- 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 class="thoughts-preview"> <br><br>
<h2>Thoughts</h2>
<a hre="articles/plasma-widgets.html#publish-widget">
<div class="thoughts-bit"
<h4>Publish your Plasma widget</h4>
<i>May 15 2024</i>
<p>A quick tutorial that shows how publish a KDE widget on the widget store. More on KDE widgets coming soon
hopefully!</p>
</div>
</a>
<a href="thoughts.html#imessage-lockin">
<div class="thoughts-bit">
<h4>The social issues with iMessage</h4>
<i>Dec 1 2022</i>
<p>I discusses the technology behind SMS, which is used when messaging between iPhones and other devices, as well as the newer MMS and RCS standards.</p>
</div>
</a>
<a href="thoughts.html#reject-folding-phones">
<div class="thoughts-bit">
<h4>An argument against folding phones</h4>
<i>Dec 1 2022</i>
<p>I mention the impracticalities in more words than strictly necessary.</p>
</div>
</a>
</div> -->
</div> </div>
</div> </div>
<br><br> <br><br>
<div w3-include-html="partials/footer.html"></div> <div w3-include-html="partials/footer.html"></div>
<div w3-include-html="partials/menu.html"></div> <div w3-include-html="partials/menu.html"></div>
</body> </body>
<script src="scripts/include-html.js"></script> <script src="scripts/include-html.js"></script>
<script src="scripts/script.js"></script>
<script src="scripts/main.js"></script> <script src="scripts/main.js"></script>
<script src="https://hnasheralneam.github.io/digit/main.js"></script> <script src="https://hnasheralneam.github.io/digit/main.js"></script>
<script defer src="https://umami.hnasheralneam.dev/script.js" <script defer src="https://umami.hnasheralneam.dev/script.js"

1
projects.html
View file

@ -21,6 +21,7 @@
<div w3-include-html="partials/menu.html"></div> <div w3-include-html="partials/menu.html"></div>
</body> </body>
<script src="scripts/include-html.js"></script> <script src="scripts/include-html.js"></script>
<script src="scripts/script.js"></script>
<script src="scripts/projects.js"></script> <script src="scripts/projects.js"></script>
<script defer src="https://umami.hnasheralneam.dev/script.js" <script defer src="https://umami.hnasheralneam.dev/script.js"
data-website-id="22e45953-378d-4e42-afe7-b31c197d3105"></script> data-website-id="22e45953-378d-4e42-afe7-b31c197d3105"></script>

24
scripts/copypopup.js Normal file
View file

@ -0,0 +1,24 @@
let url = document.location.href;
function copy(txt) {
let link = `${url}#${txt}`;
navigator.clipboard.writeText(link).then(() => {
console.log("Copied link!");
}, () => { console.log("Error copying link."); });
let alert = document.createElement("DIV");
alert.textContent = "Copied Link to Heading!";
alert.classList.add("tempAlert");
document.body.appendChild(alert);
setTimeout(() => {
alert.style.opacity = "1";
alert.style.bottom = ".5rem";
}, 200);
setTimeout(() => {
alert.style.opacity = "0";
alert.style.bottom = "-10rem";
}, 4200);
setTimeout(() => {
alert.remove();
}, 4400);
}

8
scripts/main.js
View file

@ -1,5 +1,3 @@
console.log("hello");
window.addEventListener("scroll", () => { window.addEventListener("scroll", () => {
document.body.style.setProperty("--scroll", window.pageYOffset / (document.body.offsetHeight - window.innerHeight)); document.body.style.setProperty("--scroll", window.pageYOffset / (document.body.offsetHeight - window.innerHeight));
}, false); }, false);
@ -20,8 +18,6 @@ function changeThemeHex() {
} }
} }
function setThemeColor(color) { function resetTheme() {
document.documentElement.style.setProperty("--theme-color", color); setThemeColor("#f69b46");
let metaThemeColor = document.querySelector("meta[name=theme-color]");
metaThemeColor.setAttribute("content", color);
} }

11
scripts/script.js Normal file
View file

@ -0,0 +1,11 @@
// theme color
let themeColor = localStorage.getItem("theme-color");
if (!themeColor) themeColor = "#f69b46";
setThemeColor(themeColor);
function setThemeColor(color) {
document.documentElement.style.setProperty("--theme-color", color);
let metaThemeColor = document.querySelector("meta[name=theme-color]");
metaThemeColor.setAttribute("content", color);
localStorage.setItem("theme-color", color);
}

2
styles/styles.css
View file

@ -84,7 +84,7 @@ a {
.menu { .menu {
position: fixed; position: fixed;
top: 0; top: 0;
left: .2rem; left: .3rem;
bottom: 0; bottom: 0;
width: 10rem; width: 10rem;
display: flex; display: flex;

28
thoughts.html
View file

@ -40,31 +40,7 @@
<div w3-include-html="partials/menu.html"></div> <div w3-include-html="partials/menu.html"></div>
</body> </body>
<script src="scripts/include-html.js"></script> <script src="scripts/include-html.js"></script>
<script> <script src="scripts/script.js"></script>
let url = document.location.href; <script src="scripts/copypopup.js"></script>
function copy(txt) {
let link = `${url}#${txt}`;
navigator.clipboard.writeText(link).then(() => {
console.log("Copied link!");
}, () => { console.log("Error copying link."); });
let alert = document.createElement("DIV");
alert.textContent = "Copied Link to Heading!";
alert.classList.add("tempAlert");
document.body.appendChild(alert);
setTimeout(() => {
alert.style.opacity = "1";
alert.style.bottom = ".5rem";
}, 200);
setTimeout(() => {
alert.style.opacity = "0";
alert.style.bottom = "-10rem";
}, 4200);
setTimeout(() => {
alert.remove();
}, 4400);
}
</script>
<script defer src="https://umami.hnasheralneam.dev/script.js" data-website-id="22e45953-378d-4e42-afe7-b31c197d3105"></script> <script defer src="https://umami.hnasheralneam.dev/script.js" data-website-id="22e45953-378d-4e42-afe7-b31c197d3105"></script>
</html> </html>