7.4 #permalink Tile
A tile like the one used in the featured projects section
Examples
Default styling
large
large tiles
Markup
<div class="grid-12 grid-lg-6 grid-spacer tile-[modifier class] js-tileMain">
<script type="text/javascript" src="/styleguide/public/tile.js"></script>
<script type='text/javascript'>
var outputRoot = document.getElementsByClassName("tile-[modifier class]")[0];
var tile = gg.templates.tile({
size : "[modifier class]",
projectUrl : "/20304/",
projectTitle: "Main Text",
imgSrc : "/pfil/20304/pict_featured.jpg",
preText : "Small text above main text",
srcset : "/pfil/20304/pict_featured.jpg 480w, pfil/20304/pict_featured_large.jpg 920w, /pfil/20304/pict_featured_jumbo.jpg 1840w",
srcsizes : "(min-width: 64em) 50vw, 100vw",
});
outputRoot.innerHTML = tile;
</script>
</div>
Source:
modules/07_large_elements/tile.less
, line 4