diff --git a/blt/urls.py b/blt/urls.py
index e5601befb..2f220cdb8 100644
--- a/blt/urls.py
+++ b/blt/urls.py
@@ -32,7 +32,7 @@
     UserIssueViewSet,
     UserProfileViewSet,
 )
-from website.views import (  # TODO IssueView,; TODO: REMOVE like_issue2 etc
+from website.views import (  # TODO(b) IssueView,; TODO(b): REMOVE like_issue2 etc
     AllIssuesView,
     CompanySettings,
     ContributorStatsView,
@@ -86,6 +86,7 @@
     google_callback,
     like_issue2,
     like_issue3,
+    resolve,
     select_bid,
     submit_pr,
     subscribe_to_domains,
@@ -278,7 +279,7 @@
         name="user_profile",
     ),
     path(settings.ADMIN_URL + "/", admin.site.urls),
-    # TODO: REMOVE after _3 is ready
+    # TODO(b): REMOVE after _3 is ready
     re_path(r"^like_issue/(?P<issue_pk>\d+)/$", website.views.like_issue, name="like_issue"),
     re_path(
         r"^dislike_issue/(?P<issue_pk>\d+)/$",
@@ -292,6 +293,8 @@
     re_path(r"^like_issue3/(?P<issue_pk>\d+)/$", like_issue3, name="like_issue3"),
     re_path(r"^dislike_issue3/(?P<issue_pk>\d+)/$", dislike_issue3, name="dislike_issue3"),
     re_path(r"^flag_issue3/(?P<issue_pk>\d+)/$", flag_issue3, name="flag_issue3"),
+    # TODO(b) track this
+    re_path(r"^resolve/(?P<id>\w+)/$", resolve, name="resolve"),
     re_path(r"^vote_count/(?P<issue_pk>\d+)/$", vote_count, name="vote_count"),
     path("domain/<int:pk>/subscribe/", subscribe_to_domains, name="subscribe_to_domains"),
     re_path(r"^save_issue/(?P<issue_pk>\d+)/$", website.views.save_issue, name="save_issue"),
@@ -319,7 +322,7 @@
     ),
     # delete_comment
     path("issue2/comment/delete/", website.views.delete_comment, name="delete_comment"),
-    # TODO: REMOVE after _3 is ready
+    # TODO(b): REMOVE after _3 is ready
     re_path(r"^issue/(?P<slug>\w+)/$", IssueView.as_view(), name="issue_view"),
     re_path(r"^issue2/(?P<slug>\w+)/$", IssueView2.as_view(), name="issue_view2"),
     re_path(r"^issue3/(?P<slug>\w+)/$", IssueView3.as_view(), name="issue_view3"),
diff --git a/website/templates/comments2.html b/website/templates/comments2.html
index 499c90bd8..8a27298d3 100644
--- a/website/templates/comments2.html
+++ b/website/templates/comments2.html
@@ -34,7 +34,7 @@ <h2 class="text-xl lg:text-3xl font-bold text-gray-900 ">Comments ({{ all_commen
                     <footer class="flex justify-between items-center mb-2">
                         <div class="grid grid-cols-9 items-center justify-between">
                             <p class="sm:col-start-1 sm:col-span-4 col-span-5 sm:order-1 items-center inline-flex sm:text-3xl text-2xl text-gray-900 ">
-                                {% if comment.author_fk %}
+                                {% if comment.author_fk.user_avatar %}
                                     <img class="sm:mr-2 mr-1 sm:w-12 w-10 sm:h-12 h-10 rounded-full"
                                          src="{{ MEDIA_URL }}{{ comment.author_fk.user_avatar }}"
                                          alt="{{ comment.author }} profile"
@@ -117,7 +117,7 @@ <h2 class="text-xl lg:text-3xl font-bold text-gray-900 ">Comments ({{ all_commen
                                 <div class="flex items-center">
                                     <p class="inline-flex items-center mr-3 text-md text-gray-900 ">
                                         <img class="mr-2 w-9 h-9 rounded-full"
-                                             src="{{ MEDIA_URL }}{{ user.userprofile.user_avatar }}"
+                                             {% if user.userprofile.user_avatar %} src="{{ MEDIA_URL }}{{ user.userprofile.user_avatar }}" {% else %} src="{% static 'images/dummy-user.png' %}" {% endif %}
                                              alt="Michael Gough"
                                              width="36px"
                                              height="36px">
@@ -176,6 +176,23 @@ <h2 class="text-xl lg:text-3xl font-bold text-gray-900 ">Comments ({{ all_commen
         {% endfor %}
     </div>
     <script>
+        function initDropDown(){
+            document.querySelectorAll("[data-dropdown-toggle]").forEach((toggle) => {
+                
+                toggle.addEventListener("click", () => {
+                    const { dropdownToggle } = toggle.dataset;
+                    const dropdown = document.getElementById(dropdownToggle);
+                    dropdown.classList.toggle("hidden");
+                    dropdown.classList.toggle("block");
+                    dropdown.style.position = "absolute";
+                    dropdown.style.top = toggle.offsetTop + toggle.offsetHeight + "px";
+                    dropdown.style.left = toggle.offsetLeft - 50 + "px";
+                    
+                });
+            });
+        }
+
+
         function remove_reply(){
             document.getElementById("replying_to_cont").remove();
             document.getElementById("replying_to_input").value = "";
@@ -226,18 +243,8 @@ <h2 class="text-xl lg:text-3xl font-bold text-gray-900 ">Comments ({{ all_commen
                 },
                 success: function (data) {
                     $('#comment_root').replaceWith(data);
-                    document.querySelectorAll("[data-dropdown-toggle]").forEach((toggle) => {
-                        toggle.addEventListener("click", () => {
-                            const { dropdownToggle } = toggle.dataset;
-                            const dropdown = document.getElementById(dropdownToggle);
-                            dropdown.classList.toggle("hidden");
-                            dropdown.classList.toggle("block");
-                            dropdown.style.position = "absolute";
-                            dropdown.style.top = toggle.offsetTop + toggle.offsetHeight + "px";
-                            dropdown.style.left = toggle.offsetLeft - 50 + "px";
-                            
-                        });
-                    });
+                    // initDropDown();
+                    location.reload()
                 },
             });
         }
@@ -262,18 +269,8 @@ <h2 class="text-xl lg:text-3xl font-bold text-gray-900 ">Comments ({{ all_commen
                 },
                 success: function (data) {
                     $('#comment_root').replaceWith(data);
-                    document.querySelectorAll("[data-dropdown-toggle]").forEach((toggle) => {
-                        toggle.addEventListener("click", () => {
-                            const { dropdownToggle } = toggle.dataset;
-                            const dropdown = document.getElementById(dropdownToggle);
-                            dropdown.classList.toggle("hidden");
-                            dropdown.classList.toggle("block");
-                            dropdown.style.position = "absolute";
-                            dropdown.style.top = toggle.offsetTop + toggle.offsetHeight + "px";
-                            dropdown.style.left = toggle.offsetLeft - 50 + "px";
-                            
-                        });
-                    });
+                    // initDropDown();
+                    location.reload()
                 },
             });
         }        
@@ -326,18 +323,8 @@ <h2 class="text-xl lg:text-3xl font-bold text-gray-900 ">Comments ({{ all_commen
                         // Replace the content of #comment_root with the new data
                         $('#comment_root').replaceWith(data);
 
-                        document.querySelectorAll("[data-dropdown-toggle]").forEach((toggle) => {
-                            toggle.addEventListener("click", () => {
-                                const { dropdownToggle } = toggle.dataset;
-                                const dropdown = document.getElementById(dropdownToggle);
-                                dropdown.classList.toggle("hidden");
-                                dropdown.classList.toggle("block");
-                                dropdown.style.position = "absolute";
-                                dropdown.style.top = toggle.offsetTop + toggle.offsetHeight + "px";
-                                dropdown.style.left = toggle.offsetLeft - 50 + "px";
-                                
-                            });
-                        });
+                        // initDropDown();
+                        location.reload()
                     },
                 });
             }
@@ -358,6 +345,12 @@ <h2 class="text-xl lg:text-3xl font-bold text-gray-900 ">Comments ({{ all_commen
 
         // setInterval(get_comments, 10000);
 
+        $(document).ready(function(){
+            // bind event handlers when the page loads.
+            initDropDown();
+        });
+        
+
 
     </script>
 </section>
diff --git a/website/templates/includes/_like_dislike_share.html b/website/templates/includes/_like_dislike_share.html
index fa5c0f895..4bf22e06b 100644
--- a/website/templates/includes/_like_dislike_share.html
+++ b/website/templates/includes/_like_dislike_share.html
@@ -14,7 +14,7 @@
      class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow w-44">
     <ul class="py-2 m-2 rounded text-gray-700"
         aria-labelledby="dropdownDefaultButton">
-        <span class="md:hidden flex flex-col">{% include "./_like_dislike_widget.html" %}</span>
+        <span class="md:hidden flex flex-col">{% include "./_like_dislike_widget.html" with device="mobile" %}</span>
         <li>
             <a href="https://twitter.com/intent/tweet?text=Bug Found on @{{ object.domain_title }} - {{ object.description }} Report: https://{% env 'FQDN' %}/issue/{{ object.id }}"
                target="_blank"
@@ -39,7 +39,7 @@
         {% endif %}
     </ul>
 </div>
-<span class="max-sm:hidden">{% include "./_like_dislike_widget.html" %}</span>
+<span class="max-sm:hidden">{% include "./_like_dislike_widget.html" with device="desktop" %}</span>
 <script>
     function copyClipboard() {
         var textToCopy = "Bug Found on @{{ object.domain_title }} - {{ object.description }} Report: https://{% env 'FQDN' %}/issue/{{ object.id }}";
@@ -161,4 +161,19 @@
 
     // Attach the click event handler
     $('body').on('click', '.bookmark', bookmark_handler);
+    async function resolveIssue(){
+        var id = {{object.pk}};
+
+        const request = await fetch(`/resolve/${id}/`)
+        window.location.reload();
+        if(request.status == 200){
+        const jsonData = await request.json();
+        console.log(jsonData["issue_status"])
+        }else if (request.status == 403){
+            $.notify("Permission Denied", {
+                style: "custom",
+                className: "danger"
+            });
+        }
+    }
 </script>
diff --git a/website/templates/includes/_like_dislike_widget.html b/website/templates/includes/_like_dislike_widget.html
index cedf87e60..d1614ebbd 100644
--- a/website/templates/includes/_like_dislike_widget.html
+++ b/website/templates/includes/_like_dislike_widget.html
@@ -1,9 +1,10 @@
 {% comment %} views  {% endcomment %}
 <button disabled
-        class="like_unlike border-[1px] rounded-2xl shadow-sm mb-3 cursor-pointer relative transform-[0] font-bold text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 "
+        class="like_unlike border-[1px] rounded-2xl shadow-sm mb-3 cursor-pointer relative transform-[0] font-medium text-[#3e3446] bg-white border-black-2  text-[1.3rem] leading-4 p-4 "
         type="button">
-    <span id="likes" class="flex items-end">
-        {{ object.views }} &nbsp;
+    <span id="likes" class="flex flex-row gap-2 items-center">
+        {{ object.views }}
+        <span>Views</span>
         <svg xmlns="http://www.w3.org/2000/svg"
              viewBox="0 0 562 352"
              height="16px"
@@ -14,15 +15,10 @@
 </button>
 {% comment %} likes  {% endcomment %}
 {% if request.user.is_authenticated %}
-    <button name="{{ object.pk }}"
-            data-tooltip-target="tooltip-bottom-{{ object.pk }}-like"
-            data-tooltip-placement="bottom"
-            type="submit"
-            id="like_unlike"
-            class="like_unlike rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-bold text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 "
-            type="button">
-        <span id="likes" class="flex items-end">
-            {{ likes }} &nbsp;
+    <button name="{{ object.pk }}" {% comment %} {{device}} is passed by _like_dislike_share.html {% endcomment %} data-tooltip-target="tooltip-bottom-{{ device }}-like" data-tooltip-placement="bottom" type="submit" id="like_unlike" class="like_unlike rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-medium text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 " type="button">
+        <span id="likes" class="flex flex-row gap-2 items-center">
+            {{ likes }}
+            <span>Likes</span>
             {% if isLiked %}
                 {% include "./_tooltip3.html" with text="Unlike" sno=object.pk widget="like" %}
                 <svg xmlns="http://www.w3.org/2000/svg"
@@ -45,10 +41,10 @@
         </span>
     </button>
 {% else %}
-    <button data-tooltip-target="tooltip-bottom-{{ object.pk }}-like"
+    <button data-tooltip-target="tooltip-bottom-{{ device }}-like"
             data-tooltip-placement="bottom"
             onclick="window.location.href='/accounts/login'"
-            class="like_unlike rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-bold text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 "
+            class="like_unlike rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-medium text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 "
             type="button">
         <span id="likes" class="flex items-end">
             {{ likes }} &nbsp;
@@ -66,14 +62,15 @@
 {% comment %} dislike  {% endcomment %}
 {% if request.user.is_authenticated %}
     <button name="{{ object.pk }}"
-            data-tooltip-target="tooltip-bottom-{{ object.pk }}-dislike"
+            data-tooltip-target="tooltip-bottom-{{ device }}-dislike"
             data-tooltip-placement="bottom"
             type="submit"
             id="dislike-btn"
-            class="dislike rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-bold text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4"
+            class="dislike rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-medium text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4"
             type="button">
-        <span id="dislikes" class="flex items-end">
-            {{ dislikes }} &nbsp;
+        <span id="dislikes" class="flex flex-row gap-2 items-center">
+            {{ dislikes }}
+            <span>Dislikes</span>
             {% if dislikes %}
                 {% include "./_tooltip3.html" with text="Undo Dislike" sno=object.pk widget="dislike" %}
                 <svg xmlns="http://www.w3.org/2000/svg"
@@ -96,10 +93,10 @@
         </span>
     </button>
 {% else %}
-    <button data-tooltip-target="tooltip-bottom-{{ object.pk }}-dislike"
+    <button data-tooltip-target="tooltip-bottom-{{ device }}-dislike"
             data-tooltip-placement="bottom"
             onclick="window.location.href='/accounts/login'"
-            class="dislike rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-bold text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 ">
+            class="dislike rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-medium text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 ">
         <span id="dislikes" class="flex items-end">
             {{ dislikes }} &nbsp;
             {% include "./_tooltip3.html" with text="Login to Dislike" sno=object.pk widget="dislike" %}
@@ -116,13 +113,14 @@
 {% comment %} report  {% endcomment %}
 {% if request.user.is_authenticated %}
     <button name="{{ object.pk }}"
-            data-tooltip-target="tooltip-bottom-{{ object.pk }}-flags"
+            data-tooltip-target="tooltip-bottom-{{ device }}-flags"
             data-tooltip-placement="bottom"
             id="flag-unflag"
-            class="flag-unflag rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-bold text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 "
+            class="flag-unflag rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-medium text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 "
             type="button">
-        <span id="flags" class="flex items-end">
-            {{ flags }} &nbsp;
+        <span id="flags" class="flex flex-row gap-2 items-center">
+            {{ flags }}
+            <span>Flag</span>
             {% if isFlagged %}
                 {% include "./_tooltip3.html" with text="Undo Report" sno=object.pk widget="flags" %}
                 <svg xmlns="http://www.w3.org/2000/svg"
@@ -145,10 +143,10 @@
         </span>
     </button>
 {% else %}
-    <button data-tooltip-target="tooltip-bottom-{{ object.pk }}-flags"
+    <button data-tooltip-target="tooltip-bottom-{{ device }}-flags"
             data-tooltip-placement="bottom"
             onclick="window.location.href='/accounts/login'"
-            class="like_unlike rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-bold text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 "
+            class="like_unlike rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-medium text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 "
             type="button">
         <span id="flags" class="flex items-end">
             {{ flags }} &nbsp;
@@ -166,13 +164,14 @@
 {% comment %} bookmark  {% endcomment %}
 {% if request.user.is_authenticated %}
     <button name="{{ object.pk }}"
-            data-tooltip-target="tooltip-bottom-{{ object.pk }}-bookmark"
+            data-tooltip-target="tooltip-bottom-{{ device }}-bookmark"
             data-tooltip-placement="bottom"
-            class="bookmark rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-bold text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 "
+            class="bookmark rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-medium text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 "
             type="button">
-        <span id="bookmark" class="flex items-end">
+        <span id="bookmark" class="flex flex-row gap-2 items-center">
             {% if bookmarked %}
                 {% include "./_tooltip3.html" with text="Undo Bookmark" sno=object.pk widget="bookmark" %}
+                <span>Bookmark</span>
                 <svg xmlns="http://www.w3.org/2000/svg"
                      viewBox="0 0 448 512"
                      height="16px"
@@ -182,6 +181,7 @@
                 </svg>
             {% else %}
                 {% include "./_tooltip3.html" with text="Bookmark" sno=object.pk widget="bookmark" %}
+                <span>Bookmark</span>
                 <svg xmlns="http://www.w3.org/2000/svg"
                      viewBox="0 0 384 512"
                      height="16px"
@@ -193,10 +193,10 @@
         </span>
     </button>
 {% else %}
-    <button data-tooltip-target="tooltip-bottom-{{ object.pk }}-bookmark"
+    <button data-tooltip-target="tooltip-bottom-{{ device }}-bookmark"
             data-tooltip-placement="bottom"
             onclick="window.location.href='/accounts/login'"
-            class="like_unlike rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-bold text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 "
+            class="like_unlike rounded-2xl border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-medium text-[#3e3446] bg-white border-black-2  text-[#0.875rem] leading-4 p-4 "
             type="button">
         <span id="bookmark" class="flex items-end">
             {{ bookmark }} &nbsp;
@@ -212,24 +212,42 @@
     </button>
 {% endif %}
 {% comment %} notification  {% endcomment %}
-<button data-tooltip-target="tooltip-bottom-{{ object.pk }}-notification"
+<button data-tooltip-target="tooltip-bottom-{{ device }}-notification"
         data-tooltip-placement="bottom"
-        class="relative inline-block shadow-sm rounded-xl transform-[0] font-bold text-[#3e3446] bg-white border-black-2 text-[#0.875rem] leading-4 p-4"
+        class="relative inline-block shadow-sm rounded-xl transform-[0] font-medium text-[#3e3446] bg-white border-black-2 text-[#0.875rem] leading-4 p-4"
         onclick="{% if user.is_authenticated %}subscribe_domain(){% else %}window.location.href=`{% url 'account_login' %}`{% endif %}"
         id="subscribe_domain_btn">
     {% if user.is_authenticated and subscribed_to_domain %}
         {% include "./_tooltip3.html" with text="Unsubscribe" sno=object.pk widget="notification" %}
-        <svg viewBox="0 0 16 16" fill="currentColor" height="16px" width="16px">
-            <path d="M10.533 14.07h3.466a.76.76 0 0 0 .58-.28.74.74 0 0 0 .19-.57l-.57-6.55a.13.13 0 0 0 0-.06A6.42 6.42 0 0 0 8 0a6.42 6.42 0 0 0-6.18 6.65v.06l-.57 6.55a.74.74 0 0 0 .19.57.76.76 0 0 0 .56.24h3.468A2.64 2.64 0 0 0 8 16a2.64 2.64 0 0 0 2.533-1.93Zm-1.654 0H7.121a1.13 1.13 0 0 0 1.758 0Zm4.32-1.5H2.8l.5-5.79v-.13A4.92 4.92 0 0 1 8 1.54a4.92 4.92 0 0 1 4.7 5.11v.19l.5 5.73Z">
-            </path>
-        </svg>
+        <div class="flex flex-row gap-2 items-center">
+            <span>Unsubscribe</span>
+            <svg viewBox="0 0 16 16" fill="currentColor" height="16px" width="16px">
+                <path d="M10.533 14.07h3.466a.76.76 0 0 0 .58-.28.74.74 0 0 0 .19-.57l-.57-6.55a.13.13 0 0 0 0-.06A6.42 6.42 0 0 0 8 0a6.42 6.42 0 0 0-6.18 6.65v.06l-.57 6.55a.74.74 0 0 0 .19.57.76.76 0 0 0 .56.24h3.468A2.64 2.64 0 0 0 8 16a2.64 2.64 0 0 0 2.533-1.93Zm-1.654 0H7.121a1.13 1.13 0 0 0 1.758 0Zm4.32-1.5H2.8l.5-5.79v-.13A4.92 4.92 0 0 1 8 1.54a4.92 4.92 0 0 1 4.7 5.11v.19l.5 5.73Z">
+                </path>
+                <path d="M.801 16.5a.798.798 0 0 1-.563-.234.786.786 0 0 1 0-1.127L14.635.733a.798.798 0 0 1 1.127 0 .787.787 0 0 1 0 1.127L1.365 16.266A.84.84 0 0 1 .8 16.5Z">
+                </path>
+            </svg>
+        </div>
     {% else %}
         {% include "./_tooltip3.html" with text="Subscribe" sno=object.pk widget="notification" %}
-        <svg viewBox="0 0 16 16" fill="currentColor" height="16px" width="16px">
-            <path d="M10.533 14.07h3.466a.76.76 0 0 0 .58-.28.74.74 0 0 0 .19-.57l-.57-6.55a.13.13 0 0 0 0-.06A6.42 6.42 0 0 0 8 0a6.42 6.42 0 0 0-6.18 6.65v.06l-.57 6.55a.74.74 0 0 0 .19.57.76.76 0 0 0 .56.24h3.468A2.64 2.64 0 0 0 8 16a2.64 2.64 0 0 0 2.533-1.93Zm-1.654 0H7.121a1.13 1.13 0 0 0 1.758 0Zm4.32-1.5H2.8l.5-5.79v-.13A4.92 4.92 0 0 1 8 1.54a4.92 4.92 0 0 1 4.7 5.11v.19l.5 5.73Z">
-            </path>
-            <path d="M.801 16.5a.798.798 0 0 1-.563-.234.786.786 0 0 1 0-1.127L14.635.733a.798.798 0 0 1 1.127 0 .787.787 0 0 1 0 1.127L1.365 16.266A.84.84 0 0 1 .8 16.5Z">
-            </path>
-        </svg>
+        <div class="flex flex-row gap-2 items-center">
+            <span>Sububscribe</span>
+            <svg viewBox="0 0 16 16" fill="currentColor" height="16px" width="16px">
+                <path d="M10.533 14.07h3.466a.76.76 0 0 0 .58-.28.74.74 0 0 0 .19-.57l-.57-6.55a.13.13 0 0 0 0-.06A6.42 6.42 0 0 0 8 0a6.42 6.42 0 0 0-6.18 6.65v.06l-.57 6.55a.74.74 0 0 0 .19.57.76.76 0 0 0 .56.24h3.468A2.64 2.64 0 0 0 8 16a2.64 2.64 0 0 0 2.533-1.93Zm-1.654 0H7.121a1.13 1.13 0 0 0 1.758 0Zm4.32-1.5H2.8l.5-5.79v-.13A4.92 4.92 0 0 1 8 1.54a4.92 4.92 0 0 1 4.7 5.11v.19l.5 5.73Z">
+                </path>
+            </svg>
+        </div>
     {% endif %}
 </button>
+{% comment %} resolve  {% endcomment %}
+{% if request.user.is_superuser or request.user == object.user %}
+    <button type="button"
+            onclick="resolveIssue()"
+            class="rounded-2xl h-auto border-[1px] shadow-sm mb-3 cursor-pointer relative transform-[0] font-medium text-white bg-gradient-to-r from-purple-500 via-purple-600 to-purple-700 hover:bg-gradient-to-br focus:outline-none border-black-2  text-[#0.875rem] leading-4 p-4 ">
+        {% if status == "open" %}
+            Resolve
+        {% else %}
+            Open Issue
+        {% endif %}
+    </button>
+{% endif %}
diff --git a/website/templates/includes/_tooltip3.html b/website/templates/includes/_tooltip3.html
index 2ddf5a06c..182a849e1 100644
--- a/website/templates/includes/_tooltip3.html
+++ b/website/templates/includes/_tooltip3.html
@@ -1,6 +1,6 @@
-<div id="tooltip-bottom-{{ sno }}-{{ widget }}"
+<div id="tooltip-bottom-{{ device }}-{{ widget }}"
      role="tooltip"
-     class="absolute z-10 invisible inline-block px-3 py-2  font-medium text-white bg-gray-900 rounded-lg shadow-sm opacity-0 tooltip dark:bg-gray-700">
+     class="absolute z-10 inline-block px-3 py-2  font-medium text-white bg-gray-900 rounded-lg shadow-sm opacity-0 tooltip dark:bg-gray-700">
     {{ text }}
     <div class="tooltip-arrow" data-popper-arrow></div>
 </div>
diff --git a/website/templates/issue3.html b/website/templates/issue3.html
index 4db91a1bb..5f98edf34 100644
--- a/website/templates/issue3.html
+++ b/website/templates/issue3.html
@@ -6,8 +6,6 @@
             BLT Issue - {{ object.description|escapejs }}
         {% endblock title %}
     </title>
-    <link href="https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.3.0/flowbite.min.css"
-          rel="stylesheet" />
     <meta name="description"
           content="{{ object.markdown_description|escapejs }}">
     {% if object.user.username %}
@@ -25,7 +23,6 @@
           content="{{ object.markdown_description|escapejs }}" />
     <meta name="keywords"
           content="{% block keywords %}BLT, bug, tracking, company, easy{% endblock keywords %}">
-    {% comment %} TODO: change to update DOMAIN {% endcomment %}
     <link rel="canonical"
           href="https://{% env 'FQDN' %}/issue3/{{ object.id }}">
     <meta property="og:url"
@@ -36,22 +33,18 @@
 {% load static %}
 {% load gravatar %}
 {% load custom_tags %}
-{% block head %}
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/1.8.0/flowbite.min.js"
-            integrity="sha384-SXh3DHBSUxvOFk7+R9qN3hv+DtgPJz4vQwOArU6zxWGnvtR1sy+XmzKUkNh2qWST"
-            crossorigin="anonymous"></script>
-{% endblock head %}
 {% block content %}
     {% include "includes/sidenav.html" %}
-    {% comment %} TODO:
+    {% comment %} TODO(b):
      removed anonymous reporting
+     TODO(b): FIX LIKE AND OTHERS
     delete these files after final is ready 
     {% include "includes/_likes2.html" %}
     {% include "includes/_dislike2.html" %}
     {% include "includes/_flags2.html" %}
     {% include "includes/_bookmark2.html" %}
     {% endcomment %}
-    <div class="pt-8 pb-16 lg:pt-16 lg:pb-24 bg-[#FAF9FB] font-[ubuntu] lg:pl-0">
+    <div class="pt-8 pb-16 lg:pt-16 lg:pb-24 bg-[#FAF9FB] font-[ubuntu] lg:pl-0 overflow-x-hidden">
         <div class="flex mr-[2%] ml-[2%] justify-between row gap-[8px] items-center">
             <nav class="left-issue flex items-center mr-auto">
                 <a href="{% url 'index' %}" class="!text-[#80708f] mx-4">Issues</a>
@@ -63,9 +56,13 @@
                          height="16"
                          alt="Company Logo">
                 </a>
-                <a href="{% url 'domain' object.domain.name %}"><span>{{ object.domain.name }}</span></a>
+                <a href="{% url 'domain' object.domain.name %}"><span>{{ object.domain.name }}</span></a> &nbsp;<span class="font-bold">#{{ object.id }}</span>&nbsp;
+                {% if status == "open" %}
+                    <span class="bg-red-100 text-red-800 text-xl font-medium me-2 px-2.5 py-0.5 rounded">Ongoing</span>
+                {% else %}
+                    <span class="bg-green-100 text-green-800 text-xl font-medium me-2 px-2.5 py-0.5 rounded">Resolved</span>
+                {% endif %}
             </nav>
-            <div class="right-data ml-auto max-sm:pt-2">{% include "includes/_like_dislike_share.html" %}</div>
         </div>
         <div class="h-[3vh]"></div>
         <h2 class="font-[ubuntu] font-bold text-[30px] w-[90%] truncate ml-[3.5%]"
@@ -73,89 +70,149 @@
         <p>
             <a href="{{ object.url }}"
                title="{{ object.url }}"
-               class="!text-blue-500 ml-[3.5%] font-thin w-[80%] truncate"
+               class="!text-[#7e22ce] ml-[3.5%] font-thin w-[80%] truncate"
                target="_blank"
                rel="noopener noreferrer">{{ object.url }}</a>
         </p>
         <br>
-        <div class="bg-white">
-            <div class="container md:h-[20vh] max-sm:mt-[30%] mx-auto px-4 md:px-12">
-                <div class="flex justify-evenly flex-wrap -mx-1 lg:-mx-4">
-                    <div class="max-sm:px-[20px] flex items-center bg-white my-1 w-full md:w-1/2 lg:my-4 lg:px-4 lg:w-[23vw] h-[17vh] rounded-2xl shadow-md justify-between">
-                        <div class="rounded-full w-[20%]">
-                            <img class="w-[80%] h-[80%] object-cover"
-                                 {% if object.user.username %} {% if object.user.userprofile.user_avatar %} src="{{ MEDIA_URL }}{{ object.user.userprofile.user_avatar }}" {% else %} src="{% gravatar_url object.user.email 100 %}" {% endif %}
-                                 {% else %}
-                                 src="{% static 'images/dummy-user.png' %}"
-                                 {% endif %}
+        <div class="right-data max-sm:pt-2 ml-[3.5%]">{% include "includes/_like_dislike_share.html" %}</div>
+        <div id="default-tab-content" class="bg-white">
+            <br>
+            <div class="flex flex-col items-center lg:items-start px-10 lg:flex-row">
+                <div id="screenshot-wrapper">
+                    <div class="text-[16px] font-semibold mb-5">Screenshots:</div>
+                    <hr>
+                    <div class="screenshot-container max-h-[400px] w-[100%] lg:h-[400px] lg:w-[40vw] flex">
+                        {% if object.screenshot %}
+                            <a href="{{ object.screenshot.url }}" data-lightbox="image">
+                                <img id="current-screenshot"
+                                     src="{{ object.screenshot.url }}"
+                                     class="border-2 border-black object-contain"
+                                     height="400"
+                                     width="600"
+                                     alt="screenshot">
+                            </a>
+                        {% else %}
+                            <div id="screenshot-gallery" class="hidden">
+                                {% for screenshot in screenshots %}
+                                    <img src="{{ screenshot.image.url }}"
+                                         class="screenshot-image object-contain"
+                                         height="400"
+                                         width="600"
+                                         alt="screenshot">
+                                {% endfor %}
+                            </div>
+                            <a id="lightbox-link"
+                               href="{{ screenshots.0.image.url }}"
+                               data-lightbox="image">
+                                <img id="current-screenshot"
+                                     src="{{ screenshots.0.image.url }}"
+                                     class="border-2 border-black object-contain"
+                                     height="400"
+                                     width="600"
+                                     alt="screenshot">
+                            </a>
+                        {% endif %}
+                    </div>
+                    <hr>
+                    <div class="flex flex-row my-5 gap-5">
+                        <button id="prevBtn"
+                                class="bg-[#FF6363] text-white px-4 py-2 text-[18px] font-medium rounded-lg">
+                            Prev
+                        </button>
+                        <button id="nextBtn"
+                                class="bg-[#FF6363] text-white px-4 py-2 text-[18px] font-medium rounded-lg">
+                            Next
+                        </button>
+                    </div>
+                </div>
+                <div id="details">
+                    <div>
+                        <h4 class="text-2xl font-bold mb-3">Event ID: {{ object.id }}</h4>
+                        <div class="flex justify-start items-center">
+                            <img class="w-[40px] rounded-full h-[40px] object-cover"
+                                 src="{% if object.user.username %} {% if object.user.userprofile.user_avatar %}{{ MEDIA_URL }}{{ object.user.userprofile.user_avatar }}{% else %}{% gravatar_url object.user.email 100 %}{% endif %}{% else %}{% static 'images/dummy-user.png' %}{% endif %}"
                                  alt="User Profile Logo"
-                                 width="auto"
-                                 height="auto">
+                                 width="32px"
+                                 height="32px">
+                            <div class="ml-3">
+                                <div>
+                                    {% if object.user.username %}
+                                        <a href="{% url 'profile' slug=object.user.username %}"
+                                           class="!text-[#7e22ce] font-bold">{{ object.user.username }}</a>
+                                    {% else %}
+                                        Anonymous
+                                    {% endif %}
+                                </div>
+                                <div>
+                                    <span class="font-bold">Total Points =</span> {{ users_score }}
+                                </div>
+                            </div>
                         </div>
-                        <div>
-                            <div class="text-[#B00000] text-[16px] w-[90%] truncate">
-                                {% if object.user.username %}
-                                    <a href="{% url 'profile' slug=object.user.username %}"
-                                       class="!text-[#B00000]">{{ object.user.username }}</a>
-                                {% else %}
-                                    Anonymous
-                                {% endif %}
+                    </div>
+                    <div class="flex flex-col lg:grid lg:grid-cols-2 gap-10">
+                        <div class="flex items-center bg-white rounded-2xl shadow-md gap-5 p-10 w-full lg:w-[20vw]">
+                            <div class="rounded-full w-[20%]">
+                                <img class="w-[80%] h-[80%] object-cover"
+                                     src="{% if object.user.username %} {% if object.user.userprofile.user_avatar %}{{ MEDIA_URL }}{{ object.user.userprofile.user_avatar }}{% else %}{% gravatar_url object.user.email 100 %}{% endif %}{% else %}{% static 'images/dummy-user.png' %}{% endif %}"
+                                     alt="User Profile Logo"
+                                     width="auto"
+                                     height="auto">
                             </div>
-                            <div class="text-[#B00000] text-[14px]">
-                                Total Points = <span class="font-bold">{{ users_score }}</span>
+                            <div class="flex flex-col items-start gap-2">
+                                <div class="text-[#B00000] text-[16px] w-[90%] truncate">
+                                    {% if object.user.username %}
+                                        <a href="{% url 'profile' slug=object.user.username %}"
+                                           class="!text-[#B00000]">{{ object.user.username }}</a>
+                                    {% else %}
+                                        Anonymous
+                                    {% endif %}
+                                </div>
+                                <div class="text-[#B00000] text-[14px]">
+                                    Total Points = <span class="font-bold">{{ users_score }}</span>
+                                </div>
+                                <div>
+                                    {% if not object.user.username %}
+                                        <button disabled
+                                                class="!cursor-not-allowed bg-[#FF6363] font-bold font-[ubuntu] text-white text-[18px] p-2 rounded-lg">
+                                            <span class="border-2 border-black rounded-xl p-1">$5 <i class="text-black fa-solid fa-caret-down"></i></span> Tip
+                                        </button>
+                                    {% else %}
+                                        <button class="bg-[#FF6363] font-bold font-[ubuntu] text-white text-[18px] p-2 rounded-lg">
+                                            <span class="border-2 border-black rounded-xl p-1">$5 <i class="text-black fa-solid fa-caret-down"></i></span> Tip
+                                        </button>
+                                    {% endif %}
+                                </div>
                             </div>
                         </div>
-                        <div>
-                            {% if not object.user.username %}
-                                <button disabled
-                                        class="!cursor-not-allowed bg-[#FF6363] font-bold font-[ubuntu] text-white text-[18px] p-2 rounded-lg">
-                                    <span class="border-2 border-black rounded-xl p-1">$5 <i class="text-black fa-solid fa-caret-down"></i></span> Tip
-                                </button>
-                            {% else %}
-                                <button class="bg-[#FF6363] font-bold font-[ubuntu] text-white text-[18px] p-2 rounded-lg">
-                                    <span class="border-2 border-black rounded-xl p-1">$5 <i class="text-black fa-solid fa-caret-down"></i></span> Tip
-                                </button>
-                            {% endif %}
-                        </div>
-                    </div>
-                    <br>
-                    <div class="max-sm:px-[20px] bg-white my-1 w-full md:w-1/2 lg:my-4 lg:px-4 lg:w-[23vw] h-[17vh] rounded-2xl shadow-md">
-                    </div>
-                    <br>
-                    <div class="max-sm:px-[20px] flex items-center bg-white my-1 w-full md:w-1/2 lg:my-4 lg:px-4 lg:w-[23vw] h-[17vh] rounded-2xl shadow-md justify-between">
-                        <div>
+                        <div class="flex flex-col items-center bg-white rounded-2xl shadow-md justify-between p-10 w-full lg:w-[20vw]">
                             <div class="text-[14px] w-[100%] font-bold truncate">Bug Type: {{ object.get_label_display }}</div>
                             <div class="h-[2vh]"></div>
-                            <div class=" text-[14px] w-[100%] truncate">
+                            <div class="text-[14px] w-[100%] truncate">
                                 Status: <span class="status">{{ object.status }}</span>
                             </div>
-                            <div class=" text-[14px] w-[100%] truncate">Added on: {{ object.created }}</div>
-                            {% if object.cve_id is not None %}
-                                <div class=" text-[14px] w-[100%] truncate">CVE ID: {{ object.cve_id }}</div>
+                            <div class="text-[14px] w-[100%] truncate">Added on: {{ object.created }}</div>
+                            {% if object.cve_id %}
+                                <div class="text-[14px] w-[100%] truncate">CVE ID: {{ object.cve_id }}</div>
                             {% endif %}
-                            {% if object.cve_score is not None %}
-                                <div class=" text-[14px] w-[100%] truncate">CVE Score: {{ object.cve_score }}</div>
+                            {% if object.cve_score %}
+                                <div class="text-[14px] w-[100%] truncate">CVE Score: {{ object.cve_score }}</div>
                             {% endif %}
-                            <div class=" text-[14px] w-[100%] truncate">
+                            <div class="text-[14px] w-[100%] truncate">
                                 Submitted:
-                                {% if object.hunt is None %}
-                                    Independently
-                                {% else %}
+                                {% if object.hunt %}
                                     <a href="{% url 'show_bughunt' object.hunt.id %}">{{ object.hunt.name }}</a>
+                                {% else %}
+                                    Independently
                                 {% endif %}
                             </div>
                         </div>
-                        <div class="h-[80%] items-center justify-between flex flex-col">
+                        <!-- <div class="h-[80%] items-center justify-between flex flex-col">
                             {% if request.user == object.user or request.is_staff or request.is_superuser %}
                                 <div>
-                                    <button class="bg-[#FF6363] font-bold font-[ubuntu] text-white text-[14px] p-2 rounded-lg edit-issue-status"
-                                            id="issue_stat">
+                                    <button class="bg-[#FF6363] font-bold font-[ubuntu] text-white text-[14px] p-2 rounded-lg edit-issue-status" id="issue_stat">
                                         {% if object.status == "open" %}
-                                            <svg width="23"
-                                                 height="23"
-                                                 viewBox="0 0 25 19"
-                                                 fill="none"
-                                                 xmlns="http://www.w3.org/2000/svg">
+                                            <svg width="23" height="23" viewBox="0 0 25 19" fill="none" xmlns="http://www.w3.org/2000/svg">
                                                 <path d="M8.4911 18.4552L0.366101 10.3302C-0.122034 9.8421 -0.122034 9.05065 0.366101 8.56246L2.13383 6.79469C2.62196 6.30651 3.41346 6.30651 3.9016 6.79469L9.37499 12.268L21.0984 0.54469C21.5865 0.0565552 22.378 0.0565552 22.8661 0.54469L24.6339 2.31246C25.122 2.8006 25.122 3.59205 24.6339 4.08024L10.2589 18.4553C9.77069 18.9434 8.97924 18.9434 8.4911 18.4552Z" fill="white" />
                                             </svg>
                                         {% else %}
@@ -171,117 +228,73 @@
                                     </button>
                                 </div>
                             {% endif %}
-                        </div>
-                    </div>
-                    <br>
-                </div>
-            </div>
-            <br>
-            <div class="container max-sm:mt-[2%] mx-auto px-4 md:px-12">
-                <div class="flex justify-evenly flex-wrap -mx-1 lg:-mx-4">
-                    <div class="max-sm:px-[20px] flex items-center bg-white my-1 w-full md:w-1/2 lg:my-4 lg:px-4 lg:w-[23vw] h-[17vh] rounded-2xl shadow-md justify-between">
-                        <div class="rounded-full w-[20%]">
-                            <img class="w-[80%] h-[80%] object-cover"
+                        </div> -->
+                        <div class="flex items-center bg-white rounded-2xl shadow-md gap-5 p-10 w-full lg:w-[20vw]">
+                            <img class="w-[40px] h-[40px] object-cover"
                                  src="{{ object.domain.get_logo }}"
                                  alt="Domain Logo"
                                  width="auto"
                                  height="auto">
-                        </div>
-                        <div>
-                            <div class=" text-[14px] w-[90%] truncate">
-                                <a class="#" href="{% url 'domain' slug=object.domain.name %}">Reported on {{ object.domain.name }}</a>
-                            </div>
-                            <div class="text-[13px]">
-                                Issues Reported: <span class="font-bold">{{ issue_count }}</span>
+                            <div class="flex flex-col items-start gap-2">
+                                <div class="text-[14px] w-[90%] truncate">
+                                    <a class="#" href="{% url 'domain' slug=object.domain.name %}">Reported on {{ object.domain.name }}</a>
+                                </div>
+                                <div class="text-[13px]">
+                                    Issues Reported: <span class="font-bold">{{ issue_count }}</span>
+                                </div>
+                                <button onclick="{% if user.is_authenticated %}subscribe_domain(){% else %}window.location.href=`{% url 'account_login' %}`{% endif %}"
+                                        id="subscribe_domain_btn"
+                                        class="bg-[#FF6363] font-bold font-[ubuntu] text-white text-[16px] p-2 rounded-lg">
+                                    {% if user.is_authenticated and subscribed_to_domain %}
+                                        Unsubscribe
+                                    {% else %}
+                                        Subscribe
+                                    {% endif %}
+                                </button>
                             </div>
                         </div>
-                        <div>
-                            <button onclick="{% if user.is_authenticated %}subscribe_domain(){% else %}window.location.href=`{% url 'account_login' %}`{% endif %}"
-                                    id="subscribe_domain_btn"
-                                    class="bg-[#FF6363] font-bold font-[ubuntu] text-white text-[16px] p-2 rounded-lg">
-                                {% if user.is_authenticated and subscribed_to_domain %}
-                                    Unsubscribe
-                                {% else %}
-                                    Subscribe
-                                {% endif %}
-                            </button>
-                        </div>
-                    </div>
-                    <br>
-                    <div class="max-sm:px-[20px] bg-white my-1 w-full md:w-1/2 lg:my-4 lg:px-4 rounded-2xl shadow-md lg:w-[23vw] h-[17vh]">
-                    </div>
-                    <br>
-                    <div class="max-sm:px-[20px] flex items-center bg-white my-1 w-full md:w-1/2 lg:my-4 lg:px-4 lg:w-[23vw] h-[17vh] rounded-2xl shadow-md justify-between">
-                        {% if browser_family %}
-                            {% with "img/browser-logos/"|add:browser_family|add:"/"|add:browser_family|add:"_64x64.png"|lower as image_static %}
-                                <div class="rounded-full w-[20%]">
-                                    <img class="w-[80%] h-[80%] object-cover"
-                                         src="{% static image_static %}"
-                                         alt="Browser Image"
-                                         width="auto"
-                                         height="auto">
+                        <div class="flex items-center bg-white rounded-2xl shadow-md p-10 w-full lg:w-[20vw]">
+                            {% if browser_family %}
+                                {% with "img/browser-logos/"|add:browser_family|add:"/"|add:browser_family|add:"_64x64.png"|lower as image_static %}
+                                    <div class="rounded-full w-[20%]">
+                                        <img class="w-[80%] h-[80%] object-cover"
+                                             src="{% static image_static %}"
+                                             alt="Browser Image"
+                                             width="auto"
+                                             height="auto">
+                                    </div>
+                                {% endwith %}
+                            {% endif %}
+                            <div class="flex flex-col items-start">
+                                <div class="text-[14px] truncate">
+                                    Browser Version: <span class="font-bold text-2xl">{{ browser_version }}</span>
                                 </div>
-                            {% endwith %}
-                        {% endif %}
-                        <div>
-                            <div class=" text-[14px] truncate">
-                                Browser Version: <span class="font-bold text-2xl">{{ browser_version }}</span>
-                            </div>
-                            <div class="text-[14px]">
-                                Operating System: <span class="font-bold text-2xl">{{ os_family }}</span>
+                                <div class="text-[14px]">
+                                    Operating System: <span class="font-bold text-2xl">{{ os_family }}</span>
+                                </div>
+                                <div class="text-[14px]">
+                                    OS Version: <span class="font-bold text-2xl">
+                                    {% if os_version %}
+                                        {{ os_version }}
+                                    {% else %}
+                                        Unknown
+                                    {% endif %}
+                                </span>
                             </div>
-                            <div class="text-[14px]">
-                                OS Version: <span class="font-bold text-2xl">
-                                {% if os_version %}
-                                    {{ os_version }}
-                                {% else %}
-                                    Unknown
-                                {% endif %}
-                            </span>
                         </div>
                     </div>
                 </div>
-                <br>
             </div>
         </div>
-        <br>
-        <hr class="w-full border-red-500">
-        <div id="screenshot-wrapper"
-             class="col-md-6 w-full mb-10 max-sm:mx-0 max-sm:px-1 lg:w-[82vw]">
-            <h4 class="text-[25px] font-medium p-3">Screenshots:</h4>
-            {% if object.screenshot %}
-                <a href="{{ object.screenshot.url }}"
-                   target="_blank"
-                   rel="noopener noreferrer">
-                    <img src="{{ object.screenshot.url }}"
-                         class="w-[358px] h-[210px] rounded-lg"
-                         alt="issue screenshot"
-                         data-lightbox="image"
-                         height="auto"
-                         width="auto">
-                </a>
-            {% else %}
-                <div class="grid grid-cols-4 gap-4 max-sm:grid-cols-1">
-                    {% for screenshot in screenshots %}
-                        <a href="{{ screenshot.image.url }}"
-                           target="_blank"
-                           rel="noopener noreferrer">
-                            <img src="{{ screenshot.image.url }}"
-                                 class="w-[358px] h-[210px] rounded-lg"
-                                 alt="issue screenshot"
-                                 data-lightbox="image"
-                                 height="auto"
-                                 width="auto">
-                        </a>
-                    {% endfor %}
-                </div>
+        <div class="px-10 mt-5">
+            <hr class="border-[#7e22ce] w-[100%]">
+            {% if object.markdown_description %}
+                <h3 class="font-[ubuntu] text-[16px] lg:text-[20px] p-3 my-2 font-semibold">Issue Description</h3>
+                <p class="ml-3 text-justify text-[12px] lg:text-[14px] lg:w-11/12"
+                   id="bug_report">{{ object.markdown_description }}</p>
             {% endif %}
         </div>
-        <hr class="w-full border-red-500">
-        {% if object.markdown_description %}
-            <h3 class="font-[ubuntu] text-[25px] p-3 my-2 font-medium text-2xl">Issue Description</h3>
-            <p class="text-justify max-sm:w-[95vw] lg:w-11/12" id="bug_report"></p>
-        {% endif %}
+        <div class="px-10 rounded-lg bg-white">{% include "comments2.html" %}</div>
     </div>
 </div>
 <script src="{% static '/company/js/md_editor.js' %}"></script>
@@ -296,6 +309,34 @@ <h3 class="font-[ubuntu] text-[25px] p-3 my-2 font-medium text-2xl">Issue Descri
 
     $("#bug_report").html(renderedHtml);
 
+    document.addEventListener('DOMContentLoaded', function () {
+    const prevBtn = document.getElementById('prevBtn');
+    const nextBtn = document.getElementById('nextBtn');
+    const currentScreenshot = document.getElementById('current-screenshot');
+    const lightboxLink = document.getElementById('lightbox-link');
+    const screenshots = document.querySelectorAll('.screenshot-image');
+    
+    let currentIndex = 0;
+
+    function updateImage() {
+        currentScreenshot.src = screenshots[currentIndex].src;
+        lightboxLink.href = screenshots[currentIndex].src;
+    }
+
+    nextBtn.addEventListener('click', function () {
+        if (currentIndex < screenshots.length - 1) {
+            currentIndex++;
+            updateImage();
+        }
+    });
+
+    prevBtn.addEventListener('click', function () {
+        if (currentIndex > 0) {
+            currentIndex--;
+            updateImage();
+        }
+    });
+});
 
     function subscribe_domain(){
         $.ajax({
@@ -468,8 +509,4 @@ <h3 class="font-[ubuntu] text-[25px] p-3 my-2 font-medium text-2xl">Issue Descri
         });
     });
 </script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.3.0/flowbite.js"
-        integrity="sha512-bUju8VkXhCQgW7zCHSdiIDpECo/lqzChkKrKoc1v2PL2XqO/0Q2Y8dhu07+q6Rk+1c1xr6cfE0VZnumgwy93Ig=="
-        crossorigin="anonymous"
-        referrerpolicy="no-referrer"></script>
 {% endblock content %}
diff --git a/website/views.py b/website/views.py
index 6797974aa..d1c349e48 100644
--- a/website/views.py
+++ b/website/views.py
@@ -54,6 +54,7 @@
     HttpRequest,
     HttpResponse,
     HttpResponseBadRequest,
+    HttpResponseForbidden,
     HttpResponseNotFound,
     HttpResponseRedirect,
     JsonResponse,
@@ -1985,7 +1986,7 @@ def get_success_url(self):
         return "https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=HH7MNY6KJGZFW"
 
 
-# TODO: REMOVE after _3 is ready
+# TODO(b): REMOVE after _3 is ready
 class IssueView(DetailView):
     model = Issue
     slug_field = "id"
@@ -2290,7 +2291,7 @@ def follow_user(request, user):
         return HttpResponse("Success")
 
 
-# TODO: remove after _3 is ready
+# TODO(b): remove after _3 is ready
 @login_required(login_url="/accounts/login")
 def like_issue(request, issue_pk):
     context = {}
@@ -3714,7 +3715,7 @@ def get_context_data(self, **kwargs):
         return context
 
 
-# TODO: Remove like_issue2 and like_issue, dislike_issue,dislike_issue2,flag_issue2,flag_issue after ready
+# TODO(b): Remove like_issue2 and like_issue, dislike_issue,dislike_issue2,flag_issue2,flag_issue after ready
 @login_required(login_url="/accounts/login")
 def flag_issue2(request, issue_pk):
     context = {}
@@ -4094,7 +4095,7 @@ def get_context_data(self, **kwargs):
             .values("id", "description", "markdown_description", "screenshots__image")
             .order_by("views")[:4]
         )
-        # TODO fix this, edit: Hopefully this will work
+        # TODO(b) fix this, edit: Hopefully this will work
         if isinstance(self.request.user, User):
             context["subscribed_to_domain"] = self.object.domain.user_subscribed_domains.filter(
                 pk=self.request.user.userprofile.id
@@ -4108,10 +4109,33 @@ def get_context_data(self, **kwargs):
             ).exists()
 
         context["screenshots"] = IssueScreenshot.objects.filter(issue=self.object).all()
-
+        # TODO(b) track the behaviour
+        context["status"] = Issue.objects.filter(id=self.object.id).get().status
         return context
 
 
+# TODO(b) track this
+@login_required(login_url="/accounts/login")
+@csrf_exempt
+def resolve(request, id):
+    issue = Issue.objects.get(id=id)
+    if request.user.is_superuser or request.user == issue.user:
+        if issue.status == "open":
+            issue.status = "close"
+            issue.closed_by = request.user
+            issue.closed_date = now()
+            issue.save()
+            return JsonResponse({"status": "ok", "issue_status": issue.status})
+        else:
+            issue.status = "open"
+            issue.closed_by = None
+            issue.closed_date = None
+            issue.save()
+            return JsonResponse({"status": "ok", "issue_status": issue.status})
+    else:
+        return HttpResponseForbidden()
+
+
 @receiver(user_signed_up)
 def handle_user_signup(request, user, **kwargs):
     referral_token = request.session.get("ref")