Show tags on page / Change get_tags position

polls/models.py

@@ -223,6 +223,10 @@ class Question(models.Model):
 
         return score
 
+    def get_tags(self, *args, **kwargs):
+        return "-".join([tag.tag_text for tag in self.tags.all()])
+
+
     def save(self, *args, **kwargs):
         """Modify save method of Question object"""
         # to-be-added instance # * https://github.com/django/django/blob/866122690dbe233c054d06f6afbc2f3cc6aea2f2/django/db/models/base.py#L447
@@ -233,9 +237,6 @@ class Question(models.Model):
                 self.trend_score = self.trending_score(up=0, down=0)
         super(Question, self).save(*args, **kwargs)
 
-    def get_tags(self, *args, **kwargs):
-        return "-".join([tag.tag_text for tag in self.tags.all()])
-
 
 class Choice(models.Model):
     """

polls/templates/polls/index.html

@@ -90,6 +90,7 @@
               <h2 class="mb-2 text-xl font-bold truncate">{{ question.question_text }}</h2>
               <hr class="h-px my-2 bg-gray-200 border-0 dark:bg-gray-400" />
               <p class="mb-2 text-gray-600">{{ question.short_description }}</p>
+              <!--Up, Down Vote-->
               <div class="mb-2 flex items-center text-gray-600">
                 <span class="mr-2">👍</span>
                 <span>{{ question.up_vote_percentage }}% Upvoted</span>
@@ -97,12 +98,20 @@
                 <span class="ml-4 mr-2">👎</span>
                 <span>{{ question.down_vote_percentage }}% Downvoted</span>
               </div>
-              <!-- Tag / Time -->
+              <!-- Participant, Time -->
               <div class="flex items-center text-gray-600">
                 <span class="mr-2 rounded-md bg-green-500 px-2 py-1 text-white">🕒 {{ question.time_left }}</span>
                 <span class="mr-2 rounded-md bg-orange-100 px-2 py-1 text-black">{{ question.participants }} Participants 👤</span>
               </div>
-              <div class="flex items-center text-gray-600 py-4">
+              <!-- Tags-->
+              <div class="flex items-center text-gray-600 pt-2">
+                {% for tag in question.tags.all %}
+                  <span class="mr-2 rounded-md bg-blue-100 px-1 py-1 text-blue-400 text-xs text-black font-bold">{{ tag.tag_text }}</span>
+                {% endfor %}
+              </div>
+              <hr class="h-px my-4 bg-gray-200 border-0 dark:bg-gray-400" />
+              <!--Vote View Button-->
+              <div class="flex items-center text-gray-600">
                 <button
                   onclick="window.location.href='{% url 'polls:detail' question.id %}'"
                   class="mr-2 rounded-md bg-yellow-100 px-2 py-1 text-black font-semibold border-solid border-2 border-yellow-500 hover:bg-yellow-500 transform translate-y-0 hover:translate-y-1 transition-transform">
@@ -136,6 +145,7 @@
               <h2 class="mb-2 text-xl font-semibold truncate">{{ question.question_text }}</h2>
               <hr class="h-px my-2 bg-gray-200 border-0 dark:bg-gray-400" />
               <p class="mb-2 text-gray-600">{{ question.short_description }}</p>
+              <!--Up, Down Vote-->
               <div class="mb-2 flex items-center text-gray-600">
                 <span class="mr-2">👍</span>
                 <span>{{ question.up_vote_percentage }}% Upvoted</span>
@@ -143,12 +153,20 @@
                 <span class="ml-4 mr-2">👎</span>
                 <span>{{ question.down_vote_percentage }}% Downvoted</span>
               </div>
-              <!-- Tag / Time -->
+              <!-- Participant, Time -->
               <div class="flex items-center text-gray-600">
                 <span class="mr-2 rounded-md bg-green-500 px-2 py-1 text-white">🕒 {{ question.time_left }}</span>
                 <span class="mr-2 rounded-md bg-orange-100 px-2 py-1 text-black">{{ question.participants }} Participants 👤</span>
               </div>
-              <div class="flex items-center text-gray-600 py-4">
+              <!-- Tags-->
+              <div class="flex pt-2">
+                {% for tag in question.tags.all %}
+                  <span class="mr-2 rounded-md bg-blue-100 px-1 py-1 text-blue-400 text-xs text-black font-bold">{{ tag.tag_text }}</span>
+                {% endfor %}
+              </div>
+              <hr class="h-px my-4 bg-gray-200 border-0 dark:bg-gray-400" />
+              <!--Vote View Button-->
+              <div class="flex items-center text-gray-600">
                 <button
                   onclick="window.location.href='{% url 'polls:detail' question.id %}'"
                   class="mr-2 rounded-md bg-white px-2 py-1 text-black border-solid border-2 border-black hover:bg-gray-500 transform translate-y-0 hover:translate-y-1 transition-transform">