<template
is="ui-testimonial"
logo="object"
text="string"
avatar="object"
name="string"
role="string"
>
<div class="ui-testimonial">
<div class="ui-testimonial-content">
<img
if="props.logo?.asset?.url"
src="{{props.logo.asset.url |> esc}}"
alt="{{props.logo?.alt |> esc}}"
class="ui-testimonial-logo"
/>
<figure class="ui-testimonial-quote">
<blockquote>
<div if="props.text" class="text">{{props.text}}</div>
</blockquote>
<figcaption>
<img
if="props.avatar?.asset?.url"
src="{{props.avatar.asset.url |> esc}}"
alt="{{props.avatar?.alt |> esc}}"
class="avatar"
/>
<div class="ui-testimonial-author">
<div if="props.name" class="ui-testimonial-name">
{{props.name |> esc}}
</div>
<div if="props.role" class="ui-testimonial-role">
{{props.role |> esc}}
</div>
</div>
</figcaption>
</figure>
</div>
</div>
</template>
