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
Frontend: Improve icon contrast #3594
base: develop
Are you sure you want to change the base?
Frontend: Improve icon contrast #3594
Conversation
@@ -353,6 +355,11 @@ body.chrome #photoprism .search-results .result { | |||
bottom: 4px; | |||
} | |||
|
|||
#photoprism .cards-view .input-favorite i, | |||
#photoprism .mosaic-view .input-favorite i { | |||
text-shadow: 0 0 2px #000, 0 0 2px #000 !important; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
double shadow for icons with opacity: 0.5
Thank you! Before we merge it as it is, how do other applications handle it? Are there any other CSS tricks we could try? I haven't had time to compare it with e.g. Google Photos, but I don't remember seeing any shadows there. |
@lastzero Google Photos adds a shadow to whole image. If controls are on top: to the top. If controls are on the bottom - to the bottom. Image zooms out when it's selected. I kind of like it, it's easier to distinguish if image is selected or not. |
Currently icons on the thumbnail overlay (favourite, checkbox, etc) are white-ish.
Quite often it's invisible when photo is also light color. This makes it impossible see if photo is liked or selected.
Example:
After this change icons have dark shadow so it's more contrasting
Other affected icons:
Acceptance Criteria: