[GitHub] [airflow] blag opened a new issue, #23092: UI: Transparent border causes dropshadow to render 1px away from Action dropdown menu in Task Instance list

Tue, 19 Apr 2022 10:56:43 -0700 


blag opened a new issue, #23092:
URL: https://github.com/apache/airflow/issues/23092

   ### Apache Airflow version
   
   2.2.5 (latest released)
   
   ### What happened
   
   Airflow:
   
   > Astronomer Certified: v2.2.5.post1 based on Apache Airflow v2.2.5
   > Git Version: 
.release:2.2.5+astro.1+90fc013e6e4139e2d4bfe438ad46c3af1d523668
   
   Due to this CSS in `airflowDefaultTheme.ce329611a683ab0c05fd.css`:
   
   ```css
   .dropdown-menu {
     background-clip: padding-box;
     background-color: #fff;
     border: 1px solid transparent; /* <-- transparent border */
   }
   ```
   
   the dropdown border and dropshadow renders...weirdly:
   
   ![Screen Shot 2022-04-19 at 9 50 45 
AM](https://user-images.githubusercontent.com/597113/164063925-10aaec58-ce6b-417e-a90f-4fa93eee4f9e.png)
   
   Zoomed in - take a close look at the border and how the contents underneath 
the dropdown bleed through the border, making the dropshadow render 1px away 
from the dropdown menu:
   
   ![Screen Shot 2022-04-19 at 9 51 24 
AM](https://user-images.githubusercontent.com/597113/164063995-e2d266ae-2cbf-43fc-9d97-7f90080c5507.png)
   
   
   ### What you think should happen instead
   
   When I remove the abberrant line of CSS above, it cascades to this in 
`bootstrap.min.css`:
   
   ```css
   .dropdown-menu {
     ...
     border: 1px solid rgba(0,0,0,.15);
     ...
   }
   ```
   
   which renders the border as gray:
   
   ![Screen Shot 2022-04-19 at 9 59 23 
AM](https://user-images.githubusercontent.com/597113/164064014-d575d039-aeb1-4a99-ab80-36c8cd6ca39e.png)
   
   So I think we should not use a transparent border, or we should remove the 
explicit border from the dropdown and let Bootstrap control it.
   
   ### How to reproduce
   
   Spin up an instance of Airflow with `astro dev start`, trigger a DAG, 
inspect the DAG details, and list all task instances of a DAG run. Then click 
the Actions dropdown menu.
   
   ### Operating System
   
   macOS 11.6.4 Big Sur (Intel)
   
   ### Versions of Apache Airflow Providers
   
   _No response_
   
   ### Deployment
   
   Other Docker-based deployment
   
   ### Deployment details
   
   Astro installed via Homebrew:
   
   > Astro CLI Version: 0.28.1, Git Commit: 
980c0d7bd06b818a2cb0e948bb101d0b27e3a90a
   > Astro Server Version: 0.28.4-rc9
   
   ### Anything else
   
   _No response_
   
   ### Are you willing to submit PR?
   
   - [ ] Yes I am willing to submit a PR!
   
   ### Code of Conduct
   
   - [X] I agree to follow this project's [Code of 
Conduct](https://github.com/apache/airflow/blob/main/CODE_OF_CONDUCT.md)
   


-- 
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: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]

Reply via email to