import Vue from 'vue'

import slot from '../../utils/slot.js'

export default Vue.extend({
  name: 'QPage',

  inject: {
    pageContainer: {
      default () {
        console.error('QPage needs to be child of QPageContainer')
      }
    },
    layout: {}
  },

  props: {
    padding: Boolean,
    styleFn: Function
  },

  computed: {
    style () {
      const offset =
        (this.layout.header.space === true ? this.layout.header.size : 0) +
        (this.layout.footer.space === true ? this.layout.footer.size : 0)

      if (typeof this.styleFn === 'function') {
        return this.styleFn(offset)
      }

      const height = this.layout.container === true
        ? this.layout.containerHeight
        : this.$q.screen.height

      return { minHeight: (height - offset) + 'px' }
    },

    classes () {
      if (this.padding === true) {
        return 'q-layout-padding'
      }
    }
  },

  render (h) {
    return h('main', {
      staticClass: 'q-page',
      style: this.style,
      class: this.classes,
      on: this.$listeners
    }, slot(this, 'default'))
  }
})

@@ -622,22 +622,35 @@
     
-const h
+return %7B%0A        minH
 eight
- =
+:
  thi
@@ -685,18 +685,21 @@
         
+  
 ? 
+(
 this.lay
@@ -721,69 +721,156 @@
 ight
-%0A        : this.$q.screen.height%0A%0A      return %7B minHeight: (
+ - offset) + 'px'%0A          : (%0A            this.$q.screen.height === 0%0A              ? %60calc(100vh - $%7Boffset%7Dpx)%60%0A              : (this.$q.screen.
 heig
@@ -888,16 +888,34 @@
 ) + 'px'
+%0A          )%0A     
  %7D%0A    %7D

Improve initial size on SSR