Initial public commit

codesignd/2-blocks/service/service.config.php

@@ -0,0 +1,17 @@
+<?php
+
+return [
+	'defaults' => [
+		'illustration' => false,
+		'title'        => 'Lorem ipsum dolor',
+		'coloredTitle' => true,
+		'text'         => '<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptas repellendus modi ea praesentium totam, earum, accusamus pariatur cumque.</p>'
+	],
+	'preview' => function() {
+		// Use a random service illustration if we have one
+		$page = page('services');
+		$illustration = ($page)? $page->images()->shuffle()->first()->url() : false;
+		
+		return compact('illustration');
+	}
+];

codesignd/2-blocks/service/service.html.php

@@ -0,0 +1,10 @@
+<section class="service illustrated-text illustrated-text--decorative text">
+	<?php if($illustration): ?>
+	<img class="illustrated-text__sidebar" src="<?= $illustration ?>" alt="">
+	<?php endif ?>
+	
+	<div class="service__description illustrated-text__main">
+		<h2 class="service__title<?php e($coloredTitle, ' service__title--colored') ?>"><?= html($title) ?></h2>
+		<?= $text ?>
+	</div>
+</section>

codesignd/2-blocks/service/service.scss

@@ -0,0 +1,24 @@
+.service {
+	// Make the illustrations overlap
+	&:not(:first-of-type) {
+		margin-top: -0.5em;
+		
+		@media (max-width: 50em) {
+			margin-top: -0.25em;
+		}
+	}
+}
+
+.service__description {
+	.service:not(:last-of-type) & {
+		margin-bottom: 2em;
+	}
+	
+	:last-child {
+		margin-bottom: 0;
+	}
+}
+
+.service__title--colored::first-letter {
+	color: $color--brand-secondary;
+}