ACV Footer

The 'AcvFooter' component is a structured and customizable terminating section of an interface.

It offers two sections — 'side' and 'actions' — for tailored content and aims to enhance usability with flexbox layout, a clean divider, and encapsulated styles.

It's an ideal option for placing additional information or call-to-action elements at the end of a page or a modal in a Vue application.

Basic usage

Source code

<script setup>
  import AcvButton from '@/components/button/button.vue';
  import AcvFooter from '@/components/footer/footer.vue';
</script>

<template>
  <AcvFooter>
    <AcvButton
      type="secondary"
    >
      Button
    </AcvButton>
    <AcvButton
      type="primary"
    >
      Button
    </AcvButton>
  </AcvFooter>
</template>

Link usage

Link

Text usage

Text

Primary and Link

Link

Primary and Text

Text

Related components

• Button
• Link

Slots

Name	Description	Bindings
side	Used to pass a custom side content (text or link by design)
default	The default slot content (for buttons by design)

Slots

Name	Description	Bindings
side	Used to pass a custom side content (text or link by design)
default	The default slot content (for buttons by design)