Update Timepicker (ColorlibHQ#1354)

With the new one, the widget is not hidden in scrolling container
caoqiang1990 · Jul 14, 2018 · 78a4398 · 78a4398
1 parent e38376e
commit 78a4398
Show file tree

Hide file tree

Showing 4 changed files with 528 additions and 229 deletions.
diff --git a/plugins/timepicker/bootstrap-timepicker.css b/plugins/timepicker/bootstrap-timepicker.css
@@ -23,16 +23,16 @@
   left: auto;
   right: 13px;
 }
-.bootstrap-timepicker .add-on {
+.bootstrap-timepicker .input-group-addon {
   cursor: pointer;
 }
-.bootstrap-timepicker .add-on i {
+.bootstrap-timepicker .input-group-addon i {
   display: inline-block;
   width: 16px;
   height: 16px;
 }
 .bootstrap-timepicker-widget.dropdown-menu {
-  padding: 2px 3px 2px 2px;
+  padding: 4px;
 }
 .bootstrap-timepicker-widget.dropdown-menu.open {
   display: inline-block;
@@ -43,20 +43,44 @@
   border-right: 7px solid transparent;
   content: "";
   display: inline-block;
-  left: 9px;
   position: absolute;
-  top: -7px;
 }
 .bootstrap-timepicker-widget.dropdown-menu:after {
   border-bottom: 6px solid #FFFFFF;
   border-left: 6px solid transparent;
   border-right: 6px solid transparent;
   content: "";
   display: inline-block;
-  left: 10px;
   position: absolute;
+}
+.bootstrap-timepicker-widget.timepicker-orient-left:before {
+  left: 6px;
+}
+.bootstrap-timepicker-widget.timepicker-orient-left:after {
+  left: 7px;
+}
+.bootstrap-timepicker-widget.timepicker-orient-right:before {
+  right: 6px;
+}
+.bootstrap-timepicker-widget.timepicker-orient-right:after {
+  right: 7px;
+}
+.bootstrap-timepicker-widget.timepicker-orient-top:before {
+  top: -7px;
+}
+.bootstrap-timepicker-widget.timepicker-orient-top:after {
   top: -6px;
 }
+.bootstrap-timepicker-widget.timepicker-orient-bottom:before {
+  bottom: -7px;
+  border-bottom: 0;
+  border-top: 7px solid #999;
+}
+.bootstrap-timepicker-widget.timepicker-orient-bottom:after {
+  bottom: -6px;
+  border-bottom: 0;
+  border-top: 6px solid #ffffff;
+}
 .bootstrap-timepicker-widget a.btn,
 .bootstrap-timepicker-widget input {
   border-radius: 4px;
@@ -96,6 +120,7 @@
 }
 .bootstrap-timepicker-widget table td a i {
   margin-top: 2px;
+  font-size: 18px;
 }
 .bootstrap-timepicker-widget table td input {
   width: 25px;