Fixed table rendering issues

src/index.scss

@@ -28,7 +28,7 @@ a,
   text-decoration: none;
 }
 
-a:not(.nav-link):not(.navbar-brand):not(.page-link):hover,
+a:not(.nav-link):not(.navbar-brand):not(.page-link):not(.highlight-card):hover,
 .btn-link:hover {
   text-decoration: underline;
 }
@@ -164,7 +164,8 @@ hr {
 .close,
 .close:hover,
 .table,
-.table-hover > tbody > tr:hover > * {
+.table-hover > tbody > tr:hover > *,
+.table-hover > tbody > tr > * {
   color: var(--text-color);
 }
 

src/settings/Settings.tsx

@@ -21,13 +21,13 @@ const Settings = (
     <NavPills className="mb-3">
       <NavPillItem to="general">General</NavPillItem>
       <NavPillItem to="short-urls">Short URLs</NavPillItem>
-      <NavPillItem to="secondary-items">Secondary items</NavPillItem>
+      <NavPillItem to="other-items">Other items</NavPillItem>
     </NavPills>
 
     <Routes>
       <Route path="general" element={<SettingsSections items={[ <UserInterface key="one" />, <RealTimeUpdates key="two" /> ]} />} />
       <Route path="short-urls" element={<SettingsSections items={[ <ShortUrlCreation key="one" />, <ShortUrlsList key="two" /> ]} />} />
-      <Route path="secondary-items" element={<SettingsSections items={[ <Tags key="one" />, <Visits key="two" /> ]} />} />
+      <Route path="other-items" element={<SettingsSections items={[ <Tags key="one" />, <Visits key="two" /> ]} />} />
       <Route path="*" element={<Navigate replace to="general" />} />
     </Routes>
   </NoMenuLayout>

src/visits/VisitsTable.tsx

@@ -87,7 +87,8 @@ const VisitsTable = ({
   }, [ searchTerm ]);
 
   return (
-    <table className="table table-bordered table-hover table-sm table-responsive-sm visits-table">
+    <div className="table-responsive-md">
+      <table className="table table-bordered table-hover table-sm visits-table">
         <thead className="visits-table__header">
           <tr>
             <th
@@ -218,6 +219,7 @@ const VisitsTable = ({
           </tfoot>
         )}
       </table>
+    </div>
   );
 };
 

src/visits/helpers/VisitsFilterDropdown.tsx

@@ -1,4 +1,4 @@
-import { DropdownItem, DropdownItemProps } from 'reactstrap'; // eslint-disable-line import/named
+import { DropdownItem, DropdownItemProps } from 'reactstrap';
 import { OrphanVisitType, VisitsFilter } from '../types';
 import { DropdownBtn } from '../../utils/DropdownBtn';
 import { hasValue } from '../../utils/utils';

test/settings/Settings.test.tsx

@@ -24,6 +24,6 @@ describe('<Settings />', () => {
     expect(items).toHaveLength(3);
     expect(items.first().prop('to')).toEqual('general');
     expect(items.at(1).prop('to')).toEqual('short-urls');
-    expect(items.last().prop('to')).toEqual('secondary-items');
+    expect(items.last().prop('to')).toEqual('other-items');
   });
 });