From 990db6fdc89cdbccce952571d7028683545f8980 Mon Sep 17 00:00:00 2001 From: Fabio Caccamo Date: Wed, 28 Sep 2022 15:36:46 +0200 Subject: [PATCH] [css] Fix sticky list filter scrolling. #175 --- .../admin_interface/css/admin-interface.css | 17 ++++++++++++++--- .../css/list-filter-dropdown.css | 8 ++++++-- 2 files changed, 20 insertions(+), 5 deletions(-) diff --git a/admin_interface/static/admin_interface/css/admin-interface.css b/admin_interface/static/admin_interface/css/admin-interface.css index 94f5990..2ad4ec6 100644 --- a/admin_interface/static/admin_interface/css/admin-interface.css +++ b/admin_interface/static/admin_interface/css/admin-interface.css @@ -347,9 +347,17 @@ @media (min-width: 768px) { .admin-interface.list-filter-sticky .module.filtered #changelist-filter { position: sticky; - top: 40px; + top: 30px; float: right; z-index: 30; + display: flex; + flex-direction: column; + overflow-y: auto; + height: 100%; + max-height: calc(100vh - 60px); + } + .admin-interface.list-filter-sticky.sticky-pagination .module.filtered #changelist-filter { + max-height: calc(100vh - 125px); } /* feature not available for django < 3.1.2 */ @@ -357,12 +365,15 @@ position: absolute; top: 0px; z-index: 30; + max-height: calc(100vh - 105px); + } + .admin-interface.list-filter-sticky.sticky-pagination .module.filtered #toolbar + #changelist-filter { + max-height: calc(100vh - 170px); } } .admin-interface .module.filtered #changelist-filter { - border-bottom-left-radius: var(--admin-interface-module-border-radius); - border-bottom-right-radius: var(--admin-interface-module-border-radius); + border-radius: var(--admin-interface-module-border-radius); } .admin-interface .module.filtered #changelist-filter #changelist-filter-clear a:focus, diff --git a/admin_interface/static/admin_interface/css/list-filter-dropdown.css b/admin_interface/static/admin_interface/css/list-filter-dropdown.css index d1fc14c..2d20a7d 100644 --- a/admin_interface/static/admin_interface/css/list-filter-dropdown.css +++ b/admin_interface/static/admin_interface/css/list-filter-dropdown.css @@ -3,8 +3,12 @@ list-filter-dropdown */ .admin-interface .list-filter-dropdown { - margin-top:10px; - margin-bottom:20px; + margin-top: 0; + margin-bottom: 20px; +} + +.admin-interface .list-filter-dropdown h3 { + margin-top: 0; } .admin-interface .list-filter-dropdown select {