diff --git a/src/agenda/agenda.css b/src/agenda/agenda.css index 37143ce..da75e94 100644 --- a/src/agenda/agenda.css +++ b/src/agenda/agenda.css @@ -172,6 +172,36 @@ be a descendant of the grid when it is being dragged. filter: alpha(opacity=25); /* for IE */ } +/* short mode, where time and title are on the same line */ + +.fc-time-grid-event.fc-short .fc-content { + /* don't wrap to second line (now that contents will be inline) */ + white-space: nowrap; +} + +.fc-time-grid-event.fc-short .fc-time, +.fc-time-grid-event.fc-short .fc-title { + /* put the time and title on the same line */ + display: inline-block; + vertical-align: top; +} + +.fc-time-grid-event.fc-short .fc-time span { + display: none; /* don't display the full time text... */ +} + +.fc-time-grid-event.fc-short .fc-time:before { + content: attr(data-start); /* ...instead, display only the start time */ +} + +.fc-time-grid-event.fc-short .fc-time:after { + content: "\000A0-\000A0"; /* seperate with a dash, wrapped in nbsp's */ +} + +.fc-time-grid-event.fc-short .fc-title { + font-size: .85em; /* make the title text the same size as the time */ +} + /* resizer */ .fc-time-grid-event .fc-resizer { diff --git a/src/common/TimeGrid.events.js b/src/common/TimeGrid.events.js index 07d0b1c..283b5d4 100644 --- a/src/common/TimeGrid.events.js +++ b/src/common/TimeGrid.events.js @@ -62,6 +62,12 @@ $.extend(TimeGrid.prototype, { for (i = 0; i < colSegs.length; i++) { seg = colSegs[i]; seg.el.css(this.generateSegPositionCss(seg)); + + // if the height is short, add a className for alternate styling + if (seg.bottom - seg.top < 30) { + seg.el.addClass('fc-short'); + } + containerEl.append(seg.el); } @@ -116,6 +122,7 @@ $.extend(TimeGrid.prototype, { var skinCss = this.getEventSkinCss(event); var timeText; var fullTimeText; // more verbose time text. for the print stylesheet + var startTimeText; // just the start time text classes.unshift('fc-time-grid-event'); @@ -126,11 +133,13 @@ $.extend(TimeGrid.prototype, { if (seg.isStart || seg.isEnd) { timeText = view.getEventTimeText(seg.start, seg.end); fullTimeText = view.getEventTimeText(seg.start, seg.end, 'LT'); + startTimeText = view.getEventTimeText(seg.start, null); } } else { // Display the normal time text for the *event's* times timeText = view.getEventTimeText(event); fullTimeText = view.getEventTimeText(event, 'LT'); + startTimeText = view.getEventTimeText(event.start, null); } return '' + '
' + (timeText ? - '
' + + '
' + '' + htmlEscape(timeText) + '' + '
' : ''