ThatGuyJack/nginx-proxy-manager
1
0
Fork 0
mirror of https://github.com/NginxProxyManager/nginx-proxy-manager.git synced 2025-12-06 00:16:49 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

True mobile layout with responsive table rows (sticky header)

Browse Source
This commit is contained in:
7heMech
2025-11-13 02:44:24 +02:00
parent dadd10f89b
commit 1c442dcce6
3 changed files with 8 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/SiteContainer.tsx
View File

@@ -2,5 +2,5 @@ interface Props {
children: React.ReactNode; children: React.ReactNode;
} }
export function SiteContainer({ children }: Props) { export function SiteContainer({ children }: Props) {
return <div className="container-xl py-3">{children}</div>; return <div className="container-xl py-3 min-w-0 overflow-x-auto">{children}</div>;
} }

2
frontend/src/components/SiteHeader.tsx
View File

@@ -25,7 +25,7 @@ export function SiteHeader() {
> >
<span className="navbar-toggler-icon" /> <span className="navbar-toggler-icon" />
</button> </button>
<div className="navbar-brand navbar-brand-autodark d-none-navbar-horizontal pe-0 pe-md-3"> <div className="navbar-brand navbar-brand-autodark pe-0 pe-md-3">
<NavLink to="/"> <NavLink to="/">
<div className={styles.logo}> <div className={styles.logo}>
<img <img

10
frontend/src/components/Table/TableLayout.tsx
View File

@@ -12,10 +12,12 @@ interface TableLayoutProps<TFields> {
function TableLayout<TFields>(props: TableLayoutProps<TFields>) { function TableLayout<TFields>(props: TableLayoutProps<TFields>) {
const hasRows = props.tableInstance.getRowModel().rows.length > 0; const hasRows = props.tableInstance.getRowModel().rows.length > 0;
return ( return (
<table className="table table-vcenter table-selectable mb-0"> <div className="table-responsive">
{hasRows ? <TableHeader tableInstance={props.tableInstance} /> : null} <table className="table table-vcenter table-selectable mb-0">
<TableBody {...props} /> {hasRows ? <TableHeader tableInstance={props.tableInstance} /> : null}
</table> <TableBody {...props} />
</table>
</div>
); );
} }