38 lines
1.5 KiB
Vue
38 lines
1.5 KiB
Vue
<script lang="ts" setup>
|
|
const emit = defineEmits(["close", "validate"]);
|
|
defineProps({
|
|
visible: Boolean
|
|
});
|
|
</script>
|
|
<template>
|
|
<div :class="`modal${visible ? ' visible' : ''}`">
|
|
<section class="modal-content">
|
|
<header class="modal-content-header">
|
|
<h1>CGU</h1>
|
|
<button class="close_modal" @click="$emit('close')">
|
|
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M1.6 16L0 14.4L6.4 8L0 1.6L1.6 0L8 6.4L14.4 0L16 1.6L9.6 8L16 14.4L14.4 16L8 9.6L1.6 16Z"
|
|
fill="#1C1B1F"/>
|
|
</svg>
|
|
<span>Fermer</span>
|
|
</button>
|
|
</header>
|
|
<main class="modal-content-body">
|
|
<p>
|
|
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto consequatur, consequuntur et expedita libero
|
|
non soluta sunt ullam vel velit voluptatibus voluptatum? Accusamus blanditiis est obcaecati temporibus velit. Dicta
|
|
doloribus eveniet id incidunt suscipit. Accusamus ad aspernatur at aut, beatae laboriosam modi natus nemo, officia
|
|
perspiciatis porro quisquam, totam vel.
|
|
</p>
|
|
</main>
|
|
<footer class="modal-content-footer">
|
|
<button class="button orange" @click="emit('validate')">Accepter</button>
|
|
</footer>
|
|
</section>
|
|
<div class="modal-overlay" @click="$emit('close')"></div>
|
|
</div>
|
|
</template>
|
|
<style scoped lang="scss">
|
|
@import "assets/css/modal";
|
|
</style>
|