forked from vikunja/frontend
Vikunja logo type nearly invisible in dark mode #1
Labels
No Label
bug
duplicate
enhancement
help wanted
invalid
question
wontfix
No Milestone
No project
No Assignees
3 Participants
Notifications
Due Date
No due date set.
Dependencies
No dependencies set.
Reference: adrinux/frontend#1
Loading…
Reference in New Issue
No description provided.
Delete Branch "%!s(<nil>)"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
The vikunja logo SVG has hard coded grey type.
Need to decide which workaround to use. Two possibilites (there are more):
Adding number three: add css to svg itself that applies dark mode colors =)
I was pondering whether there is an svg filter that would flip the text colour to the inverse of whatever is below it...but I like the idea of fixing it within the svg, feels simplest.
I think a filter would be to 'uncontrolled' — might have unwanted sideeffects.
After a bit more thought I think the best way is to embed the svg via something like vite-svg-loader. This would be like your first proposal.
The reason being that it allows to style the SVG with CSS from outside.
We can still include the dark theme in the svg but if we want to be able to control it from the outside e.g. similar to @konrad proposed tailwind method the SVG has to be embedded in the html so that we are able to conditionally style it via classes (I think else they have a shadow dom or s.th. like that).
I was looking for a good moment to include this for a while already :D
I think that's a good way to go about this.
I created a pull request that includes the vite-svg-loader.
If that is merged I could help to adjust the colors accordingly =)
Good timing. I did some work adding it yesterday but the end was result was a broken logo - was about to ask what I was doing wrong :)
My Vue experience consists of a Udemy course I got 4% though and haven't looked at for at least 2 years. So not entirely suprised by my failure =D
I can handle the color swap no worries :)
Fixed logo text colour in
faa3c3b156
anda957df0a59
And added sane hover and focus styles since the logo link had started inheriting bulma navbar styles
f11eeb6dce
Closing.