<template>
  <Hero
    :slots="[['1fr', '3fr']]"
    :tablet-slots="[[]]"
    padding-size="3xl"
    class="heromodule-container"
  >
    <template #1-2>
      <ShortcutsListing
        :border="false"
        :background="true"
        :background-color="$_theme('colorLight')"
      />
    </template>
  </Hero>
</template>

<script>
import Hero from '@inside-commons/components/lib/Hero'

import ShortcutsListing from '@inside-users/components/lib/ShortcutsListing'

export default {
  name: 'Heromodule',
  components: { Hero, ShortcutsListing }
}
</script>

<style lang="scss">
.heromodule-container {
  padding-top: 80px !important;
}
</style>
