Hey everyone, something seems to have changed from an older version here.
I’m trying to set the tab background and font color on New-UDTab / New-UDTabContainer.
In my theme, i can specify
'.mdc-tab-bar' = @{
'background-color' = "#a80000"
}
which handles the background, but i can’t set either the active tab’s background color or the font color. what am i missing?
Hi @artvandelay440
If you’re refering to 2.8.3 or above i believe there is a “UDTab” definition ready in the theme ?
Hi @artvandelay440 I use the following CSS to style my tabs the way I want them
'.tabs'= @{
'color' = "#2c505f"
'margin-top' = "-7px"
'background-color' = "#2c505f"
}
'.tabs .tab a:hover'= @{
'background-color' = "#557583"
'color'= "#ffffff"
}
'.tabs .tab a.active' = @{
'background-color' = "#2c505f"
'color'= "#ffffff"
}
'.tabs .tab a:focus.active' = @{
'background-color' = "#1e353f"
'color'= "#ffffff"
}
'.tabs .indicator'= @{
'background-color' = "#fff"
}
'.tabs .tab a'= @{
'color' = "#fff"
}
I am using 2.8.3, and tried both of these solutions, but unfortunately neither is working for me. I’ll keep looking, thanks. I know I’ve done it in previous versions, so checking for what has changed.
@artvandelay440
try using this, this is my config for the tabs. Result in a screenshot below:
UDTabActive = @{
ActiveBackgroundColor = '#FFFFFF'
ActiveFontColor = '#e3000f'
}
UDTabIndicator = @{
IndicatorColor = '#e3000f'
}
UDTabActiveIcon = @{
BackgroundColor = '#FFFFFF'
ActiveFontColor = '#e3000f'
}
UDTabIcon = @{
LineHeight = 'inherit'
Height = 'auto'
FontColor = '#FFFFFF'
}
UDTabs = @{
BackgroundColor = '#FFFFFF'
FontColor = '#e3000f'
Height = 'auto'
}
UDTab = @{
FontColor = '#e3000f'
}
'.mdc-tab__ripple::before' = @{
'background-color' = '#FFFFFF'
}
'.mdc-tab__ripple::after' = @{
'background-color' = '#FFFFFF'
}
That worked! Thanks again!!!
That did also the trick for me, i spent hours on the colors 
I used the developer tools from firefox/chrome to find the ‘.mdc-tab__ripple::before’ and ::after class.
