PDA

View Full Version : Generate Sencha Style for the Tab Component



antoine.kahale
17 Sep 2013, 12:53 AM
Hello,

I am generating a sencha style and i need please to have a tab style similar to the attached picture.
So i try to update the background and tab text color but i still have to fix the top and bottom border and add a flag in the bottom for the active tab as it look in this picture.
How can i do that please?

These scss variables fixed the background color and the font color:
$tab-base-color: #ffffff !default;
$tab-base-color-over: #ffffff !default;
$tab-base-color-active: #ffffff !default;

$tab-color: #2d648a !default;
$tab-color-over: #ce6c00 !default;
$tab-color-active: #ce6c00 !default;

I didn't find any possibility to hide the left and right border of the panel body.
We have only the possibility to adjust all the border at one scss variables and it's not separated.
I try also to put in this scss variable 1px 0 1px 0 (that mean top, left, bottom, right) but also i didn't retrieve any result.

Thank you in advance,
Antoine

antoine.kahale
22 Sep 2013, 10:50 PM
Any feedback please.
We need please to check if we can fix that in sencha scss variable style or not.
Thanks for your help!

Gary Schlosberg
25 Sep 2013, 9:04 PM
Not sure how you can get an anchor to show on the bottom of the tab, but you might be able to get the borders to go away with $tabbar-border-width (http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.tab.Bar-css_var-S-tabbar-border-width).