MonoX support board

Start the conversation, ask questions and share tips and solutions with fellow developers.

Non-registered users can only browse through our support boards. Please register now if you want to post your questions. It takes a second and it is completely free. Alternatively, you can log in without registration using your credentials at major sites such as Google, Microsoft Live, OpenId, Facebook, LinkedIn or Yahoo.

EventCalendar  (Mono Support )

Viewed 21376 time(s), 6 post(s) 4/16/2011 1:29:48 PMby Helene
Helene

Helene

4/16/2011 1:29:49 PM
Hi

I like the new EventCalendar very much :)

But it is a little too blue for my site. Where can I change the colors?

Regards
This content has not been rated yet. 
315 Reputation 39 Total posts
khorvat

khorvat

4/16/2011 9:55:49 PM
Hi Helene,

you can find a CSS classes related to the EventCalendar in the MonoX demo css file located here "/App_Themes/Default/Default.css" under the "/**** Event Module Start ****/" section.

To change the event scheduler skin you can use on of the built-in skins that you can set inside the mark-up located here "/MonoX/ModuleGallery/EventModule/EventModule.ascx" (I recommend that you copy the mark-up to your own location and change it there), look for the code below and set the Skin property:

<telerik:RadScheduler ID="schEvent" runat="server" Height="100%"
                            DataKeyField="Id" DataStartField="StartTime" DataEndField="EndTime" DataSubjectField="Title" DataDescriptionField="Description"
                            Skin="Vista" CssClass="event-scheduler" SelectedView="WeekView">
                            </telerik:RadScheduler>

You can find the scheduler available skins here (In the upper right corner you can find the Skin list).

I hope this will get you started.

This content has not been rated yet. 
15993 Reputation 2214 Total posts
Helene

Helene

4/18/2011 7:48:12 AM
Hi khorvat

Thanks for the answer but I can not find the "/**** Event Module Start ****/" in the "/App_Themes/Default/Default.css".!?

Can it be located somewhere else?

- I have the newest version of MonoX installed.

Regards


This content has not been rated yet. 
315 Reputation 39 Total posts
khorvat

khorvat

4/18/2011 8:04:00 AM
Hi Helene,

it is located in that file, here is the css for the Event Module (and I'm attaching the whole css file from latest MonoX version)

/**** Event Module Start ****/
.event-scheduler p
{
    margin:0px;
}
.event-module .calendar
{
    padding-right: 10px;
}
.event-module .calendar .date-marked
{
    background: url(img/date-marked.png) no-repeat;
    border: solid 1px #d5e1ec;
}
.event-module .calendar .add-new-event,
.event-simple-view .add-new-event
{
    width: 220px;
    height: 34px;
    background: url(img/orange-button.png) no-repeat;
    font-size: 14px;
    color: #fff;
    text-align: center;
    line-height: 33px;
    display: block;
    margin-bottom: 5px;
}
.event-module .scheduler
{
     
}
.event-module
{
     
}
.event-module .short-label
{  
    display: block;
}
.event-module INPUT[type="checkbox"]
{
    float: none;
}
.event-details-view
{
    padding: 10px;
}
.event-details-view .title,
.event-simple-content .title
{
    font-size: 14px;
    margin-bottom: 10px;
    font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
    font-size: 14px;
    font-weight: bold;
    color: #DC613F;
}
.event-details-view .date
{
     
}
.event-details-view .options
{
    overflow: hidden;
    margin-top: 10px;
    padding-top: 10px;
    border-top: solid 1px #ddd;
}
.event-details-view .event-content,
.event-simple-content .event-content
{
    margin-top: 10px;
}
.event-details-view .event-content .description,
.event-simple-content .event-content .description
{
    margin-top: 10px;
}
.event-simple-view
{
    overflow: hidden;
    margin-top: 10px;
}
.event-simple-view .top-button-holder
{
    overflow: hidden;
    float: right;
    margin: 0px 0px 10px 0px;
}
.event-simple-view .top-button-holder .date-picker
{
    float: left;
    margin: 3px 0px 0px 0px;
}
.event-simple-view .top-button-holder .styled-button,
.event-simple-view .styled-button
{
    float: left;
}
.event-simple-view .top-button-holder .styled-button .button,
.event-simple-view .styled-button .button
{
    margin: 0px;
}
.event-simple-view .list-view
{
    overflow: hidden;
    clear: both;
}
.event-simple-view .event-simple-content
{
    padding: 10px;
    position: relative;
}
.event-simple-view .item
{
    background: #f4fcff;
    border-bottom: solid 1px #dfeaee;
}
.event-simple-view .item-a
{
    background: #fff;
    border-bottom: solid 1px #dfeaee;
     
}
.event-simple-view .first
{
    border-top: solid 1px #a1b3bd;
}
.event-simple-view .last
{
    border-bottom: solid 1px #a1b3bd;
}
.event-simple-view .event-simple-content .options
{
    position: absolute;
    top: 10px;
    right: 10px;
}
.event-simple-view .event-simple-content .options .edit
{
    width: 16px;
    height: 16px;
    background: url(img/edit-icon.png) no-repeat;
    float: left;
    margin-right: 5px;
}
.event-simple-view .event-simple-content .options .edit:hover
{  
    background: url(img/edit-icon-hover.png) no-repeat;
}
.event-simple-view .event-simple-content .options .delete
{
    width: 16px;
    height: 16px;
    background: url(img/delete-icon.png) no-repeat;
    float: left;
}
.event-simple-view .event-simple-content .options .delete:hover
{
    background: url(img/delete-icon-hover.png) no-repeat;
}
/**** Event Module End ****/
This content has not been rated yet. 
15993 Reputation 2214 Total posts
Helene

Helene

4/18/2011 8:26:05 AM
Hi agaiin.

Thank you so much and I´m very sorry, it was me who had made a mistake.

Regards
This content has not been rated yet. 
315 Reputation 39 Total posts
khorvat

khorvat

4/18/2011 9:31:19 AM
Hi,

np, I'm glad that we have found the "missing" css ;)

Regards
This content has not been rated yet. 
15993 Reputation 2214 Total posts