prehistoric-systems/itty-bitty
1
0
Fork 0
mirror of https://github.com/arfct/itty-bitty.git synced 2026-03-11 08:54:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update Recipe

Browse source
This commit is contained in:
Nicholas Jitkoff 2022-12-31 11:23:42 -06:00
parent 7e07ecdf2b
commit 47a21f4e0c
2 changed files with 16 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
docs/render/recipe.css
View file

@ -604,8 +604,11 @@ img.qr {
}
#thumbnail-container {
width: 100%;
height: 100vh;
width: calc(100% + 20px);
height: calc(100vh + 20px);
top:-10px;
left:-10px;
position: fixed;
top: 0;
overflow:
@ -613,16 +616,20 @@ img.qr {
z-index: -1;
}
.noblur #thumbnail {
filter:none !important;
}
.thumbnail {
max-height: 100vh;
height: 100vh;
max-height: calc(100vh + 20px);
height: calc(100vh + 20px);
}
.recipe-content {
max-width:50em;
padding: 2em 4em;
background-color: var(--background-color);
margin-top: 35vh;
margin-bottom: 35vh;
margin-top: 15vh;
margin-bottom: 95vh;
}
}

6
docs/render/recipe.js
View file

@ -613,7 +613,7 @@ function render() {
let blur = 1;
blur = Math.max(blur, Math.max(thumbnailContainer.offsetHeight * window.devicePixelRatio / bgImg.naturalHeight, thumbnailContainer.offsetWidth * window.devicePixelRatio / bgImg.naturalWidth))
if (blur > 1) thumbnail.style.filter = `blur(${blur/2}px)`;
if (blur > 1) thumbnail.style.filter = `blur(${blur}px)`;
setTimeout(() => thumbnail.style.opacity = 1.0, 0);
// if (window.scrollY == 0) setTimeout(() => {
@ -633,7 +633,7 @@ function render() {
document.body.appendChild(
m(".recipe", {},
image ? m("#thumbnail-container", m("#thumbnail.thumbnail.print-hide", { style: "background-image:url(" + image + ");" })) : null,
image ? m("#thumbnail-container", m("#thumbnail.thumbnail.print-hide", { onclick:(e) => document.body.classList.toggle('noblur'), style: "background-image:url(" + image + ");" })) : null,
m(".recipe-content",
m("div.headercolumns",
m("header",
@ -668,7 +668,7 @@ function render() {
),
),
m(".actions.print-hide.watch-hide",
originalURL ? m("a.action", { title:"Open original", href: originalURL, target:"_blank"}, m(".icon.public", {innerHTML:icons.public})) : null,
// originalURL ? m("a.action", { title:"Open original", href: originalURL, target:"_blank"}, m(".icon.public", {innerHTML:icons.public})) : null,
navigator.share ? m("a.action", { title:"Share", onclick: share}, m(".icon.share", {innerHTML:icons.share})) : undefined,
// m("a.action", { title:"Show steps as list", onclick: () => {reformat = !reformat; render(); return false;}}, m(".icon.checklist")),
m("a.action", { title:"Print", onclick: () => {window.print(); return false;} }, m(".icon.print", {innerHTML:icons.print})),