<script setup lang="ts">
const props = defineProps<{
    image: string,
    imageRight?: boolean | string
}>()

let imagePosition = "sm:flex-row";
if(props.imageRight == true || props.imageRight == "true") imagePosition = "sm:flex-row-reverse"
</script>

<template>
<div :class="imagePosition" class="flex mt-5 mb-4 flex-col">
    <img class="object-contain sm:max-w-[40%] sm:max-h-[350px] max-h-[300px] max-w-[80%] sm:ml-4 sm:mr-20 m-auto" :src="props.image" />
    <p class="self-center ml-5 sm:mt-2 mt-4">
        <slot />
    </p>
</div>
</template>
