mirror of
https://github.com/unraid/webgui.git
synced 2026-01-03 16:14:54 -06:00
feat: enhance non-responsive content styles in default-base.css
- Reintroduced the .content--non-responsive class to maintain a minimum width for complex page templates. - Updated styles for definition lists to ensure proper layout and responsiveness. - Added specific input field max-widths to improve usability in non-responsive contexts. This change aims to ensure that non-responsive layouts are styled correctly while maintaining usability across various input types. No further changes are pending for this task.
This commit is contained in:
@@ -1312,11 +1312,6 @@ a.list {
|
||||
}
|
||||
}
|
||||
|
||||
/* Necessary evil to prevent rewrites of complex page templates for responsive layout - i.e. VMedit.php */
|
||||
.content--non-responsive {
|
||||
min-width: 1200px;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -1576,6 +1571,49 @@ dd {
|
||||
}
|
||||
}
|
||||
|
||||
/* Necessary evil to prevent rewrites of complex page templates for responsive layout - i.e. VMedit.php */
|
||||
.content--non-responsive {
|
||||
min-width: 1200px;
|
||||
|
||||
/* override the dl > dt + dd responsive styles, inheriting the "desktop" styles defined below */
|
||||
dl {
|
||||
grid-template-columns: 35% 1fr;
|
||||
gap: 1.5rem 2rem;
|
||||
}
|
||||
dt {
|
||||
text-align: right;
|
||||
}
|
||||
dd {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
/* white-space: nowrap; */
|
||||
|
||||
input[type="text"],
|
||||
input[type="password"],
|
||||
input[type="number"],
|
||||
input[type="url"],
|
||||
input[type="email"],
|
||||
input[type="date"],
|
||||
input[type="file"],
|
||||
input:not([type="submit"]),
|
||||
input:not([type="button"]),
|
||||
input:not([type="checkbox"]),
|
||||
input:not([type="radio"]),
|
||||
input:not([class*="narrow"]),
|
||||
textarea,
|
||||
.textarea,
|
||||
select,
|
||||
.ui-dropdownchecklist-selector-wrapper {
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
.narrow {
|
||||
max-width: 150px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Responsive styles for definition lists */
|
||||
@media (min-width: 769px) {
|
||||
dl {
|
||||
|
||||
Reference in New Issue
Block a user