fix(docs): a few issues

README.md

@@ -1,8 +1,8 @@
-## Oxytail
+# Oxytail
 
 INSERT_DEMO_IMG_HERE
 
-Ready to use native components for [Floem](https://github.com/lapce/floem), inspired by [daisyUI](https://daisyui.com/components/button/).
+Ready to use native widgets for [Floem](https://github.com/lapce/floem), inspired by [daisyUI](https://daisyui.com/components/button/).
 
 Features:
  - Cross-system support
@@ -11,29 +11,68 @@ Features:
 
 ## Installation
 
-`oxytail`  consists of the main "loader" package(`oxytail-loader`), which, well, loads the plugin you want.
+`oxytail` consists of the main "base" package(`oxytail-base`), which, loads the theme you want.
 
 Next, you need to choose your theme, and install it. Currently, `oxytail` comes with only one theme, `oxytail-theme-dark`, but if it doesn't suit your needs you can [write your own one](YOUR_OWN_THEME.md).
 
+First, add floem(floem is not on crates.io just yet, so we need to add it as a git dependency)
+
+```sh
+cargo add --git 'https://github.com/lapce/floem' floem
 ```
-cargo add floem oxytail-loader oxytail-theme-dark
+
+Next,  add `oxytail-base`(to load a theme) and `oxytail-theme-dark`(a theme) also as a git dependency, since we rely on `floem`, which is not published.
+
+```sh
+cargo add --git 'https://github.com/golota60/oxytail/tree/main/oxytail-base' oxytail-base
+cargo add --git 'https://github.com/golota60/oxytail/tree/main/oxytail-theme-dark' oxytail-theme-dark
 ```
 
-Next, simply use `floem` like normal, except with a few quirk regarding initializaiton.
+Done! Now, initialize the theme, and simply use `floem` like normal, *except* import your widgets from `oxytail-base`!
 
 ```rs
+use floem::reactive::create_signal;
+use floem::view::View;
+use floem::views::{h_stack, label, v_stack, Decorators};
+use oxytail_base::{
+    init_theme,
+    widgets::button::button,
+};
+
+fn app_view() -> impl View {
+    // Create a reactive signal with a counter value, defaulting to 0
+    let (counter, set_counter) = create_signal(0);
+
+    // Create a vertical layout
+    v_stack((
+        // The counter value updates automatically, thanks to reactivity
+        label(move || format!("Value: {}", counter.get())),
+        // Create a horizontal layout
+        h_stack((
+            button(|| "Increment").on_click_stop(move |_| {
+                set_counter.update(|value| *value += 1);
+            }),
+            button(|| "Decrement").on_click_stop(move |_| {
+                set_counter.update(|value| *value -= 1);
+            }),
+        )),
+    ))
+}
+
+
 fn main() {
     let window_config = WindowConfig::default()
         .size(Size {
             width: 1200.0,
             height: 500.0,
         })
-        // 1. We don't want any default `floem` styling to be interfering with ours, so we need to disable the default styling.
+        // 1. We don't want any default `floem` styling to be interfering with ours,
+        // so we need to disable the default styling.
         .themed(false);
 
-    // 2. We need to initialize our them
+    // 2. We need to initialize our theme
     init_theme(Theme::Dark);
-    // That's all!
+    // That's all! Now import some widgets from `oxytail_base` and you're using oxytail!
 
     let root_view = app_view();
     let root_view = root_view.style(|s| {
@@ -50,21 +89,24 @@ fn main() {
 
 ```
 
+## Examples
+
+The best showcase is `examples/widget-gallery` package. Run it with `cargo run -p widget-gallery`.
 
 ## Contributing
 
 If you notice any bugs, missing features or nice-to-haves, don't hesistate to open an issue.
 
 If you want to submit a custom theme(or just link your own in this README for other people to know) to be a part of this library, also don't hesitate and simply create a new package in the workspace(see `oxytail-theme-dark` folder for guidance).[writing your own theme](YOUR_OWN_THEME.md)
 
-If you need some components which currently don't exist, please consider submitting them to the upstream `floem` library first.
+If you need some widgets which currently don't exist, please consider submitting them to the upstream `floem` library first.
 
 If you think some of the docs are unclear, also feel free to create an issue!
 
 ## Notes
 
 The idea for this project came from my slight frustration when developing this [tauri-based desk manager app](https://github.com/golota60/trayasen). While for that project tauri is an awesome pick, I was looking for a native solution, i.e. not using system WebView. I've chosen `floem` as a base, because of their really friendly and extensible styling.
 
-I'm only aware of one other component library for floem, and it's [floem-ui-kit](https://github.com/pieterdd/floem-ui-kit). I really like the simplicity of it, but I wanted something more customizable.
+I'm only aware of one other widget library for floem, and it's [floem-ui-kit](https://github.com/pieterdd/floem-ui-kit). I really like the simplicity of it, but I wanted something more customizable.
 
 

oxytail-base/src/widgets/button.rs

@@ -42,15 +42,15 @@ pub fn button<S: Display + 'static>(
     label: impl Fn() -> S + 'static,
     props: Option<ButtonProps>,
 ) -> impl View {
-    let base_component = upstreambutton(label);
+    let base_widget = upstreambutton(label);
     let theme = GLOBAL_THEME.get().unwrap();
 
     let props = props.unwrap_or(ButtonProps::default());
 
     let styles_enhancer = theme.get_button_style(props);
     let enhanced_style = styles_enhancer(Style::new());
 
-    let styled_button = base_component.style(move |_| enhanced_style.clone());
+    let styled_button = base_widget.style(move |_| enhanced_style.clone());
 
     styled_button
 }

oxytail-theme-dark/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "oxytail-theme-dark"
-description = "Dark theme for oxytail-loader"
+description = "Dark theme for oxytail-base"
 license = "MIT"
 version = "0.1.0"
 edition = "2021"