fullcalendar.css 33 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265
  1. /*!
  2. * FullCalendar v3.8.2
  3. * Docs & License: https://fullcalendar.io/
  4. * (c) 2018 Adam Shaw
  5. */
  6. .fc {
  7. direction: ltr;
  8. text-align: left; }
  9. .fc-rtl {
  10. text-align: right; }
  11. body .fc {
  12. /* extra precedence to overcome jqui */
  13. font-size: 1em; }
  14. /* Colors
  15. --------------------------------------------------------------------------------------------------*/
  16. .fc-highlight {
  17. /* when user is selecting cells */
  18. background: #bce8f1;
  19. opacity: .3; }
  20. .fc-bgevent {
  21. /* default look for background events */
  22. background: #8fdf82;
  23. opacity: .3; }
  24. .fc-nonbusiness {
  25. /* default look for non-business-hours areas */
  26. /* will inherit .fc-bgevent's styles */
  27. background: #d7d7d7; }
  28. /* Buttons (styled <button> tags, normalized to work cross-browser)
  29. --------------------------------------------------------------------------------------------------*/
  30. .fc button {
  31. /* force height to include the border and padding */
  32. -moz-box-sizing: border-box;
  33. -webkit-box-sizing: border-box;
  34. box-sizing: border-box;
  35. /* dimensions */
  36. margin: 0;
  37. height: 2.1em;
  38. padding: 0 .6em;
  39. /* text & cursor */
  40. font-size: 1em;
  41. /* normalize */
  42. white-space: nowrap;
  43. cursor: pointer; }
  44. /* Firefox has an annoying inner border */
  45. .fc button::-moz-focus-inner {
  46. margin: 0;
  47. padding: 0; }
  48. .fc-state-default {
  49. /* non-theme */
  50. border: 1px solid; }
  51. .fc-state-default.fc-corner-left {
  52. /* non-theme */
  53. border-top-left-radius: 4px;
  54. border-bottom-left-radius: 4px; }
  55. .fc-state-default.fc-corner-right {
  56. /* non-theme */
  57. border-top-right-radius: 4px;
  58. border-bottom-right-radius: 4px; }
  59. /* icons in buttons */
  60. .fc button .fc-icon {
  61. /* non-theme */
  62. position: relative;
  63. top: -0.05em;
  64. /* seems to be a good adjustment across browsers */
  65. margin: 0 .2em;
  66. vertical-align: middle; }
  67. /*
  68. button states
  69. borrowed from twitter bootstrap (http://twitter.github.com/bootstrap/)
  70. */
  71. .fc-state-default {
  72. background-color: #f5f5f5;
  73. background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
  74. background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
  75. background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
  76. background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
  77. background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
  78. background-repeat: repeat-x;
  79. border-color: #e6e6e6 #e6e6e6 #bfbfbf;
  80. border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  81. color: #333;
  82. text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  83. box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); }
  84. .fc-state-hover,
  85. .fc-state-down,
  86. .fc-state-active,
  87. .fc-state-disabled {
  88. color: #333333;
  89. background-color: #e6e6e6; }
  90. .fc-state-hover {
  91. color: #333333;
  92. text-decoration: none;
  93. background-position: 0 -15px;
  94. -webkit-transition: background-position 0.1s linear;
  95. -moz-transition: background-position 0.1s linear;
  96. -o-transition: background-position 0.1s linear;
  97. transition: background-position 0.1s linear; }
  98. .fc-state-down,
  99. .fc-state-active {
  100. background-color: #cccccc;
  101. background-image: none;
  102. box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); }
  103. .fc-state-disabled {
  104. cursor: default;
  105. background-image: none;
  106. opacity: 0.65;
  107. box-shadow: none; }
  108. /* Buttons Groups
  109. --------------------------------------------------------------------------------------------------*/
  110. .fc-button-group {
  111. display: inline-block; }
  112. /*
  113. every button that is not first in a button group should scootch over one pixel and cover the
  114. previous button's border...
  115. */
  116. .fc .fc-button-group > * {
  117. /* extra precedence b/c buttons have margin set to zero */
  118. float: left;
  119. margin: 0 0 0 -1px; }
  120. .fc .fc-button-group > :first-child {
  121. /* same */
  122. margin-left: 0; }
  123. /* Popover
  124. --------------------------------------------------------------------------------------------------*/
  125. .fc-popover {
  126. position: absolute;
  127. box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15); }
  128. .fc-popover .fc-header {
  129. /* TODO: be more consistent with fc-head/fc-body */
  130. padding: 2px 4px; }
  131. .fc-popover .fc-header .fc-title {
  132. margin: 0 2px; }
  133. .fc-popover .fc-header .fc-close {
  134. cursor: pointer; }
  135. .fc-ltr .fc-popover .fc-header .fc-title,
  136. .fc-rtl .fc-popover .fc-header .fc-close {
  137. float: left; }
  138. .fc-rtl .fc-popover .fc-header .fc-title,
  139. .fc-ltr .fc-popover .fc-header .fc-close {
  140. float: right; }
  141. /* Misc Reusable Components
  142. --------------------------------------------------------------------------------------------------*/
  143. .fc-divider {
  144. border-style: solid;
  145. border-width: 1px; }
  146. hr.fc-divider {
  147. height: 0;
  148. margin: 0;
  149. padding: 0 0 2px;
  150. /* height is unreliable across browsers, so use padding */
  151. border-width: 1px 0; }
  152. .fc-clear {
  153. clear: both; }
  154. .fc-bg,
  155. .fc-bgevent-skeleton,
  156. .fc-highlight-skeleton,
  157. .fc-helper-skeleton {
  158. /* these element should always cling to top-left/right corners */
  159. position: absolute;
  160. top: 0;
  161. left: 0;
  162. right: 0; }
  163. .fc-bg {
  164. bottom: 0;
  165. /* strech bg to bottom edge */ }
  166. .fc-bg table {
  167. height: 100%;
  168. /* strech bg to bottom edge */ }
  169. /* Tables
  170. --------------------------------------------------------------------------------------------------*/
  171. .fc table {
  172. width: 100%;
  173. box-sizing: border-box;
  174. /* fix scrollbar issue in firefox */
  175. table-layout: fixed;
  176. border-collapse: collapse;
  177. border-spacing: 0;
  178. font-size: 1em;
  179. /* normalize cross-browser */ }
  180. .fc th {
  181. text-align: center; }
  182. .fc th,
  183. .fc td {
  184. border-style: solid;
  185. border-width: 1px;
  186. padding: 0;
  187. vertical-align: top; }
  188. .fc td.fc-today {
  189. border-style: double;
  190. /* overcome neighboring borders */ }
  191. /* Internal Nav Links
  192. --------------------------------------------------------------------------------------------------*/
  193. a[data-goto] {
  194. cursor: pointer; }
  195. a[data-goto]:hover {
  196. text-decoration: underline; }
  197. /* Fake Table Rows
  198. --------------------------------------------------------------------------------------------------*/
  199. .fc .fc-row {
  200. /* extra precedence to overcome themes w/ .ui-widget-content forcing a 1px border */
  201. /* no visible border by default. but make available if need be (scrollbar width compensation) */
  202. border-style: solid;
  203. border-width: 0; }
  204. .fc-row table {
  205. /* don't put left/right border on anything within a fake row.
  206. the outer tbody will worry about this */
  207. border-left: 0 hidden transparent;
  208. border-right: 0 hidden transparent;
  209. /* no bottom borders on rows */
  210. border-bottom: 0 hidden transparent; }
  211. .fc-row:first-child table {
  212. border-top: 0 hidden transparent;
  213. /* no top border on first row */ }
  214. /* Day Row (used within the header and the DayGrid)
  215. --------------------------------------------------------------------------------------------------*/
  216. .fc-row {
  217. position: relative; }
  218. .fc-row .fc-bg {
  219. z-index: 1; }
  220. /* highlighting cells & background event skeleton */
  221. .fc-row .fc-bgevent-skeleton,
  222. .fc-row .fc-highlight-skeleton {
  223. bottom: 0;
  224. /* stretch skeleton to bottom of row */ }
  225. .fc-row .fc-bgevent-skeleton table,
  226. .fc-row .fc-highlight-skeleton table {
  227. height: 100%;
  228. /* stretch skeleton to bottom of row */ }
  229. .fc-row .fc-highlight-skeleton td,
  230. .fc-row .fc-bgevent-skeleton td {
  231. border-color: transparent; }
  232. .fc-row .fc-bgevent-skeleton {
  233. z-index: 2; }
  234. .fc-row .fc-highlight-skeleton {
  235. z-index: 3; }
  236. /*
  237. row content (which contains day/week numbers and events) as well as "helper" (which contains
  238. temporary rendered events).
  239. */
  240. .fc-row .fc-content-skeleton {
  241. position: relative;
  242. z-index: 4;
  243. padding-bottom: 2px;
  244. /* matches the space above the events */ }
  245. .fc-row .fc-helper-skeleton {
  246. z-index: 5; }
  247. .fc .fc-row .fc-content-skeleton table,
  248. .fc .fc-row .fc-content-skeleton td,
  249. .fc .fc-row .fc-helper-skeleton td {
  250. /* see-through to the background below */
  251. /* extra precedence to prevent theme-provided backgrounds */
  252. background: none;
  253. /* in case <td>s are globally styled */
  254. border-color: transparent; }
  255. .fc-row .fc-content-skeleton td,
  256. .fc-row .fc-helper-skeleton td {
  257. /* don't put a border between events and/or the day number */
  258. border-bottom: 0; }
  259. .fc-row .fc-content-skeleton tbody td,
  260. .fc-row .fc-helper-skeleton tbody td {
  261. /* don't put a border between event cells */
  262. border-top: 0; }
  263. /* Scrolling Container
  264. --------------------------------------------------------------------------------------------------*/
  265. .fc-scroller {
  266. -webkit-overflow-scrolling: touch; }
  267. /* TODO: move to agenda/basic */
  268. .fc-scroller > .fc-day-grid,
  269. .fc-scroller > .fc-time-grid {
  270. position: relative;
  271. /* re-scope all positions */
  272. width: 100%;
  273. /* hack to force re-sizing this inner element when scrollbars appear/disappear */ }
  274. /* Global Event Styles
  275. --------------------------------------------------------------------------------------------------*/
  276. .fc-event {
  277. position: relative;
  278. /* for resize handle and other inner positioning */
  279. display: block;
  280. /* make the <a> tag block */
  281. font-size: .85em;
  282. line-height: 1.3;
  283. border-radius: 3px;
  284. border: 1px solid #3a87ad;
  285. /* default BORDER color */ }
  286. .fc-event,
  287. .fc-event-dot {
  288. background-color: #3a87ad;
  289. /* default BACKGROUND color */ }
  290. .fc-event,
  291. .fc-event:hover {
  292. color: #fff;
  293. /* default TEXT color */
  294. text-decoration: none;
  295. /* if <a> has an href */ }
  296. .fc-event[href],
  297. .fc-event.fc-draggable {
  298. cursor: pointer;
  299. /* give events with links and draggable events a hand mouse pointer */ }
  300. .fc-not-allowed,
  301. .fc-not-allowed .fc-event {
  302. /* to override an event's custom cursor */
  303. cursor: not-allowed; }
  304. .fc-event .fc-bg {
  305. /* the generic .fc-bg already does position */
  306. z-index: 1;
  307. background: #fff;
  308. opacity: .25; }
  309. .fc-event .fc-content {
  310. position: relative;
  311. z-index: 2; }
  312. /* resizer (cursor AND touch devices) */
  313. .fc-event .fc-resizer {
  314. position: absolute;
  315. z-index: 4; }
  316. /* resizer (touch devices) */
  317. .fc-event .fc-resizer {
  318. display: none; }
  319. .fc-event.fc-allow-mouse-resize .fc-resizer,
  320. .fc-event.fc-selected .fc-resizer {
  321. /* only show when hovering or selected (with touch) */
  322. display: block; }
  323. /* hit area */
  324. .fc-event.fc-selected .fc-resizer:before {
  325. /* 40x40 touch area */
  326. content: "";
  327. position: absolute;
  328. z-index: 9999;
  329. /* user of this util can scope within a lower z-index */
  330. top: 50%;
  331. left: 50%;
  332. width: 40px;
  333. height: 40px;
  334. margin-left: -20px;
  335. margin-top: -20px; }
  336. /* Event Selection (only for touch devices)
  337. --------------------------------------------------------------------------------------------------*/
  338. .fc-event.fc-selected {
  339. z-index: 9999 !important;
  340. /* overcomes inline z-index */
  341. box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); }
  342. .fc-event.fc-selected.fc-dragging {
  343. box-shadow: 0 2px 7px rgba(0, 0, 0, 0.3); }
  344. /* Horizontal Events
  345. --------------------------------------------------------------------------------------------------*/
  346. /* bigger touch area when selected */
  347. .fc-h-event.fc-selected:before {
  348. content: "";
  349. position: absolute;
  350. z-index: 3;
  351. /* below resizers */
  352. top: -10px;
  353. bottom: -10px;
  354. left: 0;
  355. right: 0; }
  356. /* events that are continuing to/from another week. kill rounded corners and butt up against edge */
  357. .fc-ltr .fc-h-event.fc-not-start,
  358. .fc-rtl .fc-h-event.fc-not-end {
  359. margin-left: 0;
  360. border-left-width: 0;
  361. padding-left: 1px;
  362. /* replace the border with padding */
  363. border-top-left-radius: 0;
  364. border-bottom-left-radius: 0; }
  365. .fc-ltr .fc-h-event.fc-not-end,
  366. .fc-rtl .fc-h-event.fc-not-start {
  367. margin-right: 0;
  368. border-right-width: 0;
  369. padding-right: 1px;
  370. /* replace the border with padding */
  371. border-top-right-radius: 0;
  372. border-bottom-right-radius: 0; }
  373. /* resizer (cursor AND touch devices) */
  374. /* left resizer */
  375. .fc-ltr .fc-h-event .fc-start-resizer,
  376. .fc-rtl .fc-h-event .fc-end-resizer {
  377. cursor: w-resize;
  378. left: -1px;
  379. /* overcome border */ }
  380. /* right resizer */
  381. .fc-ltr .fc-h-event .fc-end-resizer,
  382. .fc-rtl .fc-h-event .fc-start-resizer {
  383. cursor: e-resize;
  384. right: -1px;
  385. /* overcome border */ }
  386. /* resizer (mouse devices) */
  387. .fc-h-event.fc-allow-mouse-resize .fc-resizer {
  388. width: 7px;
  389. top: -1px;
  390. /* overcome top border */
  391. bottom: -1px;
  392. /* overcome bottom border */ }
  393. /* resizer (touch devices) */
  394. .fc-h-event.fc-selected .fc-resizer {
  395. /* 8x8 little dot */
  396. border-radius: 4px;
  397. border-width: 1px;
  398. width: 6px;
  399. height: 6px;
  400. border-style: solid;
  401. border-color: inherit;
  402. background: #fff;
  403. /* vertically center */
  404. top: 50%;
  405. margin-top: -4px; }
  406. /* left resizer */
  407. .fc-ltr .fc-h-event.fc-selected .fc-start-resizer,
  408. .fc-rtl .fc-h-event.fc-selected .fc-end-resizer {
  409. margin-left: -4px;
  410. /* centers the 8x8 dot on the left edge */ }
  411. /* right resizer */
  412. .fc-ltr .fc-h-event.fc-selected .fc-end-resizer,
  413. .fc-rtl .fc-h-event.fc-selected .fc-start-resizer {
  414. margin-right: -4px;
  415. /* centers the 8x8 dot on the right edge */ }
  416. /* DayGrid events
  417. ----------------------------------------------------------------------------------------------------
  418. We use the full "fc-day-grid-event" class instead of using descendants because the event won't
  419. be a descendant of the grid when it is being dragged.
  420. */
  421. .fc-day-grid-event {
  422. margin: 1px 2px 0;
  423. /* spacing between events and edges */
  424. padding: 0 1px; }
  425. tr:first-child > td > .fc-day-grid-event {
  426. margin-top: 2px;
  427. /* a little bit more space before the first event */ }
  428. .fc-day-grid-event.fc-selected:after {
  429. content: "";
  430. position: absolute;
  431. z-index: 1;
  432. /* same z-index as fc-bg, behind text */
  433. /* overcome the borders */
  434. top: -1px;
  435. right: -1px;
  436. bottom: -1px;
  437. left: -1px;
  438. /* darkening effect */
  439. background: #000;
  440. opacity: .25; }
  441. .fc-day-grid-event .fc-content {
  442. /* force events to be one-line tall */
  443. white-space: nowrap;
  444. overflow: hidden; }
  445. .fc-day-grid-event .fc-time {
  446. font-weight: bold; }
  447. /* resizer (cursor devices) */
  448. /* left resizer */
  449. .fc-ltr .fc-day-grid-event.fc-allow-mouse-resize .fc-start-resizer,
  450. .fc-rtl .fc-day-grid-event.fc-allow-mouse-resize .fc-end-resizer {
  451. margin-left: -2px;
  452. /* to the day cell's edge */ }
  453. /* right resizer */
  454. .fc-ltr .fc-day-grid-event.fc-allow-mouse-resize .fc-end-resizer,
  455. .fc-rtl .fc-day-grid-event.fc-allow-mouse-resize .fc-start-resizer {
  456. margin-right: -2px;
  457. /* to the day cell's edge */ }
  458. /* Event Limiting
  459. --------------------------------------------------------------------------------------------------*/
  460. /* "more" link that represents hidden events */
  461. a.fc-more {
  462. margin: 1px 3px;
  463. font-size: .85em;
  464. cursor: pointer;
  465. text-decoration: none; }
  466. a.fc-more:hover {
  467. text-decoration: underline; }
  468. .fc-limited {
  469. /* rows and cells that are hidden because of a "more" link */
  470. display: none; }
  471. /* popover that appears when "more" link is clicked */
  472. .fc-day-grid .fc-row {
  473. z-index: 1;
  474. /* make the "more" popover one higher than this */ }
  475. .fc-more-popover {
  476. z-index: 2;
  477. width: 220px; }
  478. .fc-more-popover .fc-event-container {
  479. padding: 10px; }
  480. /* Now Indicator
  481. --------------------------------------------------------------------------------------------------*/
  482. .fc-now-indicator {
  483. position: absolute;
  484. border: 0 solid red; }
  485. /* Utilities
  486. --------------------------------------------------------------------------------------------------*/
  487. .fc-unselectable {
  488. -webkit-user-select: none;
  489. -khtml-user-select: none;
  490. -moz-user-select: none;
  491. -ms-user-select: none;
  492. user-select: none;
  493. -webkit-touch-callout: none;
  494. -webkit-tap-highlight-color: transparent; }
  495. /*
  496. TODO: more distinction between this file and common.css
  497. */
  498. /* Colors
  499. --------------------------------------------------------------------------------------------------*/
  500. .fc-unthemed th,
  501. .fc-unthemed td,
  502. .fc-unthemed thead,
  503. .fc-unthemed tbody,
  504. .fc-unthemed .fc-divider,
  505. .fc-unthemed .fc-row,
  506. .fc-unthemed .fc-content,
  507. .fc-unthemed .fc-popover,
  508. .fc-unthemed .fc-list-view,
  509. .fc-unthemed .fc-list-heading td {
  510. border-color: #ddd; }
  511. .fc-unthemed .fc-popover {
  512. background-color: #fff; }
  513. .fc-unthemed .fc-divider,
  514. .fc-unthemed .fc-popover .fc-header,
  515. .fc-unthemed .fc-list-heading td {
  516. background: #eee; }
  517. .fc-unthemed .fc-popover .fc-header .fc-close {
  518. color: #666; }
  519. .fc-unthemed td.fc-today {
  520. background: #fcf8e3; }
  521. .fc-unthemed .fc-disabled-day {
  522. background: #d7d7d7;
  523. opacity: .3; }
  524. /* Icons (inline elements with styled text that mock arrow icons)
  525. --------------------------------------------------------------------------------------------------*/
  526. .fc-icon {
  527. display: inline-block;
  528. height: 1em;
  529. line-height: 1em;
  530. font-size: 1em;
  531. text-align: center;
  532. overflow: hidden;
  533. font-family: "Courier New", Courier, monospace;
  534. /* don't allow browser text-selection */
  535. -webkit-touch-callout: none;
  536. -webkit-user-select: none;
  537. -khtml-user-select: none;
  538. -moz-user-select: none;
  539. -ms-user-select: none;
  540. user-select: none; }
  541. /*
  542. Acceptable font-family overrides for individual icons:
  543. "Arial", sans-serif
  544. "Times New Roman", serif
  545. NOTE: use percentage font sizes or else old IE chokes
  546. */
  547. .fc-icon:after {
  548. position: relative; }
  549. .fc-icon-left-single-arrow:after {
  550. content: "\2039";
  551. font-weight: bold;
  552. font-size: 200%;
  553. top: -7%; }
  554. .fc-icon-right-single-arrow:after {
  555. content: "\203A";
  556. font-weight: bold;
  557. font-size: 200%;
  558. top: -7%; }
  559. .fc-icon-left-double-arrow:after {
  560. content: "\AB";
  561. font-size: 160%;
  562. top: -7%; }
  563. .fc-icon-right-double-arrow:after {
  564. content: "\BB";
  565. font-size: 160%;
  566. top: -7%; }
  567. .fc-icon-left-triangle:after {
  568. content: "\25C4";
  569. font-size: 125%;
  570. top: 3%; }
  571. .fc-icon-right-triangle:after {
  572. content: "\25BA";
  573. font-size: 125%;
  574. top: 3%; }
  575. .fc-icon-down-triangle:after {
  576. content: "\25BC";
  577. font-size: 125%;
  578. top: 2%; }
  579. .fc-icon-x:after {
  580. content: "\D7";
  581. font-size: 200%;
  582. top: 6%; }
  583. /* Popover
  584. --------------------------------------------------------------------------------------------------*/
  585. .fc-unthemed .fc-popover {
  586. border-width: 1px;
  587. border-style: solid; }
  588. .fc-unthemed .fc-popover .fc-header .fc-close {
  589. font-size: .9em;
  590. margin-top: 2px; }
  591. /* List View
  592. --------------------------------------------------------------------------------------------------*/
  593. .fc-unthemed .fc-list-item:hover td {
  594. background-color: #f5f5f5; }
  595. /* Colors
  596. --------------------------------------------------------------------------------------------------*/
  597. .ui-widget .fc-disabled-day {
  598. background-image: none; }
  599. /* Popover
  600. --------------------------------------------------------------------------------------------------*/
  601. .fc-popover > .ui-widget-header + .ui-widget-content {
  602. border-top: 0;
  603. /* where they meet, let the header have the border */ }
  604. /* Global Event Styles
  605. --------------------------------------------------------------------------------------------------*/
  606. .ui-widget .fc-event {
  607. /* overpower jqui's styles on <a> tags. TODO: more DRY */
  608. color: #fff;
  609. /* default TEXT color */
  610. text-decoration: none;
  611. /* if <a> has an href */
  612. /* undo ui-widget-header bold */
  613. font-weight: normal; }
  614. /* TimeGrid axis running down the side (for both the all-day area and the slot area)
  615. --------------------------------------------------------------------------------------------------*/
  616. .ui-widget td.fc-axis {
  617. font-weight: normal;
  618. /* overcome bold */ }
  619. /* TimeGrid Slats (lines that run horizontally)
  620. --------------------------------------------------------------------------------------------------*/
  621. .fc-time-grid .fc-slats .ui-widget-content {
  622. background: none;
  623. /* see through to fc-bg */ }
  624. .fc.fc-bootstrap3 a {
  625. text-decoration: none; }
  626. .fc.fc-bootstrap3 a[data-goto]:hover {
  627. text-decoration: underline; }
  628. .fc-bootstrap3 hr.fc-divider {
  629. border-color: inherit; }
  630. .fc-bootstrap3 .fc-today.alert {
  631. border-radius: 0; }
  632. /* Popover
  633. --------------------------------------------------------------------------------------------------*/
  634. .fc-bootstrap3 .fc-popover .panel-body {
  635. padding: 0;
  636. /* undo built-in padding */ }
  637. /* TimeGrid Slats (lines that run horizontally)
  638. --------------------------------------------------------------------------------------------------*/
  639. .fc-bootstrap3 .fc-time-grid .fc-slats table {
  640. /* some themes have background color. see through to slats */
  641. background: none; }
  642. /* Toolbar
  643. --------------------------------------------------------------------------------------------------*/
  644. .fc-toolbar {
  645. text-align: center; }
  646. .fc-toolbar.fc-header-toolbar {
  647. margin-bottom: 1em; }
  648. .fc-toolbar.fc-footer-toolbar {
  649. margin-top: 1em; }
  650. .fc-toolbar .fc-left {
  651. float: left; }
  652. .fc-toolbar .fc-right {
  653. float: right; }
  654. .fc-toolbar .fc-center {
  655. display: inline-block; }
  656. /* the things within each left/right/center section */
  657. .fc .fc-toolbar > * > * {
  658. /* extra precedence to override button border margins */
  659. float: left;
  660. margin-left: .75em; }
  661. /* the first thing within each left/center/right section */
  662. .fc .fc-toolbar > * > :first-child {
  663. /* extra precedence to override button border margins */
  664. margin-left: 0; }
  665. /* title text */
  666. .fc-toolbar h2 {
  667. margin: 0; }
  668. /* button layering (for border precedence) */
  669. .fc-toolbar button {
  670. position: relative; }
  671. .fc-toolbar .fc-state-hover,
  672. .fc-toolbar .ui-state-hover {
  673. z-index: 2; }
  674. .fc-toolbar .fc-state-down {
  675. z-index: 3; }
  676. .fc-toolbar .fc-state-active,
  677. .fc-toolbar .ui-state-active {
  678. z-index: 4; }
  679. .fc-toolbar button:focus {
  680. z-index: 5; }
  681. /* View Structure
  682. --------------------------------------------------------------------------------------------------*/
  683. /* undo twitter bootstrap's box-sizing rules. normalizes positioning techniques */
  684. /* don't do this for the toolbar because we'll want bootstrap to style those buttons as some pt */
  685. .fc-view-container *,
  686. .fc-view-container *:before,
  687. .fc-view-container *:after {
  688. -webkit-box-sizing: content-box;
  689. -moz-box-sizing: content-box;
  690. box-sizing: content-box; }
  691. .fc-view,
  692. .fc-view > table {
  693. /* so dragged elements can be above the view's main element */
  694. position: relative;
  695. z-index: 1; }
  696. /* BasicView
  697. --------------------------------------------------------------------------------------------------*/
  698. /* day row structure */
  699. .fc-basicWeek-view .fc-content-skeleton,
  700. .fc-basicDay-view .fc-content-skeleton {
  701. /* there may be week numbers in these views, so no padding-top */
  702. padding-bottom: 1em;
  703. /* ensure a space at bottom of cell for user selecting/clicking */ }
  704. .fc-basic-view .fc-body .fc-row {
  705. min-height: 4em;
  706. /* ensure that all rows are at least this tall */ }
  707. /* a "rigid" row will take up a constant amount of height because content-skeleton is absolute */
  708. .fc-row.fc-rigid {
  709. overflow: hidden; }
  710. .fc-row.fc-rigid .fc-content-skeleton {
  711. position: absolute;
  712. top: 0;
  713. left: 0;
  714. right: 0; }
  715. /* week and day number styling */
  716. .fc-day-top.fc-other-month {
  717. opacity: 0.3; }
  718. .fc-basic-view .fc-week-number,
  719. .fc-basic-view .fc-day-number {
  720. padding: 2px; }
  721. .fc-basic-view th.fc-week-number,
  722. .fc-basic-view th.fc-day-number {
  723. padding: 0 2px;
  724. /* column headers can't have as much v space */ }
  725. .fc-ltr .fc-basic-view .fc-day-top .fc-day-number {
  726. float: right; }
  727. .fc-rtl .fc-basic-view .fc-day-top .fc-day-number {
  728. float: left; }
  729. .fc-ltr .fc-basic-view .fc-day-top .fc-week-number {
  730. float: left;
  731. border-radius: 0 0 3px 0; }
  732. .fc-rtl .fc-basic-view .fc-day-top .fc-week-number {
  733. float: right;
  734. border-radius: 0 0 0 3px; }
  735. .fc-basic-view .fc-day-top .fc-week-number {
  736. min-width: 1.5em;
  737. text-align: center;
  738. background-color: #f2f2f2;
  739. color: #808080; }
  740. /* when week/day number have own column */
  741. .fc-basic-view td.fc-week-number {
  742. text-align: center; }
  743. .fc-basic-view td.fc-week-number > * {
  744. /* work around the way we do column resizing and ensure a minimum width */
  745. display: inline-block;
  746. min-width: 1.25em; }
  747. /* AgendaView all-day area
  748. --------------------------------------------------------------------------------------------------*/
  749. .fc-agenda-view .fc-day-grid {
  750. position: relative;
  751. z-index: 2;
  752. /* so the "more.." popover will be over the time grid */ }
  753. .fc-agenda-view .fc-day-grid .fc-row {
  754. min-height: 3em;
  755. /* all-day section will never get shorter than this */ }
  756. .fc-agenda-view .fc-day-grid .fc-row .fc-content-skeleton {
  757. padding-bottom: 1em;
  758. /* give space underneath events for clicking/selecting days */ }
  759. /* TimeGrid axis running down the side (for both the all-day area and the slot area)
  760. --------------------------------------------------------------------------------------------------*/
  761. .fc .fc-axis {
  762. /* .fc to overcome default cell styles */
  763. vertical-align: middle;
  764. padding: 0 4px;
  765. white-space: nowrap; }
  766. .fc-ltr .fc-axis {
  767. text-align: right; }
  768. .fc-rtl .fc-axis {
  769. text-align: left; }
  770. /* TimeGrid Structure
  771. --------------------------------------------------------------------------------------------------*/
  772. .fc-time-grid-container,
  773. .fc-time-grid {
  774. /* so slats/bg/content/etc positions get scoped within here */
  775. position: relative;
  776. z-index: 1; }
  777. .fc-time-grid {
  778. min-height: 100%;
  779. /* so if height setting is 'auto', .fc-bg stretches to fill height */ }
  780. .fc-time-grid table {
  781. /* don't put outer borders on slats/bg/content/etc */
  782. border: 0 hidden transparent; }
  783. .fc-time-grid > .fc-bg {
  784. z-index: 1; }
  785. .fc-time-grid .fc-slats,
  786. .fc-time-grid > hr {
  787. /* the <hr> AgendaView injects when grid is shorter than scroller */
  788. position: relative;
  789. z-index: 2; }
  790. .fc-time-grid .fc-content-col {
  791. position: relative;
  792. /* because now-indicator lives directly inside */ }
  793. .fc-time-grid .fc-content-skeleton {
  794. position: absolute;
  795. z-index: 3;
  796. top: 0;
  797. left: 0;
  798. right: 0; }
  799. /* divs within a cell within the fc-content-skeleton */
  800. .fc-time-grid .fc-business-container {
  801. position: relative;
  802. z-index: 1; }
  803. .fc-time-grid .fc-bgevent-container {
  804. position: relative;
  805. z-index: 2; }
  806. .fc-time-grid .fc-highlight-container {
  807. position: relative;
  808. z-index: 3; }
  809. .fc-time-grid .fc-event-container {
  810. position: relative;
  811. z-index: 4; }
  812. .fc-time-grid .fc-now-indicator-line {
  813. z-index: 5; }
  814. .fc-time-grid .fc-helper-container {
  815. /* also is fc-event-container */
  816. position: relative;
  817. z-index: 6; }
  818. /* TimeGrid Slats (lines that run horizontally)
  819. --------------------------------------------------------------------------------------------------*/
  820. .fc-time-grid .fc-slats td {
  821. height: 1.5em;
  822. border-bottom: 0;
  823. /* each cell is responsible for its top border */ }
  824. .fc-time-grid .fc-slats .fc-minor td {
  825. border-top-style: dotted; }
  826. /* TimeGrid Highlighting Slots
  827. --------------------------------------------------------------------------------------------------*/
  828. .fc-time-grid .fc-highlight-container {
  829. /* a div within a cell within the fc-highlight-skeleton */
  830. position: relative;
  831. /* scopes the left/right of the fc-highlight to be in the column */ }
  832. .fc-time-grid .fc-highlight {
  833. position: absolute;
  834. left: 0;
  835. right: 0;
  836. /* top and bottom will be in by JS */ }
  837. /* TimeGrid Event Containment
  838. --------------------------------------------------------------------------------------------------*/
  839. .fc-ltr .fc-time-grid .fc-event-container {
  840. /* space on the sides of events for LTR (default) */
  841. margin: 0 2.5% 0 2px; }
  842. .fc-rtl .fc-time-grid .fc-event-container {
  843. /* space on the sides of events for RTL */
  844. margin: 0 2px 0 2.5%; }
  845. .fc-time-grid .fc-event,
  846. .fc-time-grid .fc-bgevent {
  847. position: absolute;
  848. z-index: 1;
  849. /* scope inner z-index's */ }
  850. .fc-time-grid .fc-bgevent {
  851. /* background events always span full width */
  852. left: 0;
  853. right: 0; }
  854. /* Generic Vertical Event
  855. --------------------------------------------------------------------------------------------------*/
  856. .fc-v-event.fc-not-start {
  857. /* events that are continuing from another day */
  858. /* replace space made by the top border with padding */
  859. border-top-width: 0;
  860. padding-top: 1px;
  861. /* remove top rounded corners */
  862. border-top-left-radius: 0;
  863. border-top-right-radius: 0; }
  864. .fc-v-event.fc-not-end {
  865. /* replace space made by the top border with padding */
  866. border-bottom-width: 0;
  867. padding-bottom: 1px;
  868. /* remove bottom rounded corners */
  869. border-bottom-left-radius: 0;
  870. border-bottom-right-radius: 0; }
  871. /* TimeGrid Event Styling
  872. ----------------------------------------------------------------------------------------------------
  873. We use the full "fc-time-grid-event" class instead of using descendants because the event won't
  874. be a descendant of the grid when it is being dragged.
  875. */
  876. .fc-time-grid-event {
  877. overflow: hidden;
  878. /* don't let the bg flow over rounded corners */ }
  879. .fc-time-grid-event.fc-selected {
  880. /* need to allow touch resizers to extend outside event's bounding box */
  881. /* common fc-selected styles hide the fc-bg, so don't need this anyway */
  882. overflow: visible; }
  883. .fc-time-grid-event.fc-selected .fc-bg {
  884. display: none;
  885. /* hide semi-white background, to appear darker */ }
  886. .fc-time-grid-event .fc-content {
  887. overflow: hidden;
  888. /* for when .fc-selected */ }
  889. .fc-time-grid-event .fc-time,
  890. .fc-time-grid-event .fc-title {
  891. padding: 0 1px; }
  892. .fc-time-grid-event .fc-time {
  893. font-size: .85em;
  894. white-space: nowrap; }
  895. /* short mode, where time and title are on the same line */
  896. .fc-time-grid-event.fc-short .fc-content {
  897. /* don't wrap to second line (now that contents will be inline) */
  898. white-space: nowrap; }
  899. .fc-time-grid-event.fc-short .fc-time,
  900. .fc-time-grid-event.fc-short .fc-title {
  901. /* put the time and title on the same line */
  902. display: inline-block;
  903. vertical-align: top; }
  904. .fc-time-grid-event.fc-short .fc-time span {
  905. display: none;
  906. /* don't display the full time text... */ }
  907. .fc-time-grid-event.fc-short .fc-time:before {
  908. content: attr(data-start);
  909. /* ...instead, display only the start time */ }
  910. .fc-time-grid-event.fc-short .fc-time:after {
  911. content: "\A0-\A0";
  912. /* seperate with a dash, wrapped in nbsp's */ }
  913. .fc-time-grid-event.fc-short .fc-title {
  914. font-size: .85em;
  915. /* make the title text the same size as the time */
  916. padding: 0;
  917. /* undo padding from above */ }
  918. /* resizer (cursor device) */
  919. .fc-time-grid-event.fc-allow-mouse-resize .fc-resizer {
  920. left: 0;
  921. right: 0;
  922. bottom: 0;
  923. height: 8px;
  924. overflow: hidden;
  925. line-height: 8px;
  926. font-size: 11px;
  927. font-family: monospace;
  928. text-align: center;
  929. cursor: s-resize; }
  930. .fc-time-grid-event.fc-allow-mouse-resize .fc-resizer:after {
  931. content: "="; }
  932. /* resizer (touch device) */
  933. .fc-time-grid-event.fc-selected .fc-resizer {
  934. /* 10x10 dot */
  935. border-radius: 5px;
  936. border-width: 1px;
  937. width: 8px;
  938. height: 8px;
  939. border-style: solid;
  940. border-color: inherit;
  941. background: #fff;
  942. /* horizontally center */
  943. left: 50%;
  944. margin-left: -5px;
  945. /* center on the bottom edge */
  946. bottom: -5px; }
  947. /* Now Indicator
  948. --------------------------------------------------------------------------------------------------*/
  949. .fc-time-grid .fc-now-indicator-line {
  950. border-top-width: 1px;
  951. left: 0;
  952. right: 0; }
  953. /* arrow on axis */
  954. .fc-time-grid .fc-now-indicator-arrow {
  955. margin-top: -5px;
  956. /* vertically center on top coordinate */ }
  957. .fc-ltr .fc-time-grid .fc-now-indicator-arrow {
  958. left: 0;
  959. /* triangle pointing right... */
  960. border-width: 5px 0 5px 6px;
  961. border-top-color: transparent;
  962. border-bottom-color: transparent; }
  963. .fc-rtl .fc-time-grid .fc-now-indicator-arrow {
  964. right: 0;
  965. /* triangle pointing left... */
  966. border-width: 5px 6px 5px 0;
  967. border-top-color: transparent;
  968. border-bottom-color: transparent; }
  969. /* List View
  970. --------------------------------------------------------------------------------------------------*/
  971. /* possibly reusable */
  972. .fc-event-dot {
  973. display: inline-block;
  974. width: 10px;
  975. height: 10px;
  976. border-radius: 5px; }
  977. /* view wrapper */
  978. .fc-rtl .fc-list-view {
  979. direction: rtl;
  980. /* unlike core views, leverage browser RTL */ }
  981. .fc-list-view {
  982. border-width: 1px;
  983. border-style: solid; }
  984. /* table resets */
  985. .fc .fc-list-table {
  986. table-layout: auto;
  987. /* for shrinkwrapping cell content */ }
  988. .fc-list-table td {
  989. border-width: 1px 0 0;
  990. padding: 8px 14px; }
  991. .fc-list-table tr:first-child td {
  992. border-top-width: 0; }
  993. /* day headings with the list */
  994. .fc-list-heading {
  995. border-bottom-width: 1px; }
  996. .fc-list-heading td {
  997. font-weight: bold; }
  998. .fc-ltr .fc-list-heading-main {
  999. float: left; }
  1000. .fc-ltr .fc-list-heading-alt {
  1001. float: right; }
  1002. .fc-rtl .fc-list-heading-main {
  1003. float: right; }
  1004. .fc-rtl .fc-list-heading-alt {
  1005. float: left; }
  1006. /* event list items */
  1007. .fc-list-item.fc-has-url {
  1008. cursor: pointer;
  1009. /* whole row will be clickable */ }
  1010. .fc-list-item-marker,
  1011. .fc-list-item-time {
  1012. white-space: nowrap;
  1013. width: 1px; }
  1014. /* make the dot closer to the event title */
  1015. .fc-ltr .fc-list-item-marker {
  1016. padding-right: 0; }
  1017. .fc-rtl .fc-list-item-marker {
  1018. padding-left: 0; }
  1019. .fc-list-item-title a {
  1020. /* every event title cell has an <a> tag */
  1021. text-decoration: none;
  1022. color: inherit; }
  1023. .fc-list-item-title a[href]:hover {
  1024. /* hover effect only on titles with hrefs */
  1025. text-decoration: underline; }
  1026. /* message when no events */
  1027. .fc-list-empty-wrap2 {
  1028. position: absolute;
  1029. top: 0;
  1030. left: 0;
  1031. right: 0;
  1032. bottom: 0; }
  1033. .fc-list-empty-wrap1 {
  1034. width: 100%;
  1035. height: 100%;
  1036. display: table; }
  1037. .fc-list-empty {
  1038. display: table-cell;
  1039. vertical-align: middle;
  1040. text-align: center; }
  1041. .fc-unthemed .fc-list-empty {
  1042. /* theme will provide own background */
  1043. background-color: #eee; }