mozilla-mobile / shared-docs

⚠️ shared-docs moved to a new repository. It is now developed and maintained as part of: https://github.com/mozilla-mobile/firefox-android
https://medium.com/firefox-mobile-engineering
Mozilla Public License 2.0
34 stars 32 forks source link

Document what are android-components and common patterns we see in our applications #33

Open mcomella opened 6 years ago

mcomella commented 6 years ago

e.g. how to use:

mcomella commented 6 years ago

Something I wrote up for colors:

Quick rundown on colors: we have a Photon color palette that we ship with android components.

When using colors, we try to use existing references to our color palette because:

  • This ensures we're using the colors we want to be using rather than typoing them and using slightly off colors
  • It reduces the overall number of colors defined in the app, making things a little smaller and simpler
  • Makes dialogue between UX and engineering easier: "what color is that?" "Oh, photonGrey10." "Ah, that should be photonGrey20!"

There isn't a great way at the moment to go from hex code to color name besides grepping through the file in the android-components repository. Usually, Amin will mention the color name and it won't come directly as hex just from the mocks.

Caveat: the android-components project doesn't define colors with different alpha values, however: in this case, we define redundant colors in the project like, photonGrey10_a80p (photon grey 10 with 80% transparency) and try to re-use those.