fullcalendar.css 28 KB

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