Fixed table rendering issues

This commit is contained in:
Alejandro Celaya 2022-03-07 11:03:41 +01:00
parent 0f43ad59a0
commit 74635281de
5 changed files with 133 additions and 130 deletions

View file

@ -28,7 +28,7 @@ a,
text-decoration: none; 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 { .btn-link:hover {
text-decoration: underline; text-decoration: underline;
} }
@ -164,7 +164,8 @@ hr {
.close, .close,
.close:hover, .close:hover,
.table, .table,
.table-hover > tbody > tr:hover > * { .table-hover > tbody > tr:hover > *,
.table-hover > tbody > tr > * {
color: var(--text-color); color: var(--text-color);
} }

View file

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

View file

@ -87,7 +87,8 @@ const VisitsTable = ({
}, [ searchTerm ]); }, [ searchTerm ]);
return ( 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"> <thead className="visits-table__header">
<tr> <tr>
<th <th
@ -218,6 +219,7 @@ const VisitsTable = ({
</tfoot> </tfoot>
)} )}
</table> </table>
</div>
); );
}; };

View file

@ -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 { OrphanVisitType, VisitsFilter } from '../types';
import { DropdownBtn } from '../../utils/DropdownBtn'; import { DropdownBtn } from '../../utils/DropdownBtn';
import { hasValue } from '../../utils/utils'; import { hasValue } from '../../utils/utils';

View file

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