From 997c707d5b0180a125fe97c106e6997c73dcd5bb Mon Sep 17 00:00:00 2001 From: Vicky Date: Sun, 24 Jun 2018 20:22:21 -0400 Subject: [PATCH] Update templates (fix #59, close #61, close #60) + Add functionality to limit projects shown on main page + Improve projects display columns + List pages show content from _index.md files + Add GetPage logic to index.html and nav menus --- .travis.yml | 4 +- CHANGELOG.md | 20 ++++ README.md | 32 +++--- exampleSite/config.toml | 77 +++++++------- layouts/_default/list.html | 116 +++++++++++---------- layouts/_default/single.html | 98 +++++++++--------- layouts/_default/taxonomy.html | 119 +++++++++++----------- layouts/_default/terms.html | 2 +- layouts/blog/list.html | 123 ++++++++++++----------- layouts/blog/single.html | 161 ++++++++++++++++-------------- layouts/index.html | 22 ++-- layouts/partials/blogsection.html | 2 +- layouts/partials/footer.html | 2 +- layouts/partials/header.html | 1 - layouts/partials/nav-list.html | 4 + layouts/partials/nav-single.html | 4 + layouts/partials/projects.html | 103 ++++++++++--------- layouts/projects/list.html | 74 ++++++++++++++ 18 files changed, 542 insertions(+), 422 deletions(-) create mode 100644 layouts/projects/list.html diff --git a/.travis.yml b/.travis.yml index 97993ea..4f525b5 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,8 +1,8 @@ env: - - HUGO_VERSION="0.41" + - HUGO_VERSION="0.42.1" install: - - wget https://github.com/gohugoio/hugo/releases/download/v${HUGO_VERSION}/hugo_${HUGO_VERSION}_Linux-64bit.tar.gz + - wget -q https://github.com/gohugoio/hugo/releases/download/v${HUGO_VERSION}/hugo_${HUGO_VERSION}_Linux-64bit.tar.gz - tar xf hugo_${HUGO_VERSION}_Linux-64bit.tar.gz - mv hugo ~/bin/ diff --git a/CHANGELOG.md b/CHANGELOG.md index fb1122b..4a7b5a8 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,23 @@ +## Version 3.4.0 - Jun 24 2018 + +Changes to Projects display options: + +- Add functionality to limit number of projects shown on index page +- Projects will automatically display in 2 or 3 columns for even or odd numbers respectively +- Create new template for projects list page + +Improve list templates: + +- List pages will display content from `_index.md` + +Housecleaning: + +- Remove dead code +- Use GetPage logic on index.html and in nav menus +- Site still builds with no content + +*Thank you to @Hanzei for your feature work and @Setherizor for the great suggestion.* + ## Version 3.3.2 - Jun 10 2018 Travis CI integration, why not. diff --git a/README.md b/README.md index fa1d60a..0aea4ef 100644 --- a/README.md +++ b/README.md @@ -1,12 +1,12 @@ # Introduction theme for Hugo [![Build Status](https://travis-ci.com/vickylai/hugo-theme-introduction.svg?branch=master)](https://travis-ci.com/vickylai/hugo-theme-introduction) -A minimal, single page, smooth scrolling theme for Hugo. +A minimal, smooth-scrolling theme for Hugo. Can be configured as a single page site or full-featured site with many sections. ![Main page screenshot](https://github.com/vickylai/hugo-theme-introduction/blob/master/images/screenshot.png) Features: -- Single scrolling home page +- Minimalist home page - About section with profile photo - Contact section with option to show your local timezone - Optional Projects and Blog sections @@ -15,9 +15,9 @@ Features: - Smooth scroll-to-section navigation - Responsive and fast -## Quick start +# Quick start -### Get the theme +## Get the theme From the root of your Hugo site: ```sh @@ -25,22 +25,22 @@ $ cd themes $ git clone https://github.com/vickylai/hugo-theme-introduction.git introduction ``` -### Configure your site +## Configure your site From the exampleSite, copy `config.toml` to the root folder of your Hugo site and change the fields as you like. -Start with: +Important bits: -1. Set your baseurl to your site's domain -1. Set your blog's title and your first name -1. Set your introduction header height (use "medium", "large", or "fullheight") -1. Choose "light" or "dark" theme -1. Set your avatar image -1. Set your timezone, if you choose to show it -1. Choose whether or not to show the Blog and Projects sections, and configure them to your liking +1. Set `baseURL` to your site's domain and give your site a `title` +1. Add your `firstName` and `tagLine` +1. Set the desired `introHeight` for your main page (use "medium", "large", or "fullheight") +1. Choose a "light" or "dark" `themeStyle` +1. Set your `avatar` image +1. Choose whether or not to `showBlog` on the main page +1. Choose whether or not to `showProjects` on the main page 1. Input your social site urls and font-awesome icon names - use as many as you like -### Create About and Contact pages +## Create About and Contact pages Run: ```sh @@ -94,13 +94,13 @@ If you don't specify a `title`, only the photo will show. You can still add cont If you leave `external_link` empty, clicking on a project on your main page will pop up a window with the project's details. If you specify a url instead, clicking on the project on your main page will take you to that url. -## Contributing +# Contributing Pull requests for bug fixes and suggestions are welcome. Contributors are listed in [CHANGELOG.md](https://github.com/vickylai/hugo-theme-introduction/blob/master/CHANGELOG.md). Thank you so much! 🖤 -## License +# License Copyright (C) 2018 Vicky Lai This program is free software: you can redistribute it and/or modify diff --git a/exampleSite/config.toml b/exampleSite/config.toml index b0c01fc..ebe992e 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -1,45 +1,44 @@ -baseURL = "https://example.org/" # Your domain name. Must end with "/" -languageCode = "en-us" # languageCode -title = "Introduction" # Site title -theme = "introduction" -pygmentsStyle = "monokai" # https://help.farbox.com/pygments.html -pygmentsCodefences = true -enforce_ssl = false -# disqusshortname = "" # Enable Disqus for comments https://gohugo.io/content-management/comments -# googleAnalytics = "" # Enable Google Analytics https://gohugo.io/templates/internal/#google-analytics +baseURL = "https://example.org/" # Your domain name. Must end with "/" +languageCode = "en-us" # languageCode +title = "Introduction" # Site title +theme = "introduction" +pygmentsStyle = "monokai" # https://help.farbox.com/pygments.html +pygmentsCodefences = true +enforce_ssl = false +# disqusshortname = "" # Enable Disqus for comments https://gohugo.io/content-management/comments +# googleAnalytics = "" # Enable Google Analytics https://gohugo.io/templates/internal/#google-analytics [params] - blogHead = "Blog" # Full name shows on blog post pages - firstName = "Introduction" # First name shows in introduction on main page - tagLine = "I'm a theme for Hugo." # Appears after the introduction - introHeight = "large" # Input either 'medium' or 'large' or 'fullheight' - themeStyle = "light" # Choose 'light' or 'dark' - avatar = "img/profile.jpg" # Path to image in static folder eg. img/avatar.png, or comment out to remove - email = "youremail@email.com" # Shows in contact section, or leave blank to omit - localTime = true # Show your current local time in contact section - timeZone = "America/Los_Angeles" # Your timezone as in the TZ* column of this list: https://en.wikipedia.org/wiki/List_of_tz_database_time_zones - dateForm = "Jan 2, 2006" - dateFormFull = "Mon Jan 2 2006 15:04:05 EST" - cacheBuster = false # Add the current unix timestamp in query string for cache busting css assets (relevant in development mode) - description = "Website Description" # Max 160 characters show in search results - faviconFile = "img/fav.ico" - footerText = "" # Text to override default footer text (markdown allowed) - fadeIn = true # Turn on/off the fade-in effect - customCSS = [] # Include custom css files e.g. ["css/foo.css", "css/bar.css"] + firstName = "Introduction" # First name shows in introduction on main page + tagLine = "I'm a theme for Hugo." # Appears after the introduction + introHeight = "large" # Input either 'medium' or 'large' or 'fullheight' + themeStyle = "light" # Choose 'light' or 'dark' + avatar = "img/profile.jpg" # Path to image in static folder eg. img/avatar.png, or comment out to remove + email = "youremail@email.com" # Shows in contact section, or leave blank to omit + localTime = true # Show your current local time in contact section + timeZone = "America/Los_Angeles" # Your timezone as in the TZ* column of this list: https://en.wikipedia.org/wiki/List_of_tz_database_time_zones + dateForm = "Jan 2, 2006" + dateFormFull = "Mon Jan 2 2006 15:04:05 EST" + cacheBuster = false # Add the current unix timestamp in query string for cache busting css assets (relevant in development mode) + description = "Website Description" # Max 160 characters show in search results + faviconFile = "img/fav.ico" + footerText = "" # Text to override default footer text (markdown allowed) + fadeIn = true # Turn on/off the fade-in effect + customCSS = [] # Include custom css files e.g. ["css/foo.css", "css/bar.css"] - showBlog = true # Show Blog section on home page - showProjects = true # Show Projects section on home page - projectColumns = "3" # Choose "2" or "3" columns for projects section - placeHolderimg = "/img/workday.jpg" # For Projects without image - showAllPosts = false # Set 'true' to list all posts on home page, or set 'false' to link to separate blog list page - showLatest = true # Show latest blog post summary - shareButtons = true # On post pages, show share this social buttons - - # Share buttons - shareTwitter = true - shareFacebook = true - sharePinterest = false - shareGooglePlus = true + showBlog = true # Show Blog section on home page + showAllPosts = false # Set 'true' to list all posts on home page, or set 'false' to link to separate blog list page + showLatest = true # Show latest blog post summary + # Share buttons on blog post pages + shareButtons = true # Show "Share this:" social buttons + shareTwitter = true + shareFacebook = true + sharePinterest = false + shareGooglePlus = true + + showProjects = true # Show Projects section on home page + numberOfProjectsToShow = 3 # Maximum number of projects to show on home page. Unset or comment out to show all projects. + placeHolderimg = "/img/workday.jpg" # For Projects without image # Social icons appear in introduction and contact section. Add as many more as you like. # Find icon names here: http://fontawesome.io/cheatsheet/ diff --git a/layouts/_default/list.html b/layouts/_default/list.html index 96a6ae9..1c6cf64 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -1,65 +1,63 @@ {{ partial "header.html" . }} + -
- -
- -

{{ .Title }}

+
+ +
+ +

{{ .Title }}

+
+ + + +
+ +
+ + {{ partial "nav-list.html" . }} +
+ + +
+ + {{ .Content }} +
+
+ +
+ +
+
+ + + +
+
+ + {{ partial "footer.html" . }} +
+
- + - -
+ + -
- - {{ partial "nav-list.html" . }} -
- -
- - {{ .Content }} -
- - -
- - -
- - -
-
- - - -
-
- - {{ partial "footer.html" . }} -
- -
- - - - - - + \ No newline at end of file diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 618dc76..0371fcc 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -1,62 +1,62 @@ {{ partial "header.html" . }} -
- -
- -

{{ .Title }}

-
- - - -
-
- - {{ partial "nav-single.html" . }} +
+ +
+ +

{{ .Title }}

- + -
- - {{ if .Params.image }} -
- + +
+ +
+ + {{ partial "nav-single.html" . }}
- {{ end }} - {{ .Content }} -
- + -
- {{ template "_internal/disqus.html" . }} -
+
+ + {{ if .Params.image }} +
+ +
+ {{ end }} {{ .Content }} +
+ -
-
- - - -
-
+
+ {{ template "_internal/disqus.html" . }} +
- {{ partial "footer.html" . }} +
+
+ + + +
+
+ + {{ partial "footer.html" . }} +
+
- -
- + - - + + - + \ No newline at end of file diff --git a/layouts/_default/taxonomy.html b/layouts/_default/taxonomy.html index 4b3ddc4..5f7e1c4 100644 --- a/layouts/_default/taxonomy.html +++ b/layouts/_default/taxonomy.html @@ -1,65 +1,66 @@ {{ partial "header.html" . }} + -
- -
- -

Tagged "{{ lower .Title }}"

+
+ +
+ +

Tagged "{{ lower .Title }}"

+
+ + + +
+ +
+ + {{ partial "nav-list.html" . }} +
+ +
+ + {{ .Content }} +
+ + +
+ + +
+ + +
+
+ + + +
+
+ + {{ partial "footer.html" . }} +
+
- + - -
+ + -
- - {{ partial "nav-list.html" . }} -
- -
- - {{ .Content }} -
- - -
- - -
- - -
-
- - - -
-
- - {{ partial "footer.html" . }} -
- -
- - - - - - + \ No newline at end of file diff --git a/layouts/_default/terms.html b/layouts/_default/terms.html index 44e8b79..a1cd7f8 100644 --- a/layouts/_default/terms.html +++ b/layouts/_default/terms.html @@ -57,4 +57,4 @@ }) - + \ No newline at end of file diff --git a/layouts/blog/list.html b/layouts/blog/list.html index c2d94d6..676de26 100644 --- a/layouts/blog/list.html +++ b/layouts/blog/list.html @@ -1,67 +1,76 @@ {{ partial "header.html" . }} + -
- -
-

{{ .Site.Params.blogHead | default "Blog" }}

-
- - -
- -
- {{ partial "nav-list.html" . }} -
- -
- - {{ if .Site.Params.showLatest }} -

Latest Post

- {{ range first 1 (where .Data.Pages.ByPublishDate.Reverse "Section" "blog") }} -
{{ .Date.Format (.Site.Params.dateForm | default "Jan 02, 2006") }} -

{{ .Title }}

-
- {{ .Summary }} - {{ if .Truncated }} - ...Read More - {{ end }} -
+
+ +
+ +

{{ .Title | default "Blog" }}

- {{ end }} - {{ end }} + -

All Posts

-
    - {{ range .Data.Pages.ByPublishDate }} - {{ if eq .Section "blog" }} - {{ partial "li.html" . }} - {{ end }} - {{ end }} -
+ +
-
+
+ + {{ partial "nav-list.html" . }} +
+ -
-
- -
-
+
+ + {{ .Content }} +
+
+ {{ if .Site.Params.showLatest }} +

Latest Post

+ {{ range first 1 (where .Data.Pages.ByPublishDate.Reverse "Section" "blog") }} +
{{ .Date.Format (.Site.Params.dateForm | default "Jan 02, 2006") }} +

+ {{ .Title }} +

+
+ {{ .Summary }} {{ if .Truncated }} + ...Read More + {{ end }} +
+
+ {{ end }} {{ end }} -{{ partial "footer.html" . }} -
-
+

All Posts

+
    + {{ range .Data.Pages.ByPublishDate }} {{ if eq .Section "blog" }} {{ partial "li.html" . }} {{ end }} {{ end }} +
- - +
+ - +
+
+ + + +
+
+ + {{ partial "footer.html" . }} +
+ +
+ + + + + + \ No newline at end of file diff --git a/layouts/blog/single.html b/layouts/blog/single.html index 15e1a9b..e0b3650 100644 --- a/layouts/blog/single.html +++ b/layouts/blog/single.html @@ -1,90 +1,99 @@ {{ partial "header.html" . }} + -
+
+ -
-

{{ .Site.Params.blogHead | default "Blog" }}

-
+
+ +

{{ .Site.Params.blogHead | default "Blog" }}

+
+ - -
+ +
-
- {{ partial "nav-single.html" . }} -
+
+ + {{ partial "nav-single.html" . }} +
+ -
-

{{ .Title }}

-
- {{ .Date.Format (.Site.Params.dateForm | default "Jan 02, 2006") }} | - {{ if eq 1 .ReadingTime }}{{ .ReadingTime }} minute read{{ else }}{{ .ReadingTime }} minutes read{{ end }} +
+ +

+ {{ .Title }} +

+
+ {{ .Date.Format (.Site.Params.dateForm | default "Jan 02, 2006") }} | {{ if eq 1 .ReadingTime }}{{ .ReadingTime }} minute + read{{ else }}{{ .ReadingTime }} minutes read{{ end }} +
+ + {{ if .Site.Params.shareButtons }} +
+ Share this: {{ if .Site.Params.shareTwitter }} + + {{ end }} {{ if .Site.Params.shareFacebook }} + + + + + {{ end }} {{ if .Site.Params.sharePinterest }} + + + + + {{ end }} {{ if .Site.Params.shareGooglePlus }} + + + + + {{ end }} +
+ {{ end }} + +
+ + +
+ + {{ .Content }} +
+ + +
+ {{ template "_internal/disqus.html" . }}
- {{ if .Site.Params.shareButtons }} -
- Share this: - {{ if .Site.Params.shareTwitter }} -
+ - {{ end }} - {{ if .Site.Params.shareFacebook }} - - - - - {{ end }} - {{ if .Site.Params.sharePinterest }} - - - - - {{ end }} - {{ if .Site.Params.shareGooglePlus }} - - - - - {{ end }} -
- {{ end }} +
+
-
- -
- {{ .Content }} -
- -
- {{ template "_internal/disqus.html" . }} + {{ partial "footer.html" . }} +
+
+ -
-
- -
-
+ + -{{ partial "footer.html" . }} -
-
- - - - - + \ No newline at end of file diff --git a/layouts/index.html b/layouts/index.html index f626821..5bb5693 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -27,14 +27,18 @@
@@ -44,6 +48,7 @@
+{{ if (.Site.GetPage "page" "about") }}

About

@@ -55,11 +60,7 @@
{{ end }}
- {{ range .Data.Pages }} - {{if eq .Title "About" }} - {{.Content}} - {{end}} - {{ end }} + {{ (.Site.GetPage "page" "about").Content }}
@@ -68,7 +69,7 @@
- +{{ end }} {{ if .Site.Params.showProjects }} @@ -90,15 +91,12 @@ {{ end }} +{{ if (.Site.GetPage "page" "contact") }}

Contact

- {{ range .Data.Pages }} - {{if eq .Title "Contact" }} - {{.Content}} - {{end}} - {{ end }} + {{ (.Site.GetPage "page" "contact").Content }}
{{ if .Site.Params.localTime }} @@ -126,7 +124,7 @@
- +{{ end }} {{ partial "footer.html" . }} diff --git a/layouts/partials/blogsection.html b/layouts/partials/blogsection.html index 62796a6..bc10f7b 100644 --- a/layouts/partials/blogsection.html +++ b/layouts/partials/blogsection.html @@ -25,7 +25,7 @@ {{ end }} {{ else }} -
ALL BLOG POSTS
+
ALL BLOG POSTS
{{ end }}
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index 78dc47c..39e2446 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -3,7 +3,7 @@ {{ if .Site.Params.footerText }} {{ .Site.Params.footerText | markdownify }} {{ else }} - Introduction theme for Hugo. Made with and by Vicky Lai. + Introduction theme for Hugo. Made with and by open source contributors. {{ end }}
diff --git a/layouts/partials/header.html b/layouts/partials/header.html index 95aeddd..82ff72b 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -10,7 +10,6 @@ {{ if .Site.Params.description }}{{ end }} - {{ $url := replace .Permalink ( printf "%s" .Site.BaseURL) "" }} {{ if eq $url "/" }} diff --git a/layouts/partials/nav-list.html b/layouts/partials/nav-list.html index 1c6869a..dc00b6c 100644 --- a/layouts/partials/nav-list.html +++ b/layouts/partials/nav-list.html @@ -9,9 +9,11 @@ <span class="nav-item"> <a href="{{ "/" | relURL }}">Main</a> </span> + {{ if (.Site.GetPage "page" "about") }} <span class="nav-item"> <a href="{{ "/about" | relURL }}">About</a> </span> + {{ end }} {{ if and (.Site.Params.showProjects) (ne .Page.Section "projects") }} <span class="nav-item"> <a href="{{ "/projects" | relURL }}">Projects</a> @@ -22,9 +24,11 @@ <a href="{{ "/blog" | relURL }}">Blog</a> </span> {{ end }} + {{ if (.Site.GetPage "page" "contact") }} <span class="nav-item"> <a href="{{ "/contact" | relURL }}">Contact</a> </span> + {{ end }} {{ if .Site.RSSLink }} <span class="nav-item"> <a href="{{ .Site.RSSLink }}"><i class="fa fa-rss"></i></a> diff --git a/layouts/partials/nav-single.html b/layouts/partials/nav-single.html index b088ab0..9775c03 100644 --- a/layouts/partials/nav-single.html +++ b/layouts/partials/nav-single.html @@ -9,9 +9,11 @@ <span class="nav-item"> <a href="{{ "/" | relURL }}">Main</a> </span> + {{ if (.Site.GetPage "page" "about") }} <span class="nav-item"> <a href="{{ "/about" | relURL }}">About</a> </span> + {{ end }} {{ if .Site.Params.showProjects }} <span class="nav-item"> {{ if ne .Section "projects" }} @@ -30,9 +32,11 @@ {{ end }} </span> {{ end }} + {{ if (.Site.GetPage "page" "contact") }} <span class="nav-item"> <a href="{{ "/contact" | relURL }}">Contact</a> </span> + {{ end }} {{ if .Site.RSSLink }} <span class="nav-item"> <a href="{{ .Site.RSSLink }}"><i class="fa fa-rss"></i></a> diff --git a/layouts/partials/projects.html b/layouts/partials/projects.html index 1adef84..4688f83 100644 --- a/layouts/partials/projects.html +++ b/layouts/partials/projects.html @@ -4,13 +4,16 @@ <div class="section is-small"> <div class="columns is-multiline"> - {{ range sort .Pages }} {{ if eq .Section "projects" }} - {{ if eq .Site.Params.projectColumns "2" }} - <div class="column is-half"> {{ else if eq .Site.Params.projectColumns "3" }} - <div class="column is-one-third"> {{ else }} - <div class="column is-one-third"> {{ end }} - <!-- Hey Vicky, show half column if number is even. --> - <div {{ if not .Params.external_link }} id="project{{ $card := .Title | urlize }}{{ replace $card "%" ""}}" {{ end }} class="card"> + {{ $totalProjects := (len (.Site.GetPage "section" "projects").Pages) }} + {{ $numberOfProjectsToShow := .Site.Params.numberOfProjectsToShow | default $totalProjects }} + {{ range (.Site.GetPage "section" "projects").Pages | first $numberOfProjectsToShow }} + {{ if eq (mod $numberOfProjectsToShow 2) 0 }} + <div class="column is-half"> + {{ else }} + <div class="column is-one-third"> + {{ end }} + <div {{ if not .Params.external_link }} id="project{{ $card := .Title | urlize }}{{ replace $card "%" " "}}" {{ end }} + class="card"> <div class="card-image"> <figure class="image is-3by2"> <a {{ if .Params.external_link }} href="{{ .Params.external_link }}" {{ end }}> @@ -19,52 +22,54 @@ </figure> </div> <div class="card-content has-text-centered top-pad"> - <a {{ if .Params.external_link }} href="{{ .Params.external_link }}" {{ end }}> - {{ .Title }} - </a> + <a {{ if .Params.external_link }} href="{{ .Params.external_link }}" {{ end }}> + {{ .Title }} + </a> </div> + </div> </div> + {{ end }} </div> - {{ end }} {{ end }} + </div> </div> -</div> -</div> -<!-- End Projects container --> - -<!-- Projects modals --> -{{ range sort .Pages }} {{ if eq .Section "projects" }} {{ if not .Params.external_link }} -<div class="modal" id="modal{{ $card := .Title | urlize }}{{ replace $card "%" ""}}"> - <div class="modal-background"></div> - <div class="modal-card"> - {{ with .Title }} - <header class="modal-card-header bottom-pad"> - <p class="modal-card-title has-text-centered">{{ . }}</p> - </header> - {{ end }} - {{ if .Params.image }} - <img src="{{ .Params.image | relURL }}" class="img-responsive img-centered"> - {{ end }} - {{ if .Content }} - <section class="modal-card-body markdown"> - {{ .Content }} - </section> - {{ end }} + {{ if lt $numberOfProjectsToShow $totalProjects }} + <div class="container has-text-centered top-pad"> + <a href="{{ "/projects" | relURL }}">ALL PROJECTS</a> </div> - <button class="modal-close is-large" aria-label="close" id="close{{ $card := .Title | urlize }}{{ replace $card "%" ""}}"></button> -</div> -<script> - $('#project{{ $card := .Title | urlize }}{{ replace $card "%" ""}}').click(function() { - $('#modal{{ $card := .Title | urlize }}{{ replace $card "%" ""}}').addClass('is-active'); - }); - $('#close{{ $card := .Title | urlize }}{{ replace $card "%" ""}}').click(function() { - $('#modal{{ $card := .Title | urlize }}{{ replace $card "%" ""}}').removeClass('is-active'); - }); -</script> -{{ end }} {{ end }} {{ end }} + {{ end }} + <!-- End Projects container --> + + <!-- Projects modals --> + {{ range (.Site.GetPage "section" "projects").Pages | first $numberOfProjectsToShow }} {{ if not .Params.external_link }} + <div class="modal" id="modal{{ $card := .Title | urlize }}{{ replace $card "%" " "}}"> + <div class="modal-background"></div> + <div class="modal-card"> + {{ with .Title }} + <header class="modal-card-header bottom-pad"> + <p class="modal-card-title has-text-centered">{{ . }}</p> + </header> + {{ end }} {{ if .Params.image }} + <img src="{{ .Params.image | relURL }}" class="img-responsive img-centered"> {{ end }} {{ if .Content }} + <section class="modal-card-body markdown"> + {{ .Content }} + </section> + {{ end }} + </div> + <button class="modal-close is-large" aria-label="close" id="close{{ $card := .Title | urlize }}{{ replace $card "%" ""}}"></button> + </div> + <script> + $('#project{{ $card := .Title | urlize }}{{ replace $card "%" ""}}').click(function () { + $('#modal{{ $card := .Title | urlize }}{{ replace $card "%" ""}}').addClass('is-active'); + }); + $('#close{{ $card := .Title | urlize }}{{ replace $card "%" ""}}').click(function () { + $('#modal{{ $card := .Title | urlize }}{{ replace $card "%" ""}}').removeClass('is-active'); + }); + </script> + {{ end }} {{ end }} -<div class="container has-text-centered top-pad"> - <a href="#top"> - <i class="fa fa-arrow-up"></i> - </a> -</div> + <div class="container has-text-centered top-pad"> + <a href="#top"> + <i class="fa fa-arrow-up"></i> + </a> + </div> \ No newline at end of file diff --git a/layouts/projects/list.html b/layouts/projects/list.html new file mode 100644 index 0000000..6ab59a6 --- /dev/null +++ b/layouts/projects/list.html @@ -0,0 +1,74 @@ +{{ partial "header.html" . }} +<body> + +<div class="section" id="top"><!-- Parent section --> + <div class="container hero {{ if .Site.Params.fadeIn }} fade-in one {{ end }}"><!-- Begin Title --> + <h1 class="bold-title is-1">{{ .Title }}</h1> + </div><!-- End Title --> + + <!-- Everything below fades in two! --> + <div class="section no-padding {{ if .Site.Params.fadeIn }} fade-in two {{ end }}"> + + <div class="container"><!-- Begin Nav bar --> + {{ partial "nav-list.html" . }} + </div><!-- End Nav bar --> + + <div class="container markdown {{ if .Site.Params.fadeIn | default true }}fade-in two{{ end }} top-pad"> + <!-- "{{.Content}}" pulls from the markdown content of the corresponding _index.md --> + {{ .Content }} + </div> + <div class="container"> + <div class="section is-small"> + <div class="columns is-multiline"> + <!-- Ranges through content/projects/*.md --> + {{ range .Data.Pages }} + {{ if eq (mod (len (.Site.GetPage "section" "projects").Pages) 2) 0 }} + <div class="column is-half"> + {{ else }} + <div class="column is-one-third"> + {{ end }} + <div class="card"> + <div class="card-image"> + <figure class="image is-3by2"> + <a href="{{ if .Params.external_link }}{{ .Params.external_link }}{{ else }}{{.Permalink}}{{ end }}"> + <img src="{{ if .Params.image }}{{ .Params.image | relURL }}{{ else }}{{ (.Site.Params.placeHolderimg | default "/img/workday.jpg") | relURL }}{{ end }}"> + </a> + </figure> + </div> + <div class="card-content has-text-centered top-pad"> + <a href="{{ if .Params.external_link }}{{ .Params.external_link }}{{ else }}{{.Permalink}}{{ end }}"> + {{ .Title }} + </a> + </div> + </div> + </div> + {{ end }} + </div> + </div> + </div> + + <div class="container has-text-centered top-pad"> + <hr> + <a href="#top"> + <i class="fa fa-arrow-up"></i> + </a> + <hr> + </div> + + {{ partial "footer.html" . }} + </div><!-- End fade in two --> +</div><!-- End parent section --> + +<!-- Bitty scrolling links script --> +<script> + $('a[href^="{{ .Permalink }}#"]').click(function (e) { + e.preventDefault(); + var target = this.hash; + $('html, body').animate({ + scrollTop: $(target).offset().top + }, 500); + return false; + }) +</script> + +</body> \ No newline at end of file