rev |
line source |
paulo@103
|
1 /* =========================================================
|
paulo@103
|
2 * Bootstrap year calendar v1.1.0
|
paulo@103
|
3 * Repo: https://github.com/Paul-DS/bootstrap-year-calendar
|
paulo@103
|
4 * =========================================================
|
paulo@103
|
5 * Created by Paul David-Sivelle
|
paulo@103
|
6 *
|
paulo@103
|
7 * Licensed under the Apache License, Version 2.0 (the "License");
|
paulo@103
|
8 * you may not use this file except in compliance with the License.
|
paulo@103
|
9 * You may obtain a copy of the License at
|
paulo@103
|
10 *
|
paulo@103
|
11 * http://www.apache.org/licenses/LICENSE-2.0
|
paulo@103
|
12 *
|
paulo@103
|
13 * Unless required by applicable law or agreed to in writing, software
|
paulo@103
|
14 * distributed under the License is distributed on an "AS IS" BASIS,
|
paulo@103
|
15 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
paulo@103
|
16 * See the License for the specific language governing permissions and
|
paulo@103
|
17 * limitations under the License.
|
paulo@103
|
18 * ========================================================= */
|
paulo@103
|
19
|
paulo@103
|
20 /* Main */
|
paulo@103
|
21 .calendar {
|
paulo@103
|
22 padding: 4px;
|
paulo@103
|
23 -webkit-border-radius: 4px;
|
paulo@103
|
24 -moz-border-radius: 4px;
|
paulo@103
|
25 border-radius: 4px;
|
paulo@103
|
26 overflow: auto;
|
paulo@103
|
27 direction: ltr;
|
paulo@103
|
28
|
paulo@103
|
29 -webkit-touch-callout: none;
|
paulo@103
|
30 -webkit-user-select: none;
|
paulo@103
|
31 -khtml-user-select: none;
|
paulo@103
|
32 -moz-user-select: none;
|
paulo@103
|
33 -ms-user-select: none;
|
paulo@103
|
34 user-select: none;
|
paulo@103
|
35 }
|
paulo@103
|
36
|
paulo@103
|
37 .calendar.calendar-rtl {
|
paulo@103
|
38 direction: rtl;
|
paulo@103
|
39 }
|
paulo@103
|
40 .calendar.calendar-rtl table tr td span {
|
paulo@103
|
41 float: right;
|
paulo@103
|
42 }
|
paulo@103
|
43
|
paulo@103
|
44 .calendar table {
|
paulo@103
|
45 margin: auto;
|
paulo@103
|
46 }
|
paulo@103
|
47
|
paulo@103
|
48 .calendar table td,
|
paulo@103
|
49 .calendar table th {
|
paulo@103
|
50 text-align: center;
|
paulo@103
|
51 width: 20px;
|
paulo@103
|
52 height: 20px;
|
paulo@103
|
53 border: none;
|
paulo@103
|
54 padding: 4px 5px;
|
paulo@103
|
55 font-size:12px;
|
paulo@103
|
56 }
|
paulo@103
|
57
|
paulo@103
|
58 /* Header */
|
paulo@103
|
59 .calendar .calendar-header
|
paulo@103
|
60 {
|
paulo@103
|
61 width:100%;
|
paulo@103
|
62 margin-bottom:20px;
|
paulo@103
|
63 }
|
paulo@103
|
64
|
paulo@103
|
65 .calendar .calendar-header table
|
paulo@103
|
66 {
|
paulo@103
|
67 width:100%;
|
paulo@103
|
68 }
|
paulo@103
|
69
|
paulo@103
|
70 .calendar .calendar-header table th
|
paulo@103
|
71 {
|
paulo@103
|
72 font-size:22px;
|
paulo@103
|
73 padding:5px 10px;
|
paulo@103
|
74 }
|
paulo@103
|
75
|
paulo@103
|
76 .calendar .calendar-header table th:hover {
|
paulo@103
|
77 background: #eeeeee;
|
paulo@103
|
78 cursor: pointer;
|
paulo@103
|
79 }
|
paulo@103
|
80
|
paulo@103
|
81 .calendar .calendar-header table th.disabled,
|
paulo@103
|
82 .calendar .calendar-header table th.disabled:hover {
|
paulo@103
|
83 background: none;
|
paulo@103
|
84 cursor: default;
|
paulo@103
|
85 color:white;
|
paulo@103
|
86 }
|
paulo@103
|
87
|
paulo@103
|
88 .calendar .calendar-header table th.prev,
|
paulo@103
|
89 .calendar .calendar-header table th.next
|
paulo@103
|
90 {
|
paulo@103
|
91 width:20px;
|
paulo@103
|
92 }
|
paulo@103
|
93
|
paulo@103
|
94 .calendar .year-title {
|
paulo@103
|
95 font-weight:bold;
|
paulo@103
|
96 text-align:center;
|
paulo@103
|
97 height:20px;
|
paulo@103
|
98 width:auto;
|
paulo@103
|
99 }
|
paulo@103
|
100
|
paulo@103
|
101 .calendar .year-neighbor
|
paulo@103
|
102 {
|
paulo@103
|
103 color:#aaaaaa;
|
paulo@103
|
104 }
|
paulo@103
|
105
|
paulo@103
|
106 .calendar .year-neighbor2
|
paulo@103
|
107 {
|
paulo@103
|
108 color:#dddddd;
|
paulo@103
|
109 }
|
paulo@103
|
110
|
paulo@103
|
111 /* Months */
|
paulo@103
|
112 .calendar .months-container {
|
paulo@103
|
113 width:100%;
|
paulo@103
|
114 display:none;
|
paulo@103
|
115 }
|
paulo@103
|
116
|
paulo@103
|
117 .calendar .month-container {
|
paulo@103
|
118 min-width:180px;
|
paulo@103
|
119 text-align:center;
|
paulo@103
|
120 height:200px;
|
paulo@103
|
121 padding:0;
|
paulo@103
|
122 }
|
paulo@103
|
123
|
paulo@103
|
124 .calendar table.month th.month-title
|
paulo@103
|
125 {
|
paulo@103
|
126 font-size:16px;
|
paulo@103
|
127 padding-bottom: 5px;
|
paulo@103
|
128 }
|
paulo@103
|
129
|
paulo@103
|
130 .calendar table.month th.day-header
|
paulo@103
|
131 {
|
paulo@103
|
132 font-size:14px;
|
paulo@103
|
133 }
|
paulo@103
|
134
|
paulo@103
|
135
|
paulo@103
|
136 .calendar table.month tr td,
|
paulo@103
|
137 .calendar table.month tr th
|
paulo@103
|
138 {
|
paulo@103
|
139 padding:0;
|
paulo@103
|
140 }
|
paulo@103
|
141
|
paulo@103
|
142 .calendar table.month td.week-number {
|
paulo@103
|
143 cursor: default;
|
paulo@103
|
144 font-weight:bold;
|
paulo@103
|
145 border-right:1px solid #eee;
|
paulo@103
|
146 padding:5px;
|
paulo@103
|
147 }
|
paulo@103
|
148
|
paulo@103
|
149 .calendar .round-left {
|
paulo@103
|
150 -webkit-border-radius: 8px 0 0 8px;
|
paulo@103
|
151 -moz-border-radius: 8px 0 0 8px;
|
paulo@103
|
152 border-radius: 8px 0 0 8px;
|
paulo@103
|
153 }
|
paulo@103
|
154
|
paulo@103
|
155 .calendar .round-right {
|
paulo@103
|
156 webkit-border-radius: 0 8px 8px 0 ;
|
paulo@103
|
157 -moz-border-radius: 0 8px 8px 0;
|
paulo@103
|
158 border-radius: 0 8px 8px 0;
|
paulo@103
|
159 }
|
paulo@103
|
160
|
paulo@103
|
161 .calendar table.month tr td .day-content {
|
paulo@103
|
162 -webkit-border-radius: 4px;
|
paulo@103
|
163 -moz-border-radius: 4px;
|
paulo@103
|
164 border-radius: 4px;
|
paulo@103
|
165 padding: 5px 6px;
|
paulo@103
|
166 }
|
paulo@103
|
167
|
paulo@103
|
168 .table-striped .calendar table.month tr td,
|
paulo@103
|
169 .table-striped .calendar table.month tr th {
|
paulo@103
|
170 background-color: transparent;
|
paulo@103
|
171 }
|
paulo@103
|
172
|
paulo@103
|
173 .calendar table.month td.day .day-content:hover {
|
paulo@103
|
174 background: rgba(0, 0, 0, 0.2);
|
paulo@103
|
175 cursor: pointer;
|
paulo@103
|
176 }
|
paulo@103
|
177 .calendar table.month tr td.old,
|
paulo@103
|
178 .calendar table.month tr td.new,
|
paulo@103
|
179 .calendar table.month tr td.old:hover,
|
paulo@103
|
180 .calendar table.month tr td.new:hover {
|
paulo@103
|
181 background: none;
|
paulo@103
|
182 cursor: default;
|
paulo@103
|
183 }
|
paulo@103
|
184 .calendar table.month tr td.disabled,
|
paulo@103
|
185 .calendar table.month tr td.disabled:hover {
|
paulo@103
|
186 color: #dddddd;
|
paulo@103
|
187 }
|
paulo@103
|
188
|
paulo@103
|
189 .calendar table.month td.day.disabled .day-content:hover {
|
paulo@103
|
190 background: none;
|
paulo@103
|
191 cursor: default;
|
paulo@103
|
192 }
|
paulo@103
|
193
|
paulo@103
|
194 .calendar table.month tr td.range .day-content {
|
paulo@103
|
195 background: rgba(0, 0, 0, 0.2);
|
paulo@103
|
196 -webkit-border-radius: 0;
|
paulo@103
|
197 -moz-border-radius: 0;
|
paulo@103
|
198 border-radius: 0;
|
paulo@103
|
199 }
|
paulo@103
|
200
|
paulo@103
|
201 .calendar table.month tr td.range.range-start .day-content {
|
paulo@103
|
202 border-top-left-radius:4px;
|
paulo@103
|
203 border-bottom-left-radius:4px;
|
paulo@103
|
204 }
|
paulo@103
|
205
|
paulo@103
|
206 .calendar table.month tr td.range.range-end .day-content {
|
paulo@103
|
207 border-top-right-radius:4px;
|
paulo@103
|
208 border-bottom-right-radius:4px;
|
paulo@103
|
209 }
|
paulo@103
|
210
|
paulo@103
|
211 .calendar-context-menu,
|
paulo@103
|
212 .calendar-context-menu .submenu {
|
paulo@103
|
213 border: 1px solid #ddd;
|
paulo@103
|
214 background-color: white;
|
paulo@103
|
215 box-shadow: 2px 2px 5px rgba(0, 0, 0, .2);
|
paulo@103
|
216 -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, .2);
|
paulo@103
|
217 position:absolute;
|
paulo@103
|
218 display:none;
|
paulo@103
|
219 }
|
paulo@103
|
220
|
paulo@103
|
221 .calendar-context-menu .item {
|
paulo@103
|
222 padding:5px 10px;
|
paulo@103
|
223 cursor:pointer;
|
paulo@103
|
224 display:table;
|
paulo@103
|
225 width:100%;
|
paulo@103
|
226 }
|
paulo@103
|
227
|
paulo@103
|
228 .calendar-context-menu .item:hover {
|
paulo@103
|
229 background:#eee;
|
paulo@103
|
230 }
|
paulo@103
|
231
|
paulo@103
|
232 .calendar-context-menu .item .content {
|
paulo@103
|
233 display:table-cell;
|
paulo@103
|
234 }
|
paulo@103
|
235
|
paulo@103
|
236 .calendar-context-menu .item span {
|
paulo@103
|
237 display:table-cell;
|
paulo@103
|
238 padding-left:10px;
|
paulo@103
|
239 text-align:right;
|
paulo@103
|
240 }
|
paulo@103
|
241
|
paulo@103
|
242 .calendar-context-menu .item span:last-child {
|
paulo@103
|
243 display:none;
|
paulo@103
|
244 }
|
paulo@103
|
245
|
paulo@103
|
246 .calendar-context-menu .submenu {
|
paulo@103
|
247 left: 100%;
|
paulo@103
|
248 margin-top: -6px;
|
paulo@103
|
249 }
|
paulo@103
|
250
|
paulo@103
|
251 .calendar-context-menu .item:hover > .submenu {
|
paulo@103
|
252 display:block;
|
paulo@103
|
253 }
|