Skip to content

Commit 878fa86

Browse files
author
Joseph
committed
- Rounding up plugin.
1 parent e02b7fd commit 878fa86

8 files changed

+642
-1505
lines changed

‎bower.json

+5-5
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
2-
"name": "bootstrap-material-datetimepicker",
3-
"description": ".",
4-
"version": "2.0.0",
2+
"name": "angular-material-datetimepicker",
3+
"description": "A datetime picker for AngularJS Material",
4+
"version": "1.0.0",
55
"keywords": [
66
"css",
77
"js",
@@ -10,9 +10,9 @@
1010
"front-end",
1111
"web"
1212
],
13-
"homepage": "https://github.com/t00rk/bootstrap-material-datetimepicker",
13+
"homepage": "https://logbon72.github.io/angular-material-datetimepicker",
1414
"main": [
15-
"js/bootstrap-material-datetimepicker.js",
15+
"js/angular-material-datetimepicker.js",
1616
"css/bootstrap-material-datetimepicker.css"
1717
],
1818
"ignore": [

‎css/material-datetimepicker.css

+240-49
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,24 @@
11
md-dialog.dtp {
22
font-family: RobotoDraft, Roboto, 'Helvetica Neue', Helvetica, Arial, sans-serif;;
3-
font-size: 10px;
3+
font-size: 14px;
44
line-height: 1.42857143;
55
color: #333;
66
background-color: #fff;
77
}
88

9-
/*html {*/
10-
/*font-size: 10px;*/
11-
/*}*/
129

1310
.dtp table {
1411
border-spacing: 0;
1512
border-collapse: collapse;
1613
width: 100%;
1714
}
1815

19-
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
16+
.dtp .table > tbody > tr > td,
17+
.dtp .table > tbody > tr > th,
18+
.dtp .table > tfoot > tr > td,
19+
.dtp .table > tfoot > tr > th,
20+
.dtp .table > thead > tr > td,
21+
.dtp .table > thead > tr > th {
2022
padding: 8px;
2123
line-height: 1.42857143;
2224
vertical-align: top;
@@ -27,63 +29,252 @@ md-dialog.dtp {
2729
box-sizing: border-box !important;
2830
}
2931

32+
.dtp > .dtp-content {
33+
max-width: 300px;
34+
max-height: 500px;
35+
}
36+
37+
.dtp > .dtp-content > .dtp-date-view > header.dtp-header {
38+
background: #689F38;
39+
color: #fff;
40+
text-align: center;
41+
padding: 3px;
42+
}
43+
44+
.dtp div.dtp-date, .dtp div.dtp-time {
45+
background: #8BC34A;
46+
text-align: center;
47+
color: #fff;
48+
padding: 10px;
49+
}
50+
51+
.dtp div.dtp-date > div {
52+
padding: 0;
53+
margin: 0;
54+
}
55+
56+
.dtp div.dtp-actual-month {
57+
font-size: 1.5em;
58+
}
59+
60+
.dtp div.dtp-actual-num {
61+
font-size: 3em;
62+
line-height: 0.9;
63+
}
64+
65+
.dtp div.dtp-actual-maxtime {
66+
font-size: 3em;
67+
line-height: 0.9;
68+
}
69+
70+
.dtp div.dtp-actual-year {
71+
font-size: 1.5em;
72+
color: #DCEDC8;
73+
}
74+
75+
.dtp div.dtp-picker {
76+
padding: 10px;
77+
text-align: center;
78+
}
79+
80+
.dtp div.dtp-picker-month, .dtp div.dtp-actual-time {
81+
font-weight: 500;
82+
text-align: center;
83+
}
84+
85+
.dtp .dtp-close {
86+
position: absolute;
87+
top: 0.5em;
88+
right: 10px;
89+
}
90+
91+
.dtp .dtp-close > a {
92+
color: #fff;
93+
}
94+
95+
.dtp .dtp-close > a > i {
96+
font-size: 1em;
97+
}
98+
99+
.dtp table.dtp-picker-days {
100+
margin: 0;
101+
min-height: 251px;
102+
}
103+
104+
.dtp table.dtp-picker-days, .dtp table.dtp-picker-days tr, .dtp table.dtp-picker-days tr > td {
105+
border: none;
106+
}
107+
108+
.dtp table.dtp-picker-days tr > td {
109+
font-weight: 700;
110+
font-size: 12px;
111+
text-align: center;
112+
padding: 10px 3px;
113+
}
114+
115+
.dtp table.dtp-picker-days tr > td > span.dtp-select-day {
116+
color: #BDBDBD !important;
117+
}
118+
119+
.dtp table.dtp-picker-days tr > td > a, .dtp .dtp-picker-time > a {
120+
color: #212121;
121+
text-decoration: none;
122+
padding: 4px 5px 5px 6px;
123+
border-radius: 50% !important;
124+
}
125+
126+
.dtp table.dtp-picker-days tr > td > a.selected {
127+
background: #8BC34A;
128+
color: #fff;
129+
}
30130

31-
.dtp > .dtp-content {max-width: 300px; max-height: 500px; }
32-
.dtp > .dtp-content > .dtp-date-view > header.dtp-header { background: #689F38; color: #fff; text-align: center; padding: 0.3rem; }
131+
.dtp table.dtp-picker-days tr > th {
132+
color: #757575;
133+
text-align: center;
134+
font-weight: 700;
135+
padding: 4px 3px;
136+
}
33137

34-
.dtp div.dtp-date, .dtp div.dtp-time { background: #8BC34A; text-align: center; color: #fff; padding: 10px; }
35-
.dtp div.dtp-date > div { padding: 0; margin: 0; }
36-
.dtp div.dtp-actual-month { font-size: 1.5em; }
37-
.dtp div.dtp-actual-num { font-size: 3em; line-height: 0.9; }
38-
.dtp div.dtp-actual-maxtime { font-size: 3em; line-height: 0.9; }
39-
.dtp div.dtp-actual-year { font-size: 1.5em; color: #DCEDC8; }
40-
.dtp div.dtp-picker { padding: 1rem; text-align: center; }
138+
.dtp .p10 > a {
139+
color: #689F38;
140+
text-decoration: none;
141+
}
41142

42-
.dtp div.dtp-picker-month, .dtp div.dtp-actual-time { font-weight: 500; text-align: center; }
143+
.dtp .p10 {
144+
width: 10%;
145+
display: inline-block;
146+
}
43147

44-
.dtp .dtp-close { position: absolute; top: 0.5em; right: 1rem; }
45-
.dtp .dtp-close > a { color: #fff; }
46-
.dtp .dtp-close > a > i { font-size: 1em; }
148+
.dtp .p20 {
149+
width: 20%;
150+
display: inline-block;
151+
}
47152

48-
.dtp table.dtp-picker-days { margin: 0; min-height: 251px;}
49-
.dtp table.dtp-picker-days, .dtp table.dtp-picker-days tr, .dtp table.dtp-picker-days tr > td { border: none; }
50-
.dtp table.dtp-picker-days tr > td { font-weight: 700; font-size: 1.2rem; text-align: center; padding: 1rem 0.3rem; }
51-
.dtp table.dtp-picker-days tr > td > span.dtp-select-day { color: #BDBDBD!important; }
52-
.dtp table.dtp-picker-days tr > td > a, .dtp .dtp-picker-time > a { color: #212121; text-decoration: none; padding: 0.4rem 0.5rem 0.5rem 0.6rem; border-radius: 50%!important; }
53-
.dtp table.dtp-picker-days tr > td > a.selected{ background: #8BC34A; color: #fff; }
54-
.dtp table.dtp-picker-days tr > th { color: #757575; text-align: center; font-weight: 700; padding: 0.4rem 0.3rem; }
153+
.dtp .p60 {
154+
width: 60%;
155+
display: inline-block;
156+
}
55157

56-
.dtp .p10 > a { color: #689F38; text-decoration: none; }
57-
.dtp .p10 { width: 10%; display: inline-block; }
58-
.dtp .p20 { width: 20%; display: inline-block; }
59-
.dtp .p60 { width: 60%; display: inline-block; }
60-
.dtp .p80 { width: 80%; display: inline-block; }
158+
.dtp .p80 {
159+
width: 80%;
160+
display: inline-block;
161+
}
61162

62-
.dtp a.dtp-meridien-am, .dtp a.dtp-meridien-pm { position: relative; top: 10px; color: #212121; font-weight: 500; padding: 0.7rem 0.5rem; border-radius: 50%!important;text-decoration: none; background: #eee; font-size:1rem; }
63-
.dtp .dtp-actual-meridien a.selected { background: #689F38; color: #fff; }
163+
.dtp a.dtp-meridien-am, .dtp a.dtp-meridien-pm {
164+
position: relative;
165+
top: 10px;
166+
color: #212121;
167+
font-weight: 500;
168+
padding: 7px 5px;
169+
border-radius: 50% !important;
170+
text-decoration: none;
171+
background: #eee;
172+
font-size: 10px;
173+
}
64174

65-
.dtp .dtp-picker-time > a { display: block; line-height: 23px; padding: 0.3rem 0.3rem 0.3rem 0.3rem; }
66-
.dtp .dtp-picker-time { position: absolute;width: 30px;height: 30px;font-size: 1em;border-radius: 50%;cursor: pointer;font-weight: 500;text-align: center!important; }
175+
.dtp .dtp-actual-meridien a.selected {
176+
background: #689F38;
177+
color: #fff;
178+
}
67179

68-
.dtp .dtp-picker-time > a.dtp-select-hour.selected { background: #689F38; color: #fff; }
69-
.dtp .dtp-picker-time > a.dtp-select-hour.disabled, .dtp .dtp-picker-time > a.dtp-select-minute.disabled { color: #757575; }
70-
.dtp .dtp-picker-time > a.dtp-select-minute.selected { background: #8BC34A; color: #fff; }
180+
.dtp .dtp-picker-time > a {
181+
display: block;
182+
line-height: 23px;
183+
padding: 3px 3px 3px 3px;
184+
}
71185

72-
.dtp div.dtp-picker-clock { margin: 1rem 2rem 0 2rem; padding: 1rem; border-radius: 50%!important; background: #eee; }
73-
.dtp-clock-center { width: 15px; height: 15px; background: #757575; border-radius: 50%; position: absolute; z-index: 50; }
186+
.dtp .dtp-picker-time {
187+
position: absolute;
188+
width: 30px;
189+
height: 30px;
190+
font-size: 1em;
191+
border-radius: 50%;
192+
cursor: pointer;
193+
font-weight: 500;
194+
text-align: center !important;
195+
}
74196

75-
.dtp .dtp-hand, .dtp .dtp-hour-hand { position: absolute; width: 4px; margin-left: -2px; background: #BDBDBD; -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); -moz-transform-origin: bottom; -ms-transform-origin: bottom; -webkit-transform-origin: bottom; transform-origin: bottom; z-index: 1; }
76-
.dtp .dtp-minute-hand { width: 2px; margin-left: -1px; }
77-
.dtp .dtp-hand.on { background: #8BC34A; }
197+
.dtp .dtp-picker-time > a.dtp-select-hour.selected {
198+
background: #689F38;
199+
color: #fff;
200+
}
78201

79-
.dtp .dtp-buttons { padding: 0 1rem 1rem 1rem; text-align: right; }
202+
.dtp .dtp-picker-time > a.dtp-select-hour.disabled, .dtp .dtp-picker-time > a.dtp-select-minute.disabled {
203+
color: #757575;
204+
}
80205

81-
.dtp.hidden, .dtp .hidden { display: none; }
82-
.dtp .invisible { visibility: hidden; }
206+
.dtp .dtp-picker-time > a.dtp-select-minute.selected {
207+
background: #8BC34A;
208+
color: #fff;
209+
}
83210

84-
.dtp .left { float: left; }
85-
.dtp .right { float: right; }
86-
.dtp .clearfix { clear: both; }
211+
.dtp div.dtp-picker-clock {
212+
margin: 10px 20px 0 20px;
213+
padding: 10px;
214+
border-radius: 50% !important;
215+
background: #eee;
216+
}
217+
218+
.dtp-clock-center {
219+
width: 15px;
220+
height: 15px;
221+
background: #757575;
222+
border-radius: 50%;
223+
position: absolute;
224+
z-index: 50;
225+
}
87226

88-
.dtp .center { text-align: center; }
227+
.dtp .dtp-hand, .dtp .dtp-hour-hand {
228+
position: absolute;
229+
width: 4px;
230+
margin-left: -2px;
231+
background: #BDBDBD;
232+
-moz-transform: rotate(0deg);
233+
-ms-transform: rotate(0deg);
234+
-webkit-transform: rotate(0deg);
235+
transform: rotate(0deg);
236+
-moz-transform-origin: bottom;
237+
-ms-transform-origin: bottom;
238+
-webkit-transform-origin: bottom;
239+
transform-origin: bottom;
240+
z-index: 1;
241+
}
242+
243+
.dtp .dtp-minute-hand {
244+
width: 2px;
245+
margin-left: -1px;
246+
}
247+
248+
.dtp .dtp-hand.on {
249+
background: #8BC34A;
250+
}
251+
252+
.dtp .dtp-buttons {
253+
padding: 0 10px 10px 10px;
254+
text-align: right;
255+
}
256+
257+
.dtp.hidden, .dtp .hidden {
258+
display: none;
259+
}
260+
261+
.dtp .invisible {
262+
visibility: hidden;
263+
}
264+
265+
.dtp .left {
266+
float: left;
267+
}
268+
269+
.dtp .right {
270+
float: right;
271+
}
272+
273+
.dtp .clearfix {
274+
clear: both;
275+
}
276+
277+
.dtp .center {
278+
text-align: center;
279+
}
89280

0 commit comments

Comments
 (0)