Update 17 files

- /src/main/resources/application.properties
- /src/main/resources/templates/view-recipe.html
- /src/main/resources/templates/create-recipe.html
- /src/main/resources/templates/home.html
- /src/main/resources/templates/explore.html
- /src/main/resources/templates/public-profile.html
- /src/main/resources/templates/my-profile.html
- /src/main/resources/templates/update-recipe.html
- /src/main/resources/static/css/view-recipe.css
- /src/main/java/com/example/demo/controller/SiteController.java
- /src/main/java/com/example/demo/controller/RecipeUploadController.java
- /src/main/java/com/example/demo/controller/RecipeUploadForm.java
- /src/main/java/com/example/demo/config/WebConfig
- /src/main/java/com/example/demo/config/SecurityConfig.java
- /src/main/java/com/example/demo/config/WebConfig.java
- /src/main/java/com/example/demo/service/Impl/RecipeServiceImpl.java
- /src/main/java/com/example/demo/service/RecipeService.java

src/main/resources/templates/explore.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8">
     <meta name="_csrf_header" th:content="${_csrf.headerName}"/>
     <meta name="_csrf" th:content="${_csrf.token}"/>
-    <title>Explore - Thyme Crunch</title>
+    <title>Thyme Crunch Home</title>
     <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 rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
@@ -52,7 +52,7 @@
  		 		<button type="submit"><i class="fa fa-search"></i></button>
 			</div>
 			</form>
-    	</div>
+</div>
     	<p th:if="${#lists.isEmpty(recipes)}">There are no recipes that fit this description.</p>
 
         <div class="recipe-card" th:unless="${#lists.isEmpty(recipes)}">
@@ -65,10 +65,11 @@
                 	<div th:if="${recipe.images != null and !#lists.isEmpty(recipe.images)}">
                     	<img th:src="${recipe.images[0].imageUrl}" alt="Recipe Image">
                 	</div>
-                	<p class="card-cost" th:text="${recipe.cost}">Cost</p>
+                	<p th:text="${recipe.cost}">Cost</p>
             	</div>
         	</a>
 		</div>	
+
     </main>
 
     <!--Filter -->
@@ -234,12 +235,6 @@
 	    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>
             
 </body>