@inherits Dynamicweb.Rendering.ViewModelTemplate<Dynamicweb.Frontend.ParagraphViewModel>
@using Dynamicweb.Frontend;

<div class="card h-100 shadow-lg" itemscope itemtype="https://schema.org/Quotation">
    <div class="card-body text-center">       
        @if (Model.Item.TryGetString("Quote", out string quote))
        {
            <div class="icon-6 pe-none text-body text-opacity-25 mb-3">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 30" fill="currentColor">
                    <path 
                        d="m9.563 8.469-.813-1.25c-5.625 3.781-8.75 8.375-8.75 12.156 0 3.656 2.688 5.375 4.969 5.375 2.875 0 4.906-2.438 4.906-5 0-2.156-1.375-4-3.219-4.688-.531-.188-1.031-.344-1.031-1.25 0-1.156.844-2.875 3.938-5.344zm12.406 0-.813-1.25c-5.563 3.781-8.75 8.375-8.75 12.156 0 3.656 2.75 5.375 5.031 5.375 2.906 0 4.969-2.438 4.969-5 0-2.156-1.406-4-3.313-4.688-.531-.188-1-.344-1-1.25 0-1.156.875-2.875 3.875-5.344z"/>
                </svg>
            </div>
            <blockquote class="blockquote" itemprop="text">
                <div class="fs-5 lh-sm mb-0-last-child text-body">
                    @quote
                </div>
            </blockquote>
        }
    </div>
    @if (Model.Item.TryGetString("Author", out string author))
    {
        <div class="card-footer text-center border-top-0 p-0">
            @if (Model.Item.TryGetImageFile("AuthorImage", out ImageFileViewModel authorImage))
            {
                <figure style="margin:-40px 0 0;">
                    <img class="img-thumbnail rounded-circle" src="@authorImage.ToGetImage(new(){ Width = 80, Quality = 90, Ratio = "1/1" })" alt="@authorImage.Name" height="80" width="80">
                </figure>
            }
            <div class="my-3">
                <div class="fs-6 m-0 text-muted text-opacity-75" itemprop="author">
                    @author
                </div>
            </div>
        </div>
    }
</div>
