nutomic/ibis
1
0
Fork 0
mirror of https://github.com/Nutomic/ibis.git synced 2024-11-22 08:51:09 +00:00
Code Projects Releases Packages Activity

wip

Browse source
This commit is contained in:
Felix Ableitner 2024-10-16 15:20:53 +02:00
parent a7b95d459b
commit 8033a00b4e
4 changed files with 17 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/frontend/components/article_nav.rs
View file

@ -31,8 +31,8 @@ pub fn ArticleNav(article: Resource<Option<String>, ArticleView>) -> impl IntoVi
let article_link_ = article_link.clone(); let article_link_ = article_link.clone();
let protected = article_.article.protected; let protected = article_.article.protected;
view! { view! {
<div role="tablist" class="tabs tabs-bordered"> <div role="tablist" class="tabs tabs-lifted">
<A class="tab" href=article_link.clone()>"Read"</A> <A class="tab tab-active" href=article_link.clone()>"Read"</A>
<A class="tab" href=format!("{article_link}/history")>"History"</A> <A class="tab" href=format!("{article_link}/history")>"History"</A>
<Show when=move || { <Show when=move || {
global_state global_state

18
src/frontend/components/nav.rs
View file

@ -22,7 +22,7 @@ pub fn Nav() -> impl IntoView {
let (search_query, set_search_query) = create_signal(String::new()); let (search_query, set_search_query) = create_signal(String::new());
view! { view! {
<nav class="menu menu-vertical" style="min-width: 250px;"> <nav class="menu lg:menu-vertical lg:w-40">
<li> <li>
<A href="/">"Main Page"</A> <A href="/">"Main Page"</A>
</li> </li>
@ -38,7 +38,9 @@ pub fn Nav() -> impl IntoView {
</li> </li>
</Show> </Show>
<li> <li>
<form on:submit=move |ev| { <form
class="form-control m-0 p-1"
on:submit=move |ev| {
ev.prevent_default(); ev.prevent_default();
let navigate = leptos_router::use_navigate(); let navigate = leptos_router::use_navigate();
let query = search_query.get(); let query = search_query.get();
@ -48,7 +50,7 @@ pub fn Nav() -> impl IntoView {
}> }>
<input <input
type="text" type="text"
class="input" class="input input-secondary input-bordered input-xs w-full rounded"
placeholder="Search" placeholder="Search"
prop:value=search_query prop:value=search_query
on:keyup=move |ev: ev::KeyboardEvent| { on:keyup=move |ev: ev::KeyboardEvent| {
@ -57,9 +59,10 @@ pub fn Nav() -> impl IntoView {
} }
/> />
<button class="btn btn-primary">Go</button> <button class="btn btn-xs btn-secondary">Go</button>
</form> </form>
</li> </li>
<div class="divider"></div>
<Show <Show
when=move || global_state.with(|state| state.my_profile.is_some()) when=move || global_state.with(|state| state.my_profile.is_some())
fallback=move || { fallback=move || {
@ -80,16 +83,15 @@ pub fn Nav() -> impl IntoView {
let my_profile = global_state.with(|state| state.my_profile.clone().unwrap()); let my_profile = global_state.with(|state| state.my_profile.clone().unwrap());
let profile_link = format!("/user/{}", my_profile.person.username); let profile_link = format!("/user/{}", my_profile.person.username);
view! { view! {
<p> <p class="self-center pb-2">
"Logged in as " "Logged in as "
<a <a class="link"
href=profile_link href=profile_link
style="border: none; padding: 0; color: var(--accent) !important;"
> >
{my_profile.person.username} {my_profile.person.username}
</a> </a>
</p> </p>
<button on:click=move |_| logout_action.dispatch(())>Logout</button> <button class="btn" on:click=move |_| logout_action.dispatch(())>Logout</button>
} }
} }

5
src/main.rs
View file

@ -30,7 +30,10 @@ fn main() {
mount_to_body(|| { mount_to_body(|| {
view! { <App /> } view! { <App /> }
}); });
// set theme
// https://daisyui.com/docs/themes/
let document = web_sys::window().unwrap().document().unwrap(); let document = web_sys::window().unwrap().document().unwrap();
let html_element = document.document_element().unwrap(); let html_element = document.document_element().unwrap();
html_element.set_attribute("data-theme", "cupcake").unwrap(); html_element.set_attribute("data-theme", "emerald").unwrap();
} }

2
tailwind.config.js
View file

@ -12,7 +12,7 @@ module.exports = {
require('@tailwindcss/typography') require('@tailwindcss/typography')
], ],
daisyui: { daisyui: {
themes: ["cupcake"], themes: ["emerald"],
}, },
darkMode: 'class' darkMode: 'class'
} }