oa/documentation/block/v-block-center-documentation.md

Centered align

You can adjust the <VBlock /> component flex alignment using the center prop. This will apply the flex property align-items: center; to the component.

<template>
  <VBlock
    title="Anna B."
    subtitle="UX Designer"
    center
  >
    <template #icon>
      <VAvatar
        size="medium"
        picture="https://media.cssninja.io/content/avatars/19.jpg"
        badge="/images/icons/flags/germany.svg"
      />
    </template>
    <template #action>
      <VButton color="primary" elevated>
        View
      </VButton>
    </template>
  </VBlock>
</template>

View