split routes and components
This commit is contained in:
parent
44b90c184b
commit
4e5d0d6560
10 changed files with 64 additions and 54 deletions
|
@ -20,7 +20,7 @@ simple_logger = "4"
|
|||
tokio = { version = "1.25.0", optional = true }
|
||||
tower = { version = "0.4.13", optional = true }
|
||||
tower-http = { version = "0.4", features = ["fs"], optional = true }
|
||||
wasm-bindgen = "0.2.87"
|
||||
wasm-bindgen = "0.2.89"
|
||||
thiserror = "1.0.38"
|
||||
tracing = { version = "0.1.37", optional = true }
|
||||
http = "0.2.8"
|
||||
|
|
|
@ -1,7 +1,9 @@
|
|||
use crate::error_template::{AppError, ErrorTemplate};
|
||||
|
||||
use leptos::*;
|
||||
use leptos_meta::*;
|
||||
use leptos_router::*;
|
||||
use crate::routes::{blog::*, home::*,projects::*};
|
||||
|
||||
#[component]
|
||||
pub fn App(cx: Scope) -> impl IntoView {
|
||||
|
@ -10,13 +12,12 @@ pub fn App(cx: Scope) -> impl IntoView {
|
|||
|
||||
view! {
|
||||
cx,
|
||||
|
||||
// injects a stylesheet into the document <head>
|
||||
// id=leptos means cargo-leptos will hot-reload this stylesheet
|
||||
<Stylesheet id="leptos" href="/pkg/doordesk.css"/>
|
||||
|
||||
// sets the document title
|
||||
<Title text="DoorDesk"/>
|
||||
<Title text="doordesk"/>
|
||||
|
||||
// content for this welcome page
|
||||
<Router fallback=|cx| {
|
||||
|
@ -50,46 +51,10 @@ pub fn App(cx: Scope) -> impl IntoView {
|
|||
<Route path="/projects" view=|cx| view! { cx, <Projects /> }/>
|
||||
</Routes>
|
||||
</main>
|
||||
<p class="text-center hover:rotate-180 duration-200 w-8 m-auto"><a href="https://open.spotify.com/playlist/3JRNw9gpt1w5ptsw8uDeYc?si=8f7e4191113f41f9">":)"</a></p><br />
|
||||
<p class="text-center hover:rotate-180 duration-200 w-8 m-auto">
|
||||
<a href="https://open.spotify.com/playlist/3JRNw9gpt1w5ptsw8uDeYc?si=8f7e4191113f41f9">":)"</a>
|
||||
</p>
|
||||
<br />
|
||||
</Router>
|
||||
}
|
||||
}
|
||||
|
||||
/// Renders the home page of your application.
|
||||
#[component]
|
||||
fn Article(cx: Scope) -> impl IntoView {
|
||||
let (count, set_count) = create_signal(cx, 0);
|
||||
let on_click = move |_| set_count.update(|count| *count += 1);
|
||||
|
||||
view! { cx,
|
||||
<article class="bg-zinc-700 mx-auto p-7 my-5 w-11/12 max-w-screen-xl rounded-md shadow-1g bg-opacity-10">
|
||||
<h1 class="max-6-xs text-3xl text-orange-600 font-light capitalize">"ayo"</h1>
|
||||
<hr class="opacity-50" />
|
||||
<span class="opacity-50 text-xs pt-0 m-t pb-3.5">"today"</span>
|
||||
<div>
|
||||
<button on:click=on_click>"Click Me: " {count}</button>
|
||||
</div>
|
||||
</article>
|
||||
}
|
||||
}
|
||||
|
||||
#[component]
|
||||
fn Home(cx: Scope) -> impl IntoView {
|
||||
view! { cx,
|
||||
<Article />
|
||||
}
|
||||
}
|
||||
|
||||
#[component]
|
||||
fn Blog(cx: Scope) -> impl IntoView {
|
||||
view! { cx,
|
||||
<Article />
|
||||
}
|
||||
}
|
||||
|
||||
#[component]
|
||||
fn Projects(cx: Scope) -> impl IntoView {
|
||||
view! { cx,
|
||||
<Article />
|
||||
}
|
||||
}
|
||||
|
|
1
doordesk-rs/src/components.rs
Normal file
1
doordesk-rs/src/components.rs
Normal file
|
@ -0,0 +1 @@
|
|||
pub mod article;
|
19
doordesk-rs/src/components/article.rs
Normal file
19
doordesk-rs/src/components/article.rs
Normal file
|
@ -0,0 +1,19 @@
|
|||
use leptos::*;
|
||||
|
||||
#[component]
|
||||
pub fn Article(cx: Scope) -> impl IntoView {
|
||||
let (count, set_count) = create_signal(cx, 0);
|
||||
let on_click = move |_| set_count.update(|count| *count += 1);
|
||||
|
||||
view! { cx,
|
||||
<article class="bg-zinc-700 mx-auto p-7 my-5 w-11/12 max-w-screen-xl rounded-md shadow-1g bg-opacity-10">
|
||||
<h1 class="max-6-xs text-3xl text-orange-600 font-light capitalize">"ayo"</h1>
|
||||
<hr class="opacity-50" />
|
||||
<span class="opacity-50 text-xs pt-0 m-t pb-3.5">"today"</span>
|
||||
<div>
|
||||
<button on:click=on_click>"Click Me: " {count}</button>
|
||||
<p>I DID IT?</p>
|
||||
</div>
|
||||
</article>
|
||||
}
|
||||
}
|
|
@ -3,6 +3,9 @@ pub mod app;
|
|||
pub mod error_template;
|
||||
pub mod fileserv;
|
||||
|
||||
pub mod components;
|
||||
pub mod routes;
|
||||
|
||||
cfg_if! { if #[cfg(feature = "hydrate")] {
|
||||
use leptos::*;
|
||||
use wasm_bindgen::prelude::wasm_bindgen;
|
||||
|
|
3
doordesk-rs/src/routes.rs
Normal file
3
doordesk-rs/src/routes.rs
Normal file
|
@ -0,0 +1,3 @@
|
|||
pub mod home;
|
||||
pub mod blog;
|
||||
pub mod projects;
|
10
doordesk-rs/src/routes/blog.rs
Normal file
10
doordesk-rs/src/routes/blog.rs
Normal file
|
@ -0,0 +1,10 @@
|
|||
use crate::components::article::*;
|
||||
use leptos::*;
|
||||
|
||||
#[component]
|
||||
pub fn Blog(cx: Scope) -> impl IntoView {
|
||||
view! { cx,
|
||||
<Article />
|
||||
<p>blog</p>
|
||||
}
|
||||
}
|
|
@ -1,8 +1,10 @@
|
|||
use leptos::{component, view, IntoView, Scope};
|
||||
use leptos::*;
|
||||
use crate::components::article::*;
|
||||
|
||||
#[component]
|
||||
pub fn Home(cx: Scope) -> impl IntoView {
|
||||
view! { cx,
|
||||
<Article />
|
||||
<p>home</p>
|
||||
}
|
||||
}
|
||||
|
|
10
doordesk-rs/src/routes/projects.rs
Normal file
10
doordesk-rs/src/routes/projects.rs
Normal file
|
@ -0,0 +1,10 @@
|
|||
use leptos::*;
|
||||
use crate::components::article::*;
|
||||
|
||||
#[component]
|
||||
pub fn Projects(cx: Scope) -> impl IntoView {
|
||||
view! { cx,
|
||||
<Article />
|
||||
<p>projects</p>
|
||||
}
|
||||
}
|
|
@ -1,12 +1,9 @@
|
|||
/** @type {import('tailwindcss').Config} */
|
||||
module.exports = {
|
||||
content: {
|
||||
relative: true,
|
||||
files: ["*.html", "./src/**/*.rs"],
|
||||
},
|
||||
theme: {
|
||||
module.exports = {
|
||||
content: ["*.html", "./src/**/*.rs"],
|
||||
theme: {
|
||||
extend: {},
|
||||
},
|
||||
plugins: [],
|
||||
}
|
||||
},
|
||||
plugins: [],
|
||||
}
|
||||
|
Loading…
Add table
Reference in a new issue