diff --git a/assets/css/main.css b/assets/css/main.css index 6f3becd..033086c 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -146,6 +146,31 @@ mark { color: inherit; } +#theme-toggle { + position: absolute; + top: 10px; + right: 10px; + font-size: 24px; + cursor: pointer; +} + +.fa-sun { + color: #ffc107; +} + +.fa-moon { + color: #6c757d; +} + +.dark-mode { + background-color: #222; + color: #ddd; +} + +.dark-mode a { + color: #49bf9d; +} + input::-moz-focus-inner { border: 0; padding: 0; @@ -172,6 +197,10 @@ html { box-sizing: inherit; } +.hidden { + display: none; +} + body { background: #fff; } diff --git a/assets/js/darkmode.js b/assets/js/darkmode.js new file mode 100644 index 0000000..607e36e --- /dev/null +++ b/assets/js/darkmode.js @@ -0,0 +1,19 @@ +document.addEventListener("DOMContentLoaded", function () { + const body = document.body; + const themeToggle = document.getElementById("theme-toggle"); + + themeToggle.addEventListener("click", function () { + body.classList.toggle("dark-mode"); + toggleThemeIcon(); + }); + + function toggleThemeIcon() { + if (body.classList.contains("dark-mode")) { + themeToggle.innerHTML = ''; + } else { + themeToggle.innerHTML = ''; + } + } + + toggleThemeIcon(); // Set initial icon based on the current theme +}); diff --git a/assets/js/fullparagrph.js b/assets/js/fullparagrph.js new file mode 100644 index 0000000..1f6e575 --- /dev/null +++ b/assets/js/fullparagrph.js @@ -0,0 +1,14 @@ +function toggleParagraph() { + var spans = document.querySelectorAll("#more"); + var btnText = document.querySelector(".learn-more"); + + spans.forEach(function (span) { + span.classList.toggle("hidden"); + }); + + if (spans[0].classList.contains("hidden")) { + btnText.textContent = "Learn More"; + } else { + btnText.textContent = "Less"; + } +} diff --git a/index.html b/index.html index a9106e7..7738d5e 100644 --- a/index.html +++ b/index.html @@ -15,6 +15,16 @@ content="width=device-width, initial-scale=1, user-scalable=no" /> + + + +
+ +
+
@@ -56,32 +66,38 @@ problem-solving and innovation. My journey took a significant turn when I was deployed to Afghanistan, where I served as a military police officer, working closely with the Afghan Army. This experience - instilled in me a strong work ethic and discipline, and it was during - this time I was encouraged by special ops personnel to pursue IT. This - advice set me on a path that led to critical roles in data center - management and network optimization for organizations like Oracle. + instilled in me +

- My career took another pivotal step during my time at UPMC - CancerCenters, where I realized that technology could have a profound - impact on people's lives. Although I wasn't directly helping patients, - ensuring that the doctors and nurses had reliable technology - reaffirmed my belief that the tech field is where I could do the most - good for humanity. Recently, I graduated from Code Platoon's - Full-Stack Software Engineering program and am currently participating - in their part-time DevOps & Cloud Engineering course. My passion for - technology extends to AI, machine learning, and innovative solutions - in healthcare. I'm excited to continue expanding my expertise and - collaborating with like-minded professionals. Whether you're looking - to discuss projects, career opportunities, or simply exchange - knowledge in the tech space, I'd love to connect! +

@@ -365,6 +381,8 @@ + +