vigiboard / README / README_jquery / static / css / ui.datepicker.css @ 20fd4838
History | View | Annotate | Download (3.98 KB)
1 |
/* Main Style Sheet for jQuery UI date picker */
|
---|---|
2 |
#datepicker_div, .datepicker_inline { |
3 |
font-family: Arial, Helvetica, sans-serif; |
4 |
font-size: 14px; |
5 |
padding: 0; |
6 |
margin: 0; |
7 |
background: #ddd; |
8 |
width: 185px; |
9 |
} |
10 |
#datepicker_div {
|
11 |
display: none; |
12 |
border: 1px solid #777; |
13 |
z-index: 9999; /*must have*/ |
14 |
} |
15 |
.datepicker_inline {
|
16 |
float: left; |
17 |
display: block; |
18 |
border: 0; |
19 |
} |
20 |
.datepicker_rtl {
|
21 |
direction: rtl; |
22 |
} |
23 |
.datepicker_dialog {
|
24 |
padding: 5px !important; |
25 |
border: 4px ridge #ddd !important; |
26 |
} |
27 |
button.datepicker_trigger { |
28 |
width: 25px; |
29 |
} |
30 |
img.datepicker_trigger { |
31 |
margin: 2px; |
32 |
vertical-align: middle; |
33 |
} |
34 |
.datepicker_prompt {
|
35 |
float: left; |
36 |
padding: 2px; |
37 |
background: #ddd; |
38 |
color: #000; |
39 |
} |
40 |
* html .datepicker_prompt { |
41 |
width: 185px; |
42 |
} |
43 |
.datepicker_control, .datepicker_links, .datepicker_header, .datepicker { |
44 |
clear: both; |
45 |
float: left; |
46 |
width: 100%; |
47 |
color: #fff; |
48 |
} |
49 |
.datepicker_control {
|
50 |
background: #400; |
51 |
padding: 2px 0px; |
52 |
} |
53 |
.datepicker_links {
|
54 |
background: #000; |
55 |
padding: 2px 0px; |
56 |
} |
57 |
.datepicker_control, .datepicker_links { |
58 |
font-weight: bold; |
59 |
font-size: 80%; |
60 |
letter-spacing: 1px; |
61 |
} |
62 |
.datepicker_links label { /* disabled links */ |
63 |
padding: 2px 5px; |
64 |
color: #888; |
65 |
} |
66 |
.datepicker_clear, .datepicker_prev { |
67 |
float: left; |
68 |
width: 34%; |
69 |
} |
70 |
.datepicker_rtl .datepicker_clear, .datepicker_rtl .datepicker_prev { |
71 |
float: right; |
72 |
text-align: right; |
73 |
} |
74 |
.datepicker_current {
|
75 |
float: left; |
76 |
width: 30%; |
77 |
text-align: center; |
78 |
} |
79 |
.datepicker_close, .datepicker_next { |
80 |
float: right; |
81 |
width: 34%; |
82 |
text-align: right; |
83 |
} |
84 |
.datepicker_rtl .datepicker_close, .datepicker_rtl .datepicker_next { |
85 |
float: left; |
86 |
text-align: left; |
87 |
} |
88 |
.datepicker_header {
|
89 |
padding: 1px 0 3px; |
90 |
background: #333; |
91 |
text-align: center; |
92 |
font-weight: bold; |
93 |
height: 1.3em; |
94 |
} |
95 |
.datepicker_header select { |
96 |
background: #333; |
97 |
color: #fff; |
98 |
border: 0px; |
99 |
font-weight: bold; |
100 |
} |
101 |
.datepicker {
|
102 |
background: #ccc; |
103 |
text-align: center; |
104 |
font-size: 100%; |
105 |
} |
106 |
.datepicker a { |
107 |
display: block; |
108 |
width: 100%; |
109 |
} |
110 |
.datepicker_titleRow {
|
111 |
background: #777; |
112 |
} |
113 |
.datepicker_daysRow {
|
114 |
background: #eee; |
115 |
color: #666; |
116 |
} |
117 |
.datepicker_weekCol {
|
118 |
background: #777; |
119 |
color: #fff; |
120 |
} |
121 |
.datepicker_daysCell {
|
122 |
color: #000; |
123 |
border: 1px solid #ddd; |
124 |
} |
125 |
.datepicker_daysCell a{ |
126 |
display: block; |
127 |
} |
128 |
.datepicker_weekEndCell {
|
129 |
background: #ddd; |
130 |
} |
131 |
.datepicker_titleRow .datepicker_weekEndCell { |
132 |
background: #777; |
133 |
} |
134 |
.datepicker_daysCellOver {
|
135 |
background: #fff; |
136 |
border: 1px solid #777; |
137 |
} |
138 |
.datepicker_unselectable {
|
139 |
color: #888; |
140 |
} |
141 |
.datepicker_today {
|
142 |
background: #fcc !important; |
143 |
} |
144 |
.datepicker_currentDay {
|
145 |
background: #999 !important; |
146 |
} |
147 |
.datepicker_status {
|
148 |
background: #ddd; |
149 |
width: 100%; |
150 |
font-size: 80%; |
151 |
text-align: center; |
152 |
} |
153 |
|
154 |
/* ________ Datepicker Links _______
|
155 |
|
156 |
** Reset link properties and then override them with !important */
|
157 |
#datepicker_div a, .datepicker_inline a { |
158 |
cursor: pointer; |
159 |
margin: 0; |
160 |
padding: 0; |
161 |
background: none; |
162 |
color: #000; |
163 |
} |
164 |
.datepicker_inline .datepicker_links a { |
165 |
padding: 0 5px !important; |
166 |
} |
167 |
.datepicker_control a, .datepicker_links a { |
168 |
padding: 2px 5px !important; |
169 |
color: #eee !important; |
170 |
} |
171 |
.datepicker_titleRow a { |
172 |
color: #eee !important; |
173 |
} |
174 |
.datepicker_control a:hover { |
175 |
background: #fdd !important; |
176 |
color: #333 !important; |
177 |
} |
178 |
.datepicker_links a:hover, .datepicker_titleRow a:hover { |
179 |
background: #ddd !important; |
180 |
color: #333 !important; |
181 |
} |
182 |
|
183 |
/* ___________ MULTIPLE MONTHS _________*/
|
184 |
|
185 |
.datepicker_multi .datepicker { |
186 |
border: 1px solid #777; |
187 |
} |
188 |
.datepicker_oneMonth {
|
189 |
float: left; |
190 |
width: 185px; |
191 |
} |
192 |
.datepicker_newRow {
|
193 |
clear: left; |
194 |
} |
195 |
|
196 |
/* ___________ IE6 IFRAME FIX ________ */
|
197 |
|
198 |
.datepicker_cover {
|
199 |
display: none; /*sorry for IE5*/ |
200 |
display/**/: block; /*sorry for IE5*/ |
201 |
position: absolute; /*must have*/ |
202 |
z-index: -1; /*must have*/ |
203 |
filter: mask(); /*must have*/ |
204 |
top: -4px; /*must have*/ |
205 |
left: -4px; /*must have*/ |
206 |
width: 200px; /*must have*/ |
207 |
height: 200px; /*must have*/ |
208 |
} |