Use ng-class for optional or conditional styles.

Author: g1eb

src/date-input.html

@@ -1,7 +1,6 @@
 <div class="datetime-input date">
-  <div class="{{cssClass || 'display'}}"
-    ng-click="toggleEditPopover()"
-    ng-class="{'active': !!selected }">
+  <div ng-click="toggleEditPopover()"
+    ng-class="{'active': !!selected, 'display': !cssClass, '{{cssClass}}': !!cssClass}">
     <div class="date" ng-bind="date.format('DD MMMM YYYY')"></div>
     <div ng-if="!date" class="placeholder" ng-bind="placeholder"></div>
   </div>

src/datetime-input.html

@@ -1,7 +1,6 @@
 <div class="datetime-input datetime">
-  <div class="{{cssClass || 'display'}}"
-    ng-click="toggleEditPopover()"
-    ng-class="{'active': !!selected }">
+  <div ng-click="toggleEditPopover()"
+    ng-class="{'active': !!selected, 'display': !cssClass, '{{cssClass}}': !!cssClass}">
     <div class="date" ng-bind="datetime.format('DD MMMM YYYY')"></div>
     <div class="time" ng-bind="datetime.format('HH : mm : ss')"></div>
     <div ng-if="!datetime" class="placeholder" ng-bind="placeholder"></div>

src/time-input.html

@@ -1,7 +1,6 @@
 <div class="datetime-input time">
-  <div class="{{cssClass || 'display'}}"
-    ng-click="toggleEditPopover()"
-    ng-class="{'active': !!selected }">
+  <div ng-click="toggleEditPopover()"
+    ng-class="{'active': !!selected, 'display': !cssClass, '{{cssClass}}': !!cssClass}">
     <div class="time" ng-bind="time.format('HH : mm : ss')"></div>
     <div ng-if="!time" class="placeholder" ng-bind="placeholder"></div>
   </div>