feat: relative style paths & component crate example

examples/leptos-axum/src/main.rs

@@ -4,6 +4,7 @@
 async fn main() {
     use axum::Router;
     use leptos::prelude::*;
+    use leptos::logging::*;
     use leptos_axum::{generate_route_list, LeptosRoutes};
     use leptos_axum_sabry::shell::*;
 

examples/leptos-axum/src/routes/home.rs

@@ -45,6 +45,7 @@ pub fn Route() -> impl IntoView {
     let on_click = move |_| *count.write() += 1;
 
     view! {class = STYLE,
+        <leptos_components::Aside/> // lets use our component
         <section class=style::table>
             <h2>"Welcome to Leptos"</h2>
             <h2 class="">

examples/leptos-axum/src/shell.rs

@@ -4,6 +4,7 @@ use leptos_router::{
     components::{Route, Router, Routes},
     StaticSegment,
 };
+use sabry::styly;
 
 use crate::routes;
 
@@ -29,7 +30,7 @@ pub fn shell(options: LeptosOptions) -> impl IntoView {
 pub fn App() -> impl IntoView {
     provide_meta_context();
 
-    view! {
+    view! {class=APP,
         <Stylesheet id="leptos" href="/pkg/leptos-axum.css"/>
         <Title text="Welcome to Leptos"/>
         <Router>
@@ -41,3 +42,11 @@ pub fn App() -> impl IntoView {
         </Router>
     }
 }
+
+styly!(app:scss {"
+    @use 'theme';
+
+    main {
+        @include theme.surface(primary);
+    }
+"});