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

Button "hover" effect #4464

Closed
jibin1573 opened this issue Jul 5, 2018 · 10 comments
Closed

Button "hover" effect #4464

jibin1573 opened this issue Jul 5, 2018 · 10 comments

Comments

@jibin1573
Copy link

Can we have glowing buttons, like in FL studio. Like when we press a button, it should light up with a different colour.

Thank you!

@Sawuare
Copy link
Member

Sawuare commented Jul 9, 2018

In LMMS 1.2.0 RC6, all buttons glow when pressed.

@SecondFlight SecondFlight added the response required A response from OP is required or the issue is closed automatically within 14 days. label Jul 9, 2018
@jibin1573
Copy link
Author

jibin1573 commented Jul 10, 2018

@Sawuare, I mean the buttons should light up. Please check this theme, and you'll understand. Link: https://lmms.io/lsp/?action=show&file=11356

In the screenshot, you can see the pencil icon light up. When I used this theme, the icons light up even when we hover over them.

(After downloading this file, you have to rename the file to tar.bz2)

@no-response no-response bot removed the response required A response from OP is required or the issue is closed automatically within 14 days. label Jul 10, 2018
@Sawuare
Copy link
Member

Sawuare commented Jul 10, 2018

AFAIK, the draw mode and edit mode buttons have 3 states: hover, pressed, checked. When a button is checked, it doesn't respond to hover/pressed. That's why a checked button doesn't glow when hovered/pressed.

I don't think we can change this behavior, but I think it makes sense.

@jibin1573
Copy link
Author

jibin1573 commented Jul 10, 2018

@Sawuare, I wish if the default theme could do that. This same property is applied even in LMMS Classic theme and also in the sidebar of 1.2.0 RC6 default theme, where there is a hovering function and also the item lights up on being clicked.

@tresf tresf changed the title Glowing buttons Button "hover" effect Sep 29, 2018
@tresf tresf added this to the 1.3.0 milestone Sep 29, 2018
@Sawuare Sawuare removed the ux label Jul 31, 2019
@PhysSong
Copy link
Member

PhysSong commented Jan 30, 2022

When a button is checked, it doesn't respond to hover/pressed.

It is possible with CSS(check+hover for example):

2022-01-30.16-43-59.mp4

For test, I used this. Better colors should be chosen later, though.

QToolButton:hover:checked {
	border-top: 1px solid #343840;
	border-bottom: 1px solid #4a515e;
	border-radius: 2px;
	background: qlineargradient(spread:reflect, x1:0, y1:0, x2:0, y2:1, stop:0 #292d33, stop:1 #22262c)
}

@Rossmaxx
Copy link
Contributor

just happened to come across this. this is a nice to have feature and phys' implementation looks good. one suggestion - the hover mode could get a lighter color (but not too light to hide the actual icon).

@luzpaz
Copy link
Contributor

luzpaz commented Aug 22, 2023

Is this as simple as adding the above CSS code in to style.css ?

@DomClark
Copy link
Member

It's a little more than that, but not much. It would need to be added to style.css for both the default and classic themes, and we'd want to discuss quite which colours to use.

luzpaz added a commit to luzpaz/lmms that referenced this issue Aug 22, 2023
luzpaz added a commit to luzpaz/lmms that referenced this issue Aug 22, 2023
@Rossmaxx
Copy link
Contributor

I have opened #7202 which implements the hover effect, but I haven't decided on the colour scheme yet. Reviews appreciated.

@Rossmaxx
Copy link
Contributor

Fixed in #7202

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

Successfully merging a pull request may close this issue.

8 participants