Styling Updates

src/main/java/Team5/SmartTowns/users/UserController.java

@@ -43,8 +43,8 @@ public class UserController {
     @GetMapping("/user/{id}")
     public ModelAndView getUserPage(@PathVariable int id) {
         ModelAndView mav = new ModelAndView("rewards/userProfile");
-//        List<Badge> badges = badgesRepository.getAllBadges(); DEPRECATED FOR THE MOMENT
-//        mav.addObject("badges", badges);
+        List<Badge> badges = badgesRepository.getAllBadges(); /*DEPRECATED FOR THE MOMENT*/
+        mav.addObject("badges", badges);
         List<Sticker> allStickers = stickersRepository.getAllStickers();
         List<User> users = userRepository.getAllUsers();
         Map<Long, Boolean> userStickers = userRepository.getStickers(id);

src/main/resources/data.sql

 delete from users;
-insert into users (userID, email, name, dragonProgress) value ('1', 'hannah@gmail.com', 'Hannah', '90');
-insert into users (userID, email, name) value ('2', 'nigel@gmail.com', 'Nigel');
+insert into users (email, name, dragonProgress) value ('hannah@gmail.com', 'Hannah', '90');
+insert into users (userID, email, name, dragonProgress) value ('2', 'nigel@gmail.com', 'Nigel', '40');
 
 delete from trails;
 insert into trails (trailID, Name) value ('1', 'Caerphilly Coffee Trail');

src/main/resources/static/css/userProfile.css

@@ -351,6 +351,7 @@ header .footerButton:hover {
     transition: 0.3s ease-in-out 1ms;
 }
 
+
 #invalidLogin {
     color: red;
     text-shadow: black 0 0.1em 0.2em;

src/main/resources/templates/rewards/userProfile.html

@@ -29,13 +29,13 @@
         <!--TODO add some progression info here?-->
     </div>
     <section class="rewards"> <!--Reward lists, badges on top, stickers (larger) on the bottom-->
-<!--        <article id="badgesBar">-->
-<!--            <h2>Your Badges: </h2> &lt;!&ndash;Shows first earned badges, followed by greyed out badges&ndash;&gt;-->
-<!--            <div id="allBadgesContainer"  class="centerFlex">-->
-<!--                <img class="badgeImg"  th:each="badge : ${badges}" th:src="@{'..' + ${badge.getImgPath()}}"-->
-<!--                     th:id="'img' + ${badge.getId()}" th:alt="${badge.getName()}" >-->
-<!--            </div>-->
-<!--        </article>-->
+        <article id="badgesBar">
+            <h2>Your Badges: </h2> <!--Shows first earned badges, followed by greyed out badges-->
+            <div id="allBadgesContainer"  class="centerFlex">
+                <img class="badgeImg"  th:each="badge : ${badges}" th:src="@{'..' + ${badge.getImgPath()}}"
+                     th:id="'img' + ${badge.getId()}" th:alt="${badge.getName()}" >
+            </div>
+        </article>
         <article class="dragonProgression">
             <h1>The Dragon's Tale</h1>
             <div class="dragonContainer">