<template>
  <div class="content_body" :style="{ padding }">
    <!-- title -->
    <slot name="header">
      <!-- 页面头部 -->
    </slot>
    <!-- game-list -->
    <div
      class="list-box"
      :style="{backgroundColor}"
    >
      <game-list :list="list"></game-list>
    </div>
  </div>
</template>
<script setup lang="ts">
import { ref, onMounted, reactive } from "vue";

const props = defineProps({
  list: {
    type: Array as PropType<Array<CustomObject>>,
    default: [],
    required: true,
  },
  backgroundColor: {
    type: String,
    default: "#21212a",
    required: false,
  },
  padding: {
    type: String,
    default: 0,
    required: true,
  },
});
onMounted(async () => {});
</script>
<style lang="scss" scoped>
.content_body {
  .list-box {
    padding-top: 0.1rem;
  }
}
</style>
