LibWebView: Prevent displaying two scroll bars in the inspector console

We currently display scroll bars for the JS console and its parent tab
container. We want the console output to be separately scrollable from
the tab content, but since both containers are scrollable, we end up
with nested scroll bars. This also makes actually scrolling feel pretty
awkward.

Prevent this by making the tab container non-scrollable when the JS
console is shown.
This commit is contained in:
Timothy Flynn 2024-07-21 09:28:17 -04:00 committed by Andreas Kling
parent 44e23dce77
commit 4795b9206c
Notes: github-actions[bot] 2024-07-21 17:32:23 +00:00
2 changed files with 10 additions and 1 deletions

View file

@ -75,7 +75,7 @@ body {
border-radius: 0.5rem; border-radius: 0.5rem;
margin-top: 30px; margin-top: 30px;
padding: 8px; padding: 8px 0px 0px 4px;
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {

View file

@ -73,6 +73,15 @@ const selectTopTab = (tabButton, tabID) => {
const selectBottomTab = (tabButton, tabID) => { const selectBottomTab = (tabButton, tabID) => {
selectedBottomTab = selectTab(tabButton, tabID, selectedBottomTab, selectedBottomTabButton); selectedBottomTab = selectTab(tabButton, tabID, selectedBottomTab, selectedBottomTabButton);
selectedBottomTabButton = tabButton; selectedBottomTabButton = tabButton;
let inspectorBottom = document.getElementById("inspector-bottom");
inspectorBottom.scrollTo(0, 0);
if (tabID === "console") {
inspectorBottom.style.overflow = "hidden";
} else {
inspectorBottom.style.overflow = "scroll";
}
}; };
let initialTopTabButton = document.getElementById("dom-tree-button"); let initialTopTabButton = document.getElementById("dom-tree-button");