@ecl/ec-component-logo

ECL Logos

Stats

StarsIssuesVersionUpdatedCreatedSize
@ecl/ec-component-logo
1.6.02 years ago3 years agoMinified + gzip package size for @ecl/ec-component-logo in KB

Readme

EC logo

Default EC logo.

<a href="https://ec.europa.eu" class="ecl-logo" title="European Commission">
  <span class="ecl-u-sr-only">European Commission</span>
</a>

Or using Twig:

{% include '@ecl/ec-component-logo' with {
  'href': 'https://ec.europa.eu',
  'title': 'European Commission',
} %}

EC logotype

EC logo with text. Add ecl-logo--logotype class to use it:

<a href="https://ec.europa.eu" class="ecl-logo ecl-logo--logotype" title="European Commission">
  <span class="ecl-u-sr-only">European Commission</span>
</a>

Or using Twig:

{% include '@ecl/ec-component-logo' with {
  'href': 'https://ec.europa.eu',
  'title': 'European Commission',
  'type': 'right',
} %}

EC logotype with text below the logo

EC logo with text below. Add ecl-logo--logotypebelow class to use it:

<a href="https://ec.europa.eu" class="ecl-logo ecl-logo--logotypebelow" title="European Commission">
  <span class="ecl-u-sr-only">European Commission</span>
</a>

Or using Twig:

{% include '@ecl/ec-component-logo' with {
  'href': 'https://ec.europa.eu',
  'title': 'European Commission',
  'type': 'below',
} %}

External classes

Additionally, you can add external classes with the extra_class optional parameter.

For example:

{% include '@ecl/ec-component-logo' with {
  'href': 'https://ec.europa.eu',
  'title': 'Home - European Commission',
  'type': 'right',
  'extra_classes': 'site-header__logo'
} %}

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.