Chrome Button Style To Menu

[heavywoody]

I have an application where I am using buttons across the top that are styled a certain way.  I can seem to figure out how to get that same style to apply to the top level menu.  So I need to know how to apply a chrome button style to a top level menu?  Submenu popup should remain with the default style. Just wanted to change
the style of the main menu so that when we hover over it looks like chrome button.

Here is the styling we are doing on the Button.  Right now, I can't seem to achieve the mouseover effect this has for Top Level menu

<Style TargetType="{x:Type telerik:RadButton}">

                                                                    <Setter Property="Padding" Value="4" />
                                                                    <Setter Property="Margin" Value="1,1,0,1" />
                                                                    <Setter Property="IsTabStop" Value="False" />
                                                                    <Setter Property="Template">
                                                                        <Setter.Value>
                                                                            <ControlTemplate TargetType="{x:Type telerik:RadButton}">
                                                                                <Grid>
                                                                                    <Chromes:ButtonChrome
CornerRadius="1"
RenderNormal="False"
RenderMouseOver="{TemplateBinding IsMouseOver}"
RenderPressed="{TemplateBinding IsPressed}" Template="{DynamicResource ButtonChromeControlTemplate1}">
                                                                                        <telerik:StyleManager.Theme>
                                                                                            <telerik:Office_BlackTheme />
                                                                                        </telerik:StyleManager.Theme>
                                                                                    </Chromes:ButtonChrome>
                                                                                    <ContentPresenter
ContentTemplate="{TemplateBinding ContentTemplate}"
Content="{TemplateBinding Content}"
ContentStringFormat="{TemplateBinding ContentStringFormat}"
Margin="{TemplateBinding Padding}" />
                                                                                </Grid>
                                                                            </ControlTemplate>
                                                                        </Setter.Value>
                                                                    </Setter>
                                                                </Style>
                                                            </telerik:RadButton.Style>

[Masha]

Hello Christian,

You could modify the RadMenuItemStyle and set different control tempaltes for TopLevelItems. The properties you need to modifies are listed in the code snippet below:

<Setter Property="TopLevelHeaderTemplateKey" Value="{StaticResource CustomMenuItemTemplate}"/>
<Setter Property="TopLevelItemTemplateKey" Value="{StaticResource CustomMenuItemTemplate}"/>

Inside the Custom control template replace Border named HighlightVisual with the ButtonChrome button. Keep in mind you need to modify the VisualStates to match the desired scenario.

Hope it helps.

Regards,
Masha
Telerik