calendar.css 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190
  1. .calendar {
  2. border-width: 1px;
  3. border-style: solid;
  4. padding: 1px;
  5. overflow: hidden;
  6. }
  7. .calendar table {
  8. border-collapse: separate;
  9. font-size: 12px;
  10. width: 100%;
  11. height: 100%;
  12. }
  13. .calendar table td,
  14. .calendar table th {
  15. font-size: 12px;
  16. }
  17. .calendar-noborder {
  18. border: 0;
  19. }
  20. .calendar-header {
  21. position: relative;
  22. height: 22px;
  23. }
  24. .calendar-title {
  25. text-align: center;
  26. height: 22px;
  27. }
  28. .calendar-title span {
  29. position: relative;
  30. display: inline-block;
  31. top: 2px;
  32. padding: 0 3px;
  33. height: 18px;
  34. line-height: 18px;
  35. font-size: 12px;
  36. cursor: pointer;
  37. -moz-border-radius: 0px 0px 0px 0px;
  38. -webkit-border-radius: 0px 0px 0px 0px;
  39. border-radius: 0px 0px 0px 0px;
  40. }
  41. .calendar-prevmonth,
  42. .calendar-nextmonth,
  43. .calendar-prevyear,
  44. .calendar-nextyear {
  45. position: absolute;
  46. top: 50%;
  47. margin-top: -7px;
  48. width: 14px;
  49. height: 14px;
  50. cursor: pointer;
  51. font-size: 1px;
  52. -moz-border-radius: 0px 0px 0px 0px;
  53. -webkit-border-radius: 0px 0px 0px 0px;
  54. border-radius: 0px 0px 0px 0px;
  55. }
  56. .calendar-prevmonth {
  57. left: 20px;
  58. background: url('images/calendar_arrows.png') no-repeat -18px -2px;
  59. }
  60. .calendar-nextmonth {
  61. right: 20px;
  62. background: url('images/calendar_arrows.png') no-repeat -34px -2px;
  63. }
  64. .calendar-prevyear {
  65. left: 3px;
  66. background: url('images/calendar_arrows.png') no-repeat -1px -2px;
  67. }
  68. .calendar-nextyear {
  69. right: 3px;
  70. background: url('images/calendar_arrows.png') no-repeat -49px -2px;
  71. }
  72. .calendar-body {
  73. position: relative;
  74. }
  75. .calendar-body th,
  76. .calendar-body td {
  77. text-align: center;
  78. }
  79. .calendar-day {
  80. border: 0;
  81. padding: 1px;
  82. cursor: pointer;
  83. -moz-border-radius: 0px 0px 0px 0px;
  84. -webkit-border-radius: 0px 0px 0px 0px;
  85. border-radius: 0px 0px 0px 0px;
  86. }
  87. .calendar-other-month {
  88. opacity: 0.3;
  89. filter: alpha(opacity=30);
  90. }
  91. .calendar-menu {
  92. position: absolute;
  93. top: 0;
  94. left: 0;
  95. width: 180px;
  96. height: 150px;
  97. padding: 5px;
  98. font-size: 12px;
  99. display: none;
  100. overflow: hidden;
  101. }
  102. .calendar-menu-year-inner {
  103. text-align: center;
  104. padding-bottom: 5px;
  105. }
  106. .calendar-menu-year {
  107. width: 40px;
  108. text-align: center;
  109. border-width: 1px;
  110. border-style: solid;
  111. margin: 0;
  112. padding: 2px;
  113. font-weight: bold;
  114. font-size: 12px;
  115. }
  116. .calendar-menu-prev,
  117. .calendar-menu-next {
  118. display: inline-block;
  119. width: 21px;
  120. height: 21px;
  121. vertical-align: top;
  122. cursor: pointer;
  123. -moz-border-radius: 0px 0px 0px 0px;
  124. -webkit-border-radius: 0px 0px 0px 0px;
  125. border-radius: 0px 0px 0px 0px;
  126. }
  127. .calendar-menu-prev {
  128. margin-right: 10px;
  129. background: url('images/calendar_arrows.png') no-repeat 2px 2px;
  130. }
  131. .calendar-menu-next {
  132. margin-left: 10px;
  133. background: url('images/calendar_arrows.png') no-repeat -45px 2px;
  134. }
  135. .calendar-menu-month {
  136. text-align: center;
  137. cursor: pointer;
  138. font-weight: bold;
  139. -moz-border-radius: 0px 0px 0px 0px;
  140. -webkit-border-radius: 0px 0px 0px 0px;
  141. border-radius: 0px 0px 0px 0px;
  142. }
  143. .calendar-body th,
  144. .calendar-menu-month {
  145. color: #8d8d8d;
  146. }
  147. .calendar-day {
  148. color: #404040;
  149. }
  150. .calendar-sunday {
  151. color: #CC2222;
  152. }
  153. .calendar-saturday {
  154. color: #00ee00;
  155. }
  156. .calendar-today {
  157. color: #0000ff;
  158. }
  159. .calendar-menu-year {
  160. border-color: #d4a375;
  161. }
  162. .calendar {
  163. border-color: #d4a375;
  164. }
  165. .calendar-header {
  166. background: #f0e3bf;
  167. }
  168. .calendar-body,
  169. .calendar-menu {
  170. background: #fafafa;
  171. }
  172. .calendar-body th {
  173. background: #f5f5f5;
  174. }
  175. .calendar-hover,
  176. .calendar-nav-hover,
  177. .calendar-menu-hover {
  178. background-color: #fff7d6;
  179. color: #404040;
  180. }
  181. .calendar-hover {
  182. border: 1px solid #fff7d6;
  183. padding: 0;
  184. }
  185. .calendar-selected {
  186. background-color: #f7cc8f;
  187. color: #404040;
  188. border: 1px solid #f7cc8f;
  189. padding: 0;
  190. }