Styleguide

Initiative link 

<a class="a-initiative-link" href="#">
    <div class="a-initiative-link__image">
        <figure class="a-image a-image--cover">

            <img src="/img/dv.jpg" alt="Initiative image" title="This is a linked image" class="a-image__image a-image__image--fp a-image__image--fp-">

            <figcaption>

            </figcaption>
        </figure>
    </div>
</a>
 
<a class="a-initiative-link" href="{{link}}">
	<div class="a-initiative-link__image">
		{{> @a-image image }}
	</div>
</a>
  • Content: 
    @use "sass:math";
@use "../../../scss/variables" as v;
@use "../../../scss/mixins" as m;

.a-initiative-link {
	@include m.clean-link;

	& {
		display: block;
	}
	@include m.fluid-props(padding-top padding-bottom, v.$fluid-min, v.$fluid-max, 10px, 14px);

	&__image {
		width: 100%;
		@include m.aspect-ratio-box(25%);
	}
}
  • URL: /components/raw/a-initiative-link/_a-initiative-link.scss
  • Filesystem Path: styleguide/src/components/atoms/a-initiative-link/_a-initiative-link.scss
  • Size: 324 Bytes 
{
  "link": "#",
  "image": {
    "image-src": "/img/dv.jpg",
    "alt": "Initiative image",
    "title": "This is a linked image"
  }
}

No notes defined.