diff --git a/layouts/index.html b/layouts/index.html index 873d35e..de53e8d 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -2,9 +2,13 @@ {{ partial "head.html" . }} -{{ partial "navbar.html" . }} +{{ if ne .Site.Params.navbar.hidden true }} + {{ partial "navbar.html" . }} +{{ end }}
+{{ if ne .Site.Params.hero.custom_hero true }} {{ partial "hero.html" . }} +{{ end }} {{ partial "sections.html" . }}
{{ partial "js.html" . }} diff --git a/layouts/partials/head/styles.html b/layouts/partials/head/styles.html index 5fa31d0..eb86ba3 100644 --- a/layouts/partials/head/styles.html +++ b/layouts/partials/head/styles.html @@ -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: "{{ . }}"; } diff --git a/layouts/partials/hero.html b/layouts/partials/hero.html index 9076c77..afc7281 100644 --- a/layouts/partials/hero.html +++ b/layouts/partials/hero.html @@ -1,5 +1,6 @@ -
-
+
+
+
{{ with .Site.Params.hero }} {{ with .headline }}

{{ . }}

{{ end }} {{ with .subheadline }}

{{ . }}

{{ end }} @@ -9,6 +10,6 @@

{{ . }}

{{ end }} {{ end }} -
- +
+
diff --git a/layouts/partials/navbar.html b/layouts/partials/navbar.html index 3586ee5..0f3db17 100644 --- a/layouts/partials/navbar.html +++ b/layouts/partials/navbar.html @@ -11,7 +11,7 @@ {{ if ne .Params.navbar false }} {{ if ne .Params.hidden true }}
  • - + {{ .Params.link_text | default .Title }}
    • @@ -21,3 +21,4 @@ + diff --git a/layouts/partials/sections.html b/layouts/partials/sections.html index 4e41619..d4f372f 100644 --- a/layouts/partials/sections.html +++ b/layouts/partials/sections.html @@ -1,7 +1,6 @@ -{{ $parity := "odd" }} {{ range $i, $e := .Data.Pages }} -{{ if ne .Params.hidden true }} -
    +{{ range $i, $e := where (.Data.Pages) ".Params.hidden" "!=" true }} +

    {{ .Title }}

    @@ -12,4 +11,3 @@
    {{ end }} -{{ end }} diff --git a/layouts/shortcodes/format.html b/layouts/shortcodes/format.html index 15e633e..cecde2a 100755 --- a/layouts/shortcodes/format.html +++ b/layouts/shortcodes/format.html @@ -1,4 +1,4 @@ -
    + {{ .Inner }} -
    + diff --git a/static/css/base.css b/static/css/base.css index 2958a5d..cd1ce30 100644 --- a/static/css/base.css +++ b/static/css/base.css @@ -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 */ diff --git a/static/css/navbar.css b/static/css/navbar.css index 58df074..bdb42b8 100644 --- a/static/css/navbar.css +++ b/static/css/navbar.css @@ -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; diff --git a/static/css/page.css b/static/css/page.css index 3c36165..ded9b7c 100644 --- a/static/css/page.css +++ b/static/css/page.css @@ -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; } diff --git a/static/js/docready.js b/static/js/docready.js index 46a9a54..84f99fa 100644 --- a/static/js/docready.js +++ b/static/js/docready.js @@ -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(); diff --git a/static/js/page.js b/static/js/page.js index 3c781fe..6f7e3c0 100644 --- a/static/js/page.js +++ b/static/js/page.js @@ -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({