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

Want to hide finger component #38

Open
tongari07 opened this issue Dec 13, 2022 · 3 comments
Open

Want to hide finger component #38

tongari07 opened this issue Dec 13, 2022 · 3 comments

Comments

@tongari07
Copy link

Thanks for react-guitar!! 😍

It would be great if we could hide finger components in my project like below screenshot.

I did this by giving visibility:hidden to the finger class in the developer tools.
image

It seems that it can be implemented by allowing visibility to be passed to the theme.

Thank you for your consideration.

@4lejandrito
Copy link
Owner

4lejandrito commented Dec 26, 2022

Hi @tongari07! Sorry for the late reply.

  1. What's exactly your use case?
  2. Do you want to hide the finger completely?
  3. Do you want to keep interactivity (users being able to fret strings)?
  4. Do you want to keep the fretting so that the guitar performs the sound you want?

@4lejandrito
Copy link
Owner

4lejandrito commented Dec 26, 2022

I've published [email protected] (changes) with which you can now hide the finger by doing:

<Guitar strings={[0, 1, 2, 2, 0, 0]} renderFinger={() => null} />

Please let me know if you like it and I'll publish as stable.

Thanks!

@tongari07
Copy link
Author

@4lejandrito
Thank you very much for the reply 🙏 🤩

Sorry, I typed that out and didn't realize how vague it ended up being.

What's exactly your use case?

My use case is...
I want to select it by clicking when the fret is not selected.
Such like a quiz.

Do you want to hide the finger completely?
Do you want to keep interactivity (users being able to fret strings)?
Do you want to keep the fretting so that the guitar performs the sound you want?

So I want to hide it, but it shows when I hover or click it!

Sorry for my poor english.
Thank you for your consideration 😍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants