💄 Define context styles for base components

src/base/component.rs

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

src/base/component/button.rs

@@ -17,7 +17,7 @@ pub struct Button {
     weight     : Weight,
     renderable : Renderable,
     classes    : OptionClasses,
-    style      : ButtonStyle,
+    style      : StyleBase,
     font_size  : FontSize,
     left_icon  : OptionComponent<Icon>,
     right_icon : OptionComponent<Icon>,
@@ -44,7 +44,14 @@ impl ComponentTrait for Button {
     }
 
     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]
@@ -64,7 +71,7 @@ impl ComponentTrait for Button {
                 target=[target]
             {
                 (self.left_icon().render(cx))
-                " " span { (self.html().escaped(cx.langid())) } " "
+                span { (self.html().escaped(cx.langid())) }
                 (self.right_icon().render(cx))
             }
         })
@@ -97,7 +104,7 @@ impl Button {
     }
 
     #[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
     }
@@ -140,7 +147,7 @@ impl Button {
 
     // Button GETTERS.
 
-    pub fn style(&self) -> &ButtonStyle {
+    pub fn style(&self) -> &StyleBase {
         &self.style
     }
 

src/base/component/form/action_button.rs

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

src/base/package/welcome.rs

@@ -89,7 +89,7 @@ fn hello_world() -> Wrapper {
                         )
                         .add_component(
                             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_classes(ClassesOp::Add, "welcome-link")
                                 .with_font_size(FontSize::Medium),