Namespace List Button Not Colored in Dark Mode #2001

New Issue

rconnorjohnstone · 2022-12-31T01:21:00Z

rconnorjohnstone commented

2022-12-31 01:21:00 +00:00

Description

The button for the namespace list menu option stays light upon a switch to dark mode.

I think the following should fix it

--- a/src/components/home/navigation.vue
+++ b/src/components/home/navigation.vue
@@ -460,6 +460,7 @@ $vikunja-nav-selected-width: 0.4rem;
                font-weight: bold;
                font-family: $vikunja-font;
                color: $vikunja-nav-color;
+               background-color: var(--button-text-hover-background-color);
                font-weight: 600;
                min-height: 2.5rem;
                padding-top: 0;

But I've never developed a vue.js app, so I'm not 100% sure.

Vikunja Frontend Version

0.20.2

Vikunja API Version

0.20.2

Browser and version

qutebrowser (chromium)

Can you reproduce the bug on the Vikunja demo site?

Yes

Screenshots

No response

### Description The button for the namespace list menu option stays light upon a switch to dark mode. I think the following should fix it ``` --- a/src/components/home/navigation.vue +++ b/src/components/home/navigation.vue @@ -460,6 +460,7 @@ $vikunja-nav-selected-width: 0.4rem; font-weight: bold; font-family: $vikunja-font; color: $vikunja-nav-color; + background-color: var(--button-text-hover-background-color); font-weight: 600; min-height: 2.5rem; padding-top: 0; ``` But I've never developed a vue.js app, so I'm not 100% sure. ### Vikunja Frontend Version 0.20.2 ### Vikunja API Version 0.20.2 ### Browser and version qutebrowser (chromium) ### Can you reproduce the bug on the Vikunja demo site? Yes ### Screenshots _No response_

image.png

3.9 KiB

image.png

3.9 KiB

2022-12-30T18:20:04,017538691-07:00.png

18 KiB

rconnorjohnstone added the

kind/bug

label 2022-12-31 01:21:00 +00:00

konrad commented

2023-01-03 15:13:42 +00:00

Can you share a screenshot? It looks fine for me.

rconnorjohnstone commented

2023-01-03 17:52:24 +00:00

I believe I shared a couple in the attachments of the issue. Perhaps I did that wrong.

👍 1

rconnorjohnstone commented

2023-01-03 17:53:40 +00:00

I should note that on firefox it seems to be ok

konrad commented

2023-01-03 17:57:55 +00:00

Ah yes, now I see them, sorry.

It looks fine for me on chromium on android and in Firefox on desktop, will check in qutebrowser once I get back to my laptop. Does it work in standard chromium for you?

Ah yes, now I see them, sorry. It looks fine for me on chromium on android and in Firefox on desktop, will check in qutebrowser once I get back to my laptop. Does it work in standard chromium for you?

rconnorjohnstone commented

2023-01-03 17:59:40 +00:00

It does work fine on standard chromium

konrad commented

2023-01-04 11:33:24 +00:00

I looked at qutebrowser and it looks like they replace the stylings for the buttons with their own. Not sure how to solve this and it's definitely non-standard behavior.

The patch you sent fixes only the namespace menu button:

The underlying problem is not fixed as the issue appears in a few other places. And the button still does not look good. I believe this is a problem with qutebrowser. Can you open an issue there?

I looked at qutebrowser and it looks like they replace the stylings for the buttons with their own. Not sure how to solve this and it's definitely non-standard behavior. The patch you sent fixes only the namespace menu button: ![image](/attachments/c20b5dbb-d7d9-42b8-b448-ee7cfde4313e) The underlying problem is not fixed as the issue appears in a few other places. And the button still does not look good. I believe this is a problem with qutebrowser. Can you open an issue there?

image.png

3.9 KiB

konrad closed this issue

2023-01-04 11:33:24 +00:00

rconnorjohnstone commented

2023-01-16 20:11:22 +00:00

Just a note that this issue was related to Qutebrowser's use of an outdated chromium version not seeing the CSS "where" selectors. In the beta qt6 branch of qutebrowser, this is not a problem.

👍 2

dpschen commented

2023-01-17 09:57:05 +00:00

That makes sense!

konrad referenced this issue from a commit

2024-02-07 14:00:34 +00:00

fix(deps): update dependency vue to v3.2.36 (#2001)

Sign in to join this conversation.