Different Color Headers for Cities

[luismqueral]

To differentiate cities (and make it easier to know you've switched to a new city), let's allow for a new bg color and potentially logo.

@pedrumgolriz How do you suggest architecting something like this? I think the easiest way to do this is to assign random color values for cities / metro areas (I can supply a good palette) and then a function for city-specific overrides when necessary. That work?

[pedrumgolriz]

Rather than random values, that would change on every refresh, we could set the hex to the first 6 letters of the city's name. e.g. NYC = background-color: #NYC;
<div ng-style="background-color=city.name"></div>

[luismqueral]

Oh shit, better yet, how about we add a class? It can default to some color, but we can have ng-class="city.name--color" and manually set them in the CSS? That'd make it easy to maintain.

[pedrumgolriz]

We would have to have a class for each city then, and the cities list grows on its own

[luismqueral]

Yeah that's fine. We'd still have a default color and If there's not a class for it then it just won't assign anything.

For the city list, I really do think it's bad UX to have select options appear and disappear periodically. I'd prefer keeping it to a fixed, static number (hardcoding city urls) and adding when cities have enough good content.

Otherwise it's going to be impossible to maintain IMO.