💄 Define context styles for base components

This commit is contained in:
Manuel Cillero 2024-03-03 20:23:58 +01:00
parent e2090b2c81
commit c54390d3d9
5 changed files with 303 additions and 289 deletions

View file

@ -49,7 +49,7 @@ pub(crate) fn add_base_assets(cx: &mut Context) {
)) ))
.alter(ContextOp::AddStyleSheet( .alter(ContextOp::AddStyleSheet(
StyleSheet::at("/base/css/buttons.css") StyleSheet::at("/base/css/buttons.css")
.with_version("0.0.1") .with_version("0.0.2")
.with_weight(weight), .with_weight(weight),
)); ));
} }
@ -89,30 +89,30 @@ impl ToString for BreakPoint {
// ************************************************************************************************* // *************************************************************************************************
#[derive(AutoDefault)] #[derive(AutoDefault)]
pub enum ButtonStyle { pub enum StyleBase {
#[default] #[default]
Default, Default,
Info,
Success, Success,
Warning,
Danger, Danger,
Warning,
Info,
Light, Light,
Dark, Dark,
Link, Link,
} }
#[rustfmt::skip] #[rustfmt::skip]
impl ToString for ButtonStyle { impl ToString for StyleBase {
fn to_string(&self) -> String { fn to_string(&self) -> String {
String::from(match self { String::from(match self {
ButtonStyle::Default => "button__default", StyleBase::Default => "style__default",
ButtonStyle::Info => "button__info", StyleBase::Success => "style__success",
ButtonStyle::Success => "button__success", StyleBase::Danger => "style__danger",
ButtonStyle::Warning => "button__warning", StyleBase::Warning => "style__warning",
ButtonStyle::Danger => "button__danger", StyleBase::Info => "style__info",
ButtonStyle::Light => "button__light", StyleBase::Light => "style__light",
ButtonStyle::Dark => "button__dark", StyleBase::Dark => "style__dark",
ButtonStyle::Link => "button__link", StyleBase::Link => "style__link",
}) })
} }
} }

View file

@ -17,7 +17,7 @@ pub struct Button {
weight : Weight, weight : Weight,
renderable : Renderable, renderable : Renderable,
classes : OptionClasses, classes : OptionClasses,
style : ButtonStyle, style : StyleBase,
font_size : FontSize, font_size : FontSize,
left_icon : OptionComponent<Icon>, left_icon : OptionComponent<Icon>,
right_icon : OptionComponent<Icon>, right_icon : OptionComponent<Icon>,
@ -44,7 +44,14 @@ impl ComponentTrait for Button {
} }
fn setup_before_prepare(&mut self, _cx: &mut Context) { fn setup_before_prepare(&mut self, _cx: &mut Context) {
self.prepend_classes([self.style().to_string(), self.font_size().to_string()].join(" ")); self.prepend_classes(
[
"button__tap".to_string(),
self.style().to_string(),
self.font_size().to_string(),
]
.join(" "),
);
} }
#[rustfmt::skip] #[rustfmt::skip]
@ -64,7 +71,7 @@ impl ComponentTrait for Button {
target=[target] target=[target]
{ {
(self.left_icon().render(cx)) (self.left_icon().render(cx))
" " span { (self.html().escaped(cx.langid())) } " " span { (self.html().escaped(cx.langid())) }
(self.right_icon().render(cx)) (self.right_icon().render(cx))
} }
}) })
@ -97,7 +104,7 @@ impl Button {
} }
#[fn_builder] #[fn_builder]
pub fn alter_style(&mut self, style: ButtonStyle) -> &mut Self { pub fn alter_style(&mut self, style: StyleBase) -> &mut Self {
self.style = style; self.style = style;
self self
} }
@ -140,7 +147,7 @@ impl Button {
// Button GETTERS. // Button GETTERS.
pub fn style(&self) -> &ButtonStyle { pub fn style(&self) -> &StyleBase {
&self.style &self.style
} }

View file

@ -24,7 +24,7 @@ pub struct ActionButton {
renderable : Renderable, renderable : Renderable,
classes : OptionClasses, classes : OptionClasses,
button_type: ActionButtonType, button_type: ActionButtonType,
style : ButtonStyle, style : StyleBase,
font_size : FontSize, font_size : FontSize,
left_icon : OptionComponent<Icon>, left_icon : OptionComponent<Icon>,
right_icon : OptionComponent<Icon>, right_icon : OptionComponent<Icon>,
@ -48,7 +48,14 @@ impl ComponentTrait for ActionButton {
} }
fn setup_before_prepare(&mut self, _cx: &mut Context) { fn setup_before_prepare(&mut self, _cx: &mut Context) {
self.prepend_classes([self.style().to_string(), self.font_size().to_string()].join(" ")); self.prepend_classes(
[
"button__tap".to_string(),
self.style().to_string(),
self.font_size().to_string(),
]
.join(" "),
);
} }
fn prepare_component(&self, cx: &mut Context) -> PrepareMarkup { fn prepare_component(&self, cx: &mut Context) -> PrepareMarkup {
@ -64,7 +71,7 @@ impl ComponentTrait for ActionButton {
disabled=[self.disabled().get()] disabled=[self.disabled().get()]
{ {
(self.left_icon().render(cx)) (self.left_icon().render(cx))
" " (self.value().escaped(cx.langid())) " " span { (self.value().escaped(cx.langid())) }
(self.right_icon().render(cx)) (self.right_icon().render(cx))
} }
}) })
@ -75,7 +82,7 @@ impl ActionButton {
pub fn submit() -> Self { pub fn submit() -> Self {
ActionButton { ActionButton {
button_type: ActionButtonType::Submit, button_type: ActionButtonType::Submit,
style: ButtonStyle::Default, style: StyleBase::Default,
value: OptionTranslated::new(L10n::l("button_submit")), value: OptionTranslated::new(L10n::l("button_submit")),
..Default::default() ..Default::default()
} }
@ -84,7 +91,7 @@ impl ActionButton {
pub fn reset() -> Self { pub fn reset() -> Self {
ActionButton { ActionButton {
button_type: ActionButtonType::Reset, button_type: ActionButtonType::Reset,
style: ButtonStyle::Info, style: StyleBase::Info,
value: OptionTranslated::new(L10n::l("button_reset")), value: OptionTranslated::new(L10n::l("button_reset")),
..Default::default() ..Default::default()
} }
@ -105,7 +112,7 @@ impl ActionButton {
} }
#[fn_builder] #[fn_builder]
pub fn alter_style(&mut self, style: ButtonStyle) -> &mut Self { pub fn alter_style(&mut self, style: StyleBase) -> &mut Self {
self.style = style; self.style = style;
self self
} }
@ -164,7 +171,7 @@ impl ActionButton {
&self.button_type &self.button_type
} }
pub fn style(&self) -> &ButtonStyle { pub fn style(&self) -> &StyleBase {
&self.style &self.style
} }

View file

@ -89,7 +89,7 @@ fn hello_world() -> Wrapper {
) )
.add_component( .add_component(
Button::anchor("#welcome-page", L10n::l("welcome")) Button::anchor("#welcome-page", L10n::l("welcome"))
.with_style(ButtonStyle::Link) .with_style(StyleBase::Link)
.with_left_icon(Some(Icon::with("arrow-down-circle-fill"))) .with_left_icon(Some(Icon::with("arrow-down-circle-fill")))
.with_classes(ClassesOp::Add, "welcome-link") .with_classes(ClassesOp::Add, "welcome-link")
.with_font_size(FontSize::Medium), .with_font_size(FontSize::Medium),

File diff suppressed because it is too large Load diff