MediaWiki:CustomFiltered.css: Difference between revisions
From The Seven Sages of Rome
No edit summary |
No edit summary |
||
(One intermediate revision by the same user not shown) | |||
Line 11: | Line 11: | ||
} | } | ||
@media (min-width: | @media (min-width: 1071px) { | ||
.filtered-filters { | .filtered-filters { | ||
position: sticky !important; | position: sticky !important; | ||
Line 30: | Line 30: | ||
/* Optional: make it responsive */ | /* Optional: make it responsive */ | ||
@media (max-width: | @media (max-width: 1070px) { | ||
.filtered { | .filtered { | ||
flex-direction: column; /* Stack vertically on smaller screens */ | flex-direction: column; /* Stack vertically on smaller screens */ |
Latest revision as of 17:12, 1 May 2025
.filtered {
display: flex;
flex-wrap: nowrap; /* Make sure they stay in one row */
}
.filtered-filters {
flex: 0 0 25%; /* Don't grow or shrink, fixed at 25% width */
max-width: 25%;
box-sizing: border-box;
padding: 1rem; /* Optional: spacing inside the filters panel */
}
@media (min-width: 1071px) {
.filtered-filters {
position: sticky !important;
top: 5rem !important;
}
}
.filtered-views {
flex: 1 1 75%; /* Grow to take remaining space */
max-width: 75%;
box-sizing: border-box;
padding: 1rem; /* Optional: spacing inside the views panel */
}
.filtered-table table thead th {
position: sticky !important;
}
/* Optional: make it responsive */
@media (max-width: 1070px) {
.filtered {
flex-direction: column; /* Stack vertically on smaller screens */
}
.filtered-filters,
.filtered-views {
max-width: 100%;
flex: 0 0 100%;
}
}