/**
* @Author Think
* @Date 2018/11/24
*/

<template>
  <section :class="cusClass" class="content">
    <slot/>
  </section>
</template>

<script>
export default {
  name: 'HContent',
  props: {
    cusClass: {
      type: String,
      default: '',
    },
  },
}
</script>

<style lang="less">
  .content {
    flex: 1;
    overflow: hidden;
    background-color: #fafafa;
    position: relative;
    overflow-y: scroll;
    height: 100%;
  }

  // iPhoneX适配
  @media (device-width: 375px) and (device-height: 812px) and (-webkit-min-device-pixel-ratio: 3) {
    .platform-ios {
      .has-header {
        top: 84px;
      }
    }
  }

  // iPhoneX Max适配
  @media (device-width: 414px) and (device-height: 896px) {
    .platform-ios {
      .has-header {
        top: 84px;
      }
    }
  }
</style>
