<script setup>
const props = defineProps({
  itemSides: Object,
  titleData: Array,
});
</script>

<template>
  <div>
    <template v-for="(title, index) in titleData" :key="index">
      <div
        class="title-font item-style"
        :style="{ ...itemSides, left: itemSides.width * index }"
      >
        {{ title }}
      </div>
    </template>
  </div>
</template>

<style>
@import "../FontStyle.css";
</style>

<style scoped>
.item-style {
  text-align: center;
}
</style>