From 47c4155891894a2b4d33debdcdfd968ed1b6e0f8 Mon Sep 17 00:00:00 2001
From: tirthankarg <125943402+tirthankarg@users.noreply.github.com>
Date: Wed, 4 Jun 2025 12:00:47 +0530
Subject: [PATCH] Update recipeView.js
// old (not working)
// import { Fraction } from 'fractional';
// new
import Fraction from 'fraction.js';
And
new Fraction(ing.quantity).toFraction(true).
}
---
18-forkify/final/src/js/views/recipeView.js | 13 ++++++++++---
1 file changed, 10 insertions(+), 3 deletions(-)
diff --git a/18-forkify/final/src/js/views/recipeView.js b/18-forkify/final/src/js/views/recipeView.js
index 0d6f637cb7..61aa9040ca 100644
--- a/18-forkify/final/src/js/views/recipeView.js
+++ b/18-forkify/final/src/js/views/recipeView.js
@@ -2,7 +2,12 @@ import View from './View.js';
// import icons from '../img/icons.svg'; // Parcel 1
import icons from 'url:../../img/icons.svg'; // Parcel 2
-import { Fraction } from 'fractional';
+
+// old (not working)
+// import { Fraction } from 'fractional';
+
+// new
+import Fraction from 'fraction.js';
class RecipeView extends View {
_parentElement = document.querySelector('.recipe');
@@ -127,8 +132,10 @@ class RecipeView extends View {
<svg class="recipe__icon">
<use href="${icons}#icon-check"></use>
</svg>
- <div class="recipe__quantity">${
- ing.quantity ? new Fraction(ing.quantity).toString() : ''
+ <div class="recipe__quantity">
+
+ ${
+ ing.quantity ? new Fraction(ing.quantity).toFraction(true) : ''
}</div>
<div class="recipe__description">
<span class="recipe__unit">${ing.unit}</span>