HAML & Vue settings block helper component

What does this MR do and why?

Adds a helper component for the settings block. Also updates the Vue implementation with Tailwind classes and that the two components share the same structure and class names.

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Screenshots or screen recordings

Collapsed	Expanded

Usage

HAML: http://gdk.test:3000/rails/lookbook/inspect/layouts/settings_block/default

= render ::Layouts::SettingsBlockComponent.new(_('Settings block title'), id: 'settings-block-id', expanded: true) do |c|
  - c.with_description do
    = _('Settings block description')
  - c.with_body do
    = _('Settings block content')

Vue: http://localhost:9002/?path=/story/vue-shared-settings-settings-block--default

<script>
  import SettingsBlock from '~/vue_shared/components/settings_block.vue';
</script>

<template>
  <settings-block title="Settings block title" id="settings-block-id">
    <template #description>
      <!-- Description slot -->
    </template>

    <!-- Body slot -->
  </settings-block>
</template>

Related to #457239 (closed)