No notes defined.

<figure class=" testimonial">
    <blockquote class="testimonial__quote">
        It was an honor to work with Imarc. They demonstrated, very early on, a true ability to understand our business and solve for our needs—create a new intranet site, one that would increase engagement and foster community. Imarc delivered incredible results, taking our former site to new heights. We couldn’t be happier with their work and subject matter expertise.
    <figcaption class="testimonial__attribution">
        <div class=" avatar">
            <div class="avatar__container">
                <img class='avatar__photo' src="data:image/svg+xml,<svg xmlns='' height='72' width='72' viewBox='0 0 1 1'><rect width='1' height='1' fill='%230001'/></svg>" alt="Jane Doe" />
                <div class="avatar__name">
                    Jane Doe
                <div class="avatar__title">
                    Executive Vice President of Operations
  • Content:
    @use "/resources/styles/common" as *;
    @use "/resources/styles/config";
    .testimonial {
        $b: &;
        --testimonial-color: var(--color, #{config.$plain-text});
        --testimonial-color-attribution: var(--color-attribution, #{config.$meta-text});
        --testimonial-color-punctuation: var(--color-punctuation, #{config.$primary});
        display: grid;
        grid-template: "quote" "attribution";
        &__quote {
            border: 0;
            font-size: 1.25rem;
            max-width: 66.67%;
            margin-left: auto;
            margin-right: auto;
            color: var(--testimonial-color);
            &::before {
                color: var(--testimonial-color-punctuation);
                content: '”';
                display: inline-block;
                font-size: 400%;
                height: 1rem;
                line-height: 0;
                transform: translateY(150%);
                vertical-align: middle;
            &::before {
                content: '“';
                text-indent: -2.5rem;
        &__attribution {
            justify-self: center;
            color: var(--testimonial-color-attribution);
            @include at(lg) {
                justify-self: end;
  • URL: /components/raw/testimonial/_index.scss
  • Filesystem Path: resources/styles/molecules/testimonial/_index.scss
  • Size: 1.2 KB