<section class="ai-testimonial ai-component">
    <div class="ai-container">
        <div class="inner">
            <div class="image">
                <img alt="Stephanie Sohn" src="../../images/bitmap/testimonial-1.jpg" />
                <p class="bold">Stephanie Sohn</p>
                <p class="bold">Product Lead at Riiid</p>
            </div>
            <div class="copy">
                <img class="logo" alt="logo" src="../../images/bitmap/logo-1.png" />
                <h3 class="h4">Why did you decide to start a tech company in / focus on the education sphere?</h3>
                <p>Tincidunt magnis sed lacus tortor. Et duis mollis id adipiscing. Platea eros mauris ullamcorper ullamcorper egestas hac. Eu ante duis dignissim bibendum integer ac. Facilisi enim sodales est dui. Blandit est interdum at enim. Massa mattis ullamcorper metus habitant senectus dictum porttitor et.</p>
                <a class="ai-btn ai-btn-primary" href="">Read more</a>
            </div>
        </div>
    </div>
</section>
<section class="ai-testimonial ai-component">
    <div class="ai-container">
        <div class="inner">
            <div class="image">
                {{#if image}}
                    <img alt="{{{name}}}" src="{{{path image}}}"/>
                {{/if}}
                <p class="bold">{{{name}}}</p>
                <p class="bold">{{{title}}}</p>
            </div>
            <div class="copy">
                {{#if logo}}
                    <img class="logo" alt="logo" src="{{{path logo}}}"/>
                {{/if}}
                <h3 class="h4">{{{heading}}}</h3>
                <p>{{{text}}}</p>
                {{> '@button-primary' button-primary}}
            </div>
        </div>
    </div>
</section>
{
  "image": "/images/bitmap/testimonial-1.jpg",
  "name": "Stephanie Sohn",
  "title": "Product Lead at Riiid",
  "logo": "/images/bitmap/logo-1.png",
  "heading": "Why did you decide to start a tech company in / focus on the education sphere?",
  "text": "Tincidunt magnis sed lacus tortor. Et duis mollis id adipiscing. Platea eros mauris ullamcorper ullamcorper egestas hac. Eu ante duis dignissim bibendum integer ac. Facilisi enim sodales est dui. Blandit est interdum at enim. Massa mattis ullamcorper metus habitant senectus dictum porttitor et.",
  "button-primary": {
    "text": "Read more",
    "class": "ai-btn-primary"
  }
}
  • Content:
    //  testimonial
    
    section{
        &.ai-testimonial{
            padding: 2rem 0;
            border-bottom: 7px solid $lightgrey;
            @media (min-width: $medium) {
                padding: 2rem 0 2rem 0;
            }
            .inner{
                @media (min-width: $medium) {
                    display: flex;
                }
                .image{
                    padding: 0 0 2rem 0;
                    img{
                        padding-bottom: 1rem;
                    }
                    p{
                        padding: 0;
                        margin: 0;
                    }
                    @media (min-width: $medium) {
                        padding: 0;
                        width: 30%;
                    }
                }
                .copy{
                    padding: 0;
                    @media (min-width: $medium) {
                        width: 70%;
                        padding: 0 0 0 3rem;
                    }
                    @media (min-width: $large) {
                        padding: 0 0 0 6rem;
                    }
                    .logo{
                        width: 200px;
                        margin-bottom: 2rem;
                    }
                    h3{
                        padding-bottom: 1rem;
                    }
                    .ai-btn{
                        margin-top: 2rem;
                    }
                }
            }
        }
    }
  • URL: /components/raw/testimonial/testimonial.scss
  • Filesystem Path: src/components/02-components/testimonial/testimonial.scss
  • Size: 1.3 KB

No notes defined.