<template>
  <div class="content-form-section">
    <h2 class="content-form-section__heading">
      {{ title }}
    </h2>
    <slot />
  </div>
</template>

<script>
  export default {
    props: {
      title: {
        type: String,
        default: ''
      }
    }
  };
</script>

<style scoped lang="scss">
  @import '~styles/helpers';

  .content-form-section {
    @include default-box-shadow;
    border-radius: $default-border-radius;
    padding: $small-spacing $medium-spacing;
    margin-bottom: $medium-spacing;

    &__heading {
      @include heading-4;
    }
  }
</style>
