SharePoint 2010: Custom Calendar Item Style

admin

A small variation of the calendar style provided at labs.steveottenad.com. I made it look like this

SharePoint 2010 Calendar style
Add the following template to ItemStyle.xsl as explained in the above article, including adding the namespace xmlns:ddwrt….:

<div class="item link-item">
<div class="description xslCal">
<div class="left"></div>
<!--/Left-->
<div class="right"><span class="title">
</span></div>
<!--/Right-->

</div>
<!--/description-->

</div>
<!--/item-->

Add this css to your stylesheet (see original article for instructions):

.xslCal .left{ position:relative; float:left; text-align:center}
.xslCal .right span{display:block; margin-left:75px;}
.xslCal .month{text-transform:uppercase; font-weight:bold; background:#71cdf4; color:#fff; padding:2px; float:left;width :30px; display:inline-block; text-align:center }
.xslCal .day{font-size:11px; text-align:center; background:#eee; display:inline-block; width:22px;padding:2px }
.xslCal .title{color:#0775aa; display:block; padding-top:3px; font-family:verdana}