v65:eventToday

<v65:eventToday></v65:eventToday>

Description: Outputs events for today and allows you to move back and forth using a block style calendar.

Options:

hasCalendar: adds a block style calendar to move months

default="0"
usage: <v65:eventToday hasCalendar="1"></v65:eventToday>

calendar: by default the widget shows events from all calendars but set the calendar to specify a single calendar.

default=""
usage: <v65:eventToday calendar="My Calendar"></v65:eventToday>

showWithNoEvents: shows even if there are no events

default="1"
usage: <v65:eventToday showWithNoEvents="0"></v65:eventToday>

HTML Output:

<div class="v65-event-today v65-group">
     <div class="v65-event-date">Friday July 13, 2012</div>
     <div class="v65-event-title">Today's Schedule</div>
     <div class="v65-event-events">
          <div class="v65-event-events-event">
              <div class="v65-event-events-event-time">2:05 PM</div>
              <div class="v65-event-events-event-title"><a href="EventLink">Wine Tasting</a></div> 
         </div>
     </div>
</div>

<div class="v65-event-calendar v65-group">

     <div class="v65-event-calendar-nav">
          <a href="link">«</a>
          <span class="v65-event-calendar-nav-title">Jul 2012</span>
          <a href="link">»</a>
     </div>

     <table cellpadding="0" cellspacing="0">
          <tbody>

          <tr>
               <th>S</th>
               <th>M</th>
               <th>T</th>
               <th>W</th>
               <th>T</th>
               <th>F</th>
               <th>S</th>
         </tr>
  
         <tr valign="top">
              <td>1</td>
              <td>2</td>
              <td>3</td>
              <td>4</td>
              <td>5</td>
              <td>6</td>
              <td>7</td>
         </tr>

         <tr valign="top">
              <td>8</td>
              <td>9</td>
              <td>10</td>
              <td>11</td>
              <td><a href="link">12</a></td>
              <td class="v65-event-calendar-today"><a href="link">13</a></td>
              <td>14</td>
         </tr>

         <tr valign="top">
              <td>15</td>
              <td>16</td>
              <td>17</td>
              <td>18</td>
              <td>19</td>
              <td>20</td>
              <td>21</td>
         </tr>

         <tr valign="top">
              <td>22</td>
              <td>23</td>
              <td>24</td>
              <td>25</td>
              <td>26</td>
              <td>27</td>
              <td>28</td>
         </tr>

         <tr valign="top">
               <td>29</td>
               <td>30</td>
               <td>31</td>
               <td class="v65-event-calendar-offMonth">1</td>
               <td class="v65-event-calendar-offMonth">2</td>
               <td class="v65-event-calendar-offMonth">3</td>
               <td class="v65-event-calendar-offMonth">4</td>
          </tr>

          </tbody>
     </table>
</div>

CSS Styles:

/* -----Event Today----- */
.v65-event-today { text-align: center; }
     .v65-event-date {  }
     .v65-event-title { font-weight: bold; margin-bottom: 1em; }
 
    .v65-event-events {  }
        .v65-event-events-event { margin-bottom: 1em; }
        .v65-event-events-event-time { display: inline-block; margin-right: 5px; }
        .v65-event-events-event-title { display: inline-block; }
  
/* -----Event Today With Calendar----- */
.v65-event-calendar { margin-bottom: 1em; }

    .v65-event-calendar-nav { font-weight: bold; text-align: center; }
    .v65-event-calendar-nav-title {  }
 
    .v65-event-calendar table { border-top: 1px solid #999; border-right: 1px solid #999; width: 100%; margin: 0 auto; font-size: 0.897em; }
    .v65-event-calendar th { border-bottom: 1px solid #999; border-left: 1px solid #999; padding: 1px; font-weight: bold; text-align: center; padding: 0; color: #fff; background-color: #666; }
    .v65-event-calendar td { border-bottom: 1px solid #999; border-left: 1px solid #999; padding: 1px; text-align: center; width: 14%; }
 
    .v65-event-calendar .v65-CalendarDay { float: right; width: 15px; height: 15px; padding: 0 2px 2px 2px; border-left: 1px solid #999; border-bottom: 1px solid #999; text-align:right; font-size: 0.917em; color:#869fc3; clear: both; }
    .v65-event-calendar .v65-CalendarToDay { background-color: #ccc; }
    .v65-event-calendar .v65-CalendarOffMonthDays { background-color: #eee; }
    .v65-event-calendar .v65-CalendarEvent { clear: both; padding: 0px 0px 8px 0px; font-size: 0.917em; }
    .v65-event-calendar .v65-CalendarEvent a { }