Customize color for tabs

  • 0
  • 1
  • Question
  • Updated 2 months ago
  • Answered
I want to customize the color for tabs in the form. I know there is a tab color in the form properties but the color does not fill the whole tab. It only acts like a color underline of the tab. I want to fill the color for the background of the whole tab. Please help! 


Also, regarding to the tabs, as you see above, I have too many tabs that I have to click on the arrow left or right to go to tabs. How do I do to make half of the tabs in the end move to the second row so I can see all the tabs at once? 

Please support and help with these problems? Thanks so much!
Photo of Sales Info

Sales Info

  • 566 Points 500 badge 2x thumb

Posted 2 months ago

  • 0
  • 1
Photo of Sales Info

Sales Info

  • 566 Points 500 badge 2x thumb
Quick Base Junkie (find me on YouTube),

Can you please help me with these problems?

Thanks!!
Photo of QuickBaseCoach App Dev./Training

QuickBaseCoach App Dev./Training, Champion

  • 53,702 Points 50k badge 2x thumb
@Sales Info

It works how it works. I suggest that you design your form with fewer tabs. Keep in mind that you still can use Section within your tabs. 

The color is only the underline ands not the whole tab.

Here are 20 colors which look very different beside each other.  I just use them in sequence for my tabs.

Red       e6194b   
Green    3cb44b   
Yellow    ffe119   
Blue      0082c8   
Orange    f58231   
Purple    911eb4   
Cyan       46f0f0   
Magenta    f032e6   
Lime    d2f53c   
Pink     fabebe   
Teal      008080   
Lavender    e6beff   
Brown    aa6e28   
Beige       fffac8   
Maroon    800000
Mint         aaffc3   
Olive    808000   
Coral    ffd8b1   
Navy    000080   
Grey    808080
White    FFFFFF   
Black    000000


Photo of Sales Info

Sales Info

  • 566 Points 500 badge 2x thumb
Everett Patterson,

Do you have any suggestion for how to do this?.

Please help!!! Thanks!!
Photo of Sales Info

Sales Info

  • 566 Points 500 badge 2x thumb
Everett Patterson,

You're awesome! It works perfectly. Thanks so much! Can you please help me with the problem below?

Regarding to the tabs, as you see above, I have too many tabs that I have to click on the arrow left or right to go to tabs. How do I do to make the second half of the tabs move to the second row so I can see all the tabs at once? 
Photo of Everett Patterson

Everett Patterson

  • 802 Points 500 badge 2x thumb
No sorry I don't know any solutions to that problem, I recommend that you explore Mark's suggestion above

I suggest that you design your form with fewer tabs. Keep in mind that you still can use Section within your tabs. 

Are you using one form for all roles? Does all roles need access to the same form or can you create different forms for different roles? Can you replace a few tabs with sections?

Photo of Sales Info

Sales Info

  • 566 Points 500 badge 2x thumb
Everett Patterson,

Yes. I am using this form for all roles. I already created a few section headings and those tabs that are necessary to be displayed as a tab so my team can see it. Is it possible to add the code in the IOL so when it went to the specific tab, the next tab will go the next row? or inserting the "new line" code before the tab so it will go to the second row?

Anyways, Thanks so much for your support!  
Photo of Everett Patterson

Everett Patterson

  • 802 Points 500 badge 2x thumb
Test this out and see if it works like you want

$("#formTabsList").css("white-space", "inherit");
$("#tabHolder").css("position", "inherit");

Photo of Sales Info

Sales Info

  • 566 Points 500 badge 2x thumb
Everett Patterson,

It works. It would be nice if both rows have the length so it looks better. However, it works so I will stick with it if there is no way to do. 

Thanks so much, Everett!!! You're a genius!! AWESOME!!!