fix(mobile): compact FormGenerator header on connector page
All checks were successful
Deploy Nyla Frontend to Integration / deploy (push) Successful in 1m34s
All checks were successful
Deploy Nyla Frontend to Integration / deploy (push) Successful in 1m34s
Reduce page padding, hide subtitle and filters on mobile, keep pagination horizontal. Prevents controls from consuming all viewport height on small screens. Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
parent
7a914ce2d9
commit
49c3cf7290
2 changed files with 71 additions and 17 deletions
|
|
@ -313,13 +313,19 @@
|
|||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 6px 8px;
|
||||
max-height: 80px;
|
||||
overflow: hidden;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.searchContainer {
|
||||
flex: 0 1 auto;
|
||||
min-width: 120px;
|
||||
max-width: 200px;
|
||||
}
|
||||
|
||||
.filtersContainer {
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.filterGroup {
|
||||
|
|
@ -344,6 +350,10 @@
|
|||
.filterGroup .floatingLabelInput {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.csvExportButton {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Pagination Controls */
|
||||
|
|
@ -499,32 +509,36 @@
|
|||
/* Responsive Design for Pagination */
|
||||
@media (max-width: 768px) {
|
||||
.paginationControls {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
gap: 10px;
|
||||
margin-left: 0;
|
||||
width: 100%;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.pageSizeSelector {
|
||||
order: -1;
|
||||
justify-content: center;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.paginationInfo {
|
||||
text-align: center;
|
||||
font-size: 13px;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.pageNumbers {
|
||||
max-width: 100%;
|
||||
max-width: 60vw;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.pageNumber {
|
||||
min-width: 24px;
|
||||
height: 24px;
|
||||
font-size: 11px;
|
||||
min-width: 22px;
|
||||
height: 22px;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.paginationButton {
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -750,6 +750,46 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.adminPage {
|
||||
padding: 0.75rem;
|
||||
}
|
||||
|
||||
.pageHeader {
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.pageTitle {
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
.pageSubtitle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.headerActions {
|
||||
gap: 0.4rem;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.primaryButton,
|
||||
.secondaryButton,
|
||||
.dangerButton {
|
||||
font-size: 0.75rem;
|
||||
padding: 0.4rem 0.6rem;
|
||||
min-height: 32px;
|
||||
gap: 0.3rem;
|
||||
}
|
||||
|
||||
.tableContainer {
|
||||
min-height: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* ============================================== */
|
||||
/* Role Permissions Page Styles */
|
||||
/* ============================================== */
|
||||
|
|
|
|||
Loading…
Reference in a new issue