fix(VDateTable): events alignment on current date (#10367)

fixes #8182
vuetifyjs · Jan 29, 2020 · fc2eaa5 · fc2eaa5
1 parent 92e77a2
commit fc2eaa5
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 2 deletions.
diff --git a/packages/vuetify/src/components/VDatePicker/VDatePickerTable.sass b/packages/vuetify/src/components/VDatePicker/VDatePickerTable.sass
@@ -77,5 +77,8 @@
 .v-date-picker-table--month .v-date-picker-table__events
   bottom: $date-picker-event-date-bottom
 
+.v-date-picker-table__current .v-date-picker-table__events
+  margin-bottom: -1px
+
 .v-date-picker-table--disabled
   pointer-events: none
diff --git a/...ify/src/components/VDatePicker/__tests__/__snapshots__/VDatePickerMonthTable.spec.ts.snap b/...ify/src/components/VDatePicker/__tests__/__snapshots__/VDatePickerMonthTable.spec.ts.snap
@@ -45,7 +45,7 @@ exports[`VDatePickerMonthTable.ts should render component and match snapshot (mu
         </td>
         <td>
           <button type="button"
-                  class="v-btn v-size--default v-btn--outlined theme--light accent--text"
+                  class="v-btn v-size--default v-date-picker-table__current v-btn--outlined theme--light accent--text"
           >
             <div class="v-btn__content">
               May
@@ -170,7 +170,7 @@ exports[`VDatePickerMonthTable.ts should render component and match snapshot 1`]
         </td>
         <td>
           <button type="button"
-                  class="v-btn v-size--default v-btn--outlined theme--light accent--text"
+                  class="v-btn v-size--default v-date-picker-table__current v-btn--outlined theme--light accent--text"
           >
             <div class="v-btn__content">
               May

diff --git a/packages/vuetify/src/components/VDatePicker/mixins/date-picker-table.ts b/packages/vuetify/src/components/VDatePicker/mixins/date-picker-table.ts
@@ -77,6 +77,7 @@ export default mixins(
     genButtonClasses (isAllowed: boolean, isFloating: boolean, isSelected: boolean, isCurrent: boolean) {
       return {
         'v-size--default': !isFloating,
+        'v-date-picker-table__current': isCurrent,
         'v-btn--active': isSelected,
         'v-btn--flat': !isAllowed || this.disabled,
         'v-btn--text': isSelected === isCurrent,