site_logiciels/components/Layout/UI/TitlePage.vue

<template>
  <div>
    <h1 class="title text-center">{{ title }}</h1>
    <h2 v-if="subtitle" class="subtitle text-center">{{ subtitle }}</h2>
  </div>
</template>

<script setup>
import { defineProps } from 'vue';

const props = defineProps({
  title: String,
  subtitle: String,
});
</script>

<style scoped>

.text-center {
  text-align: center;
}

.title {
  font-size: 4rem;
  line-height: 3.5rem;
  letter-spacing: .3rem;
  margin-top: 2rem;
  margin-bottom: 2rem;
  text-transform: uppercase;
}


.subtitle {
  font-size: 1.5rem;
  line-height: 2rem;
  letter-spacing: .5rem;
  margin-bottom: 8rem;
  text-transform: uppercase;

}
</style>