How to change Rad Alert Style

[Amit kumar]

Hi

I want to change radalert style, I am using bellow code to change the style

1. Need to change default  Ok button style
1. Need to change  RadAlert  Tiltle backgorun style


StyleSheet.cs

 

 

 

 

 

 

 

 

.RadWindow

 

 

.rwTitlebar

 

 

 

 

 

 

 

{

 

 

 

background-image: url('Images/pop_bg.gif');

 

 

 

 

 

 

}

 

 

 

 

 

.RadWindow

 

 

.rwTopLeft

 

 

 

 

 

 

 

{

 

 

 

background-image: url('Images/pop_left_curve.gif');

 

 

 

 

}

 

 

 

 

 

.RadWindow

 

 

.rwTopRight

 

 

 

 

 

 

 

{

 

 

 

background-image: url('Images/pop_right_curve.gif');

 

 

 

 

}

 

 

 

 

 

.rwDialogPopup .rwPopupButton

 

 

 

 

 

 

 

{

 

 

 

background-image: url('../save_btn.gif');

 

 

 

 

background-repeat: no-repeat;

 

 

}

aspx

 

 

<telerik:RadWindowManager ID="RadWindowManager1" runat="server"

 

 

 

 

EnableEmbeddedSkins="False" EnableTheming="True">

 

 

 

 

</telerik:RadWindowManager>

 

[Georgi Tunev]

Hello Amit,

Your CSS looks OK, but note that in order to override the default values, you need to use the !important directive or to make the selector heavier.

e.g.

.RadWindow .rwTitlebar
{
    background-image: url('Images/pop_bg.gif') !important;
}

.RadWindow .rwTopLeft
{
    background-image: url('Images/pop_left_curve.gif') !important;
}

.RadWindow .rwTopRight
{
    background-image: url('Images/pop_right_curve.gif') !important;
}

.rwDialogPopup .rwPopupButton
{
    background-image: url('../save_btn.gif') !important;
    background-repeat: no-repeat;
}

Regards,
Georgi Tunev
the Telerik team

[Ashwnai]

i have a aspx page where there are 2 rad alert box .
if sucess it will show box1
if error it will show box 2
i have changed the icon of alert with green ok sign ,but want to change the bg-image og 
error alert box ,how can it possible please help me ..please 
trying to give class but not working like this 
.newClass
{
    background-image: url("../Images/SuccessIcon.png") !important;/*adding image in radalert*/
}

[Marin Bratanov]

Hello Ashwnai,

You would need to apply this class to the popup in order for it to take effect. In case you are using JavaScript to show the alerts you can do this with one line of code. If you are using the code-behind methods perhaps an easier solution would be to add a second manager with the desired template set and use its own client-side API to call the second alert. This approach is also applicable for JavaScript as well. For your convenience I am attaching here simple examples that show how modifications can be made in both manners.


Regards,
Marin Bratanov
the Telerik team