From b4091d5274c924351faec50f7dc898a90557d50a Mon Sep 17 00:00:00 2001
From: Daniel Woste <daniel.woste@useblocks.com>
Date: Fri, 8 Oct 2021 12:07:40 +0200
Subject: [PATCH] RTD and DataTables fixed.

Fixes #305
---
 docs/changelog.rst                                 |  2 ++
 sphinxcontrib/needs/css/common.css                 | 14 ++++++++++++--
 sphinxcontrib/needs/libs/html/datatables_loader.js |  2 +-
 3 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/docs/changelog.rst b/docs/changelog.rst
index 8c1c52371..a1d589e1a 100644
--- a/docs/changelog.rst
+++ b/docs/changelog.rst
@@ -25,6 +25,8 @@ License
   (`#317 <https://github.com/useblocks/sphinxcontrib-needs/issues/317>`_)
 * Improvement: API to register warnings
   (`#343 <https://github.com/useblocks/sphinxcontrib-needs/issues/343>`_)
+* Bugfix: Scrolling tables improved and ReadTheDocs Tables fixed
+  (`#305 <https://github.com/useblocks/sphinxcontrib-needs/issues/305>`_)
 * Bugfix: :ref:`needtable` need parts 'id' column is not linked
   (`#336 <https://github.com/useblocks/sphinxcontrib-needs/issues/336>`_)
 * Bugfix: :ref:`needtable` need parts 'incoming' column is empty
diff --git a/sphinxcontrib/needs/css/common.css b/sphinxcontrib/needs/css/common.css
index 756df8d9a..ef1e81238 100644
--- a/sphinxcontrib/needs/css/common.css
+++ b/sphinxcontrib/needs/css/common.css
@@ -4,10 +4,10 @@ table.need td {
     white-space: normal;
 }
 
-table.NEEDS_TABLE {
+table.NEEDS_TABLE, table.NEEDS_DATATABLES {
   display: block;
   overflow-x: auto;
-  white-space: nowrap;
+  white-space: normal;
   width: 100%;
   max-width: -moz-fit-content;
   max-width: fit-content;
@@ -102,6 +102,11 @@ div.dataTables_length {
     margin-bottom: 10px;
 }
 
+div.dataTables_wrapper{
+    overflow-x: auto;
+    padding: 0px 5px;  /*Space needed for table borders */
+}
+
 .dataTables_wrapper .dataTables_paginate .paginate_button {
     padding: 0.15em 0.75em;
     background: none;
@@ -133,6 +138,11 @@ div.dt-buttons button {
     background-image: none;
 }
 
+/* Cares about setting the final bottom border */
+table.rtd-exclude-wy-table {
+    border: 1px solid #e1e4e5 !important;
+}
+
 /* Style for external need links*/
 a.external_link:after {
     content: "🡽"
diff --git a/sphinxcontrib/needs/libs/html/datatables_loader.js b/sphinxcontrib/needs/libs/html/datatables_loader.js
index 3b29f6356..bc5a6b26c 100644
--- a/sphinxcontrib/needs/libs/html/datatables_loader.js
+++ b/sphinxcontrib/needs/libs/html/datatables_loader.js
@@ -2,7 +2,7 @@ $(document).ready(function() {
     $('table.NEEDS_DATATABLES').DataTable( {
         dom: 'lBfrtip',
         colReorder: true,
-        scrollX: true,
+        scrollX: false,
         autoWidth: false,
         buttons: [
             {