Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Comments-for-project #371

Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions credits/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ <h3> Sung in Baby It's Cold Outside </h3>
<h2>Project Contributors (People that helped make this website a success :)</h2>
<p class="thank-you"> Thanks to all our project contributors, your work and help is really appreciated. </h3>
<p class="be-a-contributor"> Want to be a contributor and be on this list too? Check out the <a href="https://github.com/KendallDoesCoding/mogul-christmas/issues">Issues section of this project repo</a> on GitHub and see if you can help out with anything.</p>
<center>
<center>
<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
<!-- prettier-ignore-start -->
<!-- markdownlint-disable -->
Expand Down Expand Up @@ -60,7 +60,7 @@ <h2>Project Contributors (People that helped make this website a success :)</h2>
<!-- markdownlint-restore -->
<!-- prettier-ignore-end -->

<!-- ALL-CONTRIBUTORS-LIST:END -->
<!-- ALL-CONTRIBUTORS-LIST:END -->
</center>
<a href="https://github.com/KendallDoesCoding"><h1>KendallDoesCoding</h1></a>
<h3> Project Founder, Owner </h3>
Expand Down
14 changes: 13 additions & 1 deletion credits/styles.css
Original file line number Diff line number Diff line change
@@ -1,66 +1,78 @@
/* Fonts */
/* Importing Google Fonts */
@import url("https://fonts.googleapis.com/css2?family=Redressed&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;1,100;1,300&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Handlee&display=swap");
@import url("https://fonts.googleapis.com/css2?family=ZCOOL+QingKe+HuangYou&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Beau+Rivage&display=swap");

/* Set center alignment and text alignment for all HTML and body elements */
html,
body {
align-items: center;
text-align: center;
}


/* Set color of visited links to blue */
a:visited {
color: blue;
}

/* Set color to purple and font family to "Handlee" for all h3 elements */
h3 {
color: purple;
font-family: "Handlee", cursive;
}

/* Set color to green for all h2 elements */
h2 {
color: green;
}

/* Set color to #1abc9c, center alignment, text alignment and font family to "Redressed" for elements with class "heading" */
.heading {
color: #1abc9c;
align-items: center;
text-align: center;
font-family: "Redressed", cursive;
}

/* Set color to red, center alignment, text alignment and font family to "Roboto" for elements with class "subtext" */
.subtext {
color: red;
align-items: center;
text-align: center;
font-family: "Roboto", sans-serif;
}

/* Set center alignment for elements with class "contributors" containing an embed element */
.contributors embed {
align-items: center;
}

/* Set font size to small for elements with class "techstudent10-work" */
.techstudent10-work {
font-size: small;
}

/* Set color to red and font family to "ZCOOL QingKe HuangYou" for elements with class "be-a-contributor" */
.be-a-contributor {
color: red;
font-family: "ZCOOL QingKe HuangYou", cursive;
}

/* Set color to red and font family to "ZCOOL QingKe HuangYou" for elements with class "commits" */
.commits {
color: red;
font-family: "ZCOOL QingKe HuangYou", cursive;
}

/* Set color to red for all links inside elements with class "commits" */
.commits a {
color: red;
}

/* Set color to purple, font family to "Beau Rivage" and font size to 9mm for elements with class "thank-you" */
.thank-you {
color: purple;
font-family: "Beau Rivage", cursive;
Expand Down
28 changes: 24 additions & 4 deletions index.js
Original file line number Diff line number Diff line change
Expand Up @@ -279,52 +279,72 @@ function toggleLoop() {
loopButton.classList.add("active");
}
}

function updateLoop() {
// Check the current state of the loop
if (loopState === false) {
// If it's off, remove the 'active' class from the loop button
loopButton.classList.remove("active");
} else if (loopState === true) {
// If it's on, add the 'active' class to the loop button
loopButton.classList.add("active");
}
}

// Function to toggle the shuffle mode
function toggleShuffle() {
shuffleState = !shuffleState;
localStorage.setItem("shuffle", shuffleState);
shuffleState = !shuffleState; // Toggle the shuffle state
localStorage.setItem("shuffle", shuffleState); // Save the state to local storage
// If shuffle mode is turned off, remove the active class from the shuffle button
if (shuffleState === false) {
shuffleButton.classList.remove("active");
// If shuffle mode is turned on, add the active class to the shuffle button and shuffle the songs list
} else if (shuffleState === true) {
shuffleButton.classList.add("active");
shuffleSongsList();
}
}

// Function to update the shuffle mode
function updateShuffle() {
// If shuffle mode is turned off, remove the active class from the shuffle button
if (shuffleState === false) {
shuffleButton.classList.remove("active");

// If shuffle mode is turned on, add the active class to the shuffle button and shuffle the songs list
} else if (shuffleState === true) {
shuffleButton.classList.add("active");
shuffleSongsList();
}
}

// Function to update the volume
function updateVolume() {
let volumeState = parseInt(localStorage.getItem("volume") ?? 50);
// Set the volume of the player to the volume state
player?.setVolume?.(volumeState);
// Set the value of the volume bar to the volume state
volumeBar.value = volumeState;
}

// Function to clear the time left interval and remove the active class from the time left elements
function clearTimeLeft() {
clearInterval(intervalId);
clearInterval(intervalId); // Clear the interval
const a = document.getElementsByClassName("time-left");
for (let i = 0; i < a.length; i++) {
a[i].classList.remove("active");
a[i].classList.remove("active"); // Remove the active class from each element
}
}

// Function to display the menu
function displayMenu(){
document.getElementById('menu-display').style.display = 'flex'
document.getElementById('menu-display').style.animationName = 'appear'
document.getElementById('closed-menu-icon').style.display = 'none'
document.getElementById('open-menu-icon').style.display = 'block'
}

// Function to close the menu
function closeMenu(){
document.getElementById('menu-display').style.animationName = 'desappear'
document.getElementById('closed-menu-icon').style.display = 'block'
Expand Down
9 changes: 7 additions & 2 deletions ludsocials/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,18 +11,23 @@
</head>
<body class="lyrics">
<header>
<!-- Link to the index.html page -->
<a href="../index.html">
<!-- SVG arrow icon for navigation -->
<svg width="40" height="40" viewBox="0 0 20 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path class='arrow' d="M0.792893 6.79289C0.402369 7.18342 0.402369 7.81658 0.792893 8.20711L7.15685 14.5711C7.54738 14.9616 8.18054 14.9616 8.57107 14.5711C8.96159 14.1805 8.96159 13.5474 8.57107 13.1569L2.91421 7.5L8.57107 1.84315C8.96159 1.45262 8.96159 0.819456 8.57107 0.428932C8.18054 0.0384079 7.54738 0.0384079 7.15685 0.428932L0.792893 6.79289ZM18.5 8.5C19.0523 8.5 19.5 8.05228 19.5 7.5C19.5 6.94772 19.0523 6.5 18.5 6.5V8.5ZM1.5 8.5H18.5V6.5H1.5V8.5Z" fill="#496C42"/>
</svg>
</a>
</a>
<!-- Main header title -->
<h1 class="h1">Ludwig's Socials</h1>

<!-- Toggler Outside Menu -->
<div id="header">
<div id="switch">
<!-- Toggle button for the menu -->
<label role='switch' class="switch">
<input class="switch-input" type="checkbox" />
<!-- Slider for the toggle button -->
<span class="switch slider round" id="round"></span>
</label>
</div>
Expand Down
19 changes: 17 additions & 2 deletions ludsocials/podcasts/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -15,35 +15,50 @@
/>
<link rel="stylesheet" href="styles.css">
<body>
<!-- This div contains the podcast name followed by the text "Socials" -->
<div class="modal-header">
<h1 class="logo">
<img class="logo-icon" src="images/theyard.jfif" />
</div>
<div class="modal-header">
<h1 class="logo">
<h1 class="logo">
Ludwig's Podcast
Socials
Socials
</h1>
</div>

<!-- This div contains a paragraph that provides context about where the code is from and includes a link to the GitHub repository -->
<div class="modal-content">
<p>This is taken from my Ludwig Launcher Extension, the repo can be found <a href="https://github.com/KendallDoesCoding/ludwigextension" target="_blank">here.</a></p>

<!-- This div contains the social media icons -->
<div class="modal-icons">

<!-- This div arranges the icons horizontally -->
<div class="flex-container">

<!-- This div contains an icon for Apple Podcasts -->
<div class="flex">
<a href="https://podcasts.apple.com/us/podcast/the-yard/id1575957255" target="_blank">
<img src="apple-brands.svg" style="color:darksalmon "></i>
</a>
</div>

<!-- This div contains an icon for Spotify -->
<div class="flex">
<a href="https://open.spotify.com/show/1CRvLoVEgaEfkfRZ3qrhiE" target="_blank">
<img src="spotify-brands.svg" style="color:darksalmon "></i>
</a>
</div>

<!-- This div contains an icon for YouTube -->
<div class="flex">
<a href="https://www.youtube.com/TheYardPodcast" target="_blank">
<i class="fa fa-youtube" style="color:darksalmon "></i>
</a>
</div>

<!-- This div contains an icon for Twitter -->
<div class="flex">
<a href="https://twitter.com/TheYard" target="_blank">
<i class="fa fa-twitter" style="color:darksalmon "></i>
Expand Down
13 changes: 12 additions & 1 deletion ludsocials/podcasts/styles.css
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
/* Defines the font family, size, and other general styles for the whole page */
html,
body {
font-family: "Open Sans", sans-serif;
Expand All @@ -20,55 +21,64 @@ body {
/* Internet Explorer/Edge */
}


/* Defines styles for links */
a:link,
a:visited {
color: #000000;
outline: 0;
text-decoration: none;
}

/* Defines styles for images */
img {
width: 30px;
color: darksalmon;
}

/* Defines styles for modal header */
.modal-header {
align-items: center;
border-bottom: 0.5px solid #dadada;
}

/* Defines styles for modal content */
.modal-content {
padding: 0 22px;
}

/* Defines styles for modal icons */
.modal-icons {
border-top: 0.5px solid #dadada;
height: 50px;
width: 100%;
}

/* Defines styles for the logo */
.logo {
padding: 16px;
}

/* Defines styles for the logo icon */
.logo-icon {
vertical-align: text-bottom;
margin-right: 12px;
width: 50%;
}

/* Defines styles for the version number */
.version {
color: #444;
font-size: 18px;
}

/* Defines styles for the flex container */
.flex-container {
display: flex;
justify-content: space-between;
padding: 10px 22px;
}

/* Defines styles for the flex items */
.flex {
opacity: 1;
transition: opacity 0.2s ease-in-out;
Expand All @@ -79,6 +89,7 @@ img {
opacity: 0.4;
}

/* Defines styles for the flex item icons */
.flex .fa {
font-size: 40px;
color: #2f5876;
Expand Down
4 changes: 2 additions & 2 deletions lyrics/alliwantforchristmas/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -342,9 +342,9 @@
<svg width="40" height="40" viewBox="0 0 20 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path class='arrow' d="M0.792893 6.79289C0.402369 7.18342 0.402369 7.81658 0.792893 8.20711L7.15685 14.5711C7.54738 14.9616 8.18054 14.9616 8.57107 14.5711C8.96159 14.1805 8.96159 13.5474 8.57107 13.1569L2.91421 7.5L8.57107 1.84315C8.96159 1.45262 8.96159 0.819456 8.57107 0.428932C8.18054 0.0384079 7.54738 0.0384079 7.15685 0.428932L0.792893 6.79289ZM18.5 8.5C19.0523 8.5 19.5 8.05228 19.5 7.5C19.5 6.94772 19.0523 6.5 18.5 6.5V8.5ZM1.5 8.5H18.5V6.5H1.5V8.5Z" fill="#496C42"/>
</svg>
</a>
</a>
<h1 id="h1" class="h1">All I Want For Christmas Lyrics</h1>

<!-- Toggler Outside Menu -->
<div id="header">
<div id="switch">
Expand Down
9 changes: 9 additions & 0 deletions lyrics/alliwantforchristmas/index.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,13 @@
// Find the lyrics for the song "all i want for christmas" in the "lyrics" array.
const song = lyrics.find((x) => x.name === "all i want for christmas").lyrics;

// Select the lyrics container from the HTML document
const lyrics__container = document.getElementsByClassName("lyrics")[0];

// Select the slider for the song "all i want for christmas"
const slider_all_I_want_for_christmas = document.querySelector(".slider");

// Create a new paragraph element for each line of the song, and append it to the lyrics container
song.map((item) => {
const p = document.createElement("p");
const textNode = document.createTextNode(item);
Expand All @@ -12,8 +18,11 @@ song.map((item) => {
return lyrics__container.appendChild(p);
});

// Select the toggle button for switching between light and dark modes
const toggle_all_I_want_for_christmas = document.querySelector(".round");
toggle_all_I_want_for_christmas.addEventListener("click", modeSwitch);

// Set the initial mode to "light"
let isLight_all_I_want_for_christmas = true;
function modeSwitch() {
isLight_all_I_want_for_christmas = !isLight_all_I_want_for_christmas;
Expand Down
Loading