WordPress/openverse-catalog

[Feature] Update navbar color

AetherUnbound opened this issue ยท 7 comments

Problem

We are using the default (read: boring ๐Ÿ˜‰) navbar color.

Description

Since we have brand colors now, we should use one of those! I find it's helpful to have different colors to distinguish easily between dev and prod. Possibly #ffe033 (brand yellow) for prod and #c52b9b (brand pink) for dev?

Alternatives

Additional context

This can be changed using the AIRFLOW__WEBSERVER__NAVBAR_COLOR environment variable, we should add a default in our env.template file.

Implementation

  • ๐Ÿ™‹ I would be interested in implementing this feature.

Examples:
CleanShot 2021-10-09 at 12 41 29@2x
CleanShot 2021-10-09 at 12 40 11@2x
CleanShot 2021-10-09 at 12 39 44@2x
CleanShot 2021-10-09 at 12 39 00@2x

  • pink: #C52B9B
  • yellow: #FFE033
  • dark: #30272E
  • light: #F3F2F2

From the screenshots, it appears that using pink and dark as backgrounds makes the text illegible.

From the screenshots, it appears that using pink and dark as backgrounds makes the text illegible.

Agreed, and our blue (#3e58e1) does not seem to be much better ๐Ÿ™
image

@AetherUnbound is the text color changeable? Because if it is, we could make even the dark colors work much better.

@AetherUnbound is the text color changeable? Because if it is, we could make even the dark colors work much better.

I'm looking into this now, but from what I recall I don't believe it is (easily enough to warrant trying, at least).

I think it might make sense to set the prod color to our "brand yellow", and then set dev colors to whatever people prefer. We could even leave the config option in our env.template but keep it as #fff, the current default.

@AetherUnbound is the text color changeable? Because if it is, we could make even the dark colors work much better.

I'm looking into this now, but from what I recall I don't believe it is (easily enough to warrant trying, at least).

I looked into this too, it's not.