Vebego Component Library

Company 

<div class="mol-company">
    <div>
        <picture class="atm-image ">
            <img class="" src="https://picsum.photos/290/130" alt="">
        </picture>
    </div>
    <div>
        <a class="atm-button atm-button-primary button-md  ">
            <span class="button-content">
                <span>Lees de klantcase</span>

            </span>
            <span class="button-triangle"></span>
        </a>

    </div>
</div>
 
<div class="mol-company">
    <div>
        {{ render '@image' image }}
    </div>
    <div>
        {{ render '@button-primary' }}
    </div>
</div>
 
{
  "image": {
    "src": "https://picsum.photos/290/130"
  }
}
  • Content: 
    .mol-company {
    @apply border border-solid border-cta border-opacity-50;
    @apply p-12;
    @apply text-center;
    @apply h-full;
    @apply flex flex-col justify-center;

    .atm-image {
        @apply h-32 relative;

        img {
            @apply max-w-[290px] max-h-32 absolute m-0 top-1/2 left-1/2;
            transform: translate(-50%, -50%);
        }
    }

    .atm-button {
        @apply mt-12 mr-0;
    }
}
  • URL: /components/raw/company/company.css
  • Filesystem Path: src\components\03-molecules\company\company.css
  • Size: 449 Bytes

No notes defined.