Uploaded image for project: 'GeoDashboard'
  1. GeoDashboard
  2. GEOD-1168

Updated color scheme for explore page pills


    • Icon: Task Task
    • Resolution: Fixed
    • Icon: Normal Normal
    • None
    • None
    • None

      I came up with a color system for the Data Source primary color, the accordian bar colors and the pill colors in both default and selected state.

      I'm not sure if the CSS translates very well for this in InVision Inspect mode so I'll put it down here:

      Both Accordian bars and Pills have 2 fill colors applied one on top of the other---a percentage of the primary color and a percentage of black. For both UI elements, the color percentages are fixed and should work for all of the primary colors.

      I did this to prevent it from looking too pastel.

      Fill #1: 5% Black
      Fill #2: 20% of Primary Color (Data Source)

      Pill - Default State:
      Fill #1: 3% Black
      Fill #2: 10% of Primary Color

      Pill - Selected or Hover State
      Fill: 100% primary color
      Text: Roboto, bold, 11pt, #FFFFFF

      This system will make it easier to add additional data sources in future or for other instances of the dashboard with different requirements.

      Let me know if you want to discuss this in person . . .

      • Comment from lgatzke in InVisionĀ 

              diegoac2 Diego Calderon
              indiragp Indira Gutierrez Polo
              0 Vote for this issue
              1 Start watching this issue