themes/blog/jscalendar/calendar-win2k-1.css

   1 /* The main calendar widget.  DIV containing a table. */
   2
   3 .calendar {
   4     position: relative;
   5     display: none;
   6     border-top: 2px solid #fff;
   7     border-right: 2px solid #000;
   8     border-bottom: 2px solid #000;
   9     border-left: 2px solid #fff;
  10     font-size: 11px;
  11     color: #000;
  12     cursor: default;
  13     background: #d4d0c8;
  14     font-family: tahoma, verdana, sans-serif;
  15 }
  16
  17 .calendar table {
  18     border-top: 1px solid #000;
  19     border-right: 1px solid #fff;
  20     border-bottom: 1px solid #fff;
  21     border-left: 1px solid #000;
  22     font-size: 11px;
  23     color: #000;
  24     cursor: default;
  25     background: #d4d0c8;
  26     font-family: tahoma, verdana, sans-serif;
  27 }
  28
  29 /* Header part -- contains navigation buttons and day names. */
  30
  31 .calendar .button {
  32     /* "<<", "<", ">", ">>" buttons have this class */
  33     text-align: center;
  34     padding: 1px;
  35     border-top: 1px solid #fff;
  36     border-right: 1px solid #000;
  37     border-bottom: 1px solid #000;
  38     border-left: 1px solid #fff;
  39 }
  40
  41 .calendar .nav {
  42     background: transparent url(menuarrow.gif) no-repeat 100% 100%;
  43 }
  44
  45 .calendar thead .title {
  46     /* This holds the current "month, year" */
  47     font-weight: bold;
  48     padding: 1px;
  49     border: 1px solid #000;
  50     background: #848078;
  51     color: #fff;
  52     text-align: center;
  53 }
  54
  55 .calendar thead .headrow {
  56     /* Row <TR> containing navigation buttons */
  57 }
  58
  59 .calendar thead .daynames {
  60     /* Row <TR> containing the day names */
  61 }
  62
  63 .calendar thead .name {
  64     /* Cells <TD> containing the day names */
  65     border-bottom: 1px solid #000;
  66     padding: 2px;
  67     text-align: center;
  68     background: #f4f0e8;
  69 }
  70
  71 .calendar thead .weekend {
  72     /* How a weekend day name shows in header */
  73     color: #f00;
  74 }
  75
  76 .calendar thead .hilite {
  77     /* How do the buttons in header appear when hover */
  78     border-top: 2px solid #fff;
  79     border-right: 2px solid #000;
  80     border-bottom: 2px solid #000;
  81     border-left: 2px solid #fff;
  82     padding: 0px;
  83     background-color: #e4e0d8;
  84 }
  85
  86 .calendar thead .active {
  87     /* Active (pressed) buttons in header */
  88     padding: 2px 0px 0px 2px;
  89     border-top: 1px solid #000;
  90     border-right: 1px solid #fff;
  91     border-bottom: 1px solid #fff;
  92     border-left: 1px solid #000;
  93     background-color: #c4c0b8;
  94 }
  95
  96 /* The body part -- contains all the days in month. */
  97
  98 .calendar tbody .day {
  99     /* Cells <TD> containing month days dates */
 100     width: 2em;
 101     text-align: right;
 102     padding: 2px 4px 2px 2px;
 103 }
 104
 105 .calendar tbody .day.othermonth {
 106     font-size: 80%;
 107     color: #aaa;
 108 }
 109
 110 .calendar tbody .day.othermonth.oweekend {
 111     color: #faa;
 112 }
 113
 114 .calendar table .wn {
 115     padding: 2px 3px 2px 2px;
 116     border-right: 1px solid #000;
 117     background: #f4f0e8;
 118 }
 119
 120 .calendar tbody .rowhilite td {
 121     background: #e4e0d8;
 122 }
 123
 124 .calendar tbody .rowhilite td.wn {
 125     background: #d4d0c8;
 126 }
 127
 128 .calendar tbody td.hilite {
 129     /* Hovered cells <TD> */
 130     padding: 1px 3px 1px 1px;
 131     border-top: 1px solid #fff;
 132     border-right: 1px solid #000;
 133     border-bottom: 1px solid #000;
 134     border-left: 1px solid #fff;
 135 }
 136
 137 .calendar tbody td.active {
 138     /* Active (pressed) cells <TD> */
 139     padding: 2px 2px 0px 2px;
 140     border-top: 1px solid #000;
 141     border-right: 1px solid #fff;
 142     border-bottom: 1px solid #fff;
 143     border-left: 1px solid #000;
 144 }
 145
 146 .calendar tbody td.selected {
 147     /* Cell showing selected date */
 148     font-weight: bold;
 149     border-top: 1px solid #000;
 150     border-right: 1px solid #fff;
 151     border-bottom: 1px solid #fff;
 152     border-left: 1px solid #000;
 153     padding: 2px 2px 0px 2px;
 154     background: #e4e0d8;
 155 }
 156
 157 .calendar tbody td.weekend {
 158     /* Cells showing weekend days */
 159     color: #f00;
 160 }
 161
 162 .calendar tbody td.today {
 163     /* Cell showing today date */
 164     font-weight: bold;
 165     color: #00f;
 166 }
 167
 168 .calendar tbody .disabled {
 169     color: #999;
 170 }
 171
 172 .calendar tbody .emptycell {
 173     /* Empty cells (the best is to hide them) */
 174     visibility: hidden;
 175 }
 176
 177 .calendar tbody .emptyrow {
 178     /* Empty row (some months need less than 6 rows) */
 179     display: none;
 180 }
 181
 182 /* The footer part -- status bar and "Close" button */
 183
 184 .calendar tfoot .footrow {
 185     /* The <TR> in footer (only one right now) */
 186 }
 187
 188 .calendar tfoot .ttip {
 189     /* Tooltip (status bar) cell <TD> */
 190     background: #f4f0e8;
 191     padding: 1px;
 192     border: 1px solid #000;
 193     background: #848078;
 194     color: #fff;
 195     text-align: center;
 196 }
 197
 198 .calendar tfoot .hilite {
 199     /* Hover style for buttons in footer */
 200     border-top: 1px solid #fff;
 201     border-right: 1px solid #000;
 202     border-bottom: 1px solid #000;
 203     border-left: 1px solid #fff;
 204     padding: 1px;
 205     background: #e4e0d8;
 206 }
 207
 208 .calendar tfoot .active {
 209     /* Active (pressed) style for buttons in footer */
 210     padding: 2px 0px 0px 2px;
 211     border-top: 1px solid #000;
 212     border-right: 1px solid #fff;
 213     border-bottom: 1px solid #fff;
 214     border-left: 1px solid #000;
 215 }
 216
 217 /* Combo boxes (menus that display months/years for direct selection) */
 218
 219 .calendar .combo {
 220     position: absolute;
 221     display: none;
 222     width: 4em;
 223     top: 0px;
 224     left: 0px;
 225     cursor: default;
 226     border-top: 1px solid #fff;
 227     border-right: 1px solid #000;
 228     border-bottom: 1px solid #000;
 229     border-left: 1px solid #fff;
 230     background: #e4e0d8;
 231     font-size: 90%;
 232     padding: 1px;
 233     z-index: 100;
 234 }
 235
 236 .calendar .combo .label,
 237 .calendar .combo .label-IEfix {
 238     text-align: center;
 239     padding: 1px;
 240 }
 241
 242 .calendar .combo .label-IEfix {
 243     width: 4em;
 244 }
 245
 246 .calendar .combo .active {
 247     background: #c4c0b8;
 248     padding: 0px;
 249     border-top: 1px solid #000;
 250     border-right: 1px solid #fff;
 251     border-bottom: 1px solid #fff;
 252     border-left: 1px solid #000;
 253 }
 254
 255 .calendar .combo .hilite {
 256     background: #048;
 257     color: #fea;
 258 }
 259
 260 .calendar td.time {
 261     border-top: 1px solid #000;
 262     padding: 1px 0px;
 263     text-align: center;
 264     background-color: #f4f0e8;
 265 }
 266
 267 .calendar td.time .hour,
 268 .calendar td.time .minute,
 269 .calendar td.time .ampm {
 270     padding: 0px 3px 0px 4px;
 271     border: 1px solid #889;
 272     font-weight: bold;
 273     background-color: #fff;
 274 }
 275
 276 .calendar td.time .ampm {
 277     text-align: center;
 278 }
 279
 280 .calendar td.time .colon {
 281     padding: 0px 2px 0px 3px;
 282     font-weight: bold;
 283 }
 284
 285 .calendar td.time span.hilite {
 286     border-color: #000;
 287     background-color: #766;
 288     color: #fff;
 289 }
 290
 291 .calendar td.time span.active {
 292     border-color: #f00;
 293     background-color: #000;
 294     color: #0f0;
 295 }