Internetstiftelsen Styleguide

Tag 

<a href="#" class="a-tag">cyberspace</a>
 
<a href="{{href}}" class="a-tag{{#if is_light}} a-tag--light{{/if}}{{#if background_color}} a-tag--background-{{background_color}}{{/if}}">{{text}}</a>
 
{
  "text": "cyberspace",
  "href": "#"
}
  • Content: 
    @charset 'UTF-8';

/// @group Tags
@include atom(tag) {
	@extend %normalize-links;

	@extend %tag;

	display: inline-block;
	position: relative;
	z-index: z_index(middleground);
	margin-right: rhythm(1);
	margin-bottom: rhythm(1);
	padding: rhythm(1) rhythm(2);
	font-size: $small-text;
	line-height: 1;
	text-decoration: none;
	text-transform: uppercase;

	&--background {
		@include color_values($colors, 'background-color', $separator: '-');
		@include color_values($colors, 'border-color', $separator: '-');
	}

	@include m(light) {
		@extend %tag-light;
	}
}
  • URL: /components/raw/tag/_tag.scss
  • Filesystem Path: src/atoms/tag/_tag.scss
  • Size: 564 Bytes

No notes defined.