wisbey’s gists

wisbey / gist:6592356

Created September 17, 2013 10:01 — forked from sta1r/gist:5765210

	<?php
	// PHP is useful for conditional logic where the HTML structure is very different - e.g.

	$number_of_highlight_boxes = '<t4 type="content" name="Number of boxes" output="normal" modifiers="" />';

	if ($number_of_highlight_boxes == "1") { /* write some HTML / } else { / write some more HTML */ }

	?>

	<!--

wisbey / media-block-two-up-full-width

Last active December 20, 2015 16:39

Media block two up full width

	<div class="row">
	<div class="l-content-full-width block __media two-up">
	<h2>Media block (2 up)</h2>
	<ul>
	<li class="region">
	<figure>
	<a href="" title=""><img src="http://placehold.it/1000x500&text=img" alt="Image Alt"></a>
	<div class="credits">This would be the credits, if applicable</div>
	<figcaption>
	This is a information for the image above, it can be either accreditation or a caption. This should not run more than 2 lines. (optional)

wisbey / media-block-aside

Last active December 20, 2015 16:39

Media block with aside

	<div class="row">
	<div class="l-content-full-width block __media __with-aside">
	<h2>Media block with aside</h2>
	<div class="row">
	<div class="l-content">
	<figure>
	<img src="http://placehold.it/1000x500&text=img" alt="Image Alt">
	<div class="credits">Pete Richardson 'i love this place' MA Fashion and Tetiles.</div>
	<figcaption>
	This is a information for the image above, it can be either accreditation or a caption. This should not run more than 2 lines. (optional)

wisbey / media-block-two-up

Created August 6, 2013 10:21

Media blocks - 2 up

	<div class="row">
	<div class="l-content-full-width block __media two-up">
	<h2>Media block (2 up)</h2>
	<ul>
	<li class="region">
	<figure class="feature">
	<a href="" title=""><img src="http://placehold.it/1000x500&text=img" alt="Image Alt"></a>
	<div class="credits">This would be the credits, if applicable</div>
	<figcaption>
	This is a information for the image above, it can be either accreditation or a caption. This should not run more than 2 lines. (optional)

wisbey / media-block

Last active December 20, 2015 16:39

Standard media block

	<div class="row">
	<div class="l-content-full-width block __media">
	<a id="component-name" class="in-page-link"></a>
	<h2>Media block</h2>
	<div class="row">
	<figure>
	<a href="" title=""><img src="http://placehold.it/1000x500&text=img" alt="Image Alt"></a>
	<div class="credits">Image credits will go here</div>
	<figcaption>
	This is a information for the image above, it can be either accreditation or a caption. This should not run more than 2 lines. (optional)

wisbey / text-block-aside

Created August 6, 2013 09:41

Text block with and aside

	<div class="row">
	<div class="l-content block __text __with-aside">
	<h2>Text block with aside</h2>
	<p class="leader">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce nulla turpis, ullamcorper congue pharetra sit amet.</p>
	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ut libero in velit suscipit pretium. Proin non quam consequat, varius libero a, volutpat nulla. Cras at ligula vitae magna venenatis vehicula eu nec metus. Aliquam erat volutpat. Quisque sagittis, lacus molestie egestas porttitor, nunc sapien dictum odio, vel sollicitudin felis ante vitae urna. Cras sit amet mi ipsum. Sed nec pharetra diam, id venenatis enim. Duis id libero condimentum, vulputate nisl non, scelerisque lorem. Vivamus auctor odio at arcu adipiscing scelerisque. Donec elementum sem odio, sit amet ullamcorper ligula mattis non. Maecenas rhoncus adipiscing neque a tempus.</p>
	<p><a href="#" class="button-link"><span class="hide-descriptive-text">Follow this link to go to more informa

wisbey / text-block

Last active December 20, 2015 16:39

Standard text block component

	<div class="row">
	<div class="l-content block __text">
	<h2>Text block</h2>
	<p class="leader">lorem ipsum dolor sit amet, consectetur adipiscing elit. fusce nulla turpis, ullamcorper congue pharetra sit amet.</p>
	<p>lorem ipsum dolor sit amet, consectetur adipiscing elit. vestibulum ut libero in velit suscipit pretium. proin non quam consequat, varius libero a, volutpat nulla. cras at ligula vitae magna venenatis vehicula eu nec metus. aliquam erat volutpat. quisque sagittis, lacus molestie egestas porttitor, nunc sapien dictum odio, vel sollicitudin felis ante vitae urna. cras sit amet mi ipsum. sed nec pharetra diam, id venenatis enim. duis id libero condimentum, vulputate nisl non, scelerisque lorem. vivamus auctor odio at arcu adipiscing scelerisque. donec elementum sem odio, sit amet ullamcorper ligula mattis non. maecenas rhoncus adipiscing neque a tempus.</p>
	<p><a href="#" class="button-link"><span class="hide-descriptive-text">follow this link to go to more information about</span>opt

wisbey / pull-quote

Created August 5, 2013 16:34

Pull quote

	<div class="l-content-full-width">
	<p class="pull-quote">Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui.</p>
	</div>

wisbey / lead-body-copy

Created August 5, 2013 16:13

Lead body copy

<p class='leader">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus malesuada, dui ut rhoncus ultrices, mauris lorem eleifend libero, in pretium augue magna vel elit.</p>

<p>Fusce auctor tincidunt quam ut pharetra. In eleifend ut odio a luctus. Nullam vehicula libero tortor, vitae laoreet mi aliquam a. Sed mattis velit eu libero posuere rhoncus. Aenean elementum eget sapien et porta. Fusce sem dui, tristique eget quam quis, sollicitudin vestibulum lectus. Phasellus lacinia consequat eros nec malesuada. Morbi sagittis justo risus, sit amet pharetra enim malesuada sit amet. Morbi ac justo sed ipsum ullamcorper imperdiet eget consectetur urna. In hac habitasse platea dictumst. Cras et turpis vel sem fringilla sodales. Proin sit amet interdum orci. Donec convallis, enim at eleifend adipiscing, arcu est vestibulum eros, non porttitor dui ipsum quis enim. Praesent tincidunt tempus libero id dictum. Proin semper nisi sed neque mattis, at sodales nulla condimentum.</p>

wisbey / html5-doctype

Created August 5, 2013 13:31

html5 doctype

	<!DOCTYPE html>
	<html lang="en">
	...
	</html>

Matt Wisbey wisbey