fullcalendar.css 21 KB

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