Skip to content

Header icons need to invert to black/dark on specific preset background images (like the Dashboard does) #33969

Closed

Description

@jancborchardt

The Dashboard already does this correctly, and as discussed with @juliushaertl we should use the same logic for the other pages. Specifically, this applies to these 4 backgrounds:

  • bernie-cetonia-aurata-take-off-composition.jpg
  • lali-masriera-yellow-bricks.jpg
  • rawpixel-pink-tapioca-bubbles.jpg
  • tommy-chau-lion-rock-hill.jpg

The logic seems to be with the --primary-invert-if-bright variable as far as I can see.

Correct in Dashboard – I would additionally say that we need to invert the logo as well (only if it is our default Nextcloud logo though) cc @karlitschek
image

Needs to be adjusted in the other apps. I assume with Julius’ move of the header to Vue this might be easier?
image

Activity

  1. added this to the Nextcloud 25 milestone on Sep 8, 2022
  2. szaimen commented on Sep 9, 2022

    @szaimen
    Contributor

    @CarlSchwan could you maybe also have a fast look into this? I think it is pretty bad...

  3. skjnldsv commented on Sep 28, 2022

    @skjnldsv
    Member

    Once #34272 is done, we can easily adjust --primary-invert-if-bright accordingly
    I can handle it if no one is diving into this. :)

    cc @Pytal

  4. Pytal commented on Sep 28, 2022

    @Pytal
    Member

    Preset colors of shipped backgrounds are used as primary in #34298

    If this touches the same code then it can be handled by @skjnldsv after the above PR

  5. skjnldsv commented on Oct 5, 2022

    @skjnldsv
    Member

    Fixed with #34298

  6. Pytal commented on Oct 12, 2022

    @Pytal
    Member

    Fixed on dashboard and appearance pages but not globally like on the files page

    The --primary-invert-if-bright variable needs to be adjusted then @skjnldsv?

  7. reopened this on Oct 12, 2022
  8. skjnldsv commented on Oct 12, 2022

    @skjnldsv
    Member

    Isn't the primary-invert-if-bright already using the primary colour?
    Why does it needs extra work then?

  9. skjnldsv commented on Oct 12, 2022

    @skjnldsv
    Member

    '--primary-invert-if-bright' => $this->util->invertTextColor($this->primaryColor) ? 'invert(100%)' : 'no',

  10. skjnldsv commented on Oct 12, 2022

    @skjnldsv
    Member

    Ah, this should be properly fixed by #34437 I guess

  11. szaimen commented on Oct 12, 2022

    @szaimen
    Contributor

    Ah, this should be properly fixed by #34437 I guess

    no, not for custom background. It will probably only get fixed with #34512

  12. skjnldsv commented on Oct 12, 2022

    @skjnldsv
    Member

    @szaimen this issue is not about custom background

  13. szaimen commented on Oct 12, 2022

    @szaimen
    Contributor

    Ah I see.

  14. Pytal commented on Oct 12, 2022

    @Pytal
    Member

    Ah, this should be properly fixed by #34437 I guess

    👌

  15. self-assigned this
    on Oct 13, 2022
  16. added
    4. to releaseReady to be released and/or waiting for tests to finish
    and removed
    1. to developAccepted and waiting to be taken care of
    on Oct 13, 2022
  17. skjnldsv commented on Oct 13, 2022

    @skjnldsv
    Member

    Merged and fixed

  18. Pytal commented on Oct 18, 2022

    @Pytal
    Member

    Seems that the header icons on the files page and others (excluding dashboard and appearance pages) are still not inverted

    image

  19. reopened this on Oct 18, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

Type

No type

Projects

No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions