mirror of
https://github.com/EGroupware/egroupware.git
synced 2024-11-30 11:53:57 +01:00
470 lines
6.4 KiB
CSS
470 lines
6.4 KiB
CSS
/* CSS Document */
|
|
|
|
/*
|
|
* CSS settings for the new uiviews code
|
|
*/
|
|
|
|
/* timeGridWidget, contains timeRow's and dayCol's
|
|
*/
|
|
.calTimeGrid{
|
|
position: relative;
|
|
top: 0px;
|
|
left: 0px;
|
|
border:1px solid gray;
|
|
margin-top: 20px; /* contains the dayColHeader */
|
|
/* set via inline style on runtime:
|
|
* width:
|
|
*/
|
|
}
|
|
|
|
/* single row in the time-line, always used in conjunction with row_{on|off}, you dont need to set a bgcolor, but you can
|
|
*/
|
|
.calTimeRow,.calTimeRowOff{
|
|
position: relative;
|
|
width: 100%;
|
|
/* set via inline style on runtime:
|
|
* height:
|
|
*/
|
|
}
|
|
.calTimeRow{
|
|
/* background-color: silver; */
|
|
}
|
|
|
|
/* time in a timeRow
|
|
*/
|
|
.calTimeRowTime{
|
|
padding-left: 5px;
|
|
height: 100%;
|
|
}
|
|
|
|
/* contains (multiple) dayCol's
|
|
*/
|
|
.calDayCols{
|
|
position: absolute;
|
|
top: 0px;
|
|
height: 100%;
|
|
/* set via inline style on runtime:
|
|
* left: width(calTimeRowTime)
|
|
* width: 100% - width(calTimeRowTime)
|
|
*/
|
|
}
|
|
|
|
/* contains (multiple) eventCol's
|
|
*/
|
|
.calDayCol{
|
|
position: absolute;
|
|
top: 0px;
|
|
height: 100%;
|
|
/* set via inline style on runtime:
|
|
* left:
|
|
* width:
|
|
*/
|
|
border-left: 1px solid gray;
|
|
}
|
|
|
|
/* header for the dayCol
|
|
*/
|
|
.calDayColHeader,.calGridHeader{
|
|
position: absolute;
|
|
top: -20px;
|
|
width: 100%;
|
|
text-align: center;
|
|
font-size: 100%;
|
|
white-space: nowrap;
|
|
border: 1px solid gray;
|
|
height: 16px;
|
|
left: -1px;
|
|
padding-top: 2px;
|
|
}
|
|
.calToday{
|
|
background: #ffffcc;
|
|
}
|
|
.calHoliday{
|
|
background: #dac0c0;
|
|
}
|
|
|
|
.calViewUserNameBox {
|
|
position: absolute;
|
|
top: -1px;
|
|
width: 95%;
|
|
text-align: left;
|
|
font-size: 120%;
|
|
white-space: nowrap;
|
|
border: 1px solid gray;
|
|
height: 17px;
|
|
left: -1px;
|
|
padding-top: 0px;
|
|
padding-left: 10px;
|
|
background: #dac0c0;
|
|
}
|
|
.calViewUserName {
|
|
font-weight: normal;
|
|
}
|
|
.calViewUserName:first-letter {
|
|
text-transform:uppercase;
|
|
}
|
|
.calViewUserNameFirst {
|
|
}
|
|
.calViewUserNameFirst:after {
|
|
content: ", ";
|
|
}
|
|
|
|
/* header of the time-grid, eg. for the weeks in the month-view (leftmost of the day-col-headers)
|
|
*/
|
|
.calGridHeader{
|
|
text-align: left;
|
|
padding-left: 3px;
|
|
}
|
|
|
|
/* contains (multiple) events's
|
|
*/
|
|
.calEventCol{
|
|
position: absolute;
|
|
top: 0px;
|
|
height: 100%;
|
|
/* set via inline style on runtime:
|
|
* left:
|
|
* width:
|
|
*/
|
|
/* border: 1px dotted red; */
|
|
}
|
|
|
|
/* contains one event: header-row & -body
|
|
*/
|
|
.calEvent,.calEvent:hover{
|
|
position: absolute;
|
|
/* background-color: #ffffC0;*/
|
|
left: 0px;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
/* set via inline style on runtime:
|
|
* top: depending on startime
|
|
* top: depending on length
|
|
*/
|
|
}
|
|
.calEvent:hover{
|
|
/* background-color: #ffff80;*/
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
}
|
|
|
|
/* header-row of the event
|
|
*/
|
|
.calEventHeader,.calEventHeaderSmall{
|
|
font-weight: bold;
|
|
font-size: 14px;
|
|
background-color: #0000ff;
|
|
color: white;
|
|
text-align: center;
|
|
white-space: nowrap;
|
|
}
|
|
.calEventHeaderSmall{
|
|
font-size: 10px;
|
|
}
|
|
|
|
/* body of the event
|
|
*/
|
|
.calEventBody,.calEventBodySmall{
|
|
padding: 0px 3px 0px;
|
|
}
|
|
|
|
.calEventBodySmall{
|
|
font-size: 95%;
|
|
}
|
|
|
|
.calEventLabel
|
|
{
|
|
font-weight: bold;
|
|
font-size: 90%;
|
|
}
|
|
|
|
.calEventTitle
|
|
{
|
|
font-weight: bold;
|
|
font-size: 110%;
|
|
}
|
|
|
|
/* cal day-view's todo column
|
|
*/
|
|
.calDayToDos {
|
|
width: 250px;
|
|
text-align: center;
|
|
}
|
|
/* header row
|
|
*/
|
|
.calDayTodos .calDayTodosHeader {
|
|
margin: 0px;
|
|
padding: 2px;
|
|
font-weight: bold;
|
|
}
|
|
/* div containing the table with the ToDo's
|
|
*/
|
|
.calDayTodos .calDayTodosTable {
|
|
overflow: auto;
|
|
max-height: 400px;
|
|
}
|
|
|
|
/*
|
|
* From here on, settings for the "old" uicalendar code
|
|
*/
|
|
.to_continue
|
|
{
|
|
font-size: 9px;
|
|
}
|
|
|
|
A.minicalendar
|
|
{
|
|
color: #000000;
|
|
font-size: 9px;
|
|
|
|
}
|
|
|
|
A.bminicalendar
|
|
{
|
|
color: #336699;
|
|
font-style: italic;
|
|
font-weight: bold;
|
|
font-size: 9px;
|
|
}
|
|
|
|
A.minicalendargrey
|
|
{
|
|
color: #999999;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
A.bminicalendargrey
|
|
{
|
|
color: #336699;
|
|
font-style: italic;
|
|
font-size:10px;
|
|
}
|
|
|
|
A.minicalhol
|
|
{
|
|
padding-left:3px;
|
|
padding-right:3px;
|
|
background: #dab0b0;
|
|
color: #000000;
|
|
font-size: 10px;
|
|
}
|
|
|
|
A.bminicalhol
|
|
{
|
|
padding-left:3px;
|
|
padding-right:3px;
|
|
background: #dab0b0;
|
|
color: #336699;
|
|
font-size: 10px;
|
|
}
|
|
|
|
A.minicalgreyhol
|
|
{
|
|
padding-left:3px;
|
|
padding-right:3px;
|
|
background: #dab0b0;
|
|
color: #999999;
|
|
font-size: 10px;
|
|
}
|
|
|
|
A.bminicalgreyhol
|
|
{
|
|
padding-left:3px;
|
|
padding-right:3px;
|
|
background: #dab0b0;
|
|
color: #999999;
|
|
font-size: 10px;
|
|
}
|
|
|
|
|
|
.event-on
|
|
{
|
|
background: #D3DCE3;
|
|
border: #E8F0F0 1px solid;
|
|
}
|
|
|
|
.event-off
|
|
{
|
|
background: #E8F0F0;
|
|
border: #D3DCE3 1px solid;
|
|
}
|
|
|
|
.event-holiday
|
|
{
|
|
font-size: 100%;
|
|
background: #dac0c0;
|
|
color:#000000;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.time
|
|
{
|
|
background: #D3DCE3;
|
|
color:#000000;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
vertical-align: middle;
|
|
width: 5.2%;
|
|
text-align: right;
|
|
padding-right: 5px;
|
|
line-height: 11px;
|
|
border: #E8F0F0 1px solid;
|
|
}
|
|
|
|
|
|
.planner-cell
|
|
{
|
|
cursor: pointer;
|
|
cursor: hand;
|
|
border: thin solid black;
|
|
}
|
|
|
|
/* common */
|
|
.calendar_link_print
|
|
{
|
|
text-align: center;
|
|
font-size: 10px;
|
|
}
|
|
|
|
//Mini Calendar
|
|
|
|
.calendar_minical_table
|
|
{
|
|
width: 180px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.calendar_minical_daytable
|
|
{
|
|
width: 100%;
|
|
}
|
|
|
|
.calendar_minical_dayname
|
|
{
|
|
font-size: 9px;
|
|
text-align: right;
|
|
}
|
|
|
|
.calendar_minical_hrule
|
|
{
|
|
width: 96%;
|
|
}
|
|
|
|
/* Header */
|
|
.calendar_dropbuttons
|
|
{
|
|
align: center;
|
|
text-align: center;
|
|
vertical-align: bottom;
|
|
font-weight: bold;
|
|
font-size: 8px;
|
|
}
|
|
|
|
.calendar-weekidentifier
|
|
{
|
|
font-size:16px;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
|
|
.calendar_header
|
|
{
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
|
|
.calendar_dayview_table_header
|
|
{
|
|
font-size: 13px;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
|
|
.calendar_dayview_todo_header
|
|
{
|
|
margin: 0px;
|
|
padding: 2px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
/* week view */
|
|
.calendar_week_identifier_table
|
|
{
|
|
border: 0px solid black;
|
|
width: 100%;
|
|
}
|
|
|
|
.calendar_week_identifier
|
|
{
|
|
font-size: 13px;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.calendar_weekview_daytitle
|
|
{
|
|
font-weight: bold;
|
|
font-size: 12px;
|
|
background: #D3DCE3;
|
|
}
|
|
|
|
.calendar_m_w_table
|
|
{
|
|
table-layout:fixed;
|
|
overflow:auto;
|
|
height: 100%;
|
|
width: 100%;
|
|
border: 0px #000000 solid;
|
|
}
|
|
|
|
.calendar_m_w_table_row
|
|
{
|
|
height: 80px;
|
|
}
|
|
|
|
.calendar_m_w_tablecell
|
|
{
|
|
vertical-align: top;
|
|
padding-left: 4px;
|
|
padding-right: 4px;
|
|
padding-bottom: 6px;
|
|
}
|
|
|
|
A.event_entry
|
|
{
|
|
font-size:10px;
|
|
}
|
|
|
|
/* month view */
|
|
|
|
.calendar_month_identifier
|
|
{
|
|
font-size:14px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.calendar_user_identifier
|
|
{
|
|
font-size:12px;
|
|
color: #009999;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.calendar_week_minical_table
|
|
{
|
|
width:100%;
|
|
border: 0px solid #000000
|
|
}
|
|
|
|
.calendar_weekinfo
|
|
{
|
|
color: #000000;
|
|
padding-left: 2px;
|
|
padding-right: 2px;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
font-style: italic;
|
|
}
|