1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
|
/* Time Picker
*
* Styling the Time Picker consists of the following:
*
* 1. minor time values
* .dijitTimePickerTick - set text color, size, background color of minor values
* .dijitTimePickerTickHover - set hover style of minor time values
* dijitTimePickerTickSelected - set selected style of minor time values
*
* 2. major time values - 1:00, 2:00, times on the hour
* set text color, size, background color, left/right margins for "zoom" affect
* .dijitTimePickerMarkerHover - to set hover style of major time values
* .dijitTimePickerMarkerSelected - set selected style of major time values
*
* 3. up and down arrow buttons
* .dijitTimePicker .dijitButtonNode - background-color, border
* .dijitTimePicker .dijitUpArrowHover, .dijitTimePicker .dijitDownArrowHover - set background-color for hover state
*
* Other classes provide the fundamental structure of the TimePicker and should not be modified.
*/
/* override Button.css */
.claro .dijitTimePicker .dijitButtonNode {
padding: 0 0;
-moz-border-radius: 0;
border-radius: 0;
}
.claro .dijitTimePicker {
border: 1px #b5bcc7 solid;
border-top: none;
border-bottom: none;
background-color: #fff;
/* TODO: useless? Appears to be overridden by settings on individual elements */
}
.claro .dijitTimePickerItem {
/* dijitTimePickerItem refers to both Tick's (minor values like 2:15, 2:30, 2:45) and Marker's (major values like 2PM, 3PM) */
background-image: url("images/standardGradient.png");
background-repeat: repeat-x;
background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -o-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
background-image: linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
_background-image: none;
border-top: solid 1px #b5bcc7;
border-bottom: solid 1px #b5bcc7;
margin-right: -1px;
margin-left: -1px;
margin-top: -1px;
}
.claro .dijitTimePickerTick {
/* minor value */
color: #818181;
background-color: #efefef;
font-size: 0.818em;
}
.claro .dijitTimePickerMarker {
/* major value - 1:00, 2:00, times on the hour */
background-color: #e5f2fe;
font-size: 1em;
white-space: nowrap;
}
.claro .dijitTimePickerTickHover,
.claro .dijitTimePickerMarkerHover,
.claro .dijitTimePickerMarkerSelected,
.claro .dijitTimePickerTickSelected {
background-color: #7dbdfa;
border: solid 1px #b5bcc7;
margin-left: -7px;
margin-right: -7px;
color: #000000;
}
.claro .dijitTimePickerMarkerSelected, .claro .dijitTimePickerTickSelected {
font-size: 1em;
}
.dj_ie .claro .dijitTimePickerTickHover,
.dj_ie .claro .dijitTimePickerMarkerHover,
.dj_ie .claro .dijitTimePickerMarkerSelected,
.dj_ie .claro .dijitTimePickerTickSelected {
width: 114%;
}
.dj_ie6 .claro .dijitTimePickerTickHover,
.dj_ie6 .claro .dijitTimePickerMarkerHover,
.dj_ie6 .claro .dijitTimePickerMarkerSelected,
.dj_ie6 .claro .dijitTimePickerTickSelected {
position: relative;
/* creates widening of element */
zoom: 1;
/* creates widening of element */
}
.claro .dijitTimePickerTick .dijitTimePickerItemInner {
padding: 1px;
margin: 0;
}
.claro .dijitTimePicker .dijitButtonNode {
border-left: none;
border-right: none;
border-color: #b5bcc7;
background-color: #efefef;
background-image: url("images/standardGradient.png");
background-repeat: repeat-x;
background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -o-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
background-image: linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
_background-image: none;
}
.claro .dijitTimePicker .dijitArrowButtonInner {
height: 100%;
/* hack claro.button.css */
background-image: url("form/images/commonFormArrows.png");
background-repeat: no-repeat;
background-position: -140px 45%;
}
.claro .dijitTimePicker .dijitDownArrowButton .dijitArrowButtonInner {
background-position: -35px 45%;
}
/* hover */
.claro .dijitTimePicker .dijitUpArrowHover, .claro .dijitTimePicker .dijitDownArrowHover {
background-color: #abd6ff;
}
.claro .dijitTimePicker .dijitUpArrowHover .dijitArrowButtonInner {
background-position: -175px 45%;
}
.claro .dijitTimePicker .dijitDownArrowHover .dijitArrowButtonInner {
background-position: -70px 45%;
}
|
