Compare commits

...

2 commits

Author SHA1 Message Date
5f19345653
use JS to show/hide subrecipes
Some checks failed
continuous-integration/drone/push Build is failing
2020-03-01 16:47:33 +10:00
f07860b1d4
made licensing a h2 2020-03-01 16:13:27 +10:00
5 changed files with 23 additions and 4 deletions

View file

@ -87,7 +87,7 @@ The entries in `parents` refer to the filenames of the parent recipes - `chocola
If a subrecipe does not have at least one valid `parents` entry, it will not appear anywhere on the website.
### Licensing
## Licensing
This software is licensed under the [Apache 2.0 license](https://choosealicense.com/licenses/apache-2.0/).
Copyright 2020 Lynnesbian

View file

@ -5,6 +5,6 @@
<{{tag}}>Ingredients</{{tag}}>
<ul>
{% for item in page.ingredients -%}
<li>{{ item[0] }} {%- if item[2] %} {{ item[2] }} of {% endif %} {{ item[1] }}</li>
<li>{{ item[0] }} {%- if item[2] %} {{ item[2] }} of {% endif -%} {{ item[1] }}</li>
{% endfor -%}
</ul>

View file

@ -4,6 +4,7 @@
<head>
<meta charset="UTF-8">
<link rel='stylesheet' href='/style.css'>
<script async src='/script.js'></script>
<title>{{ page.title }}</title>
</head>

View file

@ -33,8 +33,9 @@ layout: default
<h2> Subrecipes </h2>
{% for subrecipe in site.subrecipes -%}
{%- if subrecipe.parents contains id -%}
<div class='subrecipe' id='sr-{{ subrecipe.name | downcase | url_encode }}'>
<h3>{{ subrecipe.name }}</h3>
{%- assign srid = "sr-" | append: subrecipe.name | downcase | url_encode -%}
<div class='subrecipe' id='{{ srid }}'>
<div class='subrecipe-heading'><h3>{{ subrecipe.name }}</h3><span class='subrecipe-toggle show' onclick="subrecipe_toggle('{{ srid }}');"></span></div>
<div class='subrecipe-output'>
{{ subrecipe.output }}
</div>

View file

@ -24,6 +24,23 @@ body div {
height: min-content;
}
.subrecipe-heading h3 {
display: inline-block;
}
.subrecipe-toggle {
margin-left: 10px;
}
.subrecipe-toggle::after {
font-style: italic;
}
.subrecipe .subrecipe-toggle::after {
content: "Show";
}
.subrecipe.open .subrecipe-toggle::after {
content: "Hide";
}
ul {
list-style-type: "- ";
}