diff --git a/acros/templates/acros/detail.html b/acros/templates/acros/detail.html
index 1191aa0..1a8ae5b 100644
--- a/acros/templates/acros/detail.html
+++ b/acros/templates/acros/detail.html
@@ -49,7 +49,7 @@
     <a class="nav-item nav-link" href="{% url 'admin:acros_acronym_change' acro.id %}">Admin-Edit</a>
   {% endif %}
   <li class="nav-item dropdown">
-    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button" data-toggle="dropdown"
+    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown"
        aria-haspopup="true" aria-expanded="false">
       Add Reference
     </a>
@@ -93,7 +93,7 @@
               Read on Wikipedia
             </a>
             <a href="https://en.wikipedia.org/wiki/Wikipedia:Text_of_Creative_Commons_Attribution-ShareAlike_3.0_Unported_License"
-               data-toggle="tooltip"
+               data-bs-toggle="tooltip"
                target="_blank" rel="noopener"
                class="text-muted"
                title="This snippet and thumbnail is from the English Wikipedia and licensed under the CC-BY-SA 3.0 license">
@@ -102,7 +102,7 @@
             {% if link.thumbnail %}
               <a href="{{ link.thumbnail.commons_url }}" target="_blank" rel="noopener"
                  class="text-muted"
-                 data-toggle="tooltip"
+                 data-bs-toggle="tooltip"
                  title="by {{ link.thumbnail.artist }} under {{ link.thumbnail.license_short_name }}">
                 Image-Source
               </a>
@@ -122,24 +122,24 @@
             <h5 class="card-title">{{ paper.title }} ({{ paper.year }})</h5>
             <p>{{ paper.authors }}</p>
             <div class="linkbar">
-              <a href="{{ paper.ads_url }}" data-toggle="tooltip" title="view on ADS">
+              <a href="{{ paper.ads_url }}" data-bs-toggle="tooltip" title="view on ADS">
                 <img src="{% static "images/adees.png" %}" width="32" height="32">
               </a>
               {% if paper.arxiv_id %}
-                <a href="{{ paper.arxiv_url }}" data-toggle="tooltip" title="view on arXiv.org">
+                <a href="{{ paper.arxiv_url }}" data-bs-toggle="tooltip" title="view on arXiv.org">
                   <img src="{% static "images/arxiv.png" %}" width="32" height="32">
                 </a>
               {% endif %}
               {% if paper.doi %}
-                <a href="{{ paper.doi_url }}" data-toggle="tooltip" title="Publisher Website">
+                <a href="{{ paper.doi_url }}" data-bs-toggle="tooltip" title="Publisher Website">
                   {% include 'SVGs/external.svg' %}
                 </a>
               {% endif %}
-              <a href="{{ paper.publisher_url }}" data-toggle="tooltip" title="Publisher PDF">
+              <a href="{{ paper.publisher_url }}" data-bs-toggle="tooltip" title="Publisher PDF">
                 {% include 'SVGs/pdf.svg' %}
               </a>
               {% if paper.arxiv_id %}
-                <a href="{{ paper.preprint_url }}" data-toggle="tooltip" title="arXiv.org PDF">
+                <a href="{{ paper.preprint_url }}" data-bs-toggle="tooltip" title="arXiv.org PDF">
                   {% include 'SVGs/pdf.svg' %}
                 </a>
               {% endif %}
diff --git a/acros/utils/wikilinks.py b/acros/utils/wikilinks.py
index c98b6d9..e962a94 100644
--- a/acros/utils/wikilinks.py
+++ b/acros/utils/wikilinks.py
@@ -59,7 +59,7 @@ class WikiLinksInlineProcessor(InlineProcessor):
         a.text = label
         a.set("href", url)
         a.set("title", acro.full_name)
-        a.set("data-toggle", "tooltip")
+        a.set("data-bs-toggle", "tooltip")
         if self.html_class:
             a.set("class", self.html_class)
         return a, m.start(0), m.end(0)
diff --git a/static/app.js b/static/app.js
index 3135b9c..d8cfc5d 100644
--- a/static/app.js
+++ b/static/app.js
@@ -1,5 +1,4 @@
 document.addEventListener('DOMContentLoaded', function () {
-
     const tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-toggle="tooltip"]'))
     const tooltipList = tooltipTriggerList.map(
         tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl)
diff --git a/templates/base.html b/templates/base.html
index 68e2940..4e5b29d 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -43,7 +43,7 @@
       {% if user.is_staff %}
         <a class="navbar-brand" href="{% url 'admin:index' %}">Admin</a>
       {% endif %}
-      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
+      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
               aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
         <span class="navbar-toggler-icon"></span>
       </button>