Section Top Digital Ecosystem
The VSectionTopDigitalEcosystem component is a tailored implementation of the VSectionTop component. It is designed to highlight digital ecosystems with a customizable background image, dynamic responsive behavior, and flexible text content.
Props
| Name | Type | Required | Description |
|---|---|---|---|
data | IDigitalTop | true | Object containing section content and image data. |
getInTouchUrl | String | false | URL for the "Get in Touch" button. |
useCaseUrl | String | false | URL for the "Use Case" button. |
IDigitalTop Interface
The data prop should adhere to the IDigitalTop interface:
tagText(string, optional): Tagline or label for the section.title(string, optional): Main title for the section.subtitle(string, optional): Subtitle for the section.imageMobile(string, optional): URL for the mobile version of the background image.image(string, optional): URL for the desktop version of the background image.text(string, optional): Descriptive text for the section.
Slots
right: Displays a responsive background image.
Example Usage
vue
<script setup lang="ts">
import VSectionTopDigitalEcosystem from 'UiKit/components/VSectionTop/VSectionTopDigitalEcosystem.vue';
</script>
<template>
<VSectionTopDigitalEcosystem
:data="{
tagText: 'Explore',
title: 'Digital Ecosystems',
subtitle: 'Revolutionize Your Workflow',
imageMobile: '/images/digital-ecosystem/Rectangle-4-_3_.webp',
image: '/images/digital-ecosystem/Rectangle-4-_2_.webp',
text: 'Leverage cutting-edge tools for your business.'
}"
getInTouchUrl="/contact"
useCaseUrl="/use-case"
/>
</template>