media/datePicker.css

   1 table.jCalendar {\r
   2         border: 1px solid #000;\r
   3         background: #532029;\r
   4     border-collapse: separate;\r
   5     border-spacing: 2px;\r
   6 }\r
   7 table.jCalendar th {\r
   8         background: #C9C79E;\r
   9         color: #000;\r
  10         font-weight: bold;\r
  11         padding: 3px 5px;\r
  12 }\r
  13 \r
  14 table.jCalendar td {\r
  15         background: #FBFEF3;\r
  16         color: #000;\r
  17         padding: 3px 5px;\r
  18         text-align: center;\r
  19 }\r
  20 table.jCalendar td.other-month {\r
  21         background: #CDA464;\r
  22         color: #eee;\r
  23 }\r
  24 table.jCalendar td.today {\r
  25         background: #CDA464;\r
  26         color: #fff;\r
  27 }\r
  28 table.jCalendar td.selected {\r
  29         background: #532029;\r
  30         color: #fff;\r
  31 }\r
  32 table.jCalendar td.selected.dp-hover {\r
  33         background: #CDA464;\r
  34         color: #000;\r
  35 }\r
  36 table.jCalendar td.dp-hover,\r
  37 table.jCalendar tr.activeWeekHover td {\r
  38         background: #C9C79E;\r
  39         color: #000;\r
  40 }\r
  41 table.jCalendar tr.selectedWeek td {\r
  42         background: #f66;\r
  43         color: #fff;\r
  44 }\r
  45 table.jCalendar td.disabled, table.jCalendar td.disabled.dp-hover {\r
  46         background: #bbb;\r
  47         color: #888;\r
  48 }\r
  49 table.jCalendar td.unselectable,\r
  50 table.jCalendar td.unselectable:hover,\r
  51 table.jCalendar td.unselectable.dp-hover {\r
  52         background: #bbb;\r
  53         color: #888;\r
  54 }\r
  55 \r
  56 /* For the popup */\r
  57 \r
  58 /* NOTE - you will probably want to style a.dp-choose-date - see how I did it in demo.css */\r
  59 \r
  60 a.dp-choose-date {\r
  61         padding-top: 5px;\r
  62         display: block;\r
  63         overflow: hidden;\r
  64         font-size: 12px;\r
  65 }\r
  66 \r
  67 \r
  68 div.dp-popup {\r
  69         position: relative;\r
  70         background: #CDA464;\r
  71         border-top: 2px solid #532029;\r
  72         font-size: 10px;\r
  73         font-family: 'Adobe Caslon Pro', Georgia, sans-serif;\r
  74         padding: 2px;\r
  75         width: 180px;\r
  76         line-height: 1.2em;\r
  77 }\r
  78 div#dp-popup {\r
  79         position: absolute;\r
  80         z-index: 199;\r
  81 }\r
  82 div.dp-popup h2 {\r
  83         font-size: 11px;\r
  84         text-align: center;\r
  85         margin: 2px 0;\r
  86         padding: 0;\r
  87 }\r
  88 a#dp-close {\r
  89         font-size: 11px;\r
  90         padding: 4px 0;\r
  91         text-align: center;\r
  92         display: block;\r
  93 }\r
  94 a#dp-close:hover {\r
  95         text-decoration: underline;\r
  96 }\r
  97 div.dp-popup a {\r
  98         color: #000;\r
  99         text-decoration: none;\r
 100         padding: 3px 2px 0;\r
 101 }\r
 102 div.dp-popup div.dp-nav-prev {\r
 103         position: absolute;\r
 104         top: 2px;\r
 105         left: 4px;\r
 106         width: 100px;\r
 107 }\r
 108 div.dp-popup div.dp-nav-prev a {\r
 109         float: left;\r
 110 }\r
 111 /* Opera needs the rules to be this specific otherwise it doesn't change the cursor back to pointer after you have disabled and re-enabled a link */\r
 112 div.dp-popup div.dp-nav-prev a, div.dp-popup div.dp-nav-next a {\r
 113         cursor: pointer;\r
 114 }\r
 115 div.dp-popup div.dp-nav-prev a.disabled, div.dp-popup div.dp-nav-next a.disabled {\r
 116         cursor: default;\r
 117 }\r
 118 div.dp-popup div.dp-nav-next {\r
 119         position: absolute;\r
 120         top: 2px;\r
 121         right: 4px;\r
 122         width: 100px;\r
 123 }\r
 124 div.dp-popup div.dp-nav-next a {\r
 125         float: right;\r
 126 }\r
 127 div.dp-popup a.disabled {\r
 128         cursor: default;\r
 129         color: #aaa;\r
 130 }\r
 131 div.dp-popup td {\r
 132         cursor: pointer;\r
 133 }\r
 134 div.dp-popup td.disabled {\r
 135         cursor: default;\r
 136 }