Saved: 2018-02-19 09:22

Torey Heinz committed Feb 19, 2018

commit 7caf6b85242f180323ea320dd22073863e52a83b

Showing 4 changed files with 65 additions and 18 deletions

app/views/pages/index.liquid +26 -4

@@	@@ -19,8 +19,8 @@ is_layout: false
	</p>
	</div>
	</header>
-	<section class="featured-services" >
-	<div class="row" data-equalizer data-equalize-on="medium">
+	<section class="services featured" >
+	<div class="row">
	{% with_scope featured: true %}
	{% for service in contents.services %}
	<div class="columns medium-4">
@@	@@ -29,8 +29,29 @@ is_layout: false
	<p class="lead"><a href="{% path_to service %}">{{ service.title }}</a></p>

	</div>
-	<img src="http://via.placeholder.com/650x250">
-	<div class="card-section" data-equalizer-watch>
+	<img src="{{ service.featured_image.url \| resize: '600x450#' }}">
+	<div class="card-section">
+	{{ service.brief }}
+	</div>
+	</div>
+	</div>
+	{% endfor %}
+	{% endwith_scope %}
+	</div>
+	</div>
+
+	<section class="services" >
+	<div class="row small-up-2 medium-up-3 large-up-4" >
+	{% with_scope featured: nil %}
+	{% for service in contents.services %}
+	<div class="columns medium-4">
+	<div class="card text-center">
+	<div class="card-divider">
+	<p class="lead"><a href="{% path_to service %}">{{ service.title }}</a></p>
+
+	</div>
+	<img src="{{ service.featured_image.url \| resize: '400x225#' }}">
+	<div class="card-section">
	{{ service.brief }}
	</div>
	</div>
@@	@@ -40,3 +61,4 @@ is_layout: false
	</div>
	</section>
	{% endblock %}
+

data/services.yml +19 -11

@@	@@ -1,51 +1,59 @@
	- "Contract Sewing":
	brief: "Nam molestiae ipsa non iure sint architecto doloribus"
+	featured_image: /samples/plotter.jpg # Path to a file in the public/samples folder or to a remote and external file.
	featured: true
-	# featured_image: /samples/offering_types/yourfile.txt # Path to a file in the public/samples folder or to a remote and external file.
	description: "Nam molestiae ipsa non iure sint architecto doloribus. Odio non quisquam consectetur delectus natus. Magnam iure aliquid fuga sequi harum qui et. Consequuntur autem eligendi explicabo ratione."

	- "Boat Enclosures":
-	featured_image: /samples/100_1304.jpg # Path to a file in the public/samples folder or to a remote and external file.
	brief: "Id vel expedita asperiores. Explicabo doloremque aliquid."
+	featured_image: /samples/000_0045.jpg # Path to a file in the public/samples folder or to a remote and external file.
	featured: true
	description: "Id vel expedita asperiores. Explicabo doloremque aliquid. Quod non itaque voluptate libero dicta. Aut quis impedit."
	projects: [project-1, project-2, project-3]

	- "Boat Flooring":
-	# featured_image: /samples/offering_types/yourfile.txt # Path to a file in the public/samples folder or to a remote and external file.
	brief: "Enim officia ipsa sunt. Officiis voluptatum doloribus."
+	featured_image: /samples/000_0039.jpg # Path to a file in the public/samples folder or to a remote and external file.
	featured: true
	description: "Enim officia ipsa sunt. Officiis voluptatum doloribus. Error architecto asperiores ut voluptas veritatis. Velit doloribus saepe soluta aut."

	- "Sample 4":
-	# featured_image: /samples/offering_types/yourfile.txt # Path to a file in the public/samples folder or to a remote and external file.
+	brief: "Id vel expedita asperiores. Explicabo doloremque aliquid."
+	featured_image: /samples/000_0034.jpg # Path to a file in the public/samples folder or to a remote and external file.
	description: "Suscipit ab sed commodi. Ducimus impedit unde quia alias. Aperiam hic est laudantium cumque accusamus. Qui rerum doloremque aut quas enim laborum."

	- "Sample 4":
-	# featured_image: /samples/offering_types/yourfile.txt # Path to a file in the public/samples folder or to a remote and external file.
+	brief: "Id vel expedita asperiores. Explicabo doloremque aliquid."
+	featured_image: /samples/000_0030.jpg # Path to a file in the public/samples folder or to a remote and external file.
	description: "Suscipit ab sed commodi. Ducimus impedit unde quia alias. Aperiam hic est laudantium cumque accusamus. Qui rerum doloremque aut quas enim laborum."

	- "Sample 4":
-	# featured_image: /samples/offering_types/yourfile.txt # Path to a file in the public/samples folder or to a remote and external file.
+	brief: "Id vel expedita asperiores. Explicabo doloremque aliquid."
+	featured_image: /samples/000_0028.jpg # Path to a file in the public/samples folder or to a remote and external file.
	description: "Suscipit ab sed commodi. Ducimus impedit unde quia alias. Aperiam hic est laudantium cumque accusamus. Qui rerum doloremque aut quas enim laborum."

	- "Sample 4":
-	# featured_image: /samples/offering_types/yourfile.txt # Path to a file in the public/samples folder or to a remote and external file.
+	brief: "Id vel expedita asperiores. Explicabo doloremque aliquid."
+	featured_image: /samples/000_0018.jpg # Path to a file in the public/samples folder or to a remote and external file.
	description: "Suscipit ab sed commodi. Ducimus impedit unde quia alias. Aperiam hic est laudantium cumque accusamus. Qui rerum doloremque aut quas enim laborum."

	- "Sample 4":
-	# featured_image: /samples/offering_types/yourfile.txt # Path to a file in the public/samples folder or to a remote and external file.
+	brief: "Id vel expedita asperiores. Explicabo doloremque aliquid."
+	featured_image: /samples/000_0019.jpg # Path to a file in the public/samples folder or to a remote and external file.
	description: "Suscipit ab sed commodi. Ducimus impedit unde quia alias. Aperiam hic est laudantium cumque accusamus. Qui rerum doloremque aut quas enim laborum."

	- "Sample 4":
-	# featured_image: /samples/offering_types/yourfile.txt # Path to a file in the public/samples folder or to a remote and external file.
+	brief: "Id vel expedita asperiores. Explicabo doloremque aliquid."
+	featured_image: /samples/000_0026.jpg # Path to a file in the public/samples folder or to a remote and external file.
	description: "Suscipit ab sed commodi. Ducimus impedit unde quia alias. Aperiam hic est laudantium cumque accusamus. Qui rerum doloremque aut quas enim laborum."

	- "Sample 4":
-	# featured_image: /samples/offering_types/yourfile.txt # Path to a file in the public/samples folder or to a remote and external file.
+	brief: "Id vel expedita asperiores. Explicabo doloremque aliquid."
+	featured_image: /samples/100_1304.jpg # Path to a file in the public/samples folder or to a remote and external file.
	description: "Suscipit ab sed commodi. Ducimus impedit unde quia alias. Aperiam hic est laudantium cumque accusamus. Qui rerum doloremque aut quas enim laborum."

	- "Sample 4":
-	# featured_image: /samples/offering_types/yourfile.txt # Path to a file in the public/samples folder or to a remote and external file.
+	brief: "Id vel expedita asperiores. Explicabo doloremque aliquid."
+	featured_image: /samples/000_0045.jpg # Path to a file in the public/samples folder or to a remote and external file.
	description: "Suscipit ab sed commodi. Ducimus impedit unde quia alias. Aperiam hic est laudantium cumque accusamus. Qui rerum doloremque aut quas enim laborum."

public/samples/plotter.jpg +0 -0

public/stylesheets/_featured_services.scss +20 -3

@@	@@ -1,13 +1,30 @@
-	.featured-services {
+	.services {
	margin-top: rem-calc(10);

	.card {
+	position: relative;
	.card-divider {
+	// position: absolute;
+	// top: 0;
+	width: 100%;
+	padding: 0.5rem;
	text-transform: uppercase;
-	background: none;
+	// background: $white;
+	background: $primary-color;
	a {
-	color: $black;
+	// color: $black;
+	color: $white;
	}
	}
+
+	.card-section {
+	padding: 0.5rem;
+	position: absolute;
+	bottom: 0;
+	background: rgba(255, 255, 255, 0.85);
+	// background: $black;
+	// color: $white;
+	}
+
	}
	}