allow optional hero markdown file, allow navbar to be optional

master
David Kebler 2017-04-05 00:24:28 -07:00
parent 63289cbc53
commit 6834c1aedf
11 changed files with 68 additions and 27 deletions

View File

@ -2,9 +2,13 @@
<html lang="en">
{{ partial "head.html" . }}
<body>
{{ if ne .Site.Params.navbar.hidden true }}
{{ partial "navbar.html" . }}
{{ end }}
<main id="page">
{{ if ne .Site.Params.hero.custom_hero true }}
{{ partial "hero.html" . }}
{{ end }}
{{ partial "sections.html" . }}
</main>
{{ partial "js.html" . }}

View File

@ -56,15 +56,19 @@
{{ end }}
{{ with .font }}
#hero .text { font-family:{{ . }},Helvetica,Arial,sans-serif;}
#hero > .section__container { font-family:{{ . }},Helvetica,Arial,sans-serif;}
{{ end }}
{{ with .color }}
#hero > .text { color: {{ . }}; }
#hero { color: {{ . }}; }
{{ end }}
{{ with .bg_color }}
#hero { background-color: {{ . }}; }
{{ end }}
{{ if and ( .text_outline ) ( .text_shadow ) }}
#hero > .text {
#hero > .section__container {
text-shadow:
-2px -2px 0 {{ .text_outline }},
2px -2px 0 {{ .text_outline }},
@ -75,7 +79,7 @@
{{ else }}
{{ with .text_outline }}
#hero > .text {
#hero > .section__container {
text-shadow:
-2px -2px 0 {{ . }},
2px -2px 0 {{ . }},
@ -85,7 +89,7 @@
{{ end }}
{{ with .text_shadow }}
#hero > .text {
#hero > .section__container {
text-shadow:
-7px -3px 0 {{ . }}
}
@ -131,11 +135,11 @@
{{ end }}
{{ with .divider_thickness }}
hr { border-width: {{ . }}px; }
#hero hr { border-width: {{ . }}px; }
{{ end }}
{{ with .divider_color }}
hr { border-top-color: {{ . }}; }
#hero hr { border-top-color: {{ . }}; }
{{ end }}
{{ end }} /* end hero */
@ -152,7 +156,7 @@
{{ end }}
{{ with .bullet_icon }}
.section__content ul > li::before {
.section__content :not(.highlight) ul > li::before {
content: "{{ . }}";
}

View File

@ -1,5 +1,6 @@
<section id="hero">
<div class="text" >
<section id="hero" class="section section--hero">
<div class="section__container" >
<div class="section__content section__content--hero" >
{{ with .Site.Params.hero }}
{{ with .headline }}<h1>{{ . }}</h1>{{ end }}
{{ with .subheadline }}<h2>{{ . }}</h2>{{ end }}
@ -10,5 +11,5 @@
{{ end }}
{{ end }}
</div>
</div>
</section>

View File

@ -11,7 +11,7 @@
{{ if ne .Params.navbar false }}
{{ if ne .Params.hidden true }}
<li class="nav-bar__menu-item">
<a href="#nav-{{ .File.BaseFileName }}">
<a href="#{{ .File.BaseFileName }}">
{{ .Params.link_text | default .Title }}
</a>
</li>
@ -21,3 +21,4 @@
<!-- </nav> -->
<!-- </div> -->
</div>
<div id="nav-bar-spacer"></div>

View File

@ -1,7 +1,6 @@
<!-- Renders Section Based on Content -->
{{ $parity := "odd" }} {{ range $i, $e := .Data.Pages }}
{{ if ne .Params.hidden true }}
<section id="nav-{{ .File.BaseFileName }}" class="section section--{{ .File.BaseFileName }} section--{{ if modBool $i 2 }}odd{{ else }}even{{ end }}">
{{ range $i, $e := where (.Data.Pages) ".Params.hidden" "!=" true }}
<section id="{{ .File.BaseFileName }}" class="section section--{{ .File.BaseFileName }} {{ if ne .File.BaseFileName "hero" }}section--{{ if modBool $i 2 }}odd{{ else }}even{{ end }}{{ end }}">
<div class="section__container">
<div class="section__headline section__headline--{{ .File.BaseFileName }}">
<h1>{{ .Title }}</h1>
@ -12,4 +11,3 @@
</div>
</section>
{{ end }}
{{ end }}

View File

@ -1,4 +1,4 @@
<!-- Adds a class to a block of text. Used for custom formatting -->
<div class="{{ range .Params }}{{ . }} {{ end }}">
<span class="{{ range .Params }}{{ . }} {{ end }}">
{{ .Inner }}
</div>
</span>

View File

@ -19,6 +19,7 @@ body {
font-family: 'Roboto', sans-serif;
font-size: 1.4rem;
flex-direction: column;
width: 100%;
/* 14px default before jquery scalling */
}
@ -89,7 +90,7 @@ p {
text-align: left;
font-size: 1em;
line-height: 1.2;
margin-bottom: 1em;
margin-bottom: 0.5em;
}
/* using ::before for list numbers and icons */

View File

@ -68,7 +68,7 @@
color: white;
}
@media only screen and (min-width: 860px) {
@media only screen and (min-width: 900px) {
.nav-bar {
flex-direction: row;
flex-wrap: nowrap;

View File

@ -36,7 +36,7 @@
.section__content ol {
margin-left: 2em;
list-style-position: inside;
padding-top: 1em;
padding-top: 0.5em;
}
.section__content ul > li::before {
@ -65,6 +65,11 @@
background-color: black;
}
.section--hero {
color: white;
background-color: grey;
}
.section--even .btn {
color: black;
background-color: white;
@ -89,9 +94,8 @@
justify-content: center;
}
#hero .text {
#hero .section-content--hero {
text-align: center;
color: white;
}
/* ----------------
@ -161,6 +165,24 @@ img.avatar {
padding: 0.5em;
}
.highlight {
font-size: 0.7em;
align-items: left;
color: red;
background-color: white;
padding: 0.5em;
border-color: black;
border-width: 3px;
border-radius: 1em;
}
.highlight > ul > li::before {
font-family: FontAwesome;
content: "\f054"; /* chevron-right */
padding-right: 1.1em;
margin-left: -2em;
}
.box--avatar > a {
opacity: 1;
}

View File

@ -2,12 +2,17 @@
$(document).ready(function () {
// initialize
navbarSpacer();
// $('#page').css("width", $(window).width());
heroResize();
itemResize('iframe');
typeResize(); // for section content
hljs.initHighlightingOnLoad();
// resize elements on change
$(window).resize(function () {
// $('#page').css("width", $(window).width());
navbarSpacer();
heroResize();
itemResize('iframe');
typeResize();

View File

@ -29,9 +29,15 @@ $('a[href*="#"]:not([href="#"])').click(function () {
$('#cell').click(function () { $('#cell-number').toggleClass("hide"); });
// $('#phone').click(function () { alert('phone clicked'); return false; });
function navbarSpacer() {
$('#nav-bar-spacer').css({
height: $(".nav-bar__header").outerHeight(true),
});
}
// hero resizer
function heroResize(bfr = 15) {
var h = $(window).height(),
var h = $(window).height() - $(".nav-bar__header").outerHeight(true),
w = $(window).width(),
fr = bfr * h / w
// console.log('w,h,fr', w, h, fr)
@ -44,7 +50,6 @@ function heroResize(bfr = 15) {
$('#hero').css({
width: w + 10,
height: h / w > 1.5 ? w * 1.5 : h,
'margin-top': $('#nav-bar').height()
});
$('#hero').flowtype({