Vebego Component Library

Search Result 

<div class="mol-search-result js--clickable">
    <span class="atm-heading h-subtitle">Facility management</span>

    <a class="atm-link " href="#" title="This is what a link looks like" aria-label="" target="">Lorem ipsum</a>
    <div class="atm-paragraph ">
        <p>Wil je je facilitaire organisatie (her)inrichten? Heb je een facilitair vraagstuk waar je zelf niet uitkomt of waarvoor tijdelijk de capaciteit ontbreekt</p>
    </div>

</div>
 
<div class="mol-search-result js--clickable">
    {{render '@heading' category}}
    {{render '@link' title merge=true}}
    {{!-- {{#each tag}}{{render '@tag--link-sm' this merge=true}}{{/each}} --}}
    {{render '@paragraph' paragraph}}
</div>
 
{
  "category": {
    "tag": "span",
    "modifier": "h-subtitle",
    "text": "Facility management"
  },
  "title": {
    "text": "Lorem ipsum",
    "href": "#"
  },
  "tag": [
    {
      "text": "Blog"
    },
    {
      "text": "Content"
    }
  ],
  "paragraph": {
    "text": "Wil je je facilitaire organisatie (her)inrichten? Heb je een facilitair vraagstuk waar je zelf niet uitkomt of waarvoor tijdelijk de capaciteit ontbreekt"
  }
}
  • Content: 
    .mol-search-result {
    .atm-tag {
        @apply mr-2;
    }

    .atm-link {
        @apply text-black;
        @apply font-bold;
        @apply text-h5;
        @apply no-underline hover:underline;
        @apply mr-4;
        @apply my-1;
        @apply inline-block;
    }

    .atm-paragraph {
        @apply mt-2;
    }
}
  • URL: /components/raw/search-result/search-result.css
  • Filesystem Path: src\components\03-molecules\search-result\search-result.css
  • Size: 349 Bytes

No notes defined.