-
-
Notifications
You must be signed in to change notification settings - Fork 537
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix(ui): adjust z-index of Embedded Media Player and sticky header #2848
base: main
Are you sure you want to change the base?
Conversation
Run & review this pull request in StackBlitz Codeflow. |
✅ Deploy Preview for elk-docs canceled.
|
✅ Deploy Preview for elk-zone ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
@@ -27,7 +27,7 @@ const containerClass = computed(() => { | |||
<template> | |||
<div ref="container" :class="containerClass"> | |||
<div | |||
sticky top-0 z10 | |||
sticky top-0 z-20 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The bottom menu has z-20
so I used the same value and set the z-index of media player to z-10
:
elk/components/nav/NavBottomMoreMenu.vue
Line 132 in f79d84a
absolute inset-x-0 top-auto bottom-full z-20 h-100vh |
@@ -90,7 +90,7 @@ function activate() { | |||
</button> | |||
</div> | |||
<!-- Results --> | |||
<div left-0 top-11 absolute w-full z10 group-focus-within="pointer-events-auto visible" invisible pointer-events-none> | |||
<div left-0 top-11 absolute w-full z-10 group-focus-within="pointer-events-auto visible" invisible pointer-events-none> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is not related to the fix but all other z-index have the prefix z-
so use the same format for better code discoverability.
fix #2847 by adjusting z-index values
After fix