diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..6f3a291 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "liveServer.settings.port": 5501 +} \ No newline at end of file diff --git a/footer.css b/footer.css new file mode 100644 index 0000000..9fa3589 --- /dev/null +++ b/footer.css @@ -0,0 +1,36 @@ +/* Footer styles */ +footer { + background-color: #333; + color: #fff; + padding: 10px; + text-align: center; + position: absolute; + bottom: 0; + width: 100%; +} + +.footer-content { + max-width: 800px; + margin: 0 auto; + display: flex; + justify-content: space-between; + align-items: center; +} + +.footer-content p { + margin: 0; +} + +.footer-content ul { + list-style: none; + padding: 0; +} + +.footer-content ul li { + display: inline; + margin-right: 20px; +} + +.footer-content ul li:last-child { + margin-right: 0; +} diff --git a/index.html b/index.html index 8ca4da9..4bf5911 100644 --- a/index.html +++ b/index.html @@ -5,7 +5,8 @@ Productivity Dashboard - + +
@@ -29,7 +30,7 @@

Pomodoro Timer

- +
@@ -54,8 +55,27 @@

To-Do List

+
+

Play a Song

+
+ + +
+ +
+ + + diff --git a/script.js b/script.js index eef0301..18f4543 100644 --- a/script.js +++ b/script.js @@ -210,3 +210,18 @@ function unassignPrimaryTask() { // Spotify Music Player // Add JavaScript code for Spotify music player here + +const musicLink = document.getElementById('musicLink'); +const playButton = document.getElementById('playButton'); +const music = document.getElementById('music'); + +playButton.addEventListener('click', () => { + const link = musicLink.value.trim(); + + if (link) { + music.src = link; + music.play(); + } else { + alert('Please enter a valid music link.'); + } +}); diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..86b3bcb --- /dev/null +++ b/styles.css @@ -0,0 +1,31 @@ +body { + font-family: Arial, sans-serif; + text-align: center; +} + +.music-player { + margin: 20px; +} + +input[type="text"] { + padding: 8px; + border: 1px solid #ccc; + border-radius: 4px; +} + +#playButton { + background-color: #4CAF50; + color: white; + border: none; + border-radius: 4px; + padding: 8px 16px; + cursor: pointer; +} + +#playButton:hover { + background-color: #45a049; +} + +#playButton:active { + background-color: #3e8741; +} \ No newline at end of file