Reflect kaizumaki/covid19:feature/pr-5443

Tokyo-Metro-Gov · Sep 29, 2020 · 78b7531 · 78b7531
1 parent 0f08d8a
commit 78b7531
Showing 1 changed file with 12 additions and 6 deletions.
diff --git a/components/cards/CardRow.vue b/components/cards/CardRow.vue
@@ -45,11 +45,11 @@ const options: ThisTypedComponentOptionsWithRecordProps<
 
       const [self, side] = this.cardElements
       if (self) {
-        self.style.height = ''
+        self.style.maxHeight = ''
         self.dataset.height = `${self.offsetHeight}`
       }
       if (side) {
-        side.style.height = ''
+        side.style.maxHeight = ''
         side.dataset.height = `${side.offsetHeight}`
       }
     },
@@ -61,10 +61,10 @@ const options: ThisTypedComponentOptionsWithRecordProps<
       self.dataset.height = self.dataset.height || `${self.offsetHeight}`
       side.dataset.height = side.dataset.height || `${side.offsetHeight}`
 
-      self.style.height =
-        self.style.height === 'auto' ? `${self.dataset.height}px` : 'auto'
-      side.style.height =
-        side.style.height === 'auto' ? 'auto' : `${side.dataset.height}px`
+      self.style.maxHeight =
+        self.style.maxHeight === '100%' ? `${self.dataset.height}px` : '100%'
+      side.style.maxHeight =
+        side.style.maxHeight === '100%' ? '100%' : `${side.dataset.height}px`
     },
   },
   computed: {
@@ -98,3 +98,9 @@ const options: ThisTypedComponentOptionsWithRecordProps<
 
 export default Vue.extend(options)
 </script>
+
+<style lang="scss">
+.DataCard {
+  transition: max-height 0.3s;
+}
+</style>