adam/thaw
1
0
Fork 0
mirror of https://github.com/adoyle0/thaw.git synced 2025-01-23 06:19:22 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: ButtonVariant Solid is changed to Outlined

Browse source
This commit is contained in:
luoxiao 2024-01-29 16:18:01 +08:00 • committed by luoxiaozero
parent cd3a27c1b8
commit b44ba4f143
7 changed files with 25 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
demo_markdown/docs/button/mod.md
View file

@ -4,7 +4,7 @@
view! {
<Space>
<Button variant=ButtonVariant::Primary>"Primary"</Button>
<Button variant=ButtonVariant::Solid>"Solid"</Button>
<Button variant=ButtonVariant::Outlined>"Outlined"</Button>
<Button variant=ButtonVariant::Text>"Text"</Button>
<Button variant=ButtonVariant::Link>"Link"</Button>
</Space>
@ -80,8 +80,8 @@ view! {
<Button variant=ButtonVariant::Primary disabled=true>
"Primary"
</Button>
<Button variant=ButtonVariant::Solid disabled=true>
"Solid"
<Button variant=ButtonVariant::Outlined disabled=true>
"Outlined"
</Button>
<Button variant=ButtonVariant::Text disabled=true>
"Text"
@ -112,14 +112,14 @@ view! {
view! {
<Space>
<ButtonGroup>
<Button variant=ButtonVariant::Solid>"Solid"</Button>
<Button variant=ButtonVariant::Solid>"Solid"</Button>
<Button variant=ButtonVariant::Solid>"Solid"</Button>
<Button variant=ButtonVariant::Outlined>"Outlined"</Button>
<Button variant=ButtonVariant::Outlined>"Outlined"</Button>
<Button variant=ButtonVariant::Outlined>"Outlined"</Button>
</ButtonGroup>
<ButtonGroup vertical=true>
<Button variant=ButtonVariant::Solid>"Solid"</Button>
<Button variant=ButtonVariant::Solid>"Solid"</Button>
<Button variant=ButtonVariant::Solid>"Solid"</Button>
<Button variant=ButtonVariant::Outlined>"Outlined"</Button>
<Button variant=ButtonVariant::Outlined>"Outlined"</Button>
<Button variant=ButtonVariant::Outlined>"Outlined"</Button>
</ButtonGroup>
</Space>
}

6
thaw/src/button/button.css
View file

@ -13,7 +13,7 @@
user-select: none;
}
.thaw-button:hover:not(.thaw-button--disabled, .thaw-button--solid) {
.thaw-button:hover:not(.thaw-button--disabled, .thaw-button--outlined) {
border-color: var(--thaw-border-color-hover);
background-color: var(--thaw-background-color-hover);
cursor: pointer;
@ -37,13 +37,13 @@
background-color: var(--thaw-background-color-active);
}
.thaw-button--solid {
.thaw-button--outlined {
background-color: transparent;
color: inherit;
transition: all 0.3s;
}
.thaw-button--solid:hover:not(.thaw-button--disabled) {
.thaw-button--outlined:hover:not(.thaw-button--disabled) {
cursor: pointer;
color: var(--thaw-font-color-hover);
border-color: var(--thaw-border-color-hover);

10
thaw/src/button/mod.rs
View file

@ -15,7 +15,7 @@ pub use theme::ButtonTheme;
pub enum ButtonVariant {
#[default]
Primary,
Solid,
Outlined,
Text,
Link,
}
@ -155,11 +155,11 @@ pub fn Button(
theme.button.color_border_disabled
));
}
ButtonVariant::Solid => {
ButtonVariant::Outlined => {
css_vars.push_str(&format!("--thaw-font-color-hover: {bg_color};"));
css_vars.push_str(&format!(
"--thaw-border-color: {};",
theme.button.border_color_solid
theme.button.border_color_outlined
));
css_vars.push_str(&format!("--thaw-border-color-hover: {bg_color};"));
css_vars.push_str(&format!("--thaw-ripple-color: {bg_color};"));
@ -223,8 +223,8 @@ pub fn Button(
view! {
<button
class=class_list![
"thaw-button", ("thaw-button--solid", move || variant.get() ==
ButtonVariant::Solid), ("thaw-button--text", move || variant.get() ==
"thaw-button", ("thaw-button--outlined", move || variant.get() ==
ButtonVariant::Outlined), ("thaw-button--text", move || variant.get() ==
ButtonVariant::Text), ("thaw-button--link", move || variant.get() ==
ButtonVariant::Link), ("thaw-button--round", move || round.get()),
("thaw-button--circle", move || circle.get()), ("thaw-button--disabled", move ||

6
thaw/src/button/theme.rs
View file

@ -7,7 +7,7 @@ pub struct ButtonTheme {
pub padding_medium: String,
pub padding_large: String,
pub border_color_solid: String,
pub border_color_outlined: String,
pub color_text_hover: String,
pub color_text_active: String,
pub color_text_disabled: String,
@ -23,7 +23,7 @@ impl ThemeMethod for ButtonTheme {
padding_medium: "0 14px".into(),
padding_large: "0 18px".into(),
border_color_solid: "#e0e0e6".into(),
border_color_outlined: "#e0e0e6".into(),
color_text_hover: "#f1f3f5".into(),
color_text_active: "#eceef0".into(),
color_text_disabled: "#00000040".into(),
@ -39,7 +39,7 @@ impl ThemeMethod for ButtonTheme {
padding_medium: "0 14px".into(),
padding_large: "0 18px".into(),
border_color_solid: "#ffffff3d".into(),
border_color_outlined: "#ffffff3d".into(),
color_text_hover: "#ffffff1a".into(),
color_text_active: "#ffffff26".into(),
color_text_disabled: "#4c5155".into(),

6
thaw/src/calendar/mod.rs
View file

@ -135,15 +135,15 @@ pub fn Calendar(
<span>
<ButtonGroup>
<Button
variant=ButtonVariant::Solid
variant=ButtonVariant::Outlined
icon=icondata::AiLeftOutlined
on_click=previous_month
/>
<Button variant=ButtonVariant::Solid on_click=today>
<Button variant=ButtonVariant::Outlined on_click=today>
"Today"
</Button>
<Button
variant=ButtonVariant::Solid
variant=ButtonVariant::Outlined
icon=icondata::AiRightOutlined
on_click=next_month
/>

2
thaw/src/date_picker/panel/date_panel.rs
View file

@ -159,7 +159,7 @@ pub fn DatePanel(
</div>
</div>
<div class="thaw-date-picker-date-panel__footer">
<Button variant=ButtonVariant::Solid size=ButtonSize::Tiny on_click=now>
<Button variant=ButtonVariant::Outlined size=ButtonSize::Tiny on_click=now>
"Now"
</Button>
</div>

2
thaw/src/time_picker/mod.rs
View file

@ -257,7 +257,7 @@ fn Panel(
</div>
</div>
<div class="thaw-time-picker-panel__footer">
<Button variant=ButtonVariant::Solid size=ButtonSize::Tiny on_click=now>
<Button variant=ButtonVariant::Outlined size=ButtonSize::Tiny on_click=now>
"Now"
</Button>
<Button size=ButtonSize::Tiny on_click=ok>