Add `trueCenter` property to the `<Hero>` component

[ieedan]

Would just be a flag property.

This would add a margin / spacer below the slot content equal to the exclusionHeight property.

[ieedan]

This would substitute doing this

<Hero exclusionHeight={107}>
    <Text type="h3">Nothing has been setup yet.</Text>
    <Spacer h={10}/>
    <Text color="secondary">Get started with a template?</Text>
    <Spacer h={15}/>
    <div class="flex place-items-center gap-4">
        <Button color="secondary-light">
            Lets Go
        </Button>
        <Button color="abort-active">
            I'll do it on my own
        </Button>
      </div>
     <!-- Add a spacer at the bottom equal to exclusion height 
            this causes the content to properly center                   
      -->
    <Spacer h={107}/>
</Hero>