calendar.css 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. @import url('demo.css');
  2. @font-face {
  3. font-family: 'fontawesome-selected';
  4. src: url("../font/fontawesome-selected.eot");
  5. src: url("../font/fontawesome-selected.eot?#iefix") format('embedded-opentype'), url("../font/fontawesome-selected.woff") format('woff'), url("../font/fontawesome-selected.ttf") format('truetype'), url("../font/fontawesome-selected.svg#fontawesome-selected") format('svg');
  6. font-weight: normal;
  7. font-style: normal;
  8. }
  9. .fc-calendar-container {
  10. position: relative;
  11. height: 400px;
  12. width: 400px;
  13. }
  14. .fc-calendar {
  15. width: 100%;
  16. height: 100%;
  17. }
  18. .fc-calendar .fc-head {
  19. height: 30px;
  20. line-height: 30px;
  21. background: #ccc;
  22. color: #fff;
  23. }
  24. .fc-calendar .fc-body {
  25. position: relative;
  26. width: 100%;
  27. height: 100%;
  28. height: -moz-calc(100% - 30px);
  29. height: -webkit-calc(100% - 30px);
  30. height: calc(100% - 30px);
  31. border: 1px solid #ddd;
  32. }
  33. .fc-calendar .fc-row {
  34. width: 100%;
  35. border-bottom: 1px solid #ddd;
  36. }
  37. .fc-four-rows .fc-row {
  38. height: 25%;
  39. }
  40. .fc-five-rows .fc-row {
  41. height: 105px;
  42. }
  43. .fc-six-rows .fc-row {
  44. height: 16.66%;
  45. height: -moz-calc(100%/6);
  46. height: -webkit-calc(100%/6);
  47. height: calc(100%/6);
  48. }
  49. .fc-calendar .fc-row > div,
  50. .fc-calendar .fc-head > div {
  51. float: left;
  52. height: 100%;
  53. width: 14.28%; /* 100% / 7 */
  54. width: -moz-calc(100%/7);
  55. width: -webkit-calc(100%/7);
  56. width: calc(100%/7);
  57. position: relative;
  58. }
  59. /* IE 9 is rounding up the calc it seems */
  60. .ie9 .fc-calendar .fc-row > div,
  61. .ie9 .fc-calendar .fc-head > div {
  62. width: 14.2%;
  63. }
  64. .fc-calendar .fc-row > div {
  65. border-right: 1px solid #ddd;
  66. padding: 0px;
  67. overflow: hidden;
  68. position: relative;
  69. }
  70. .fc-calendar .fc-head > div {
  71. text-align: center;
  72. }
  73. .fc-calendar .fc-row > div > span.fc-date {
  74. position: absolute;
  75. width: 30px;
  76. height: 20px;
  77. font-size: 20px;
  78. line-height: 20px;
  79. font-weight: 700;
  80. color: #ddd;
  81. text-shadow: 0 -1px 0 rgba(255,255,255,0.8);
  82. bottom: 5px;
  83. right: 5px;
  84. text-align: right;
  85. }
  86. .fc-calendar .fc-row > div > span.fc-weekday {
  87. padding-left: 5px;
  88. display: none;
  89. }
  90. .fc-calendar .fc-row > div.fc-today {
  91. background: #fff4c3;
  92. }
  93. .fc-calendar .fc-row > div.fc-out {
  94. opacity: 0.6;
  95. }
  96. .fc-calendar .fc-row > div:last-child,
  97. .fc-calendar .fc-head > div:last-child {
  98. border-right: none;
  99. }
  100. .fc-calendar .fc-row:last-child {
  101. border-bottom: none;
  102. }