adam/thaw
1
0
Fork 0
mirror of https://github.com/adoyle0/thaw.git synced 2025-03-13 05:59:49 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: drawer adds z_index prop

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

8
thaw/src/drawer/drawer.css
View file

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

3
thaw/src/drawer/mod.rs
View file

@ -12,6 +12,7 @@ pub fn Drawer(
#[prop(optional, into)] placement: MaybeSignal<DrawerPlacement>, #[prop(optional, into)] placement: MaybeSignal<DrawerPlacement>,
#[prop(default = MaybeSignal::Static("520px".to_string()), into)] width: MaybeSignal<String>, #[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("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>>, #[prop(optional, into)] class: OptionalProp<MaybeSignal<String>>,
children: Children, children: Children,
) -> impl IntoView { ) -> impl IntoView {
@ -27,7 +28,7 @@ pub fn Drawer(
<Teleport> <Teleport>
<div <div
class="thaw-drawer-container" 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 class="thaw-drawer-mask" on:click=move |_| show.set(false)></div>
<div <div