Dario Ernst
4 years ago
commit
5fb2718889
@ -0,0 +1,45 @@
|
||||
---
|
||||
draft: true
|
||||
title: "Title for your recipe"
|
||||
author: {{ .Site.Params.front.defaultAuthor | default "User" }}
|
||||
recipe_image: {{ .Site.Params.front.defaultImage | default "images/defaultImage.png" }} #The image for your recipe
|
||||
image_width: {{ .Site.Params.front.defaultImageWidth | default 512 }}
|
||||
image_height: {{ .Site.Params.front.defaultImageHeight | default 512 }}
|
||||
date: {{ .Date }}
|
||||
tags: ["tag1", "tag2"] #tags for your recipe
|
||||
tagline: "A short tagline for your recipe"
|
||||
servings: 4
|
||||
prep_time: 15 #in minutes #can be BLANK
|
||||
cook: true # If we are cooking this, leave true, if we are cooling set to false
|
||||
cook_increment: minutes # set to minutes or hours
|
||||
cook_time: 8 #in minutes or hours #can be BLANK
|
||||
calories: 300 #in kcal #can be BLANK
|
||||
|
||||
# For ingredient subheadings (if you use them), please use the h4 header. For print view I have those elements targeted
|
||||
---
|
||||
|
||||
|
||||
## Ingredients
|
||||
|
||||
#### Ingredient Subheading
|
||||
|
||||
- First Ingredient
|
||||
- Second Ingredient [^1]
|
||||
- Third Ingredient
|
||||
- Fourth Ingredient
|
||||
- Fifth Ingredient
|
||||
|
||||
|
||||
## Directions
|
||||
|
||||
1. Step One
|
||||
1. Sub Step One
|
||||
2. Step Two
|
||||
3. Step Three
|
||||
4. Step Four
|
||||
5. Step Five
|
||||
6. Step Six
|
||||
|
||||
#### Footnotes
|
||||
|
||||
[^1]: Footnote 1
|
||||
@ -0,0 +1,56 @@
|
||||
baseURL = "http://example.org/"
|
||||
languageCode = "en-us"
|
||||
title = "My Cookbook"
|
||||
theme = "cookbook"
|
||||
sectionPagesMenu = "main"
|
||||
|
||||
[params.front]
|
||||
defaultAuthor = "Jared Swets" #Put in the default name of the author of the recipe
|
||||
defaultImage = "/images/defaultImage.jpg" #default image that will be used for a recipe with no image
|
||||
defaultImageHeight = 512 #default recipe image height
|
||||
defaultImageWidth = 512 # default recipe image width
|
||||
|
||||
|
||||
# If you have a logo image, add it here, else just text (as an image) will be added
|
||||
# The default height/width are the recommended bulma size (112W X 28H), best to get your logo as close as possible to that
|
||||
# The site will SCALE your image, but will not force a stretch, so you may need to stretch it in external tool before using.
|
||||
[params.logo]
|
||||
fileName = "/images/logo.webp"
|
||||
#fileName = "images/logo-alt.png" #alt logo if you are interested
|
||||
height = 50
|
||||
width = 200
|
||||
|
||||
[params.favicon]
|
||||
fileName = "/images/favicon.svg" #your favicon here if you wish to change it.
|
||||
|
||||
|
||||
[menu]
|
||||
[[menu.main]]
|
||||
name = "Home"
|
||||
pre = "fas fa-home" #icon, change if you would prefer a different icon
|
||||
url = "/"
|
||||
weight = 1
|
||||
[[menu.main]]
|
||||
name = "Categories" # change to w/e you want, tags or categories works best
|
||||
pre = "fas fa-tags" #icon, change if you would prefer a different icon
|
||||
url = "/tags/"
|
||||
weight = 2
|
||||
|
||||
|
||||
# Print output just creates a special route for a print view
|
||||
[outputs]
|
||||
home = ["HTML", "RSS", "JSON"]
|
||||
page = ["HTML", "PRINT"]
|
||||
|
||||
# The settings for the print format
|
||||
[outputFormats]
|
||||
[outputFormats.printFormat]
|
||||
name = "print"
|
||||
mediaType = "text/html"
|
||||
baseName = "print"
|
||||
isPlainText = false
|
||||
rel = "print"
|
||||
isHTML = true
|
||||
noUgly = true
|
||||
permalinkable = true
|
||||
path = "print"
|
||||
@ -0,0 +1,97 @@
|
||||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" type="image/svg+xml" href="/images/favicon.svg">
|
||||
<link rel="stylesheet" type="text/css" href="/css/bulma.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="/css/custom.css">
|
||||
<script src="https://kit.fontawesome.com/b7002cebe4.js" crossorigin="anonymous"></script>
|
||||
|
||||
|
||||
<title>My Cookbook | Categories</title>
|
||||
</head><body><div id="alert" class="notification is-danger is-hidden" style="position: absolute; bottom: 0; right: 0; z-index:99">
|
||||
Alert
|
||||
</div><nav class="navbar is-primary" role="navigation" aria-label="main navigation">
|
||||
<div class="navbar-brand">
|
||||
<a class="navbar-brand">
|
||||
|
||||
<img src="/images/logo.webp" width="200" height="50">
|
||||
|
||||
</a>
|
||||
<a id="navBarButton" role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
</a>
|
||||
</div>
|
||||
<div id="navBarMenu" class="navbar-menu">
|
||||
<div class="navbar-start">
|
||||
|
||||
<a class="navbar-item" href="/">
|
||||
|
||||
<i class="fas fa-home pr-2"></i>
|
||||
Home</a>
|
||||
|
||||
<a class="navbar-item" href="/tags/">
|
||||
|
||||
<i class="fas fa-tags pr-2"></i>
|
||||
Categories</a>
|
||||
|
||||
</div>
|
||||
<div class="navbar-end">
|
||||
<div class="navbar-item">
|
||||
<form class="field has-addons">
|
||||
<div class="control">
|
||||
<input class="input" id="searchTerm" type="text" value="" placeholder="Search Term...">
|
||||
</div>
|
||||
<div class="control">
|
||||
<button id="searchButton" class="button is-secondary">Search</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav><div id="searchResults" class="section is-hidden">
|
||||
<h4 class="title is-3"> Search results </h4>
|
||||
<div id="searchResultsCol" class="columns is-multiline">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script id="search-result-template" type="text/x-js-template">
|
||||
<div class="column is-one-quarter">
|
||||
<div class="result" id="summary-${key}">
|
||||
<div class="card" style="border-radius: 1%;">
|
||||
<div class="card-image">
|
||||
<figure class="image is-4by3">
|
||||
<img style="border-radius: 3%;" src="${image}" alt="Placeholder image">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="media-content">
|
||||
<p class="title is-4 has-text-centered">${title}</p>
|
||||
<p class="subtitle is-6 "><em></em></p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="is-small">${snippet}</p>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<a href="${link}" class="card-footer-item button is-primary">View Recipe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</script><div id="content">
|
||||
<div class="section">
|
||||
<div class="columns is-multiline">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div><p class="footer text-center">Using <a href="https://github.com/deranjer/hugo-cookbook" target="_blank">Hugo Cookbook Theme</a>, <a href="https://fontawesome.com/license/free" target="_blank">Font Awesome Icons</a> and <a href="https://bulma.io/" target="_blank">Bulma CSS</a></p><script src="/js/umbrella.min.js"></script>
|
||||
<script src="/js/custom.js"></script>
|
||||
<script src="/js/menu.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/fuse.js/3.2.0/fuse.min.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,10 @@
|
||||
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
|
||||
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
||||
<channel>
|
||||
<title>Categories on My Cookbook</title>
|
||||
<link>http://example.org/categories/</link>
|
||||
<description>Recent content in Categories on My Cookbook</description>
|
||||
<generator>Hugo -- gohugo.io</generator>
|
||||
<language>en-us</language><atom:link href="http://example.org/categories/index.xml" rel="self" type="application/rss+xml" />
|
||||
</channel>
|
||||
</rss>
|
||||
@ -0,0 +1,212 @@
|
||||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" type="image/svg+xml" href="/images/favicon.svg">
|
||||
<link rel="stylesheet" type="text/css" href="/css/bulma.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="/css/custom.css">
|
||||
<script src="https://kit.fontawesome.com/b7002cebe4.js" crossorigin="anonymous"></script>
|
||||
|
||||
|
||||
<title>My Cookbook | Homemade Chicken Ramen</title>
|
||||
</head><body><div id="alert" class="notification is-danger is-hidden" style="position: absolute; bottom: 0; right: 0; z-index:99">
|
||||
Alert
|
||||
</div><nav class="navbar is-primary" role="navigation" aria-label="main navigation">
|
||||
<div class="navbar-brand">
|
||||
<a class="navbar-brand">
|
||||
|
||||
<img src="/images/logo.webp" width="200" height="50">
|
||||
|
||||
</a>
|
||||
<a id="navBarButton" role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
</a>
|
||||
</div>
|
||||
<div id="navBarMenu" class="navbar-menu">
|
||||
<div class="navbar-start">
|
||||
|
||||
<a class="navbar-item" href="/">
|
||||
|
||||
<i class="fas fa-home pr-2"></i>
|
||||
Home</a>
|
||||
|
||||
<a class="navbar-item" href="/tags/">
|
||||
|
||||
<i class="fas fa-tags pr-2"></i>
|
||||
Categories</a>
|
||||
|
||||
</div>
|
||||
<div class="navbar-end">
|
||||
<div class="navbar-item">
|
||||
<form class="field has-addons">
|
||||
<div class="control">
|
||||
<input class="input" id="searchTerm" type="text" value="" placeholder="Search Term...">
|
||||
</div>
|
||||
<div class="control">
|
||||
<button id="searchButton" class="button is-secondary">Search</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav><div id="searchResults" class="section is-hidden">
|
||||
<h4 class="title is-3"> Search results </h4>
|
||||
<div id="searchResultsCol" class="columns is-multiline">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script id="search-result-template" type="text/x-js-template">
|
||||
<div class="column is-one-quarter">
|
||||
<div class="result" id="summary-${key}">
|
||||
<div class="card" style="border-radius: 1%;">
|
||||
<div class="card-image">
|
||||
<figure class="image is-4by3">
|
||||
<img style="border-radius: 3%;" src="${image}" alt="Placeholder image">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="media-content">
|
||||
<p class="title is-4 has-text-centered">${title}</p>
|
||||
<p class="subtitle is-6 "><em></em></p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="is-small">${snippet}</p>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<a href="${link}" class="card-footer-item button is-primary">View Recipe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</script><div id="content">
|
||||
<div class="section">
|
||||
<div class="columns is-centered">
|
||||
<div class="column is-full-mobile is-half-desktop" style="border-radius: 1%; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)">
|
||||
<div class="is-flex" style="justify-content: center; border-radius: 3%; background-color: #f0f5f1; position: relative;">
|
||||
<figure class="image">
|
||||
<img style="border-radius: 3%; width: 512px; height: 512px" src=http://example.org/images/recipe-headers/homemade-chicken-ramen.jpg alt="Placeholder image">
|
||||
</figure>
|
||||
<div id="printButton" style="position: absolute; bottom: 0; right: 0;" class="is-rounded">
|
||||
<a href="/print/chicken-ramen/print.html" target="_blank"><i class="fas fa-print fa-3x"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container has-text-centered">
|
||||
<h1 class="title is-bold"> Homemade Chicken Ramen</h1>
|
||||
<p class="subtitle is-italic"> Jared Swets</p>
|
||||
<div class="container has-text-right">
|
||||
|
||||
|
||||
<i class="far fa-calendar-alt"></i>
|
||||
<time datetime="01-24-2021">Jan 24, 2021</time>
|
||||
|
||||
<i class="fas fa-tags"></i>
|
||||
|
||||
|
||||
<a class="btn btn-sm btn-outline-dark tag-btn" href="http://example.org/tags/ramen">ramen</a>
|
||||
|
||||
|
||||
<a class="btn btn-sm btn-outline-dark tag-btn" href="http://example.org/tags/meal">meal</a>
|
||||
|
||||
|
||||
</div>
|
||||
<hr>
|
||||
</div>
|
||||
<div class="container has-text-centered">
|
||||
<div class="columns is-mobile is-multiline">
|
||||
<div class="column is-half-mobile" style="border-right: 1px solid #dbdbdb">
|
||||
<i class="fas fa-concierge-bell fa-lg"></i>
|
||||
<div></div>
|
||||
<p class="has-text-weight-bold is-size-6">Servings</p>
|
||||
<div></div>
|
||||
8 Servings
|
||||
</div>
|
||||
<div class="column is-half-mobile" style="border-right: 1px solid #dbdbdb">
|
||||
<i class="fas fa-hourglass-half fa-lg"></i>
|
||||
<div></div>
|
||||
<p class="has-text-weight-bold is-size-6">Prep time</p>
|
||||
<div></div>
|
||||
60 Minutes
|
||||
</div>
|
||||
<div class="column is-half-mobile" style="border-right: 1px solid #dbdbdb">
|
||||
<i class="fas fa-temperature-high fa-lg"></i>
|
||||
<div></div>
|
||||
|
||||
<p class="has-text-weight-bold is-size-6">Cooking Time</p>
|
||||
|
||||
<div></div>
|
||||
|
||||
20 Minutes
|
||||
|
||||
</div>
|
||||
<div class="column is-half-mobile">
|
||||
<i class="fas fa-fire fa-lg"></i>
|
||||
<div></div>
|
||||
<p class="has-text-weight-bold is-size-6">Calories</p>
|
||||
<div></div>
|
||||
400 Kcal
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<p class="subtitle is-italic"> An easy homemade chicken ramen, with a flavorful broth, roasted chicken, fresh veggies, lots of noodles, and a soft cooked egg.</p>
|
||||
<div class="content">
|
||||
<h2 id="ingredients">Ingredients</h2>
|
||||
<h4 id="chicken">Chicken</h4>
|
||||
<ul>
|
||||
<li>4 Chicken Breasts (boneless)</li>
|
||||
<li>2 tbsp unsalted butter</li>
|
||||
<li>Salt and Pepper</li>
|
||||
</ul>
|
||||
<h4 id="broth">Broth</h4>
|
||||
<ul>
|
||||
<li>4 tsp sesame or vegetable oil</li>
|
||||
<li>4 tsp fresh ginger, minced</li>
|
||||
<li>6 tsp fresh garlic, minced</li>
|
||||
<li>6 tbsp low-sodium soy sauce</li>
|
||||
<li>4 tbsp mirin</li>
|
||||
<li>8 cups rich chicken stock</li>
|
||||
<li>1 1/2 cups fresh shitake or bella mushrooms</li>
|
||||
<li>Sea Salt (to taste)</li>
|
||||
</ul>
|
||||
<h4 id="noodles">Noodles</h4>
|
||||
<ul>
|
||||
<li>6 (2-3oz) packs of dried ramen noodles</li>
|
||||
</ul>
|
||||
<h4 id="extras">Extras</h4>
|
||||
<ul>
|
||||
<li>6 Eggs</li>
|
||||
<li>1 cup scallions or green onions, tops sliced</li>
|
||||
<li>optional: fresh jalapeno slices</li>
|
||||
</ul>
|
||||
<h2 id="directions">Directions</h2>
|
||||
<ol>
|
||||
<li>Cook the chicken: Preheat the oven to 375 degrees. Season the chicken generously with salt and pepper. Melt the butter in a large oven-safe skillet over medium heat. Add the chicken, and cook until it is golden brown.
|
||||
<ol>
|
||||
<li>Transfer the skillet to the oven and roast for 15-20 minutes, until the chicken is cooked through. Remove from the oven, transfer the chicken to a plate and cover with foil until ready to serve.</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li>Make the ramen broth: Heat the oil in a large pot (enough for 10 cups at least) over medium heat, until shimmering. Add the garlic and ginger, and cook for a few minutes until softened. Add the soy sauce and mirin, and stir to combine. Cook for another minute. Add the stock, and the bulbs of the green onions (if using, tops cut off) cover, and bring to boil. Remove the lid, and let simmer uncovered for 5 minutes, then add the dried mushrooms. Simmer gently for another 10 minutes, then remove the green onion bulbs and season with salt, to taste.</li>
|
||||
<li>Make the soft-boiled eggs: Fill a pot with enough water to cover the eggs, and bring to a boil. Gently lower the eggs (still cold from the fridge) into the boiling water, and let simmer for 8 minutes (for a soft, but set-up yoke).
|
||||
<ol>
|
||||
<li>Meanwhile, fill a large bowl with ice water. When the timer finishes, transfer the eggs to the ice bath to stop the cooking process. Wait at least 5 minutes, or until cool enough to handle, then carefully peel away the shell and slice in half, lengthwise. Set aside until ready to serve.</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li>Assemble the ramen bowls: Meanwhile, chop the scallions and jalapeño (if using). Slice the chicken into thin pieces. Set aside. When the eggs finish cooking, add the ramen noodles to the boiling water. Cook for 2-3 minutes, until soft, then divide the noodles into two large bowls. Add the sliced chicken and the ramen broth. Top with the fresh scallions, jalapeño and the soft boiled egg. Serve immediately.</li>
|
||||
</ol>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div><p class="footer text-center">Using <a href="https://github.com/deranjer/hugo-cookbook" target="_blank">Hugo Cookbook Theme</a>, <a href="https://fontawesome.com/license/free" target="_blank">Font Awesome Icons</a> and <a href="https://bulma.io/" target="_blank">Bulma CSS</a></p><script src="/js/umbrella.min.js"></script>
|
||||
<script src="/js/custom.js"></script>
|
||||
<script src="/js/menu.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/fuse.js/3.2.0/fuse.min.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,4 @@
|
||||
li {
|
||||
padding-bottom: .5em;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 102 KiB |
|
After Width: | Height: | Size: 825 B |
|
After Width: | Height: | Size: 28 KiB |
|
After Width: | Height: | Size: 25 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 762 KiB |
|
After Width: | Height: | Size: 93 KiB |
|
After Width: | Height: | Size: 114 KiB |
|
After Width: | Height: | Size: 64 KiB |
|
After Width: | Height: | Size: 16 KiB |
|
After Width: | Height: | Size: 89 KiB |
|
After Width: | Height: | Size: 110 KiB |
@ -0,0 +1,129 @@
|
||||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta name="generator" content="Hugo 0.88.1" />
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" type="image/svg+xml" href="/images/favicon.svg">
|
||||
<link rel="stylesheet" type="text/css" href="/css/bulma.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="/css/custom.css">
|
||||
<script src="https://kit.fontawesome.com/b7002cebe4.js" crossorigin="anonymous"></script>
|
||||
|
||||
|
||||
<title>My Cookbook</title>
|
||||
</head><body><div id="alert" class="notification is-danger is-hidden" style="position: absolute; bottom: 0; right: 0; z-index:99">
|
||||
Alert
|
||||
</div><nav class="navbar is-primary" role="navigation" aria-label="main navigation">
|
||||
<div class="navbar-brand">
|
||||
<a class="navbar-brand">
|
||||
|
||||
<img src="/images/logo.webp" width="200" height="50">
|
||||
|
||||
</a>
|
||||
<a id="navBarButton" role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
</a>
|
||||
</div>
|
||||
<div id="navBarMenu" class="navbar-menu">
|
||||
<div class="navbar-start">
|
||||
|
||||
<a class="navbar-item" href="/">
|
||||
|
||||
<i class="fas fa-home pr-2"></i>
|
||||
Home</a>
|
||||
|
||||
<a class="navbar-item" href="/tags/">
|
||||
|
||||
<i class="fas fa-tags pr-2"></i>
|
||||
Categories</a>
|
||||
|
||||
</div>
|
||||
<div class="navbar-end">
|
||||
<div class="navbar-item">
|
||||
<form class="field has-addons">
|
||||
<div class="control">
|
||||
<input class="input" id="searchTerm" type="text" value="" placeholder="Search Term...">
|
||||
</div>
|
||||
<div class="control">
|
||||
<button id="searchButton" class="button is-secondary">Search</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav><div id="searchResults" class="section is-hidden">
|
||||
<h4 class="title is-3"> Search results </h4>
|
||||
<div id="searchResultsCol" class="columns is-multiline">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script id="search-result-template" type="text/x-js-template">
|
||||
<div class="column is-one-quarter">
|
||||
<div class="result" id="summary-${key}">
|
||||
<div class="card" style="border-radius: 1%;">
|
||||
<div class="card-image">
|
||||
<figure class="image is-4by3">
|
||||
<img style="border-radius: 3%;" src="${image}" alt="Placeholder image">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="media-content">
|
||||
<p class="title is-4 has-text-centered">${title}</p>
|
||||
<p class="subtitle is-6 "><em></em></p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="is-small">${snippet}</p>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<a href="${link}" class="card-footer-item button is-primary">View Recipe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</script><div id="content">
|
||||
<div class="section">
|
||||
<div class="columns is-multiline">
|
||||
|
||||
<div class="column is-one-quarter">
|
||||
<div class="card" style="border-radius: 1%;">
|
||||
<div class="card-image">
|
||||
<figure class="image is-4by3">
|
||||
<img style="border-radius: 3%;" src="images/recipe-headers/homemade-chicken-ramen.jpg" alt="Placeholder image">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="media-content">
|
||||
<p class="title is-4 has-text-centered">Homemade Chicken Ramen</p>
|
||||
<p class="subtitle is-6 "><em>Jared Swets</em></p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="is-small">An easy homemade chicken ramen, with a flavorful broth, roasted chicken, fresh veggies, lots of noodles, and a soft cooked egg.</p>
|
||||
<br>
|
||||
<i class="fas fa-tags pr-2"></i>
|
||||
|
||||
<a href="#">ramen</a>
|
||||
|
||||
<a href="#">meal</a>
|
||||
|
||||
<br>
|
||||
<i class="fas fa-calendar pr-4"></i>January 2021
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<a href="http://example.org/chicken-ramen/" class="card-footer-item button is-primary">View Recipe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div><p class="footer text-center">Using <a href="https://github.com/deranjer/hugo-cookbook" target="_blank">Hugo Cookbook Theme</a>, <a href="https://fontawesome.com/license/free" target="_blank">Font Awesome Icons</a> and <a href="https://bulma.io/" target="_blank">Bulma CSS</a></p><script src="/js/umbrella.min.js"></script>
|
||||
<script src="/js/custom.js"></script>
|
||||
<script src="/js/menu.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/fuse.js/3.2.0/fuse.min.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1 @@
|
||||
[{"categories":null,"contents":"Ingredients Chicken 4 Chicken Breasts (boneless) 2 tbsp unsalted butter Salt and Pepper Broth 4 tsp sesame or vegetable oil 4 tsp fresh ginger, minced 6 tsp fresh garlic, minced 6 tbsp low-sodium soy sauce 4 tbsp mirin 8 cups rich chicken stock 1 1/2 cups fresh shitake or bella mushrooms Sea Salt (to taste) Noodles 6 (2-3oz) packs of dried ramen noodles Extras 6 Eggs 1 cup scallions or green onions, tops sliced optional: fresh jalapeno slices Directions Cook the chicken: Preheat the oven to 375 degrees. Season the chicken generously with salt and pepper. Melt the butter in a large oven-safe skillet over medium heat. Add the chicken, and cook until it is golden brown. Transfer the skillet to the oven and roast for 15-20 minutes, until the chicken is cooked through. Remove from the oven, transfer the chicken to a plate and cover with foil until ready to serve. Make the ramen broth: Heat the oil in a large pot (enough for 10 cups at least) over medium heat, until shimmering. Add the garlic and ginger, and cook for a few minutes until softened. Add the soy sauce and mirin, and stir to combine. Cook for another minute. Add the stock, and the bulbs of the green onions (if using, tops cut off) cover, and bring to boil. Remove the lid, and let simmer uncovered for 5 minutes, then add the dried mushrooms. Simmer gently for another 10 minutes, then remove the green onion bulbs and season with salt, to taste. Make the soft-boiled eggs: Fill a pot with enough water to cover the eggs, and bring to a boil. Gently lower the eggs (still cold from the fridge) into the boiling water, and let simmer for 8 minutes (for a soft, but set-up yoke). Meanwhile, fill a large bowl with ice water. When the timer finishes, transfer the eggs to the ice bath to stop the cooking process. Wait at least 5 minutes, or until cool enough to handle, then carefully peel away the shell and slice in half, lengthwise. Set aside until ready to serve. Assemble the ramen bowls: Meanwhile, chop the scallions and jalapeño (if using). Slice the chicken into thin pieces. Set aside. When the eggs finish cooking, add the ramen noodles to the boiling water. Cook for 2-3 minutes, until soft, then divide the noodles into two large bowls. Add the sliced chicken and the ramen broth. Top with the fresh scallions, jalapeño and the soft boiled egg. Serve immediately. ","imageLink":"images/recipe-headers/homemade-chicken-ramen.jpg","permalink":"http://example.org/chicken-ramen/","tags":["ramen","meal"],"title":"Homemade Chicken Ramen"}]
|
||||
@ -0,0 +1,20 @@
|
||||
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
|
||||
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
||||
<channel>
|
||||
<title>My Cookbook</title>
|
||||
<link>http://example.org/</link>
|
||||
<description>Recent content on My Cookbook</description>
|
||||
<generator>Hugo -- gohugo.io</generator>
|
||||
<language>en-us</language>
|
||||
<lastBuildDate>Sun, 24 Jan 2021 20:05:39 -0500</lastBuildDate><atom:link href="http://example.org/index.xml" rel="self" type="application/rss+xml" />
|
||||
<item>
|
||||
<title>Homemade Chicken Ramen</title>
|
||||
<link>http://example.org/chicken-ramen/</link>
|
||||
<pubDate>Sun, 24 Jan 2021 20:05:39 -0500</pubDate>
|
||||
|
||||
<guid>http://example.org/chicken-ramen/</guid>
|
||||
<description>Ingredients Chicken 4 Chicken Breasts (boneless) 2 tbsp unsalted butter Salt and Pepper Broth 4 tsp sesame or vegetable oil 4 tsp fresh ginger, minced 6 tsp fresh garlic, minced 6 tbsp low-sodium soy sauce 4 tbsp mirin 8 cups rich chicken stock 1 1/2 cups fresh shitake or bella mushrooms Sea Salt (to taste) Noodles 6 (2-3oz) packs of dried ramen noodles Extras 6 Eggs 1 cup scallions or green onions, tops sliced optional: fresh jalapeno slices Directions Cook the chicken: Preheat the oven to 375 degrees.</description>
|
||||
</item>
|
||||
|
||||
</channel>
|
||||
</rss>
|
||||
@ -0,0 +1,127 @@
|
||||
|
||||
var searchTerm = null;
|
||||
|
||||
summaryInclude=60;
|
||||
var fuseOptions = {
|
||||
shouldSort: true,
|
||||
includeMatches: true,
|
||||
threshold: 0.0,
|
||||
tokenize:true,
|
||||
location: 0,
|
||||
distance: 100,
|
||||
maxPatternLength: 32,
|
||||
minMatchCharLength: 1,
|
||||
keys: [
|
||||
{name:"title",weight:0.8},
|
||||
{name:"contents",weight:0.5},
|
||||
{name:"tags",weight:0.3},
|
||||
{name:"categories",weight:0.3}
|
||||
]
|
||||
};
|
||||
|
||||
u('#searchTerm').on('change keyup', function() { // Set the search value on keyup for the input
|
||||
searchTerm = this.value;
|
||||
})
|
||||
|
||||
function showAlert(message){
|
||||
u('#alert').removeClass("is-hidden")
|
||||
u('#alert').html(message)
|
||||
setTimeout(function () {
|
||||
u('#alert').addClass("is-hidden")
|
||||
}, 3000)
|
||||
}
|
||||
|
||||
u('#searchButton').handle('click', function(e) { //use handle to automatically prevent default
|
||||
if(searchTerm){
|
||||
u("#searchTerm").text(searchTerm);
|
||||
u('#searchButton').addClass("is-loading");
|
||||
executeSearch(searchTerm);
|
||||
}else {
|
||||
showAlert("Search cannot be empty!")
|
||||
}
|
||||
})
|
||||
|
||||
function executeSearch(searchQuery){
|
||||
fetch("/index.json").then(r => r.json())
|
||||
.then(function(data) {
|
||||
var pages = data;
|
||||
var fuse = new Fuse(pages, fuseOptions);
|
||||
var result = fuse.search(searchQuery);
|
||||
if(result.length > 0){
|
||||
u('#content').addClass("is-hidden"); //hiding our main content to display the results
|
||||
u('#searchResults').children(u('div')).empty(); // clean out any previous search results
|
||||
u('#searchButton').removeClass("is-loading") //change our button back
|
||||
u('#searchResults').removeClass("is-hidden") //show Result area
|
||||
populateResults(result);
|
||||
}else{
|
||||
showAlert("No results found!")
|
||||
u('#searchButton').removeClass("is-loading");
|
||||
u("#searchTerm").text("");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function populateResults(result){
|
||||
//Object.keys(result).forEach(function(key,value){
|
||||
Object.entries(result).forEach(entry => {
|
||||
const [key, value] = entry;
|
||||
var contents= value.item.contents;
|
||||
var snippet = "";
|
||||
var snippetHighlights=[];
|
||||
var tags =[];
|
||||
if( fuseOptions.tokenize ){
|
||||
snippetHighlights.push(searchTerm);
|
||||
}else{
|
||||
value.matches.forEach(function(matchKey,mvalue){
|
||||
|
||||
if(mvalue.key == "tags" || mvalue.key == "categories" ){
|
||||
snippetHighlights.push(mvalue.value);
|
||||
}else if(mvalue.key == "contents"){
|
||||
start = mvalue.indices[0][0]-summaryInclude>0?mvalue.indices[0][0]-summaryInclude:0;
|
||||
end = mvalue.indices[0][1]+summaryInclude<contents.length?mvalue.indices[0][1]+summaryInclude:contents.length;
|
||||
snippet += contents.substring(start,end);
|
||||
snippetHighlights.push(mvalue.value.substring(mvalue.indices[0][0],mvalue.indices[0][1]-mvalue.indices[0][0]+1));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if(snippet.length<1){
|
||||
snippet += contents.substring(0,summaryInclude*2);
|
||||
}
|
||||
//pull template from hugo template definition
|
||||
var templateDefinition = u('#search-result-template').html();
|
||||
//replace values
|
||||
var output = render(templateDefinition,{key:key,title:value.item.title,link:value.item.permalink,tags:value.item.tags,categories:value.item.categories,snippet:snippet,image:value.item.imageLink});
|
||||
u('#searchResultsCol').append(output);
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
function param(name) {
|
||||
return decodeURIComponent((location.search.split(name + '=')[1] || '').split('&')[0]).replace(/\+/g, ' ');
|
||||
}
|
||||
|
||||
function render(templateString, data) {
|
||||
var conditionalMatches,conditionalPattern,copy;
|
||||
conditionalPattern = /\$\{\s*isset ([a-zA-Z]*) \s*\}(.*)\$\{\s*end\s*}/g;
|
||||
//since loop below depends on re.lastInxdex, we use a copy to capture any manipulations whilst inside the loop
|
||||
copy = templateString;
|
||||
while ((conditionalMatches = conditionalPattern.exec(templateString)) !== null) {
|
||||
if(data[conditionalMatches[1]]){
|
||||
//valid key, remove conditionals, leave contents.
|
||||
copy = copy.replace(conditionalMatches[0],conditionalMatches[2]);
|
||||
}else{
|
||||
//not valid, remove entire section
|
||||
copy = copy.replace(conditionalMatches[0],'');
|
||||
}
|
||||
}
|
||||
templateString = copy;
|
||||
//now any conditionals removed we can do simple substitution
|
||||
var key, find, re;
|
||||
for (key in data) {
|
||||
find = '\\$\\{\\s*' + key + '\\s*\\}';
|
||||
re = new RegExp(find, 'g');
|
||||
templateString = templateString.replace(re, data[key]);
|
||||
}
|
||||
return templateString;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,9 @@
|
||||
// Toggle menu with button
|
||||
u('#navBarButton').on('click', function(e) {
|
||||
u('#navBarMenu').toggleClass('is-active')
|
||||
})
|
||||
|
||||
// Hide menu on search
|
||||
u('#searchButton').on('click', function(e) {
|
||||
u('#navBarMenu').removeClass('is-active')
|
||||
})
|
||||
@ -0,0 +1,32 @@
|
||||
|
||||
// Shrink up the spacing and change the size of the headers
|
||||
u('#ingredients').attr("style", "margin-bottom: .5em;")
|
||||
u('#ingredients').attr("class", "is-size-5")
|
||||
u('#directions').attr("style", "margin: 0px;")
|
||||
u('#directions').attr("class", "is-size-5")
|
||||
|
||||
// If we have ingredients subheadings, change the h4 headings
|
||||
u('h4').addClass("is-size-6")
|
||||
u('h4').attr("style", "margin: 0px;")
|
||||
|
||||
// Change the title size
|
||||
u('#mainTitle').addClass("is-size-4")
|
||||
|
||||
// Change the lists margins
|
||||
var directions = u('ol');
|
||||
directions.attr("style", "margin-top: 0px; margin-bottom: 0px;")
|
||||
|
||||
var ingredients = u('ul');
|
||||
ingredients.attr("style", "margin-top: 0px; margin-bottom: 0px;")
|
||||
|
||||
var listItems = u('li');
|
||||
listItems.attr("style", "margin-top: 0px;")
|
||||
|
||||
// Remove the last <hr> if we have a footnote
|
||||
var hrs = u('hr')
|
||||
if (hrs.length > 2) {
|
||||
hrs.last().remove()
|
||||
}
|
||||
|
||||
// Remove the footnote links
|
||||
u(document.getElementsByClassName('footnote-backref')).remove()
|
||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,130 @@
|
||||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="../../css/bulma.min.css">
|
||||
<script src="https://kit.fontawesome.com/b7002cebe4.js" crossorigin="anonymous"></script>
|
||||
|
||||
|
||||
<title>My Cookbook | Homemade Chicken Ramen</title>
|
||||
</head>
|
||||
<body>
|
||||
<div class="section">
|
||||
<div class="columns is-centered">
|
||||
<div class="column is-full-mobile is-half-desktop" style="border-radius: 1%; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)">
|
||||
<div class="container">
|
||||
<div class="columns">
|
||||
<div class="column is-half">
|
||||
<h1 id="mainTitle" class="title is-bold"> Homemade Chicken Ramen </h1>
|
||||
<p class="subtitle is-italic" style="margin-bottom: .5em;"> Jared Swets</p>
|
||||
|
||||
<i class="fas fa-tags"></i>
|
||||
|
||||
|
||||
ramen
|
||||
|
||||
|
||||
meal
|
||||
|
||||
|
||||
<p class="subtitle is-italic" style="margin-top: .5em;"> An easy homemade chicken ramen, with a flavorful broth, roasted chicken, fresh veggies, lots of noodles, and a soft cooked egg.</p>
|
||||
</div>
|
||||
<div class="column is-half">
|
||||
<div class="is-pulled-right">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr style="margin-top: .5em; margin-bottom: 1em;">
|
||||
<div class="container has-text-centered">
|
||||
<div class="columns">
|
||||
<div class="column" style="border-right: 1px solid #dbdbdb; padding: 0px;">
|
||||
<i class="fas fa-concierge-bell"></i>
|
||||
<div></div>
|
||||
<p class="has-text-weight-bold">Servings</p>
|
||||
<div></div>
|
||||
8 Servings
|
||||
</div>
|
||||
<div class="column" style="border-right: 1px solid #dbdbdb; padding: 0px;">
|
||||
<i class="fas fa-hourglass-half"></i>
|
||||
<div></div>
|
||||
<p class="has-text-weight-bold">Prep time</p>
|
||||
<div></div>
|
||||
60 Minutes
|
||||
</div>
|
||||
<div class="column" style="border-right: 1px solid #dbdbdb; padding: 0px;">
|
||||
<i class="fas fa-temperature-high"></i>
|
||||
<div></div>
|
||||
|
||||
<p class="has-text-weight-bold is-size-6">Cooking Time</p>
|
||||
|
||||
<div></div>
|
||||
|
||||
20 Minutes
|
||||
|
||||
</div>
|
||||
<div class="column" style="padding: 0px;">
|
||||
<i class="fas fa-fire"></i>
|
||||
<div></div>
|
||||
<p class="has-text-weight-bold">Calories</p>
|
||||
<div></div>
|
||||
400 Kcal
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr style="margin-top: 1em; margin-bottom: .5em;">
|
||||
<div class="content">
|
||||
<h2 id="ingredients">Ingredients</h2>
|
||||
<h4 id="chicken">Chicken</h4>
|
||||
<ul>
|
||||
<li>4 Chicken Breasts (boneless)</li>
|
||||
<li>2 tbsp unsalted butter</li>
|
||||
<li>Salt and Pepper</li>
|
||||
</ul>
|
||||
<h4 id="broth">Broth</h4>
|
||||
<ul>
|
||||
<li>4 tsp sesame or vegetable oil</li>
|
||||
<li>4 tsp fresh ginger, minced</li>
|
||||
<li>6 tsp fresh garlic, minced</li>
|
||||
<li>6 tbsp low-sodium soy sauce</li>
|
||||
<li>4 tbsp mirin</li>
|
||||
<li>8 cups rich chicken stock</li>
|
||||
<li>1 1/2 cups fresh shitake or bella mushrooms</li>
|
||||
<li>Sea Salt (to taste)</li>
|
||||
</ul>
|
||||
<h4 id="noodles">Noodles</h4>
|
||||
<ul>
|
||||
<li>6 (2-3oz) packs of dried ramen noodles</li>
|
||||
</ul>
|
||||
<h4 id="extras">Extras</h4>
|
||||
<ul>
|
||||
<li>6 Eggs</li>
|
||||
<li>1 cup scallions or green onions, tops sliced</li>
|
||||
<li>optional: fresh jalapeno slices</li>
|
||||
</ul>
|
||||
<h2 id="directions">Directions</h2>
|
||||
<ol>
|
||||
<li>Cook the chicken: Preheat the oven to 375 degrees. Season the chicken generously with salt and pepper. Melt the butter in a large oven-safe skillet over medium heat. Add the chicken, and cook until it is golden brown.
|
||||
<ol>
|
||||
<li>Transfer the skillet to the oven and roast for 15-20 minutes, until the chicken is cooked through. Remove from the oven, transfer the chicken to a plate and cover with foil until ready to serve.</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li>Make the ramen broth: Heat the oil in a large pot (enough for 10 cups at least) over medium heat, until shimmering. Add the garlic and ginger, and cook for a few minutes until softened. Add the soy sauce and mirin, and stir to combine. Cook for another minute. Add the stock, and the bulbs of the green onions (if using, tops cut off) cover, and bring to boil. Remove the lid, and let simmer uncovered for 5 minutes, then add the dried mushrooms. Simmer gently for another 10 minutes, then remove the green onion bulbs and season with salt, to taste.</li>
|
||||
<li>Make the soft-boiled eggs: Fill a pot with enough water to cover the eggs, and bring to a boil. Gently lower the eggs (still cold from the fridge) into the boiling water, and let simmer for 8 minutes (for a soft, but set-up yoke).
|
||||
<ol>
|
||||
<li>Meanwhile, fill a large bowl with ice water. When the timer finishes, transfer the eggs to the ice bath to stop the cooking process. Wait at least 5 minutes, or until cool enough to handle, then carefully peel away the shell and slice in half, lengthwise. Set aside until ready to serve.</li>
|
||||
</ol>
|
||||
</li>
|
||||
<li>Assemble the ramen bowls: Meanwhile, chop the scallions and jalapeño (if using). Slice the chicken into thin pieces. Set aside. When the eggs finish cooking, add the ramen noodles to the boiling water. Cook for 2-3 minutes, until soft, then divide the noodles into two large bowls. Add the sliced chicken and the ramen broth. Top with the fresh scallions, jalapeño and the soft boiled egg. Serve immediately.</li>
|
||||
</ol>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="/js/umbrella.min.js"></script>
|
||||
<script src="/js/print.js"></script>
|
||||
|
||||
</html>
|
||||
@ -0,0 +1,22 @@
|
||||
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
|
||||
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
|
||||
xmlns:xhtml="http://www.w3.org/1999/xhtml">
|
||||
<url>
|
||||
<loc>http://example.org/chicken-ramen/</loc>
|
||||
<lastmod>2021-01-24T20:05:39-05:00</lastmod>
|
||||
</url><url>
|
||||
<loc>http://example.org/tags/meal/</loc>
|
||||
<lastmod>2021-01-24T20:05:39-05:00</lastmod>
|
||||
</url><url>
|
||||
<loc>http://example.org/</loc>
|
||||
<lastmod>2021-01-24T20:05:39-05:00</lastmod>
|
||||
</url><url>
|
||||
<loc>http://example.org/tags/ramen/</loc>
|
||||
<lastmod>2021-01-24T20:05:39-05:00</lastmod>
|
||||
</url><url>
|
||||
<loc>http://example.org/tags/</loc>
|
||||
<lastmod>2021-01-24T20:05:39-05:00</lastmod>
|
||||
</url><url>
|
||||
<loc>http://example.org/categories/</loc>
|
||||
</url>
|
||||
</urlset>
|
||||
@ -0,0 +1,205 @@
|
||||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" type="image/svg+xml" href="/images/favicon.svg">
|
||||
<link rel="stylesheet" type="text/css" href="/css/bulma.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="/css/custom.css">
|
||||
<script src="https://kit.fontawesome.com/b7002cebe4.js" crossorigin="anonymous"></script>
|
||||
|
||||
|
||||
<title>My Cookbook | Tags</title>
|
||||
</head><body><div id="alert" class="notification is-danger is-hidden" style="position: absolute; bottom: 0; right: 0; z-index:99">
|
||||
Alert
|
||||
</div><nav class="navbar is-primary" role="navigation" aria-label="main navigation">
|
||||
<div class="navbar-brand">
|
||||
<a class="navbar-brand">
|
||||
|
||||
<img src="/images/logo.webp" width="200" height="50">
|
||||
|
||||
</a>
|
||||
<a id="navBarButton" role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
</a>
|
||||
</div>
|
||||
<div id="navBarMenu" class="navbar-menu">
|
||||
<div class="navbar-start">
|
||||
|
||||
<a class="navbar-item" href="/">
|
||||
|
||||
<i class="fas fa-home pr-2"></i>
|
||||
Home</a>
|
||||
|
||||
<a class="navbar-item" href="/tags/">
|
||||
|
||||
<i class="fas fa-tags pr-2"></i>
|
||||
Categories</a>
|
||||
|
||||
</div>
|
||||
<div class="navbar-end">
|
||||
<div class="navbar-item">
|
||||
<form class="field has-addons">
|
||||
<div class="control">
|
||||
<input class="input" id="searchTerm" type="text" value="" placeholder="Search Term...">
|
||||
</div>
|
||||
<div class="control">
|
||||
<button id="searchButton" class="button is-secondary">Search</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav><div id="searchResults" class="section is-hidden">
|
||||
<h4 class="title is-3"> Search results </h4>
|
||||
<div id="searchResultsCol" class="columns is-multiline">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script id="search-result-template" type="text/x-js-template">
|
||||
<div class="column is-one-quarter">
|
||||
<div class="result" id="summary-${key}">
|
||||
<div class="card" style="border-radius: 1%;">
|
||||
<div class="card-image">
|
||||
<figure class="image is-4by3">
|
||||
<img style="border-radius: 3%;" src="${image}" alt="Placeholder image">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="media-content">
|
||||
<p class="title is-4 has-text-centered">${title}</p>
|
||||
<p class="subtitle is-6 "><em></em></p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="is-small">${snippet}</p>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<a href="${link}" class="card-footer-item button is-primary">View Recipe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</script><div id="content">
|
||||
<div class="section">
|
||||
<div class="columns is-multiline">
|
||||
|
||||
|
||||
<div class="column is-one-quarter">
|
||||
<div class="card">
|
||||
<header class="card-header">
|
||||
<p class="card-header-title">
|
||||
<a class="title" href="/tags/ramen/">ramen</a>
|
||||
<i class="fas fa-tags pl-3 pb-3"></i>
|
||||
</p>
|
||||
<div class="pt-4 pr-2">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
1 Recipe Found
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</header>
|
||||
<div class="card-content">
|
||||
<div class="content">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li><a href="http://example.org/chicken-ramen/"> Homemade Chicken Ramen</a></li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="summary" href="/tags/ramen/">
|
||||
<p></p>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="column is-one-quarter">
|
||||
<div class="card">
|
||||
<header class="card-header">
|
||||
<p class="card-header-title">
|
||||
<a class="title" href="/tags/meal/">meal</a>
|
||||
<i class="fas fa-tags pl-3 pb-3"></i>
|
||||
</p>
|
||||
<div class="pt-4 pr-2">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
1 Recipe Found
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</header>
|
||||
<div class="card-content">
|
||||
<div class="content">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li><a href="http://example.org/chicken-ramen/"> Homemade Chicken Ramen</a></li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="summary" href="/tags/meal/">
|
||||
<p></p>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div><p class="footer text-center">Using <a href="https://github.com/deranjer/hugo-cookbook" target="_blank">Hugo Cookbook Theme</a>, <a href="https://fontawesome.com/license/free" target="_blank">Font Awesome Icons</a> and <a href="https://bulma.io/" target="_blank">Bulma CSS</a></p><script src="/js/umbrella.min.js"></script>
|
||||
<script src="/js/custom.js"></script>
|
||||
<script src="/js/menu.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/fuse.js/3.2.0/fuse.min.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,29 @@
|
||||
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
|
||||
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
||||
<channel>
|
||||
<title>Tags on My Cookbook</title>
|
||||
<link>http://example.org/tags/</link>
|
||||
<description>Recent content in Tags on My Cookbook</description>
|
||||
<generator>Hugo -- gohugo.io</generator>
|
||||
<language>en-us</language>
|
||||
<lastBuildDate>Sun, 24 Jan 2021 20:05:39 -0500</lastBuildDate><atom:link href="http://example.org/tags/index.xml" rel="self" type="application/rss+xml" />
|
||||
<item>
|
||||
<title>meal</title>
|
||||
<link>http://example.org/tags/meal/</link>
|
||||
<pubDate>Sun, 24 Jan 2021 20:05:39 -0500</pubDate>
|
||||
|
||||
<guid>http://example.org/tags/meal/</guid>
|
||||
<description></description>
|
||||
</item>
|
||||
|
||||
<item>
|
||||
<title>ramen</title>
|
||||
<link>http://example.org/tags/ramen/</link>
|
||||
<pubDate>Sun, 24 Jan 2021 20:05:39 -0500</pubDate>
|
||||
|
||||
<guid>http://example.org/tags/ramen/</guid>
|
||||
<description></description>
|
||||
</item>
|
||||
|
||||
</channel>
|
||||
</rss>
|
||||
@ -0,0 +1,140 @@
|
||||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" type="image/svg+xml" href="/images/favicon.svg">
|
||||
<link rel="stylesheet" type="text/css" href="/css/bulma.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="/css/custom.css">
|
||||
<script src="https://kit.fontawesome.com/b7002cebe4.js" crossorigin="anonymous"></script>
|
||||
|
||||
|
||||
<title>My Cookbook | meal</title>
|
||||
</head><body><div id="alert" class="notification is-danger is-hidden" style="position: absolute; bottom: 0; right: 0; z-index:99">
|
||||
Alert
|
||||
</div><nav class="navbar is-primary" role="navigation" aria-label="main navigation">
|
||||
<div class="navbar-brand">
|
||||
<a class="navbar-brand">
|
||||
|
||||
<img src="/images/logo.webp" width="200" height="50">
|
||||
|
||||
</a>
|
||||
<a id="navBarButton" role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
</a>
|
||||
</div>
|
||||
<div id="navBarMenu" class="navbar-menu">
|
||||
<div class="navbar-start">
|
||||
|
||||
<a class="navbar-item" href="/">
|
||||
|
||||
<i class="fas fa-home pr-2"></i>
|
||||
Home</a>
|
||||
|
||||
<a class="navbar-item" href="/tags/">
|
||||
|
||||
<i class="fas fa-tags pr-2"></i>
|
||||
Categories</a>
|
||||
|
||||
</div>
|
||||
<div class="navbar-end">
|
||||
<div class="navbar-item">
|
||||
<form class="field has-addons">
|
||||
<div class="control">
|
||||
<input class="input" id="searchTerm" type="text" value="" placeholder="Search Term...">
|
||||
</div>
|
||||
<div class="control">
|
||||
<button id="searchButton" class="button is-secondary">Search</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav><div id="searchResults" class="section is-hidden">
|
||||
<h4 class="title is-3"> Search results </h4>
|
||||
<div id="searchResultsCol" class="columns is-multiline">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script id="search-result-template" type="text/x-js-template">
|
||||
<div class="column is-one-quarter">
|
||||
<div class="result" id="summary-${key}">
|
||||
<div class="card" style="border-radius: 1%;">
|
||||
<div class="card-image">
|
||||
<figure class="image is-4by3">
|
||||
<img style="border-radius: 3%;" src="${image}" alt="Placeholder image">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="media-content">
|
||||
<p class="title is-4 has-text-centered">${title}</p>
|
||||
<p class="subtitle is-6 "><em></em></p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="is-small">${snippet}</p>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<a href="${link}" class="card-footer-item button is-primary">View Recipe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</script><div id="content">
|
||||
<div class="section">
|
||||
<div class="columns is-multiline">
|
||||
|
||||
|
||||
<div class="column is-one-quarter">
|
||||
<div class="card">
|
||||
<header class="card-header">
|
||||
<p class="card-header-title">
|
||||
<a class="title" href="/chicken-ramen/">Homemade Chicken Ramen</a>
|
||||
<i class="fas fa-tags pl-3 pb-3"></i>
|
||||
</p>
|
||||
<div class="pt-4 pr-2">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</header>
|
||||
<div class="card-content">
|
||||
<div class="content">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="summary" href="/chicken-ramen/">
|
||||
<p>Ingredients Chicken 4 Chicken Breasts (boneless) 2 tbsp unsalted butter Salt and Pepper Broth 4 tsp sesame or vegetable oil 4 tsp fresh ginger, minced 6 tsp fresh garlic, minced 6 tbsp low-sodium soy sauce 4 tbsp mirin 8 cups rich chicken stock 1 1/2 cups fresh shitake or bella mushrooms Sea Salt (to taste) Noodles 6 (2-3oz) packs of dried ramen noodles Extras 6 Eggs 1 cup scallions or green onions, tops sliced optional: fresh jalapeno slices Directions Cook the chicken: Preheat the oven to 375 degrees.</p>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div><p class="footer text-center">Using <a href="https://github.com/deranjer/hugo-cookbook" target="_blank">Hugo Cookbook Theme</a>, <a href="https://fontawesome.com/license/free" target="_blank">Font Awesome Icons</a> and <a href="https://bulma.io/" target="_blank">Bulma CSS</a></p><script src="/js/umbrella.min.js"></script>
|
||||
<script src="/js/custom.js"></script>
|
||||
<script src="/js/menu.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/fuse.js/3.2.0/fuse.min.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,20 @@
|
||||
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
|
||||
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
||||
<channel>
|
||||
<title>meal on My Cookbook</title>
|
||||
<link>http://example.org/tags/meal/</link>
|
||||
<description>Recent content in meal on My Cookbook</description>
|
||||
<generator>Hugo -- gohugo.io</generator>
|
||||
<language>en-us</language>
|
||||
<lastBuildDate>Sun, 24 Jan 2021 20:05:39 -0500</lastBuildDate><atom:link href="http://example.org/tags/meal/index.xml" rel="self" type="application/rss+xml" />
|
||||
<item>
|
||||
<title>Homemade Chicken Ramen</title>
|
||||
<link>http://example.org/chicken-ramen/</link>
|
||||
<pubDate>Sun, 24 Jan 2021 20:05:39 -0500</pubDate>
|
||||
|
||||
<guid>http://example.org/chicken-ramen/</guid>
|
||||
<description>Ingredients Chicken 4 Chicken Breasts (boneless) 2 tbsp unsalted butter Salt and Pepper Broth 4 tsp sesame or vegetable oil 4 tsp fresh ginger, minced 6 tsp fresh garlic, minced 6 tbsp low-sodium soy sauce 4 tbsp mirin 8 cups rich chicken stock 1 1/2 cups fresh shitake or bella mushrooms Sea Salt (to taste) Noodles 6 (2-3oz) packs of dried ramen noodles Extras 6 Eggs 1 cup scallions or green onions, tops sliced optional: fresh jalapeno slices Directions Cook the chicken: Preheat the oven to 375 degrees.</description>
|
||||
</item>
|
||||
|
||||
</channel>
|
||||
</rss>
|
||||
@ -0,0 +1,140 @@
|
||||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" type="image/svg+xml" href="/images/favicon.svg">
|
||||
<link rel="stylesheet" type="text/css" href="/css/bulma.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="/css/custom.css">
|
||||
<script src="https://kit.fontawesome.com/b7002cebe4.js" crossorigin="anonymous"></script>
|
||||
|
||||
|
||||
<title>My Cookbook | ramen</title>
|
||||
</head><body><div id="alert" class="notification is-danger is-hidden" style="position: absolute; bottom: 0; right: 0; z-index:99">
|
||||
Alert
|
||||
</div><nav class="navbar is-primary" role="navigation" aria-label="main navigation">
|
||||
<div class="navbar-brand">
|
||||
<a class="navbar-brand">
|
||||
|
||||
<img src="/images/logo.webp" width="200" height="50">
|
||||
|
||||
</a>
|
||||
<a id="navBarButton" role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
</a>
|
||||
</div>
|
||||
<div id="navBarMenu" class="navbar-menu">
|
||||
<div class="navbar-start">
|
||||
|
||||
<a class="navbar-item" href="/">
|
||||
|
||||
<i class="fas fa-home pr-2"></i>
|
||||
Home</a>
|
||||
|
||||
<a class="navbar-item" href="/tags/">
|
||||
|
||||
<i class="fas fa-tags pr-2"></i>
|
||||
Categories</a>
|
||||
|
||||
</div>
|
||||
<div class="navbar-end">
|
||||
<div class="navbar-item">
|
||||
<form class="field has-addons">
|
||||
<div class="control">
|
||||
<input class="input" id="searchTerm" type="text" value="" placeholder="Search Term...">
|
||||
</div>
|
||||
<div class="control">
|
||||
<button id="searchButton" class="button is-secondary">Search</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav><div id="searchResults" class="section is-hidden">
|
||||
<h4 class="title is-3"> Search results </h4>
|
||||
<div id="searchResultsCol" class="columns is-multiline">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script id="search-result-template" type="text/x-js-template">
|
||||
<div class="column is-one-quarter">
|
||||
<div class="result" id="summary-${key}">
|
||||
<div class="card" style="border-radius: 1%;">
|
||||
<div class="card-image">
|
||||
<figure class="image is-4by3">
|
||||
<img style="border-radius: 3%;" src="${image}" alt="Placeholder image">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="media-content">
|
||||
<p class="title is-4 has-text-centered">${title}</p>
|
||||
<p class="subtitle is-6 "><em></em></p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="is-small">${snippet}</p>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<a href="${link}" class="card-footer-item button is-primary">View Recipe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</script><div id="content">
|
||||
<div class="section">
|
||||
<div class="columns is-multiline">
|
||||
|
||||
|
||||
<div class="column is-one-quarter">
|
||||
<div class="card">
|
||||
<header class="card-header">
|
||||
<p class="card-header-title">
|
||||
<a class="title" href="/chicken-ramen/">Homemade Chicken Ramen</a>
|
||||
<i class="fas fa-tags pl-3 pb-3"></i>
|
||||
</p>
|
||||
<div class="pt-4 pr-2">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</header>
|
||||
<div class="card-content">
|
||||
<div class="content">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="summary" href="/chicken-ramen/">
|
||||
<p>Ingredients Chicken 4 Chicken Breasts (boneless) 2 tbsp unsalted butter Salt and Pepper Broth 4 tsp sesame or vegetable oil 4 tsp fresh ginger, minced 6 tsp fresh garlic, minced 6 tbsp low-sodium soy sauce 4 tbsp mirin 8 cups rich chicken stock 1 1/2 cups fresh shitake or bella mushrooms Sea Salt (to taste) Noodles 6 (2-3oz) packs of dried ramen noodles Extras 6 Eggs 1 cup scallions or green onions, tops sliced optional: fresh jalapeno slices Directions Cook the chicken: Preheat the oven to 375 degrees.</p>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div><p class="footer text-center">Using <a href="https://github.com/deranjer/hugo-cookbook" target="_blank">Hugo Cookbook Theme</a>, <a href="https://fontawesome.com/license/free" target="_blank">Font Awesome Icons</a> and <a href="https://bulma.io/" target="_blank">Bulma CSS</a></p><script src="/js/umbrella.min.js"></script>
|
||||
<script src="/js/custom.js"></script>
|
||||
<script src="/js/menu.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/fuse.js/3.2.0/fuse.min.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,20 @@
|
||||
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
|
||||
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
||||
<channel>
|
||||
<title>ramen on My Cookbook</title>
|
||||
<link>http://example.org/tags/ramen/</link>
|
||||
<description>Recent content in ramen on My Cookbook</description>
|
||||
<generator>Hugo -- gohugo.io</generator>
|
||||
<language>en-us</language>
|
||||
<lastBuildDate>Sun, 24 Jan 2021 20:05:39 -0500</lastBuildDate><atom:link href="http://example.org/tags/ramen/index.xml" rel="self" type="application/rss+xml" />
|
||||
<item>
|
||||
<title>Homemade Chicken Ramen</title>
|
||||
<link>http://example.org/chicken-ramen/</link>
|
||||
<pubDate>Sun, 24 Jan 2021 20:05:39 -0500</pubDate>
|
||||
|
||||
<guid>http://example.org/chicken-ramen/</guid>
|
||||
<description>Ingredients Chicken 4 Chicken Breasts (boneless) 2 tbsp unsalted butter Salt and Pepper Broth 4 tsp sesame or vegetable oil 4 tsp fresh ginger, minced 6 tsp fresh garlic, minced 6 tbsp low-sodium soy sauce 4 tbsp mirin 8 cups rich chicken stock 1 1/2 cups fresh shitake or bella mushrooms Sea Salt (to taste) Noodles 6 (2-3oz) packs of dried ramen noodles Extras 6 Eggs 1 cup scallions or green onions, tops sliced optional: fresh jalapeno slices Directions Cook the chicken: Preheat the oven to 375 degrees.</description>
|
||||
</item>
|
||||
|
||||
</channel>
|
||||
</rss>
|
||||
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 762 KiB |
|
After Width: | Height: | Size: 93 KiB |
|
After Width: | Height: | Size: 114 KiB |
|
After Width: | Height: | Size: 64 KiB |
|
After Width: | Height: | Size: 16 KiB |
|
After Width: | Height: | Size: 89 KiB |
|
After Width: | Height: | Size: 110 KiB |
@ -0,0 +1,20 @@
|
||||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2020 YOUR_NAME_HERE
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||
this software and associated documentation files (the "Software"), to deal in
|
||||
the Software without restriction, including without limitation the rights to
|
||||
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
|
||||
the Software, and to permit persons to whom the Software is furnished to do so,
|
||||
subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
|
||||
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
|
||||
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
|
||||
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
|
||||
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
@ -0,0 +1,67 @@
|
||||
# Cookbook Theme
|
||||
|
||||
[Demo Site](https://wonderful-raman-ea1990.netlify.app)
|
||||
|
||||
## About
|
||||
|
||||
Cookbook is a theme for hugo that stores all of your recipes and displays them in a viewable format on desktop and mobile.
|
||||
|
||||
Developed with Bulma CSS and UmbrellaJS (as well as fuse.js for search).
|
||||
|
||||
|
||||
|
||||
## Features
|
||||
|
||||
- [x] Search all your recipes.
|
||||
- [x] Display cooking/cooling time, calories, servings, and prep time.
|
||||
- [x] Tag your recipes, browse by tags.
|
||||
- [x] Break your ingredients into subheadings.
|
||||
- [x] Print view.
|
||||
|
||||
## Planned
|
||||
|
||||
- [ ] 404 page.
|
||||
- [ ] More customizable print options, smaller font size for printing.
|
||||
- [ ] Any other layout tweaks/feature requests.
|
||||
|
||||
## Install
|
||||
|
||||
First create your site: `hugo new site <site_name>`
|
||||
|
||||
Then move into the directory: `cd <site_name>`
|
||||
|
||||
You can install using hugo's recommended theme install method while in your hugo site directory:
|
||||
|
||||
`git init`
|
||||
|
||||
`git submodule add https://github.com/deranjer/hugo-cookbook.git themes/cookbook`
|
||||
|
||||
OR
|
||||
|
||||
You can download the latest release, or the the current master as a zip, then extract the zip file into the themes directory.
|
||||
|
||||
## Copy Site Config
|
||||
|
||||
Then you can copy the `config.toml` from `exampleSite` to the root of your hugo directory, and modify that for your instance.
|
||||
|
||||
## Setup Default Template
|
||||
|
||||
Since hugo-cookbook is a single purpose theme, you need to override your default archetype so that all content created is of `recipe` type.
|
||||
|
||||
To override the default template, copy the `default.md` from `themes\archetypes\default.md` to `archetypes` and overwrite the current `default.md` in that directory.
|
||||
|
||||
This will ensure that any new content you create will be of type `recipe`.
|
||||
|
||||
## First Recipe
|
||||
|
||||
Simply run `hugo new recipe_name.md` to create your new recipe in the `content` folder. Modify the markdown file as required for your new recipe.
|
||||
|
||||
`hugo serve` to view the site.
|
||||
|
||||
## Recipe Views of the Site
|
||||
|
||||
|
||||
|
||||
## Directions View
|
||||
|
||||
|
||||
@ -0,0 +1,45 @@
|
||||
---
|
||||
draft: true
|
||||
title: "Title for your recipe"
|
||||
author: {{ .Site.Params.front.defaultAuthor | default "User" }}
|
||||
recipe_image: {{ .Site.Params.front.defaultImage | default "images/defaultImage.png" }} #The image for your recipe
|
||||
image_width: {{ .Site.Params.front.defaultImageWidth | default 512 }}
|
||||
image_height: {{ .Site.Params.front.defaultImageHeight | default 512 }}
|
||||
date: {{ .Date }}
|
||||
tags: ["tag1", "tag2"] #tags for your recipe
|
||||
tagline: "A short tagline for your recipe"
|
||||
servings: 4
|
||||
prep_time: 15 #in minutes #can be BLANK
|
||||
cook: true # If we are cooking this, leave true, if we are cooling set to false
|
||||
cook_increment: minutes # set to minutes or hours
|
||||
cook_time: 8 #in minutes or hours #can be BLANK
|
||||
calories: 300 #in kcal #can be BLANK
|
||||
|
||||
# For ingredient subheadings (if you use them), please use the h4 header. For print view I have those elements targeted
|
||||
---
|
||||
|
||||
|
||||
## Ingredients
|
||||
|
||||
#### Ingredient Subheading
|
||||
|
||||
- First Ingredient
|
||||
- Second Ingredient [^1]
|
||||
- Third Ingredient
|
||||
- Fourth Ingredient
|
||||
- Fifth Ingredient
|
||||
|
||||
|
||||
## Directions
|
||||
|
||||
1. Step One
|
||||
1. Sub Step One
|
||||
2. Step Two
|
||||
3. Step Three
|
||||
4. Step Four
|
||||
5. Step Five
|
||||
6. Step Six
|
||||
|
||||
#### Footnotes
|
||||
|
||||
[^1]: Footnote 1
|
||||
@ -0,0 +1,14 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
{{- partial "head.html" . -}}
|
||||
<body>
|
||||
{{- partial "alert.html" -}}
|
||||
{{- partial "header.html" . -}}
|
||||
{{- partial "searchResults.html" -}}
|
||||
<div id="content">
|
||||
{{- block "main" . }}{{ end }}
|
||||
</div>
|
||||
{{- partial "footer.html" . -}}
|
||||
{{- partial "script.html" . -}}
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,38 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
{{- partial "printhead.html" . -}}
|
||||
<body>
|
||||
<div class="section">
|
||||
<div class="columns is-centered">
|
||||
<div class="column is-full-mobile is-half-desktop" style="border-radius: 1%; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)">
|
||||
<div class="container">
|
||||
<div class="columns">
|
||||
<div class="column is-half">
|
||||
<h1 id="mainTitle" class="title is-bold"> {{ .Title }} </h1>
|
||||
<p class="subtitle is-italic" style="margin-bottom: .5em;"> {{ .Params.Author }}</p>
|
||||
{{ partial "printmetadata.html" . }}
|
||||
<p class="subtitle is-italic" style="margin-top: .5em;"> {{ .Params.Tagline }}</p>
|
||||
</div>
|
||||
<div class="column is-half">
|
||||
<div class="is-pulled-right">
|
||||
<!-- <figure class="image">
|
||||
<img style="border-radius: 3%; width: 128px; height: 128px" src={{ printf "%s%s" .Site.BaseURL .Params.Recipe_image }} alt="Placeholder image">
|
||||
</figure> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr style="margin-top: .5em; margin-bottom: 1em;">
|
||||
<div class="container has-text-centered">
|
||||
{{ partial "printstatstable.html" . }}
|
||||
</div>
|
||||
<hr style="margin-top: 1em; margin-bottom: .5em;">
|
||||
<div class="content">
|
||||
{{ .Content }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
{{ partial "printscript.html" }}
|
||||
</html>
|
||||
@ -0,0 +1,5 @@
|
||||
{{- $.Scratch.Add "index" slice -}}
|
||||
{{- range .Site.RegularPages -}}
|
||||
{{- $.Scratch.Add "index" (dict "title" .Title "tags" .Params.tags "categories" .Params.categories "contents" .Plain "permalink" .Permalink "imageLink" .Params.Recipe_image) -}}
|
||||
{{- end -}}
|
||||
{{- $.Scratch.Get "index" | jsonify -}}
|
||||
@ -0,0 +1,63 @@
|
||||
{{ define "main" }}
|
||||
<div class="section">
|
||||
<div class="columns is-multiline">
|
||||
{{ range .Pages.ByPublishDate.Reverse }}
|
||||
{{ $.Scratch.Set "relLink" .RelPermalink }}
|
||||
<div class="column is-one-quarter">
|
||||
<div class="card">
|
||||
<header class="card-header">
|
||||
<p class="card-header-title">
|
||||
<a class="title" href="{{ .RelPermalink }}">{{ .Title }}</a>
|
||||
<i class="fas fa-tags pl-3 pb-3"></i>
|
||||
</p>
|
||||
<div class="pt-4 pr-2">
|
||||
{{ $.Scratch.Set "category" .Title }}
|
||||
{{ range $name, $taxonomy := .Site.Taxonomies }}
|
||||
{{ range $key, $value := $taxonomy }}
|
||||
{{ if (eq $key ($.Scratch.Get "category")) }}
|
||||
{{ $.Scratch.Set "count" (len $value) }}
|
||||
{{ if (gt (len $value) 1 ) }}
|
||||
{{ len $value }} Recipes Found
|
||||
{{ else }}
|
||||
1 Recipe Found
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</header>
|
||||
<div class="card-content">
|
||||
<div class="content">
|
||||
{{ $.Scratch.Set "category" .Title }}
|
||||
{{ range $name, $taxonomy := .Site.Taxonomies }}
|
||||
{{ range $key, $value := $taxonomy }}
|
||||
{{ if (eq $key ($.Scratch.Get "category")) }}
|
||||
{{ range first 5 $value.Pages }}
|
||||
<li><a href="{{ .Permalink}}"> {{ .LinkTitle }}</a></li>
|
||||
{{ end }}
|
||||
{{ if (gt (len $value) 5) }}
|
||||
<a href={{ $.Scratch.Get "relLink" }}>See All</a>
|
||||
{{ end }}
|
||||
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
<a class="summary" href="{{ .RelPermalink }}">
|
||||
<p>{{ .Summary }}</p>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
{{/* <p>
|
||||
<h3><a class="title" href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
|
||||
{{ partial "metadata.html" . }}
|
||||
<a class="summary" href="{{ .RelPermalink }}">
|
||||
<p>{{ .Summary }}</p>
|
||||
</a>
|
||||
</p> */}}
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
@ -0,0 +1,33 @@
|
||||
{{ define "main" }}
|
||||
<div class="section">
|
||||
<div class="columns is-centered">
|
||||
<div class="column is-full-mobile is-half-desktop" style="border-radius: 1%; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)">
|
||||
<div class="is-flex" style="justify-content: center; border-radius: 3%; background-color: #f0f5f1; position: relative;">
|
||||
<figure class="image">
|
||||
<img style="border-radius: 3%; width: {{.Params.Image_width}}px; height: {{.Params.Image_height}}px" src={{ printf "%s%s" .Site.BaseURL .Params.Recipe_image }} alt="Placeholder image">
|
||||
</figure>
|
||||
<div id="printButton" style="position: absolute; bottom: 0; right: 0;" class="is-rounded">
|
||||
<a href="/print/{{ urlize .File.BaseFileName }}/print.html" target="_blank"><i class="fas fa-print fa-3x"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container has-text-centered">
|
||||
<h1 class="title is-bold"> {{ .Title }}</h1>
|
||||
<p class="subtitle is-italic"> {{ .Params.Author }}</p>
|
||||
<div class="container has-text-right">
|
||||
{{ partial "metadata.html" . }}
|
||||
</div>
|
||||
<hr>
|
||||
</div>
|
||||
<div class="container has-text-centered">
|
||||
{{ partial "statstable.html" . }}
|
||||
</div>
|
||||
<hr>
|
||||
<p class="subtitle is-italic"> {{ .Params.Tagline }}</p>
|
||||
<div class="content">
|
||||
{{ .Content }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
@ -0,0 +1,3 @@
|
||||
<div id="alert" class="notification is-danger is-hidden" style="position: absolute; bottom: 0; right: 0; z-index:99">
|
||||
Alert
|
||||
</div>
|
||||
@ -0,0 +1 @@
|
||||
<p class="footer text-center">Using <a href="https://github.com/deranjer/hugo-cookbook" target="_blank">Hugo Cookbook Theme</a>, <a href="https://fontawesome.com/license/free" target="_blank">Font Awesome Icons</a> and <a href="https://bulma.io/" target="_blank">Bulma CSS</a></p>
|
||||
@ -0,0 +1,11 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" type="image/svg+xml" href="/images/favicon.svg">
|
||||
<link rel="stylesheet" type="text/css" href="/css/bulma.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="/css/custom.css">
|
||||
<script src="https://kit.fontawesome.com/b7002cebe4.js" crossorigin="anonymous"></script>
|
||||
{{ $title := print .Site.Title " | " .Title }}
|
||||
{{ if .IsHome }}{{ $title = .Site.Title }}{{ end }}
|
||||
<title>{{ $title }}</title>
|
||||
</head>
|
||||
@ -0,0 +1,42 @@
|
||||
<nav class="navbar is-primary" role="navigation" aria-label="main navigation">
|
||||
<div class="navbar-brand">
|
||||
<a class="navbar-brand">
|
||||
{{ with .Site.Params.logo }}
|
||||
<img src="{{ .filename }}" width="{{ .width }}" height="{{ .height }}">
|
||||
{{ else }}
|
||||
<h1 style="font-size:300%"><em>{{ .Site.Params.navText.text }}</em></h1>
|
||||
{{ end }}
|
||||
</a>
|
||||
<a id="navBarButton" role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
</a>
|
||||
</div>
|
||||
<div id="navBarMenu" class="navbar-menu">
|
||||
<div class="navbar-start">
|
||||
{{ range .Site.Menus.main }}
|
||||
<a class="navbar-item" href="{{- .URL -}}">
|
||||
{{ if .Pre }}
|
||||
{{ $icon := printf "<i class=\"%s pr-2\"></i> " .Pre | safeHTML }}
|
||||
{{- $icon -}}
|
||||
{{ end }}
|
||||
{{ $text := print .Name | safeHTML }}
|
||||
{{- $text -}}
|
||||
</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="navbar-end">
|
||||
<div class="navbar-item">
|
||||
<form class="field has-addons">
|
||||
<div class="control">
|
||||
<input class="input" id="searchTerm" type="text" value="" placeholder="Search Term...">
|
||||
</div>
|
||||
<div class="control">
|
||||
<button id="searchButton" class="button is-secondary">Search</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
@ -0,0 +1,11 @@
|
||||
{{ $dateTime := .PublishDate.Format "01-02-2006" }}
|
||||
{{ $dateFormat := .Site.Params.dateFormat | default "Jan 2, 2006" }}
|
||||
<i class="far fa-calendar-alt"></i>
|
||||
<time datetime="{{ $dateTime }}">{{ .PublishDate.Format $dateFormat }}</time>
|
||||
{{ with .Params.tags }}
|
||||
<i class="fas fa-tags"></i>
|
||||
{{ range . }}
|
||||
{{ $href := print (absURL "tags/") (urlize .) }}
|
||||
<a class="btn btn-sm btn-outline-dark tag-btn" href="{{ $href }}">{{ . }}</a>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
@ -0,0 +1,9 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="../../css/bulma.min.css">
|
||||
<script src="https://kit.fontawesome.com/b7002cebe4.js" crossorigin="anonymous"></script>
|
||||
{{ $title := print .Site.Title " | " .Title }}
|
||||
{{ if .IsHome }}{{ $title = .Site.Title }}{{ end }}
|
||||
<title>{{ $title }}</title>
|
||||
</head>
|
||||
@ -0,0 +1,7 @@
|
||||
{{ with .Params.tags }}
|
||||
<i class="fas fa-tags"></i>
|
||||
{{ range . }}
|
||||
{{/* {{ $href := print (absURL "tags/") (urlize .) }} */}}
|
||||
{{ . }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
@ -0,0 +1,2 @@
|
||||
<script src="/js/umbrella.min.js"></script>
|
||||
<script src="/js/print.js"></script>
|
||||
@ -0,0 +1,38 @@
|
||||
<div class="columns">
|
||||
<div class="column" style="border-right: 1px solid #dbdbdb; padding: 0px;">
|
||||
<i class="fas fa-concierge-bell"></i>
|
||||
<div></div>
|
||||
<p class="has-text-weight-bold">Servings</p>
|
||||
<div></div>
|
||||
{{ .Params.Servings | default "---"}} Servings
|
||||
</div>
|
||||
<div class="column" style="border-right: 1px solid #dbdbdb; padding: 0px;">
|
||||
<i class="fas fa-hourglass-half"></i>
|
||||
<div></div>
|
||||
<p class="has-text-weight-bold">Prep time</p>
|
||||
<div></div>
|
||||
{{ .Params.Prep_time | default "---"}} Minutes
|
||||
</div>
|
||||
<div class="column" style="border-right: 1px solid #dbdbdb; padding: 0px;">
|
||||
<i class="fas fa-temperature-high"></i>
|
||||
<div></div>
|
||||
{{ if .Params.Cook }}
|
||||
<p class="has-text-weight-bold is-size-6">Cooking Time</p>
|
||||
{{ else }}
|
||||
<p class="has-text-weight-bold is-size-6">Cooling Time</p>
|
||||
{{ end }}
|
||||
<div></div>
|
||||
{{ if eq .Params.Cook_increment "hours" }}
|
||||
{{ .Params.Cook_time | default "---"}} Hours
|
||||
{{ else }}
|
||||
{{ .Params.Cook_time | default "---"}} Minutes
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="column" style="padding: 0px;">
|
||||
<i class="fas fa-fire"></i>
|
||||
<div></div>
|
||||
<p class="has-text-weight-bold">Calories</p>
|
||||
<div></div>
|
||||
{{ .Params.Calories | default "---" }} Kcal
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,5 @@
|
||||
<script src="/js/umbrella.min.js"></script>
|
||||
<script src="/js/custom.js"></script>
|
||||
<script src="/js/menu.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/fuse.js/3.2.0/fuse.min.js"></script>
|
||||
|
||||
@ -0,0 +1,31 @@
|
||||
<div id="searchResults" class="section is-hidden">
|
||||
<h4 class="title is-3"> Search results </h4>
|
||||
<div id="searchResultsCol" class="columns is-multiline">
|
||||
{{/* Search template will populate here */}}
|
||||
</div>
|
||||
</div>
|
||||
<script id="search-result-template" type="text/x-js-template">
|
||||
<div class="column is-one-quarter">
|
||||
<div class="result" id="summary-${key}">
|
||||
<div class="card" style="border-radius: 1%;">
|
||||
<div class="card-image">
|
||||
<figure class="image is-4by3">
|
||||
<img style="border-radius: 3%;" src="${image}" alt="Placeholder image">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="media-content">
|
||||
<p class="title is-4 has-text-centered">${title}</p>
|
||||
<p class="subtitle is-6 "><em>{{ $.Params }}</em></p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="is-small">${snippet}</p>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<a href="${link}" class="card-footer-item button is-primary">View Recipe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
@ -0,0 +1,38 @@
|
||||
<div class="columns is-mobile is-multiline">
|
||||
<div class="column is-half-mobile" style="border-right: 1px solid #dbdbdb">
|
||||
<i class="fas fa-concierge-bell fa-lg"></i>
|
||||
<div></div>
|
||||
<p class="has-text-weight-bold is-size-6">Servings</p>
|
||||
<div></div>
|
||||
{{ .Params.Servings | default "---"}} Servings
|
||||
</div>
|
||||
<div class="column is-half-mobile" style="border-right: 1px solid #dbdbdb">
|
||||
<i class="fas fa-hourglass-half fa-lg"></i>
|
||||
<div></div>
|
||||
<p class="has-text-weight-bold is-size-6">Prep time</p>
|
||||
<div></div>
|
||||
{{ .Params.Prep_time | default "---"}} Minutes
|
||||
</div>
|
||||
<div class="column is-half-mobile" style="border-right: 1px solid #dbdbdb">
|
||||
<i class="fas fa-temperature-high fa-lg"></i>
|
||||
<div></div>
|
||||
{{ if .Params.Cook }}
|
||||
<p class="has-text-weight-bold is-size-6">Cooking Time</p>
|
||||
{{ else }}
|
||||
<p class="has-text-weight-bold is-size-6">Cooling Time</p>
|
||||
{{ end }}
|
||||
<div></div>
|
||||
{{ if eq .Params.Cook_increment "hours" }}
|
||||
{{ .Params.Cook_time | default "---"}} Hours
|
||||
{{ else }}
|
||||
{{ .Params.Cook_time | default "---"}} Minutes
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="column is-half-mobile">
|
||||
<i class="fas fa-fire fa-lg"></i>
|
||||
<div></div>
|
||||
<p class="has-text-weight-bold is-size-6">Calories</p>
|
||||
<div></div>
|
||||
{{ .Params.Calories | default "---" }} Kcal
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,26 @@
|
||||
<div class="card" style="border-radius: 1%;">
|
||||
<div class="card-image">
|
||||
<figure class="image is-4by3">
|
||||
<img style="border-radius: 3%;" src="{{ $.Params.Recipe_image }}" alt="Placeholder image">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="media-content">
|
||||
<p class="title is-4 has-text-centered">{{ $.Title }}</p>
|
||||
<p class="subtitle is-6 "><em>{{ $.Params.Author }}</em></p>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p class="is-small">{{ $.Params.Tagline }}</p>
|
||||
<br>
|
||||
<i class="fas fa-tags pr-2"></i>
|
||||
{{ range $index, $element := $.Params.Tags }}
|
||||
<a href="#">{{$element}}</a>
|
||||
{{ end }}
|
||||
<br>
|
||||
<i class="fas fa-calendar pr-4"></i>{{ .Date.Format "January 2006" }}
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<a href="{{ .Permalink }}" class="card-footer-item button is-primary">View Recipe</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1 @@
|
||||
<div>{{ .Inner }}</div>
|
||||
@ -0,0 +1 @@
|
||||
<li>{{ .Inner }}</li>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,4 @@
|
||||
li {
|
||||
padding-bottom: .5em;
|
||||
font-size: 20px;
|
||||
}
|
||||
@ -0,0 +1,127 @@
|
||||
|
||||
var searchTerm = null;
|
||||
|
||||
summaryInclude=60;
|
||||
var fuseOptions = {
|
||||
shouldSort: true,
|
||||
includeMatches: true,
|
||||
threshold: 0.0,
|
||||
tokenize:true,
|
||||
location: 0,
|
||||
distance: 100,
|
||||
maxPatternLength: 32,
|
||||
minMatchCharLength: 1,
|
||||
keys: [
|
||||
{name:"title",weight:0.8},
|
||||
{name:"contents",weight:0.5},
|
||||
{name:"tags",weight:0.3},
|
||||
{name:"categories",weight:0.3}
|
||||
]
|
||||
};
|
||||
|
||||
u('#searchTerm').on('change keyup', function() { // Set the search value on keyup for the input
|
||||
searchTerm = this.value;
|
||||
})
|
||||
|
||||
function showAlert(message){
|
||||
u('#alert').removeClass("is-hidden")
|
||||
u('#alert').html(message)
|
||||
setTimeout(function () {
|
||||
u('#alert').addClass("is-hidden")
|
||||
}, 3000)
|
||||
}
|
||||
|
||||
u('#searchButton').handle('click', function(e) { //use handle to automatically prevent default
|
||||
if(searchTerm){
|
||||
u("#searchTerm").text(searchTerm);
|
||||
u('#searchButton').addClass("is-loading");
|
||||
executeSearch(searchTerm);
|
||||
}else {
|
||||
showAlert("Search cannot be empty!")
|
||||
}
|
||||
})
|
||||
|
||||
function executeSearch(searchQuery){
|
||||
fetch("/index.json").then(r => r.json())
|
||||
.then(function(data) {
|
||||
var pages = data;
|
||||
var fuse = new Fuse(pages, fuseOptions);
|
||||
var result = fuse.search(searchQuery);
|
||||
if(result.length > 0){
|
||||
u('#content').addClass("is-hidden"); //hiding our main content to display the results
|
||||
u('#searchResults').children(u('div')).empty(); // clean out any previous search results
|
||||
u('#searchButton').removeClass("is-loading") //change our button back
|
||||
u('#searchResults').removeClass("is-hidden") //show Result area
|
||||
populateResults(result);
|
||||
}else{
|
||||
showAlert("No results found!")
|
||||
u('#searchButton').removeClass("is-loading");
|
||||
u("#searchTerm").text("");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function populateResults(result){
|
||||
//Object.keys(result).forEach(function(key,value){
|
||||
Object.entries(result).forEach(entry => {
|
||||
const [key, value] = entry;
|
||||
var contents= value.item.contents;
|
||||
var snippet = "";
|
||||
var snippetHighlights=[];
|
||||
var tags =[];
|
||||
if( fuseOptions.tokenize ){
|
||||
snippetHighlights.push(searchTerm);
|
||||
}else{
|
||||
value.matches.forEach(function(matchKey,mvalue){
|
||||
|
||||
if(mvalue.key == "tags" || mvalue.key == "categories" ){
|
||||
snippetHighlights.push(mvalue.value);
|
||||
}else if(mvalue.key == "contents"){
|
||||
start = mvalue.indices[0][0]-summaryInclude>0?mvalue.indices[0][0]-summaryInclude:0;
|
||||
end = mvalue.indices[0][1]+summaryInclude<contents.length?mvalue.indices[0][1]+summaryInclude:contents.length;
|
||||
snippet += contents.substring(start,end);
|
||||
snippetHighlights.push(mvalue.value.substring(mvalue.indices[0][0],mvalue.indices[0][1]-mvalue.indices[0][0]+1));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if(snippet.length<1){
|
||||
snippet += contents.substring(0,summaryInclude*2);
|
||||
}
|
||||
//pull template from hugo template definition
|
||||
var templateDefinition = u('#search-result-template').html();
|
||||
//replace values
|
||||
var output = render(templateDefinition,{key:key,title:value.item.title,link:value.item.permalink,tags:value.item.tags,categories:value.item.categories,snippet:snippet,image:value.item.imageLink});
|
||||
u('#searchResultsCol').append(output);
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
function param(name) {
|
||||
return decodeURIComponent((location.search.split(name + '=')[1] || '').split('&')[0]).replace(/\+/g, ' ');
|
||||
}
|
||||
|
||||
function render(templateString, data) {
|
||||
var conditionalMatches,conditionalPattern,copy;
|
||||
conditionalPattern = /\$\{\s*isset ([a-zA-Z]*) \s*\}(.*)\$\{\s*end\s*}/g;
|
||||
//since loop below depends on re.lastInxdex, we use a copy to capture any manipulations whilst inside the loop
|
||||
copy = templateString;
|
||||
while ((conditionalMatches = conditionalPattern.exec(templateString)) !== null) {
|
||||
if(data[conditionalMatches[1]]){
|
||||
//valid key, remove conditionals, leave contents.
|
||||
copy = copy.replace(conditionalMatches[0],conditionalMatches[2]);
|
||||
}else{
|
||||
//not valid, remove entire section
|
||||
copy = copy.replace(conditionalMatches[0],'');
|
||||
}
|
||||
}
|
||||
templateString = copy;
|
||||
//now any conditionals removed we can do simple substitution
|
||||
var key, find, re;
|
||||
for (key in data) {
|
||||
find = '\\$\\{\\s*' + key + '\\s*\\}';
|
||||
re = new RegExp(find, 'g');
|
||||
templateString = templateString.replace(re, data[key]);
|
||||
}
|
||||
return templateString;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,9 @@
|
||||
// Toggle menu with button
|
||||
u('#navBarButton').on('click', function(e) {
|
||||
u('#navBarMenu').toggleClass('is-active')
|
||||
})
|
||||
|
||||
// Hide menu on search
|
||||
u('#searchButton').on('click', function(e) {
|
||||
u('#navBarMenu').removeClass('is-active')
|
||||
})
|
||||
@ -0,0 +1,32 @@
|
||||
|
||||
// Shrink up the spacing and change the size of the headers
|
||||
u('#ingredients').attr("style", "margin-bottom: .5em;")
|
||||
u('#ingredients').attr("class", "is-size-5")
|
||||
u('#directions').attr("style", "margin: 0px;")
|
||||
u('#directions').attr("class", "is-size-5")
|
||||
|
||||
// If we have ingredients subheadings, change the h4 headings
|
||||
u('h4').addClass("is-size-6")
|
||||
u('h4').attr("style", "margin: 0px;")
|
||||
|
||||
// Change the title size
|
||||
u('#mainTitle').addClass("is-size-4")
|
||||
|
||||
// Change the lists margins
|
||||
var directions = u('ol');
|
||||
directions.attr("style", "margin-top: 0px; margin-bottom: 0px;")
|
||||
|
||||
var ingredients = u('ul');
|
||||
ingredients.attr("style", "margin-top: 0px; margin-bottom: 0px;")
|
||||
|
||||
var listItems = u('li');
|
||||
listItems.attr("style", "margin-top: 0px;")
|
||||
|
||||
// Remove the last <hr> if we have a footnote
|
||||
var hrs = u('hr')
|
||||
if (hrs.length > 2) {
|
||||
hrs.last().remove()
|
||||
}
|
||||
|
||||
// Remove the footnote links
|
||||
u(document.getElementsByClassName('footnote-backref')).remove()
|
||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,35 @@
|
||||
# theme.toml template for a Hugo theme
|
||||
# See https://github.com/gohugoio/hugoThemes#themetoml for an example
|
||||
|
||||
name = "Cookbook"
|
||||
license = "MIT"
|
||||
licenselink = "https://github.com/deranjer/hugo-cookbook/blob/master/LICENSE"
|
||||
description = "Cookbook is a theme that stores all of your recipes and displays them in a viewable format on desktop and mobile."
|
||||
homepage = "https://github.com/deranjer/hugo-cookbook/"
|
||||
tags = ["recipes", "cookbook", "cooking", "bulma", "responsive"]
|
||||
features = []
|
||||
min_version = "0.72.0"
|
||||
|
||||
[author]
|
||||
name = "Jared Swets"
|
||||
homepage = ""
|
||||
|
||||
|
||||
[markup]
|
||||
defaultMarkdownHandler = "goldmark"
|
||||
[markup.goldmark.extensions]
|
||||
definitionList = true
|
||||
footnote = true
|
||||
linkify = true
|
||||
strikethrough = true
|
||||
table = true
|
||||
taskList = true
|
||||
typographer = true
|
||||
[markup.goldmark.parser]
|
||||
attribute = true
|
||||
autoHeadingID = true
|
||||
autoHeadingIDType = "github"
|
||||
[markup.goldmark.renderer]
|
||||
hardWraps = false
|
||||
unsafe = false
|
||||
xhtml = false
|
||||
Loading…
Reference in new issue