GitBlixt
teagles/CanvasInnovations.us

Saved: 2018-02-16 08:49

Torey Heinz committed Feb 16, 2018
commit 9ff9bef028b337dd280bf71217a6fcdb6707097a
Showing 15 changed files with 131 additions and 37 deletions
app/views/pages/index.liquid +17 -8
@@ @@ -8,17 +8,26 @@ is_layout: false
---
{% extends 'layouts/application' %}
{% block 'main' %}
- <div class="callout small">
- <div class="row">
+ <header>
+ <div class="content row column text-center">
+ <h1>
+ Canvas Innovations
+ </h1>
+ <p>West Michigan's Premier Shop for All Your Canvas and Upholstery Needs.</p>
+ </div>
+ </header>
+ <section class="featured-services" >
+ <div class="row" data-equalizer data-equalize-on="medium">
{% with_scope featured: true %}
{% for service in contents.services %}
- <div class="columns large-4">
- <div class="card">
+ <div class="columns medium-4">
+ <div class="card text-center">
<div class="card-divider">
- <a href="{% path_to service %}">{{ service.title }}</a>
+ <p class="lead"><a href="{% path_to service %}">{{ service.title }}</a></p>
+
</div>
- <img src="http://via.placeholder.com/450x150">
- <div class="card-section">
+ <img src="http://via.placeholder.com/650x250">
+ <div class="card-section" data-equalizer-watch>
{{ service.brief }}
</div>
</div>
@@ @@ -26,5 +35,5 @@ is_layout: false
{% endfor %}
{% endwith_scope %}
</div>
- </div>
+ </section>
{% endblock %}
app/views/pages/layouts/application.liquid +7 -10
@@ @@ -10,14 +10,15 @@ is_layout: true
<html class="no-js" lang="en">
<head>
{% include 'metatags' %}
+ <link href="https://fonts.googleapis.com/css?family=Playfair+Display" rel="stylesheet">
{{ 'app.css' | stylesheet_tag }}
<!-- Global Site Tag (gtag.js) - Google Analytics -->
- <script async src="https://www.googletagmanager.com/gtag/js?id=UA-107293990-1"></script>
+ <script async src="https://www.googletagmanager.com/gtag/js?id=###"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments)};
gtag('js', new Date());
- gtag('config', 'UA-107293990-1');
+ gtag('config', '###');
</script>
</head>
@@ @@ -26,20 +27,16 @@ is_layout: true
<div class="top-bar">
<div class="row">
<div class="top-bar-left">
+ <img src="{{ 'CanvasInnovations-logo.jpg' | theme_image_url | resize: '125x87'}}" width="125" height="87" alt="Canvas Innovations Logo">
+ </div>
+
+ <div class="top-bar-right">
{% include 'dropdown-menu' %}
</div>
</div>
</div>
<!-- End Top Bar -->
<div class="wrapper row column">
- <div class="callout large">
- <div class="row column text-center">
- <h1>
- Canvas Innovations
- </h1>
- <p class="lead">West Michigan's premier shop for all your canvas and upholstery needs.</p>
- </div>
- </div>
<div class="">
{% block main %}
<h1>{% editable_text "heading", line_break: false, format: 'raw', rows: 1 %}{% endeditable_text %}</h1>
app/views/pages/misc/content_type_template.liquid +20 -0
@@ @@ -0,0 +1,20 @@
+ ---
+ title: Service Template Page
+ content_type: services
+ ---
+ {% extends 'layouts/application' %}
+ {% block main %}
+ <p>{{ params }}</p>
+ <div class="card">
+ <img src="{{ service.featured_image.url | resize: '1200x400#' }}">
+ </div>
+ <h1>{{ service.title }}</h1>
+ {{ service.description }}
+ <h2>Projects</h2>
+ <ul>
+ {% for project in service.projects %}
+ <li><a href="{% path_to project %}">{{ project.title }}</a></li>
+ {% endfor %}
+ </ul>
+ {% endblock %}
+
app/views/pages/projects/content_type_template.liquid +0 -1
@@ @@ -13,7 +13,6 @@ is_layout: true
{% endfor %}
</ul>
-
{% assign categories = 'Before,After' | split: ','] %}
<div class="row">
{% for category in categories %}
app/views/pages/services/content_type_template.liquid +3 -0
@@ @@ -4,6 +4,9 @@ content_type: services
---
{% extends 'layouts/application' %}
{% block main %}
+ <div class="card">
+ <img src="{{ service.featured_image.url | resize: '1200x400#' }}">
+ </div>
<h1>{{ service.title }}</h1>
{{ service.description }}
<h2>Projects</h2>
app/views/snippets/dropdown-menu.liquid +0 -1
@@ @@ -1,5 +1,4 @@
<ul class="dropdown menu" data-dropdown-menu data-alignment="left">
- <li class="menu-text">Canvas Innovations</li>
<li><a href="/">Home</a></li>
{% for page in site.pages %}
{% if page.depth == 1 and page.listed? %}
data/services.yml +31 -3
@@ @@ -1,15 +1,15 @@
- - "Commerical Sewing":
+ - "Contract Sewing":
brief: "Nam molestiae ipsa non iure sint architecto doloribus"
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/offering_types/yourfile.txt # Path to a file in the public/samples folder or to a remote and external file.
+ 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: true
description: "Id vel expedita asperiores. Explicabo doloremque aliquid. Quod non itaque voluptate libero dicta. Aut quis impedit."
- projects: [sample-1, sample-2, sample-3]
+ 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.
@@ @@ -21,3 +21,31 @@
# featured_image: /samples/offering_types/yourfile.txt # 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.
+ 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.
+ 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.
+ 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.
+ 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.
+ 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.
+ 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.
+ description: "Suscipit ab sed commodi. Ducimus impedit unde quia alias. Aperiam hic est laudantium cumque accusamus. Qui rerum doloremque aut quas enim laborum."
+
public/fonts/Brixton.ttf +0 -0
public/fonts/Brixton.woff +0 -0
public/images/CanvasInnovations-logo.jpg +0 -0
public/images/header-bg.jpg +0 -0
public/samples/100_1304.jpg +0 -0
public/stylesheets/_featured_services.scss +13 -0
@@ @@ -0,0 +1,13 @@
+ .featured-services {
+ margin-top: rem-calc(10);
+
+ .card {
+ .card-divider {
+ text-transform: uppercase;
+ background: none;
+ a {
+ color: $black;
+ }
+ }
+ }
+ }
public/stylesheets/_settings.scss +3 -3
@@ @@ -82,7 +82,7 @@ $black: #0a0a0a;
$white: #fefefe;
$body-background: $white;
$body-font-color: $black;
- $body-font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif;
+ $body-font-family: Brixton, Roboto, Arial, sans-serif;
$body-antialiased: true;
$global-margin: 1rem;
$global-padding: 1rem;
@@ @@ -130,7 +130,7 @@ $block-grid-max: 8;
// 4. Base Typography
// ------------------
- $header-font-family: $body-font-family;
+ $header-font-family: 'Playfair Display', serif;;
$header-font-weight: $global-weight-normal;
$header-font-style: normal;
$font-family-monospace: Consolas, 'Liberation Mono', Courier, monospace;
@@ @@ -846,7 +846,7 @@ $tooltip-radius: $global-radius;
// -----------
$topbar-padding: 0.5rem;
- $topbar-background: $light-gray;
+ $topbar-background: $white;
$topbar-submenu-background: $topbar-background;
$topbar-title-spacing: 0.5rem 1rem 0.5rem 0;
$topbar-input-width: 200px;
public/stylesheets/app.scss +37 -11
@@ @@ -1,5 +1,12 @@
@charset 'utf-8';
+ @font-face {
+ font-family: 'Brixton';
+ src:
+ font-url('/fonts/Brixton.woff') format('woff'),
+ font-url('/fonts/Brixton.ttf') format('truetype');
+ }
+
@import 'settings';
@import 'foundation6/foundation';
@@ @@ -45,24 +52,43 @@
body, html {
height: 100%;
- background: none;
+ background: $white;
}
- html {
- background: image-url('/images/body-bg.jpg') no-repeat center center fixed;
+ header {
+ position: relative;
+ background: image-url('/images/header-bg.jpg') no-repeat center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
- }
- div.wrapper {
- background: #fff;
- padding-top: rem-calc(10);
- }
+ color: $white;
+
+ .content {
+ // @include vertical-center;
+ }
- body.index {
- .row {
- // max-width: rem-calc(1200);
+ @include breakpoint(small) {
+ height: rem-calc(200);
+ }
+
+ @include breakpoint(large) {
+ height: rem-calc(400);
+ .content {
+ // top: 25%;
+ }
+
+ h1 {
+ // font-size: 80px;
+ text-transform: uppercase;
+ font-size: rem-calc(60);
+ }
}
}
+
+ .lead {
+ font-family: $header-font-family;
+ }
+
+ @import "featured_services";