Renamed calendar-toggle header to a more appropriate edit-popover header in datetime-input directive.

Author: g1eb

src/datetime-input.css

@@ -71,20 +71,15 @@
   border: 1px solid #aaa;
   box-sizing: border-box;
 }
-
-
-/**
- * Calendar
- */
-.datetime-input.datetime .calendar-toggle {
+.datetime-input.datetime .edit-popover .header {
   width: 100%;
   color: #777;
   font-size: 1.5em;
   line-height: 2em;
   cursor: pointer;
   transition: background-color 0.25s ease-out;
 }
-.datetime-input.datetime .calendar-toggle::before {
+.datetime-input.datetime .edit-popover .header::before {
   content: "";
   display: block;
   position: absolute;
@@ -104,10 +99,15 @@
   -webkit-transform: rotate(-45deg);
   transition: background-color 0.25s ease-out;
 }
-.datetime-input.datetime .calendar-toggle:hover,
-.datetime-input.datetime .calendar-toggle:hover::before {
+.datetime-input.datetime .edit-popover .header:hover,
+.datetime-input.datetime .edit-popover .header:hover::before {
   background-color: #ddd;
 }
+
+
+/**
+ * Calendar
+ */
 .datetime-input.datetime .calendar .calendar-header {
   cursor: default;
   background-color: #fff;

src/datetime-input.html

@@ -6,7 +6,7 @@
     <div class="time">{{ datetime.format('HH : mm : ss') }}</div>
   </div>
   <div class="edit-popover" ng-show="!!selected">
-    <div class="calendar-toggle"
+    <div class="header"
       ng-click="calendar_active = !calendar_active">
       {{ selected.format('DD MMMM YYYY') }}
     </div>