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

Added artist page, FIXES #361 #362

Merged
merged 7 commits into from
Sep 29, 2023

Conversation

abhinav2712
Copy link
Contributor

@abhinav2712 abhinav2712 commented Mar 24, 2023

πŸ› οΈ Fixes Issue

Fixes #361

Related Issue/Addition to code

  • Adding Artist Page

πŸ‘¨β€πŸ’» Changes proposed

  • Added an artist page in the nav item
  • Included 10 artists popular during Christmas
  • Hover enabled for more info regarding each artists

Type of change

  • New feature (non-breaking change which adds functionality)
  • This change requires a documentation update

βœ”οΈ Check List (Check all the applicable boxes)

  • My code follows the code style of this project.
  • This PR does not contain plagiarized content.
  • The title of my pull request is a short description of the requested changes.

πŸ“„ Note to reviewers

  • In future, It would be better to make a seperate database for every data present in this website

πŸ“· Screenshots

New Feature:

image

@netlify
Copy link

netlify bot commented Mar 24, 2023

βœ… Deploy Preview for mogulchristmas ready!

Name Link
πŸ”¨ Latest commit 72283e3
πŸ” Latest deploy log https://app.netlify.com/sites/mogulchristmas/deploys/6517204b1656920008742f06
😎 Deploy Preview https://deploy-preview-362--mogulchristmas.netlify.app
πŸ“± Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

@accesslint accesslint bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There are accessibility issues in these changes.

<!-- Toggler Outside Menu -->
<div id="header">
<div id="switch">
<label role='switch' class="switch">
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like this element is missing an accessible name or label. That makes it hard for people using screen readers or voice control to use the control.

<div id="header">
<div id="switch">
<label role='switch' class="switch">
<input class="switch-input" type="checkbox" />
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like this element is missing an accessible name or label. That makes it hard for people using screen readers or voice control to use the control.

<div id='grid-container' class="row">
<div class="flipper">
<div class="front">
<img src="../images/artists-imgs/1.jpg" />
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This image is missing a text alternative. This is a problem for people using screen readers.


<div class="flipper">
<div class="front">
<img src="../images/artists-imgs/2.webp" />
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This image is missing a text alternative. This is a problem for people using screen readers.


<div class="flipper">
<div class="front">
<img src="../images/artists-imgs/3.webp" />
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This image is missing a text alternative. This is a problem for people using screen readers.


<div class="flipper">
<div class="front">
<img src="../images/artists-imgs/8.jpg" />
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This image is missing a text alternative. This is a problem for people using screen readers.


<div class="flipper">
<div class="front">
<img src="../images/artists-imgs/9.webp" />
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This image is missing a text alternative. This is a problem for people using screen readers.


<div class="flipper">
<div class="front">
<img src="../images/artists-imgs/10.jpg" />
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This image is missing a text alternative. This is a problem for people using screen readers.




<img src="../images/artists-imgs/9.webp" />
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This image is missing a text alternative. This is a problem for people using screen readers.



<img src="../images/artists-imgs/9.webp" />
<img src="../images/artists-imgs/10.jpg" />
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This image is missing a text alternative. This is a problem for people using screen readers.

Copy link
Owner

@KendallDoesCoding KendallDoesCoding left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is amazing. Just need a few changes to get done!

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not mobile responsive:
image

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How will mobile users find info on the artists (They can't hover over right?)

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Duplicate of artists on last line:
image

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The hover sometimes isn't smooth. Please have a look.

index.html Outdated Show resolved Hide resolved
@@ -415,9 +415,13 @@
<a href="/you-may-like"
>You May Also Like</a
>
<a href="/news-articles" target="_blank"
<!-- <a href="/news-articles" target="_blank"

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Well, don't remove this for now. As I said, I will consider removing this later on. But, this can go below on the nav-bar maybe after Rate Song?

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we change Andy William's photo to either:

  • image

OR

  • image

OR

  • image

OR

  • image

Pick any one, but I don't like the current one!

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

4th will do it, I actually was trying to find smaller pic hence was stuck with that..

@KendallDoesCoding
Copy link
Owner

@abhinav2712 any update?

@abhinav2712
Copy link
Contributor Author

@abhinav2712 any update?

I may need some more time for this, just got into some other things, but will fix in coming time

@KendallDoesCoding
Copy link
Owner

KendallDoesCoding commented Mar 26, 2023 via email

@KendallDoesCoding
Copy link
Owner

@abhinav2712 - any update?

@KendallDoesCoding
Copy link
Owner

@abhinav2712 - any update or should I close the PR?

@abhinav2712 abhinav2712 closed this Apr 9, 2023
@KendallDoesCoding
Copy link
Owner

@abhinav2712 why?

@abhinav2712
Copy link
Contributor Author

@KendallDoesCoding Man, Have a lot of other commitments, didnt want to hold this PR, you can do one thing to add this in issue s FEAT REQUEST, or shall I do it?

@KendallDoesCoding
Copy link
Owner

@KendallDoesCoding Man, Have a lot of other commitments, didnt want to hold this PR, you can do one thing to add this in issue s FEAT REQUEST, or shall I do it?

I'll reopen PR but I or someone else will work on it. I don't want to stress you out.

Copy link

@accesslint accesslint bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

πŸ‘ You fixed the issue(s)! Great work.

Copy link
Owner

@KendallDoesCoding KendallDoesCoding left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM βœ”οΈ.

This works for now, but we'll make it slightly more responsive in the future.

@KendallDoesCoding KendallDoesCoding merged commit 30a0aa0 into KendallDoesCoding:main Sep 29, 2023
7 of 10 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[FEATURE REQUEST] - Adding "Artist" nav item on nav bar
2 participants