fullcalendar.css 24 KB

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