feat: SiteHeader

This commit is contained in:
luoxiao 2024-08-03 01:05:34 +08:00
parent 0b8a89caab
commit 2d46cc41d0
2 changed files with 24 additions and 14 deletions

View file

@ -203,26 +203,30 @@ pub fn SiteHeader() -> impl IntoView {
} }
</Menu> </Menu>
<Space class="demo-header__right-btn" align=SpaceAlign::Center> <Space class="demo-header__right-btn" align=SpaceAlign::Center>
<SwitchVersion/>
<Button <Button
appearance=ButtonAppearance::Subtle icon=Memo::new(move |_| {
theme.with(|theme| {
if theme.name == "light" {
icondata::BiMoonRegular
} else {
icondata::BiSunRegular
}
})
})
on_click=change_theme on_click=change_theme
> >
{move || theme_name.get()} {move || theme_name.get()}
</Button> </Button>
<SwitchVersion/>
<Button <Button
appearance=ButtonAppearance::Subtle
icon=icondata::BiDiscordAlt icon=icondata::BiDiscordAlt
attr:style="font-size: 22px; padding: 0px 6px;"
on_click=move |_| { on_click=move |_| {
_ = window().open_with_url("https://discord.gg/YPxuprzu6M"); _ = window().open_with_url("https://discord.gg/YPxuprzu6M");
} }
/> />
<Button <Button
appearance=ButtonAppearance::Subtle
icon=icondata::AiGithubOutlined icon=icondata::AiGithubOutlined
attr:style="font-size: 22px; padding: 0px 6px;"
on_click=move |_| { on_click=move |_| {
_ = window().open_with_url("http://github.com/thaw-ui/thaw"); _ = window().open_with_url("http://github.com/thaw-ui/thaw");
} }

View file

@ -4,7 +4,7 @@ pub use button_group::ButtonGroup;
use crate::icon::Icon; use crate::icon::Icon;
use leptos::{either::Either, ev, prelude::*}; use leptos::{either::Either, ev, prelude::*};
use thaw_utils::{class_list, mount_style, BoxOneCallback, OptionalMaybeSignal}; use thaw_utils::{class_list, mount_style, BoxOneCallback};
#[derive(Default, PartialEq, Clone, Copy)] #[derive(Default, PartialEq, Clone, Copy)]
pub enum ButtonAppearance { pub enum ButtonAppearance {
@ -66,18 +66,24 @@ impl ButtonSize {
pub fn Button( pub fn Button(
#[prop(optional, into)] class: MaybeProp<String>, #[prop(optional, into)] class: MaybeProp<String>,
/// A button can have its content and borders styled for greater emphasis or to be subtle. /// A button can have its content and borders styled for greater emphasis or to be subtle.
#[prop(optional, into)] appearance: MaybeSignal<ButtonAppearance>, #[prop(optional, into)]
appearance: MaybeSignal<ButtonAppearance>,
/// A button can be rounded, circular, or square. /// A button can be rounded, circular, or square.
#[prop(optional, into)] shape: MaybeSignal<ButtonShape>, #[prop(optional, into)]
shape: MaybeSignal<ButtonShape>,
/// A button supports different sizes. /// A button supports different sizes.
#[prop(optional, into)] size: MaybeSignal<ButtonSize>, #[prop(optional, into)]
size: MaybeSignal<ButtonSize>,
/// Whether the button is displayed as block. /// Whether the button is displayed as block.
#[prop(optional, into)] block: MaybeSignal<bool>, #[prop(optional, into)]
#[prop(optional, into)] icon: OptionalMaybeSignal<icondata_core::Icon>, block: MaybeSignal<bool>,
#[prop(optional, into)] icon: MaybeProp<icondata_core::Icon>,
/// Whether the button is disabled. /// Whether the button is disabled.
#[prop(optional, into)] disabled: MaybeSignal<bool>, #[prop(optional, into)]
disabled: MaybeSignal<bool>,
/// When set, allows the button to be focusable even when it has been disabled. /// When set, allows the button to be focusable even when it has been disabled.
#[prop(optional, into)] disabled_focusable: MaybeSignal<bool>, #[prop(optional, into)]
disabled_focusable: MaybeSignal<bool>,
#[prop(optional, into)] on_click: Option<BoxOneCallback<ev::MouseEvent>>, #[prop(optional, into)] on_click: Option<BoxOneCallback<ev::MouseEvent>>,
#[prop(optional)] children: Option<Children>, #[prop(optional)] children: Option<Children>,
) -> impl IntoView { ) -> impl IntoView {