etc404/thymecrunch
1
0
Fork 0
mirror of https://gitlab.com/etc404/software-engineering-project.git synced 2026-05-10 20:52:58 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

js for cost

Browse Source
This commit is contained in:
kaipher7
2026-04-20 20:58:23 -06:00
parent 24d193504e
commit 37f8cca781
6 changed files with 44 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/resources/static/css/explore.css
+6
View File
@@ -425,6 +425,12 @@ a {
color: var(--dusty-red-hover); color: var(--dusty-red-hover);
} }
.card-cost {
font-weight: 800;
color: var(--dusty-red);
}
/* ========================= /* =========================
Card Image Card Image
========================= */ ========================= */
src/main/resources/static/css/home.css
+6
View File
@@ -290,6 +290,12 @@ a {
color: var(--dusty-red-hover); color: var(--dusty-red-hover);
} }
.card-cost {
font-weight: 800;
color: var(--dusty-red);
}
/* ========================= /* =========================
Card Image Card Image
========================= */ ========================= */
src/main/resources/static/css/my-profile.css
+5
View File
@@ -399,6 +399,11 @@ a {
overflow: hidden; overflow: hidden;
} }
.card-cost {
font-weight: 800;
color: var(--dusty-red);
}
/* ========================= /* =========================
Card Image Card Image
========================= */ ========================= */
src/main/resources/templates/explore.html
+8 -2
View File
@@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="_csrf_header" th:content="${_csrf.headerName}"/> <meta name="_csrf_header" th:content="${_csrf.headerName}"/>
<meta name="_csrf" th:content="${_csrf.token}"/> <meta name="_csrf" th:content="${_csrf.token}"/>
<title>Thyme Crunch Home</title> <title>Explore - Thyme Crunch</title>
<link rel="stylesheet" th:href="@{css/explore.css}"> <link rel="stylesheet" th:href="@{css/explore.css}">
<link href="https://fonts.googleapis.com/css2?family=Delius+Swash+Caps&family=Mali:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Delius+Swash+Caps&family=Mali:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
@@ -65,7 +65,7 @@
<div th:if="${recipe.images != null and !#lists.isEmpty(recipe.images)}"> <div th:if="${recipe.images != null and !#lists.isEmpty(recipe.images)}">
<img th:src="${recipe.images[0].imageUrl}" alt="Recipe Image"> <img th:src="${recipe.images[0].imageUrl}" alt="Recipe Image">
</div> </div>
<p th:text="${recipe.cost}">Cost</p> <p class="card-cost" th:text="${recipe.cost}">Cost</p>
</div> </div>
</a> </a>
</div> </div>
@@ -234,6 +234,12 @@
window.location.href = '/explore?' + out.toString(); window.location.href = '/explore?' + out.toString();
} }
})(); })();
// For cost display
document.querySelectorAll('.card-cost').forEach(el => {
const num = parseInt(el.textContent);
el.textContent = num === 0 ? '' : '$'.repeat(num);
});
</script> </script>
</body> </body>
src/main/resources/templates/home.html
+10 -2
View File
@@ -2,7 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Thyme Crunch Home</title> <title>Home - Thyme Crunch</title>
<link rel="stylesheet" th:href="@{css/home.css}"> <link rel="stylesheet" th:href="@{css/home.css}">
<link href="https://fonts.googleapis.com/css2?family=Delius+Swash+Caps&family=Mali:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Delius+Swash+Caps&family=Mali:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700" rel="stylesheet">
</head> </head>
@@ -51,7 +51,7 @@
<div th:if="${recipe.images != null and !#lists.isEmpty(recipe.images)}"> <div th:if="${recipe.images != null and !#lists.isEmpty(recipe.images)}">
<img th:src="${recipe.images[0].imageUrl}" alt="Recipe Image"> <img th:src="${recipe.images[0].imageUrl}" alt="Recipe Image">
</div> </div>
<p th:text="${recipe.cost}">Cost</p> <p class="card-cost" th:text="${recipe.cost}">Cost</p>
</div> </div>
</a> </a>
</div> </div>
@@ -64,5 +64,13 @@
</div> </div>
</div> </div>
</div> </div>
<script>
document.querySelectorAll('.card-cost').forEach(el => {
const num = parseInt(el.textContent);
el.textContent = num === 0 ? '' : '$'.repeat(num);
});
</script>
</body> </body>
</html> </html>
src/main/resources/templates/my-profile.html
+8 -1
View File
@@ -56,7 +56,7 @@
<div th:if="${recipe.images != null and !#lists.isEmpty(recipe.images)}"> <div th:if="${recipe.images != null and !#lists.isEmpty(recipe.images)}">
<img th:src="${recipe.images[0].imageUrl}" alt="Recipe Image"> <img th:src="${recipe.images[0].imageUrl}" alt="Recipe Image">
</div> </div>
<p th:text="${recipe.cost}">Cost</p> <p class="card-cost" th:text="${recipe.cost}"><b>Cost</b></p>
</div> </div>
</a> </a>
<a th:href="@{/recipes/{id}/edit(id=${recipe.id})}" class="edit-link">Edit</a> <a th:href="@{/recipes/{id}/edit(id=${recipe.id})}" class="edit-link">Edit</a>
@@ -91,5 +91,12 @@
</div> </div>
<script>
document.querySelectorAll('.card-cost').forEach(el => {
const num = parseInt(el.textContent);
el.textContent = num === 0 ? '' : '$'.repeat(num);
});
</script>
</body> </body>
</html> </html>