static/cal.css
author Tero Marttila <terom@fixme.fi>
Sat, 08 Jan 2011 23:17:16 +0200
changeset 39 4f331cfc76a4
parent 37 eabea2857143
child 40 30a0a0fa8c54
permissions -rw-r--r--
cal: span events across week's days
/* The calendar uses up all available horizontal width */
table.calendar
{
    width: 100%;
}

/* Each column in the table is approximately the same width */
table.calendar th
{
    width: 14%;
}

/* The prev-month link is on the left edge */
table.calendar a.prev-month
{
    float: left;
}

/* The next-month link is on the right edge */
table.calendar a.next-month
{
    float: right;
}

/* The weekdays-in-week header is fixed-height */
table.calendar thead tr
{
    height: 1em;
}

/* A day's header is a fixed height cell */
table.calendar tbody tr.week-header
{    
    height: 1em;
}

/* The day number is visible inside the header */
table.calendar tbody tr.week-header th
{
    padding-left: 0.5em;

    text-align: left;
}

/* The numbers of days that are a part of the current month are clearly visible */
table.calendar tbody th.in-month
{
    background-color: #eeeeee;
}

/* The numbers of days that are outside the current month are less noticable */
table.calendar tbody th.out-month
{
    background-color: #ffffff;

    color: #888888;
}

/* Each row of day-event-data for a week is fixed height */
table.calendar tbody tr.week-data
{
    height: 1em;
}

/* Each event is visible as its own block */
table.calendar tbody tr.week-data td.event a
{
    display: block;

    background-color: #A6C6E3;

    padding: 4px;

    /* Rounded corner for cosmetic effect */
    border-radius: 4px;
    -moz-border-radius: 6px;
    
    text-align: center;
}

/* Borders ? */
table.calendar tbody td
{
    border: 1px solid #d8d8d8;

    border-style: none solid;
}