Improve styles of date of birth field

web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/components/Address.vue

@@ -39,10 +39,10 @@
                         <input id="firstName" type="text" v-model="address.firstName" class="form-control">
                     </div>
                     <div class="form-group">
-                        <label for="dateOfBirth" class="control-label">
+                        <label class="control-label">
                             Geburtsdatum:
                         </label>
-                        <input id="dateOfBirth" type="text" ref="picker" class="form-control datepicker--visible">
+                        <span ref="picker"></span>
                     </div>
                 </div>
                 <div class="col-xs-12 col-md-6">
@@ -127,6 +127,7 @@
                 this.picker = $(this.$refs.picker).flatpickr({
                     dateFormat: 'd.m.Y',
                     locale: German,
+                    inline: true,
                     onChange: (selectedDates) => {
                         this.address.dateOfBirth = flatpickr.formatDate(selectedDates[0], 'Y-m-d')
                     }

web/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/remix/_datepicker.scss

@@ -42,8 +42,12 @@
 
   &.inline {
     border: 1px solid $color-grey-light;
+  }
+
+  &.centered {
     margin: 0 auto 16px;
   }
+
 }
 
 .flatpickr-day {
@@ -57,6 +61,9 @@
 }
 
 .flatpickr-day.selected {
+  background: $color-brand-secondary;
+  border-color: $color-brand-secondary;
+
   &.startRange, &.endRange {
     background: $color-brand-secondary;
     border-color: $color-brand-secondary;