1 Commits
Author SHA1 Message Date
aaron.axvig 3e695d6699 Scale only recipe cooking content 2026-08-03 22:24:41 -05:00
5 changed files with 19 additions and 17 deletions
+10 -10
View File
@@ -4,7 +4,7 @@
} }
.MMM-NextcloudCookbook .ncc-active { .MMM-NextcloudCookbook .ncc-active {
--ncc-type-scale: 1; --ncc-content-scale: 1;
position: fixed; position: fixed;
inset: 0; inset: 0;
@@ -54,9 +54,9 @@
} }
.MMM-NextcloudCookbook .ncc-recipe h1 { .MMM-NextcloudCookbook .ncc-recipe h1 {
margin: 0 0 calc(26px * var(--ncc-type-scale)); margin: 0 0 26px;
color: #fff6d8; color: #fff6d8;
font-size: calc(82px * var(--ncc-type-scale)); font-size: 82px;
line-height: 1.08; line-height: 1.08;
} }
@@ -65,8 +65,8 @@
flex-wrap: wrap; flex-wrap: wrap;
gap: 10px 22px; gap: 10px 22px;
align-items: baseline; align-items: baseline;
margin: 0 0 calc(36px * var(--ncc-type-scale)); margin: 0 0 36px;
font-size: calc(36px * var(--ncc-type-scale)); font-size: 36px;
} }
.MMM-NextcloudCookbook .ncc-meta dt { .MMM-NextcloudCookbook .ncc-meta dt {
@@ -83,7 +83,7 @@
} }
.MMM-NextcloudCookbook .ncc-layout-stacked section:first-child { .MMM-NextcloudCookbook .ncc-layout-stacked section:first-child {
margin-bottom: calc(42px * var(--ncc-type-scale)); margin-bottom: calc(42px * var(--ncc-content-scale));
} }
.MMM-NextcloudCookbook .ncc-layout-side-by-side { .MMM-NextcloudCookbook .ncc-layout-side-by-side {
@@ -93,21 +93,21 @@
} }
.MMM-NextcloudCookbook .ncc-columns h2 { .MMM-NextcloudCookbook .ncc-columns h2 {
margin: 0 0 calc(18px * var(--ncc-type-scale)); margin: 0 0 calc(18px * var(--ncc-content-scale));
color: #d6b96b; color: #d6b96b;
font-size: calc(56px * var(--ncc-type-scale)); font-size: calc(56px * var(--ncc-content-scale));
} }
.MMM-NextcloudCookbook .ncc-columns ul, .MMM-NextcloudCookbook .ncc-columns ul,
.MMM-NextcloudCookbook .ncc-columns ol { .MMM-NextcloudCookbook .ncc-columns ol {
margin: 0; margin: 0;
padding-left: 1.25em; padding-left: 1.25em;
font-size: calc(50px * var(--ncc-type-scale)); font-size: calc(50px * var(--ncc-content-scale));
line-height: 1.36; line-height: 1.36;
} }
.MMM-NextcloudCookbook .ncc-columns li { .MMM-NextcloudCookbook .ncc-columns li {
margin-bottom: calc(18px * var(--ncc-type-scale)); margin-bottom: calc(18px * var(--ncc-content-scale));
} }
.MMM-NextcloudCookbook .ncc-error { .MMM-NextcloudCookbook .ncc-error {
+2 -2
View File
@@ -58,7 +58,7 @@ Module.register("MMM-NextcloudCookbook", {
for (let attempt = 0; attempt < 12; attempt++) { for (let attempt = 0; attempt < 12; attempt++) {
const scale = (minimum + maximum) / 2; const scale = (minimum + maximum) / 2;
root.style.setProperty("--ncc-type-scale", scale); root.style.setProperty("--ncc-content-scale", scale);
const fits = recipe.scrollHeight <= availableHeight const fits = recipe.scrollHeight <= availableHeight
&& recipe.scrollWidth <= availableWidth; && recipe.scrollWidth <= availableWidth;
if (fits) { if (fits) {
@@ -68,7 +68,7 @@ Module.register("MMM-NextcloudCookbook", {
maximum = scale; maximum = scale;
} }
} }
root.style.setProperty("--ncc-type-scale", best.toFixed(3)); root.style.setProperty("--ncc-content-scale", best.toFixed(3));
}, },
setRecipeMode(active) { setRecipeMode(active) {
+4 -2
View File
@@ -25,8 +25,10 @@ link; it should look like `https://cloud.example.test/s/SHARE_TOKEN`.
`layout` controls the full-screen recipe arrangement. Its default value, `layout` controls the full-screen recipe arrangement. Its default value,
`"stacked"`, displays the ingredients above the instructions. Set it to `"stacked"`, displays the ingredients above the instructions. Set it to
`"side-by-side"` to display ingredients and instructions in two columns. Both `"side-by-side"` to display ingredients and instructions in two columns. Both
layouts automatically enlarge the recipe to make the best use of the available layouts automatically scale the ingredient and instruction sections to make
screen while keeping all of its content visible. the best use of the available screen while keeping all recipe content visible.
The recipe title, timing metadata, yield, and QR controller remain at fixed
sizes.
The configured `position` controls where the QR controller appears during the The configured `position` controls where the QR controller appears during the
normal MagicMirror layout. When a recipe is activated, the module displays a normal MagicMirror layout. When a recipe is activated, the module displays a
+2 -2
View File
@@ -1,12 +1,12 @@
{ {
"name": "mmm-nextcloud-cookbook", "name": "mmm-nextcloud-cookbook",
"version": "0.2.0", "version": "0.2.1",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "mmm-nextcloud-cookbook", "name": "mmm-nextcloud-cookbook",
"version": "0.2.0", "version": "0.2.1",
"dependencies": { "dependencies": {
"fast-xml-parser": "5.10.1", "fast-xml-parser": "5.10.1",
"qrcode": "1.5.4" "qrcode": "1.5.4"
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "mmm-nextcloud-cookbook", "name": "mmm-nextcloud-cookbook",
"version": "0.2.0", "version": "0.2.1",
"private": true, "private": true,
"description": "Display recipes from a Nextcloud Cookbook share on MagicMirror", "description": "Display recipes from a Nextcloud Cookbook share on MagicMirror",
"main": "node_helper.js", "main": "node_helper.js",