diff options
Diffstat (limited to 'assets/css/fullcalendar/custom.css')
| -rw-r--r-- | assets/css/fullcalendar/custom.css | 172 |
1 files changed, 172 insertions, 0 deletions
diff --git a/assets/css/fullcalendar/custom.css b/assets/css/fullcalendar/custom.css new file mode 100644 index 0000000..7b38b49 --- /dev/null +++ b/assets/css/fullcalendar/custom.css @@ -0,0 +1,172 @@ +/* +This is the Material Design theme for FullCalendar Weekly Agenda view +Creation Date: Aug 19th 2015 +Author: Jacky Liang +Version: FullCalendar 2.4.0 +Tested Using the Following FC Settings: + editable: false, + handleWindowResize: true, + weekends: false, // Hide weekends + defaultView: 'agendaWeek', // Only show week view + header: false, // Hide buttons/titles + minTime: '07:30:00', // Start time for the calendar + maxTime: '22:00:00', // End time for the calendar + columnFormat: { + week: 'ddd' // Only show day of the week names + }, + displayEventTime: true, + allDayText: 'Online/TBD' +Note: This has NOT been tested on Monthly or Daily views. +Colors: Use the following - https://www.google.com/design/spec/style/color.html#color-color-palette + at the 700 level. An opacity of 0.65 is automatically applied to the + 700 level colors to generate a soft and pleasing look. + Color were applied to each event using the following code: + events.push({ + title: 'This is a Material Design event!', + start: 'someStartDate', + end: 'someEndDate', + color: '#C2185B' + }); +*/ + +/* Remove scroll bar */ + +.fc-scroller { + overflow-y: hidden !important; +} + +/* Remove that awful yellow color and border from today in Schedule */ + +.fc-state-highlight { + opacity: 0; + border: none; +} + +#calendar>div.fc-toolbar.fc-header-toolbar>div.fc-right>button.fc-today-button.fc-button.fc-button-primary { + display: none !important; +} + +/* Styling for each event from Schedule */ + +.fc-time-grid-event.fc-v-event.fc-event { + border-radius: 4px; + border: none; + padding: 5px; + opacity: .65; + left: 5% !important; + right: 5% !important; +} + +/* Bolds the name of the event and inherits the font size */ + +.fc-event { + font-size: inherit !important; + font-weight: bold !important; +} + +/* Remove the header border from Schedule */ + +.fc td, .fc th { + border-style: none !important; + border-width: 1px !important; + padding: 0 !important; + vertical-align: top !important; +} + +/* Inherits background for each event from Schedule. */ + +.fc-event .fc-bg { + z-index: 1 !important; + background: inherit !important; + opacity: .25 !important; +} + +/* Normal font weight for the time in each event */ + +.fc-time-grid-event .fc-time { + font-weight: normal !important; +} + +/* Apply same opacity to all day events */ + +.fc-ltr .fc-h-event.fc-not-end, .fc-rtl .fc-h-event.fc-not-start { + opacity: .65 !important; + margin-left: 12px !important; + padding: 5px !important; +} + +/* Apply same opacity to all day events */ + +.fc-day-grid-event.fc-h-event.fc-event.fc-not-start.fc-end { + opacity: .65 !important; + margin-left: 12px !important; + padding: 5px !important; +} + +/* Material design button */ + +.fc-button-primary:disabled { + background-color: rgba(192, 192, 192, 0.5) !important; +} + +.fc-button-primary:hover { + border-color: rgba(158, 158, 158, 0.2) !important; +} + +.fc-button { + display: inline-block !important; + position: relative !important; + cursor: pointer !important; + min-height: 36px !important; + min-width: 40px !important; + line-height: 36px !important; + vertical-align: middle !important; + -webkit-box-align: center !important; + -webkit-align-items: center !important; + align-items: center !important; + text-align: center !important; + border-radius: 2px !important; + box-sizing: border-box !important; + -webkit-user-select: none !important; + -moz-user-select: none !important; + -ms-user-select: none !important; + user-select: none !important; + outline: none !important; + border: 0 !important; + padding: 0 6px !important; + margin: 6px 8px !important; + letter-spacing: .01em !important; + background: transparent !important; + color: currentColor !important; + white-space: nowrap !important; + text-transform: uppercase !important; + font-weight: 500; + font-size: 14px; + font-style: inherit; + font-variant: inherit; + font-family: inherit; + text-decoration: none; + overflow: hidden !important; + -webkit-transition: box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); + transition: box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); +} + +.fc-button:hover { + background-color: rgba(158, 158, 158, 0.2); +} + +.fc-button:focus, .fc-button:hover { + text-decoration: none; +} + +/* The active button box is ugly so the active button will have the same appearance of the hover */ + +.fc-state-active { + background-color: rgba(158, 158, 158, 0.2); +} + +/* Not raised button */ + +.fc-state-default { + box-shadow: None; +}
\ No newline at end of file |