You are viewing a plain text version of this content. The canonical link for it is here.

Posted to commits@airflow.apache.org by "choo121600 (via GitHub)" <gi...@apache.org> on 2025/12/20 04:36:24 UTC

[PR] Fix sidebar visibility issue when main content exceeds viewport height [airflow]

choo121600 opened a new pull request, #59660:
URL: https://github.com/apache/airflow/pull/59660

In responsive layouts, when the main content height exceeds the viewport height, users had to scroll the entire page to access bottom elements of the fixed sidebar, making navigation difficult.

## Change
The main content area in `BaseLayout.tsx` was set to h="100vh" without overflow handling.

Added `overflowY="auto"` to the main content container
--> Main content scrolls within its own container when it exceeds viewport height

## Before

https://github.com/user-attachments/assets/50897750-e6bb-46a1-afbf-fdb612c49017

## After

https://github.com/user-attachments/assets/f16c2968-6751-4444-9d88-7149ff43932b

<!--
Licensed to the Apache Software Foundation (ASF) under one
or more contributor license agreements. See the NOTICE file
distributed with this work for additional information
regarding copyright ownership. The ASF licenses this file
to you under the Apache License, Version 2.0 (the
"License"); you may not use this file except in compliance
with the License. You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing,
software distributed under the License is distributed on an
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, either express or implied. See the License for the
specific language governing permissions and limitations
under the License.
-->

<!--
Thank you for contributing! Please make sure that your code changes
are covered with tests. And in case of new features or big changes
remember to adjust the documentation.

Feel free to ping committers for the review!

In case of an existing issue, reference it using one of the following:

closes: #ISSUE
related: #ISSUE

How to write a good git commit message:
http://chris.beams.io/posts/git-commit/
-->

---
**^ Add meaningful description above**
Read the **[Pull Request Guidelines](https://github.com/apache/airflow/blob/main/contributing-docs/05_pull_requests.rst#pull-request-guidelines)** for more information.
In case of fundamental code changes, an Airflow Improvement Proposal ([AIP](https://cwiki.apache.org/confluence/display/AIRFLOW/Airflow+Improvement+Proposals)) is needed.
In case of a new dependency, check compliance with the [ASF 3rd Party License Policy](https://www.apache.org/legal/resolved.html#category-x).
In case of backwards incompatible changes please leave a note in a newsfragment file, named `{pr_number}.significant.rst` or `{issue_number}.significant.rst`, in [airflow-core/newsfragments](https://github.com/apache/airflow/tree/main/airflow-core/newsfragments).

--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org

Re: [PR] Fix sidebar visibility issue when main content exceeds viewport height [airflow]

Posted by "bbovenzi (via GitHub)" <gi...@apache.org>.

bbovenzi merged PR #59660:
URL: https://github.com/apache/airflow/pull/59660


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org

Re: [PR] Fix sidebar visibility issue when main content exceeds viewport height [airflow]

Posted by "github-actions[bot] (via GitHub)" <gi...@apache.org>.

github-actions[bot] commented on PR #59660:
URL: https://github.com/apache/airflow/pull/59660#issuecomment-3725527519

   ### Backport successfully created: v3-1-test
   
   <table>
                   <tr>
                       <th>Status</th>
                       <th>Branch</th>
                       <th>Result</th>
                   </tr>
                   <tr>
                       <td>✅</td>
                       <td>v3-1-test</td>
                       <td><a href="https://github.com/apache/airflow/pull/60286"><img src="https://img.shields.io/badge/PR-60286-blue" alt="PR Link"></a></td>
                   </tr>
               </table>


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org

Re: [PR] Fix sidebar visibility issue when main content exceeds viewport height [airflow]

Posted by "choo121600 (via GitHub)" <gi...@apache.org>.

choo121600 commented on PR #59660:
URL: https://github.com/apache/airflow/pull/59660#issuecomment-3718985105

   With many Dags on the Dags page, the layout appears like this when responsive mode
   I’m using the Arc browser, and the issue can be reproduced in Chrome as well.
   
   https://github.com/user-attachments/assets/fe1173f6-be3f-421a-a1d8-52691d0fbc6d
   
   https://github.com/user-attachments/assets/f1f21bbb-1947-4b0d-89fc-e97e9ff463cd
   
   


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: commits-unsubscribe@airflow.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org