Open Close
Teva VIsion
Font Face
Teva Sans Latin
Drafts & Templates
PBS Templates
Primitives & components context
Teva SCS
Primitives & components: Teva SCS

Country Select Link

v0.0.0

The Country Select Link shows a link with a flag.

The Country Select Link is part of Country Select component.

alt text
Mexico
 
<!-- Country Select Link  -->
<a class="vi-country-select-link" href="#mx-7b7b28" hreflang="mx">
  <!-- Media object (mods: --gap-10) -->
  <div class="vi-media-object vi-media-object--gap-10">
    <!-- Media object figure with (mods: --w-20) -->
    <div class="vi-media-object__figure vi-media-object__figure--w-20">
      <div class="vi-circular-image"><img alt="alt text" draggable="false" loading="lazy" src="/assets/images/flags/square/mx_80x80.png"></div>
    </div>
    <div class="align-self-center vi-media-object__body">
      <div class="vi-country-select-link__label">Mexico</div>
    </div>
  </div>
</a>

Stylesheets #

The following stylesheets are required to display this component.

Usage documentation #

Usage documentation can be found here.

Changelog #

Changelog

Added

  • hreflang attribute with example LANGUAGE codes.
  • Initial draft