Fix: Added light background

[abdullah5361k]

fixes: #7969

What does this PR do?

Applied a lighter background color on hover.

[greptile-apps]

PR Summary

This pull request addresses the visibility issue of button hover effects in dark mode by applying a lighter background color on hover for dropdown buttons.

• Modified StyledHeaderDropdownButton.tsx to add a light background color on hover using theme.background.transparent.light
• Adjusted EmptyPlaceholderStyled.tsx with minor spacing and layout changes, reducing gap in StyledEmptyTextContainer and increasing line height in StyledEmptySubTitle
• Improved visibility for filter, sort, and options buttons in dark mode as demonstrated in the provided screenshot
• Changes align with the properly coded Storybook component mentioned in the related issue

_{2 file(s) reviewed, 2 comment(s)
Edit PR Review Bot Settings | Greptile}

[greptile-apps]

style: Consider removing the brightness filter as it may interfere with the new background color

[Bonapara]

Doesn't work for me:

CleanShot.2024-10-23.at.09.35.27.mp4

Why did you change the Emptyplaceholder file @abdullah5361k?

Also I think we are supposed to use this component here: packages/twenty-front/src/modules/ui/input/button/components/LightButton.tsx

WDYT @lucasbordeau?

[abdullah5361k]

Doesn't work for me:

CleanShot.2024-10-23.at.09.35.27.mp4
Why did you change the Emptyplaceholder file @abdullah5361k?

Also I think we are supposed to use this component here: packages/twenty-front/src/modules/ui/input/button/components/LightButton.tsx

WDYT @lucasbordeau?

Let me check why it's not working for you.
My last pull request includes changes to the EmptyPlaceholder file. I'm not sure why this file is showing as changed this time, but I'm looking into it.