Merge pull request #1407 from OpenEnergyPlatform/bugfix-1403-fix-cate…

…gory-tabs-on-factsheet-edit-pages Fix category tabs on factsheet edit pages
OpenEnergyPlatform · Oct 16, 2023 · 92b7719 · 92b7719
2 parents 08848ee + 6c562d7
commit 92b7719
Show file tree

Hide file tree

Showing 3 changed files with 53 additions and 16 deletions.
diff --git a/modelview/templates/modelview/editframework.html b/modelview/templates/modelview/editframework.html
@@ -33,19 +33,30 @@ <h1> Framework </h1>
 {% include 'modelview/error_snipet.html' with errors=errors %}
 
 <ul class="nav nav-tabs">
-    <li class="active" style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#Overview">Overview</a>
+    <li class="nav-item" role="presentation">
+        <button class="nav-link active" id="overview-tab" data-bs-toggle="tab" data-bs-target="#Overview" type="button" role="tab" aria-controls="Overview" aria-selected="true">Overview</button>
+    </li>
+    <li class="nav-item" role="presentation">
+        <button class="nav-link" id="general-tab" data-bs-toggle="tab" data-bs-target="#General" type="button" role="tab" aria-controls="General" aria-selected="false">General</button>
+    </li>
+    <li class="nav-item" role="presentation">
+        <button class="nav-link" id="openness-tab" data-bs-toggle="tab" data-bs-target="#Openness" type="button" role="tab" aria-controls="Openness" aria-selected="false">Openness</button>
+    </li>
+    <li class="nav-item" role="presentation">
+        <button class="nav-link" id="mathematical-description-tab" data-bs-toggle="tab" data-bs-target="#MathematicalDescription" type="button" role="tab" aria-controls="MathematicalDescription" aria-selected="false">MathematicalDescription</button>
+    </li>
+    <li class="nav-item" role="presentation">
+        <button class="nav-link" id="model-building-tab" data-bs-toggle="tab" data-bs-target="#ModelBuilding" type="button" role="tab" aria-controls="Overview" aria-selected="false">ModelBuilding</button>
+    </li>
+    <li class="nav-item" role="presentation">
+        <button class="nav-link" id="references-tab" data-bs-toggle="tab" data-bs-target="#References" type="button" role="tab" aria-controls="Overview" aria-selected="false">References</button>
+    </li>
+    <li class="nav-item" role="presentation">
+        <button class="nav-link" id="tags-tab" data-bs-toggle="tab" data-bs-target="#Tags" type="button" role="tab" aria-controls="Overview" aria-selected="false">Tags</button>
     </li>
-    <li style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#General">General Information</a></li>
-    <li style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#MathematicalDescription">Mathematical
-        Description</a></li>
-    <li style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#Openness">Openness</a></li>
-    <li style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#ModelBuilding">Model Building</a></li>
-    <li style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#References">References</a></li>
-    <li style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#Tags">Tags</a></li>
     <span onclick="window.onbeforeunload = function (e) {};">
-  <input class="btn btn-info right" type="submit" value="Submit all"/>
-  </span>
-
+        <input class="btn btn-info right" type="submit" value="Submit all"/>
+    </span>
 </ul>
 <div class="tab-content">
     <div id="Overview" class="tab-pane fade show active">

diff --git a/modelview/templates/modelview/editmodel.html b/modelview/templates/modelview/editmodel.html
@@ -33,17 +33,41 @@ <h1> Model </h1>
 <div style="width:100%">
 
 <ul class="nav nav-tabs" style="width:100%">
-  <li class="active" style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#Basic">General Information</a></li>
+  <!-- <li class="active" style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#Basic">General Information</a></li>
   <li style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#Openness">Openness</a></li>
   <li style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#Software">Software</a></li>
   <li style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#Coverage">Coverage</a></li>
   <li style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#Math">Mathematical Properties</a></li>
   <li style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#Integration">Model Integration</a></li>
   <li style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#References">References</a></li>
-  <li style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#Tags">Tags</a></li>
-  <span onclick="window.onbeforeunload = function (e) {};">
-  <input class="btn btn-info right" type="submit" value="Submit all" />
-  </span>
+  <li style="padding-right: 5px; padding-left: 5px"><a data-bs-toggle="tab" href="#Tags">Tags</a></li> -->
+    <li class="nav-item" role="presentation">
+        <button class="nav-link active" id="basic-tab" data-bs-toggle="tab" data-bs-target="#Basic" type="button" role="tab" aria-controls="Basic" aria-selected="true">General</button>
+    </li>
+    <li class="nav-item" role="presentation">
+        <button class="nav-link" id="openness-tab" data-bs-toggle="tab" data-bs-target="#Openness" type="button" role="tab" aria-controls="Openness" aria-selected="false">Openness</button>
+    </li>
+    <li class="nav-item" role="presentation">
+        <button class="nav-link" id="software-tab" data-bs-toggle="tab" data-bs-target="#Software" type="button" role="tab" aria-controls="Software" aria-selected="false">Software</button>
+    </li>
+    <li class="nav-item" role="presentation">
+        <button class="nav-link" id="coverage-tab" data-bs-toggle="tab" data-bs-target="#Coverage" type="button" role="tab" aria-controls="Coverage" aria-selected="false">Coverage</button>
+    </li>
+    <li class="nav-item" role="presentation">
+        <button class="nav-link" id="math-tab" data-bs-toggle="tab" data-bs-target="#Math" type="button" role="tab" aria-controls="Math" aria-selected="false">Mathematical Properties</button>
+    </li>
+    <li class="nav-item" role="presentation">
+        <button class="nav-link" id="integration-tab" data-bs-toggle="tab" data-bs-target="#Integration" type="button" role="tab" aria-controls="Integration" aria-selected="false">Model Integration</button>
+    </li>
+    <li class="nav-item" role="presentation">
+        <button class="nav-link" id="references-tab" data-bs-toggle="tab" data-bs-target="#References" type="button" role="tab" aria-controls="Overview" aria-selected="false">References</button>
+    </li>
+    <li class="nav-item" role="presentation">
+        <button class="nav-link" id="tags-tab" data-bs-toggle="tab" data-bs-target="#Tags" type="button" role="tab" aria-controls="Overview" aria-selected="false">Tags</button>
+    </li>
+    <span onclick="window.onbeforeunload = function (e) {};">
+        <input class="btn btn-info right" type="submit" value="Submit all" />
+    </span>
 </ul>
 
 </div>

diff --git a/versions/changelogs/current.md b/versions/changelogs/current.md
@@ -5,4 +5,6 @@
 ### Bugs
 - Fixed a bug that displayed outdated data on model & framework factsheet pages because a cached version of the page was displayed [PR#1404](https://github.com/OpenEnergyPlatform/oeplatform/pull/1404)
 
+- Update nav tabs implementation in factsheet edit pages to bootstrap5  [PR#1407](https://github.com/OpenEnergyPlatform/oeplatform/pull/1407)
+
 ### Removed