From 2455b7176d627d60031610ea59007d1715ef8496 Mon Sep 17 00:00:00 2001 From: nathangray Date: Mon, 22 Feb 2021 10:02:27 -0700 Subject: [PATCH] Calendar: Make events nicer for screen readers --- calendar/js/et2_widget_event.js | 14 +-- calendar/js/et2_widget_event.ts | 14 +-- calendar/templates/default/app.css | 3 + calendar/templates/pixelegg/app.css | 127 ++++++++++++++-------------- 4 files changed, 86 insertions(+), 72 deletions(-) diff --git a/calendar/js/et2_widget_event.js b/calendar/js/et2_widget_event.js index 9d2d5fcc2b..68ca793010 100644 --- a/calendar/js/et2_widget_event.js +++ b/calendar/js/et2_widget_event.js @@ -237,6 +237,7 @@ var et2_calendar_event = /** @class */ (function (_super) { // Let timegrid always get the drag .droppable('option', 'greedy', false); } + var tooltip = jQuery(this._tooltip()).text(); // DOM nodes this.div // Set full day flag @@ -250,6 +251,9 @@ var et2_calendar_event = /** @class */ (function (_super) { .attr('data-recur_type', event.recur_type) .attr('data-resize', event.whole_day ? 'WD' : '' + (event.recur_type ? 'S' : '')) .attr('data-priority', event.priority) + // Accessibility + .attr("tabindex", 0) + .attr("aria-label", tooltip) // Remove any category classes .removeClass(function (index, css) { return (css.match(/(^|\s)cat_\S+/g) || []).join(' '); @@ -437,24 +441,24 @@ var et2_calendar_event = /** @class */ (function (_super) { } for (var type_name in this.options.value.participant_types) { if (type_name) { - participants += '

' + type_name + ':
'; + participants += '

' + type_name + ':
'; participants += this.options.value.participant_types[type_name].join("
"); } } return '

' + '
' + - '' + timespan + '' + + '' + timespan + '' + this.icons[0].outerHTML + '
' + '
' + '

' + - '' + egw.htmlspecialchars(this.options.value.title) + '
' + + '

' + egw.htmlspecialchars(this.options.value.title) + '


' + egw.htmlspecialchars(this.options.value.description) + '

' + '

' + times + '

' + location + - (cat_label ? '

' + this.egw().lang('Category') + ':' + cat_label + '

' : '') + - '

' + this.egw().lang('Participants') + ':
' + + (cat_label ? '

' + this.egw().lang('Category') + ':

' + cat_label + '

' : '') + + '

' + this.egw().lang('Participants') + ':


' + participants + '

' + this._participant_summary(this.options.value.participants) + '
' + '
'; diff --git a/calendar/js/et2_widget_event.ts b/calendar/js/et2_widget_event.ts index b6a843bfef..73d6affb46 100644 --- a/calendar/js/et2_widget_event.ts +++ b/calendar/js/et2_widget_event.ts @@ -302,6 +302,7 @@ export class et2_calendar_event extends et2_valueWidget implements et2_IDetached // Let timegrid always get the drag .droppable('option','greedy',false); } + let tooltip = jQuery(this._tooltip()).text(); // DOM nodes this.div // Set full day flag @@ -316,6 +317,9 @@ export class et2_calendar_event extends et2_valueWidget implements et2_IDetached .attr('data-recur_type', event.recur_type) .attr('data-resize', event.whole_day ? 'WD' : '' + (event.recur_type ? 'S':'')) .attr('data-priority', event.priority) + // Accessibility + .attr("tabindex",0) + .attr("aria-label", tooltip) // Remove any category classes .removeClass(function(index, css) { return (css.match (/(^|\s)cat_\S+/g) || []).join(' '); @@ -557,7 +561,7 @@ export class et2_calendar_event extends et2_valueWidget implements et2_IDetached { if(type_name) { - participants += '

'+type_name+':
'; + participants += '

'+type_name+':
'; participants += this.options.value.participant_types[type_name].join("
"); } } @@ -565,17 +569,17 @@ export class et2_calendar_event extends et2_valueWidget implements et2_IDetached return '

'+ '
'+ - ''+timespan+''+ + ''+timespan+''+ this.icons[0].outerHTML+ '
'+ '
'+ '

'+ - ''+egw.htmlspecialchars(this.options.value.title)+'
'+ + '

'+egw.htmlspecialchars(this.options.value.title)+'


'+ egw.htmlspecialchars(this.options.value.description)+'

'+ '

'+times+'

'+ location + - (cat_label ? '

'+this.egw().lang('Category') + ':' + cat_label +'

' : '')+ - '

'+this.egw().lang('Participants')+':
'+ + (cat_label ? '

'+this.egw().lang('Category') + ':

' + cat_label +'

' : '')+ + '

'+this.egw().lang('Participants')+':


'+ participants + '

'+ this._participant_summary(this.options.value.participants) + '
'+ '
'; diff --git a/calendar/templates/default/app.css b/calendar/templates/default/app.css index 9233aacc8b..f142bfc459 100644 --- a/calendar/templates/default/app.css +++ b/calendar/templates/default/app.css @@ -917,10 +917,13 @@ Hide subsequent headers in week view with non-consolidated owners .calendar_calEventLabel{ font-weight: bold; font-size: 90%; + display:inline; } .calendar_calEventTitle{ font-weight: bold; + font-size:100%; + display:inline; } /* Event is too small for full display */ diff --git a/calendar/templates/pixelegg/app.css b/calendar/templates/pixelegg/app.css index 5f9a4c95c6..f1cf8248ea 100755 --- a/calendar/templates/pixelegg/app.css +++ b/calendar/templates/pixelegg/app.css @@ -383,13 +383,13 @@ Hide subsequent headers in week view with non-consolidated owners top: 2em; } #calendar-view_view.hideDayColHeader tr:first-of-type .calendar_calGridHeader .calendar_calDayColHeader_spacer { - height: calc(1.5em + 32px); + height: calc(33.5em); } #calendar-view_view.hideDayColHeader tr .calendar_calGridHeader > span.et2_label { white-space: nowrap; display: block; position: static; - width: calc(100% - 58px); + width: calc(42%); margin-left: 58px; color: white; background-color: #2D6393; @@ -899,9 +899,12 @@ Hide subsequent headers in week view with non-consolidated owners .calendar_calEventLabel { font-weight: bold; font-size: 90%; + display: inline; } .calendar_calEventTitle { font-weight: bold; + font-size: 100%; + display: inline; } /* Event is too small for full display */ .calendar_calTimeGrid:not(.calendar_calTimeGridList) .calendar_calEventSmall[data-visible_lines='1'] .calendar_calTimespan { @@ -1632,13 +1635,13 @@ img.sideboxstar:active { .calendar_calEventBodySmall img[src$="svg"], .calendar_calDayColHeader img[src$="svg"] { background-color: #0c5da5; - background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjMEM1REE1IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjMEM1REE1IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=); - background-image: -moz-linear-gradient(top, #0C5DA5, #0C5DA5); - background-image: -ms-linear-gradient(top, #0C5DA5, #0C5DA5); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0C5DA5), to(#0C5DA5)); - background-image: -webkit-linear-gradient(top, #0C5DA5, #0C5DA5); - background-image: -o-linear-gradient(top, #0C5DA5, #0C5DA5); - background-image: linear-gradient(top, #0C5DA5, #0C5DA5); + background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjMGM1ZGE1IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjMGM1ZGE1IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=); + background-image: -moz-linear-gradient(top, #0c5da5, #0c5da5); + background-image: -ms-linear-gradient(top, #0c5da5, #0c5da5); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0c5da5), to(#0c5da5)); + background-image: -webkit-linear-gradient(top, #0c5da5, #0c5da5); + background-image: -o-linear-gradient(top, #0c5da5, #0c5da5); + background-image: linear-gradient(top, #0c5da5, #0c5da5); background-repeat: repeat-x; } /* calender view*/ @@ -1662,26 +1665,26 @@ div.calendar { /* They are the navigation buttons */ padding: 2px; /* Make the buttons seem like they're pressing */ - background-color: #FFDD73; + background-color: #ffdd73; } .calendar .nav { /*background: url(../images/menuarrow.png) no-repeat 100% 100%;*/ background-image: none; - background-color: #FFDD73; + background-color: #ffdd73; } .calendar thead .title { /* This holds the current "month, year" */ font-weight: bold; /* Pressing it will take you to the current date */ /*text-align: center;*/ - background-color: #679FD2; + background-color: #679fd2; } .calendar thead .title:hover { - background-color: #E6E6E6 !important; + background-color: #e6e6e6 !important; } .calendar thead .headrow { /* Row containing navigation buttons */ - background-color: #FFDD73; + background-color: #ffdd73; color: #fff; } .calendar thead .daynames { @@ -1711,7 +1714,7 @@ div.calendar { } .calendar thead .active { /* Active (pressed) buttons in header */ - background_color: #408DD2; + background_color: #408dd2; /*padding: 2px 0px 0px 2px;*/ } .calendar tbody tr, @@ -1756,7 +1759,7 @@ div.calendar { /*border: 0px solid @gray_50;*/ /*padding: 1px 3px 1px 1px;*/ /*padding: 0px;*/ - background-color: #FFDD73; + background-color: #ffdd73; color: #000; -webkit-box-shadow: inset 1px 2px 1px #000000; -moz-box-shadow: inset 1px 2px 1px #000000; @@ -1938,7 +1941,7 @@ div.calendar { box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); } #calendar-edit #calendar-edit_calendar-edit-details #calendar-edit_details_alarms { - background-color: #CDCDCD; + background-color: #cdcdcd; display: block !important; } #calendar-edit #calendar-edit_calendar-edit-description #calendar-edit_details_category { @@ -1956,7 +1959,7 @@ div.calendar { } #calendar-edit #calendar-edit_calendar-edit-description #calendar-edit_category { border: 1px solid; - border-color: #B4B4B4; + border-color: #b4b4b4; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; @@ -2063,10 +2066,10 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget */ .calendar_calToday, .calendar_calTimeGrid .calendar_calDayColHeader .calendar_calToday.et2_link.et2_clickable { - background-color: #FFDD73; + background-color: #ffdd73; } .calendar_calWeek { - background-color: #FFFFFF; + background-color: #ffffff; width: auto; margin: 0 auto; text-align: center; @@ -2074,7 +2077,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget } .calendar_calMonth { /*.background_table_cal_head;*/ - background-color: #FFFFFF; + background-color: #ffffff; width: auto; margin: 0 auto; text-align: center; @@ -2182,12 +2185,12 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget * border-color: depending on category * background: depending on category (shade) */ - background-color: #679FD2; + background-color: #679fd2; border-top: 1px solid; } .calendar_calEvent:not([class*=" cat_"]) { /* Defaults for no category, so we don't override it */ - background-color: #679FD2; + background-color: #679fd2; } /** * All participants accepted the invitation @@ -2203,7 +2206,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget overflow: auto; } .calendar_calDayColHeader .calendar_calAddEvent:hover { - background-color: #FFDD73; + background-color: #ffdd73; cursor: pointer; color: #ffffff; } @@ -2228,7 +2231,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget position: absolute; right: 0px; top: 0px; - background-color: #E6E6E6; + background-color: #e6e6e6; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; @@ -2250,13 +2253,13 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget } .calendar_calDayTodos .calendar_calDayTodosHeader a img[src$="svg"] { background-color: #0c5da5; - background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjMEM1REE1IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjMEM1REE1IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=); - background-image: -moz-linear-gradient(top, #0C5DA5, #0C5DA5); - background-image: -ms-linear-gradient(top, #0C5DA5, #0C5DA5); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0C5DA5), to(#0C5DA5)); - background-image: -webkit-linear-gradient(top, #0C5DA5, #0C5DA5); - background-image: -o-linear-gradient(top, #0C5DA5, #0C5DA5); - background-image: linear-gradient(top, #0C5DA5, #0C5DA5); + background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjMGM1ZGE1IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjMGM1ZGE1IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=); + background-image: -moz-linear-gradient(top, #0c5da5, #0c5da5); + background-image: -ms-linear-gradient(top, #0c5da5, #0c5da5); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0c5da5), to(#0c5da5)); + background-image: -webkit-linear-gradient(top, #0c5da5, #0c5da5); + background-image: -o-linear-gradient(top, #0c5da5, #0c5da5); + background-image: linear-gradient(top, #0c5da5, #0c5da5); background-repeat: repeat-x; } .calendar_calDayTodos .calendar_calDayTodosHeader a img { @@ -2277,7 +2280,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget -moz-transition-timing-function: linear; -o-transition-timing-function: linear; transition-timing-function: linear; - background-color: #E6E6E6; + background-color: #e6e6e6; width: 16px; height: 16px; } @@ -2288,7 +2291,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget background-color: inherit; } .calendar_calDayTodos .calendar_calDayTodosTable table tr:nth-child(even) { - background: #FFFFFF; + background: #ffffff; } .calendar_calDayTodos .calendar_calDayTodosTable table tr:nth_child(odd) { background: #f2f2f2; @@ -2298,13 +2301,13 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget } .calendar_calDayTodos .calendar_calDayTodosTable table td img[src$="svg"] { background-color: #0c5da5; - background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjMEM1REE1IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjMEM1REE1IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=); - background-image: -moz-linear-gradient(top, #0C5DA5, #0C5DA5); - background-image: -ms-linear-gradient(top, #0C5DA5, #0C5DA5); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0C5DA5), to(#0C5DA5)); - background-image: -webkit-linear-gradient(top, #0C5DA5, #0C5DA5); - background-image: -o-linear-gradient(top, #0C5DA5, #0C5DA5); - background-image: linear-gradient(top, #0C5DA5, #0C5DA5); + background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjMGM1ZGE1IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjMGM1ZGE1IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=); + background-image: -moz-linear-gradient(top, #0c5da5, #0c5da5); + background-image: -ms-linear-gradient(top, #0c5da5, #0c5da5); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0c5da5), to(#0c5da5)); + background-image: -webkit-linear-gradient(top, #0c5da5, #0c5da5); + background-image: -o-linear-gradient(top, #0c5da5, #0c5da5); + background-image: linear-gradient(top, #0c5da5, #0c5da5); background-repeat: repeat-x; } .calendar_calDayTodos .calendar_calDayTodosTable table td img { @@ -2473,7 +2476,7 @@ button#series { -moz-transition-timing-function: linear; -o-transition-timing-function: linear; transition-timing-function: linear; - background-color: #E6E6E6; + background-color: #e6e6e6; padding-left: 30px; background-position: 6px center; background-repeat: no-repeat; @@ -2483,13 +2486,13 @@ button#series { } button#series img[url*="svg"] { background-color: #b4b4b4; - background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=); - background-image: -moz-linear-gradient(top, #B4B4B4, #B4B4B4); - background-image: -ms-linear-gradient(top, #B4B4B4, #B4B4B4); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#B4B4B4), to(#B4B4B4)); - background-image: -webkit-linear-gradient(top, #B4B4B4, #B4B4B4); - background-image: -o-linear-gradient(top, #B4B4B4, #B4B4B4); - background-image: linear-gradient(top, #B4B4B4, #B4B4B4); + background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjYjRiNGI0IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjYjRiNGI0IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=); + background-image: -moz-linear-gradient(top, #b4b4b4, #b4b4b4); + background-image: -ms-linear-gradient(top, #b4b4b4, #b4b4b4); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b4b4b4), to(#b4b4b4)); + background-image: -webkit-linear-gradient(top, #b4b4b4, #b4b4b4); + background-image: -o-linear-gradient(top, #b4b4b4, #b4b4b4); + background-image: linear-gradient(top, #b4b4b4, #b4b4b4); background-repeat: repeat-x; fill: red; } @@ -2526,7 +2529,7 @@ button#exception { -moz-transition-timing-function: linear; -o-transition-timing-function: linear; transition-timing-function: linear; - background-color: #E6E6E6; + background-color: #e6e6e6; padding-left: 30px; background-position: 6px center; background-repeat: no-repeat; @@ -2536,13 +2539,13 @@ button#exception { } button#exception img[url*="svg"] { background-color: #b4b4b4; - background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=); - background-image: -moz-linear-gradient(top, #B4B4B4, #B4B4B4); - background-image: -ms-linear-gradient(top, #B4B4B4, #B4B4B4); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#B4B4B4), to(#B4B4B4)); - background-image: -webkit-linear-gradient(top, #B4B4B4, #B4B4B4); - background-image: -o-linear-gradient(top, #B4B4B4, #B4B4B4); - background-image: linear-gradient(top, #B4B4B4, #B4B4B4); + background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjYjRiNGI0IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjYjRiNGI0IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=); + background-image: -moz-linear-gradient(top, #b4b4b4, #b4b4b4); + background-image: -ms-linear-gradient(top, #b4b4b4, #b4b4b4); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b4b4b4), to(#b4b4b4)); + background-image: -webkit-linear-gradient(top, #b4b4b4, #b4b4b4); + background-image: -o-linear-gradient(top, #b4b4b4, #b4b4b4); + background-image: linear-gradient(top, #b4b4b4, #b4b4b4); background-repeat: repeat-x; fill: red; } @@ -2606,22 +2609,22 @@ div#calendar-container div.calendar table { font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif; } div#calendar-container div.calendar table thead .button { - background-color: #FFDD73; + background-color: #ffdd73; } div#calendar-container div.calendar table thead .title { border: none; box-shadow: none; -webkit-box-shadow: none; - background-color: #FFDD73; + background-color: #ffdd73; } div#calendar-container div.calendar table thead .headrow { - color: #1E1E1E; + color: #1e1e1e; } div#calendar-container div.calendar table thead .headrow td { background-color: #ffc200; } div#calendar-container div.calendar table thead .daynames { - background-color: #679FD2; + background-color: #679fd2; } div#calendar-container div.calendar table tbody tr.daysrow:hover { background-color: #ffc200; @@ -2650,7 +2653,7 @@ div#calendar-container div.calendar table tbody tr.rowhilite td { box-shadow: none; } #calendar-sidebox_date .ui-datepicker-today { - background-color: #FFDD73; + background-color: #ffdd73; } #calendar-sidebox_date .ui-datepicker-calendar .ui-state-hover { background-color: rgba(153, 204, 255, 0.4);