feat: drawer adds z_index prop

This commit is contained in:
luoxiao 2024-02-03 21:05:09 +08:00 committed by luoxiaozero
parent 2dd28c3cd5
commit 96d5d3f337
2 changed files with 7 additions and 4 deletions

View file

@ -1,5 +1,9 @@
.thaw-drawer-container {
z-index: 2001;
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
}
.thaw-drawer-mask {
@ -9,12 +13,10 @@
left: 0;
bottom: 0;
background-color: #0007;
z-index: 2000;
}
.thaw-drawer {
position: absolute;
z-index: 2002;
}
.thaw-drawer > .thaw-card {

View file

@ -12,6 +12,7 @@ pub fn Drawer(
#[prop(optional, into)] placement: MaybeSignal<DrawerPlacement>,
#[prop(default = MaybeSignal::Static("520px".to_string()), into)] width: MaybeSignal<String>,
#[prop(default = MaybeSignal::Static("260px".to_string()), into)] height: MaybeSignal<String>,
#[prop(default = MaybeSignal::Static("2000".to_string()), into)] z_index: MaybeSignal<String>,
#[prop(optional, into)] class: OptionalProp<MaybeSignal<String>>,
children: Children,
) -> impl IntoView {
@ -27,7 +28,7 @@ pub fn Drawer(
<Teleport>
<div
class="thaw-drawer-container"
style=move || if show.get() { "" } else { "display: none" }
style=move || if show.get() { format!("z-index: {}", z_index.get()) } else { "display: none".to_string() }
>
<div class="thaw-drawer-mask" on:click=move |_| show.set(false)></div>
<div