1
0
Fork 0
mirror of https://github.com/Nutomic/ibis.git synced 2025-01-18 18:05:48 +00:00

Format tailwind classes

This commit is contained in:
Felix Ableitner 2024-12-05 11:30:47 +01:00
parent f78f2df94a
commit 0c3b5ca65a
16 changed files with 49 additions and 46 deletions

View file

@ -1,2 +1,5 @@
max_width = 100 max_width = 100
attr_value_brace_style = "WhenRequired" # "Always", "AlwaysUnlessLit", "WhenRequired" or "Preserve" attr_value_brace_style = "WhenRequired" # "Always", "AlwaysUnlessLit", "WhenRequired" or "Preserve"
[attr_values]
class = "Tailwind"

View file

@ -66,7 +66,7 @@ impl<T: Default + Send + Sync + Clone> DefaultResource<T> for Resource<T> {
} }
pub fn shell(options: LeptosOptions) -> impl IntoView { pub fn shell(options: LeptosOptions) -> impl IntoView {
view! { view! {
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />

View file

@ -86,7 +86,7 @@ pub fn ArticleNav(article: Resource<ArticleView>, active_tab: ActiveTab) -> impl
</Suspense> </Suspense>
</div> </div>
<div class="flex flex-row"> <div class="flex flex-row">
<h1 class="text-4xl font-bold font-serif my-6 grow flex-auto"> <h1 class="flex-auto my-6 font-serif text-4xl font-bold grow">
{title} {title}
</h1> </h1>
<Show when=move || protected> <Show when=move || protected>

View file

@ -26,7 +26,7 @@ where
view! { view! {
<div class="flex justify-center h-screen"> <div class="flex justify-center h-screen">
<button <button
class="btn btn-primary place-self-center" class="place-self-center btn btn-primary"
on:click=move |_| { on:click=move |_| {
connect_ibis_wiki.dispatch(()); connect_ibis_wiki.dispatch(());
} }

View file

@ -19,7 +19,7 @@ pub fn CredentialsForm(
view! { view! {
<form class="form-control max-w-80" on:submit=|ev| ev.prevent_default()> <form class="form-control max-w-80" on:submit=|ev| ev.prevent_default()>
<h1 class="text-4xl font-bold font-serif my-4 grow max-w-fit">{title}</h1> <h1 class="my-4 font-serif text-4xl font-bold grow max-w-fit">{title}</h1>
{move || { {move || {
error error
.get() .get()
@ -71,7 +71,7 @@ pub fn CredentialsForm(
<div> <div>
<button <button
class="btn btn-primary my-2" class="my-2 btn btn-primary"
prop:disabled=move || button_is_disabled.get() prop:disabled=move || button_is_disabled.get()
on:click=move |_| { on:click=move |_| {
dispatch_action(); dispatch_action();

View file

@ -40,9 +40,9 @@ pub fn EditList(edits: Vec<EditView>, for_article: bool) -> impl IntoView {
) )
}; };
view! { view! {
<li class="card card-compact bg-base-100 card-bordered m-2 rounded-s"> <li class="m-2 card card-compact bg-base-100 card-bordered rounded-s">
<div class="card-body"> <div class="card-body">
<a class="link link-primary text-lg w-full" href=path> <a class="w-full text-lg link link-primary" href=path>
{edit.edit.summary} {edit.edit.summary}
</a> </a>
<p>{second_line}</p> <p>{second_line}</p>

View file

@ -21,11 +21,11 @@ pub fn EditorView(
view! { view! {
<div> <div>
<div class="my-4 w-full flex max-sm:flex-col"> <div class="flex my-4 w-full max-sm:flex-col">
<textarea <textarea
prop:value=content prop:value=content
placeholder="Article text..." placeholder="Article text..."
class="grow textarea textarea-primary min-h-80 resize-none text-base text-base" class="text-base text-base resize-none grow textarea textarea-primary min-h-80"
on:input=move |evt| { on:input=move |evt| {
let val = event_target_value(&evt); let val = event_target_value(&evt);
set_preview.set(render_markdown(&val)); set_preview.set(render_markdown(&val));
@ -34,14 +34,14 @@ pub fn EditorView(
node_ref=textarea_ref node_ref=textarea_ref
></textarea> ></textarea>
<Show when=move || { show_preview.get() }> <Show when=move || { show_preview.get() }>
<div class="divider md:hidden"></div> <div class="md:hidden divider"></div>
<div <div
class="prose prose-slate basis-6/12 md:ms-4 text-base py-2 max-sm:px-2" class="py-2 text-base prose prose-slate basis-6/12 max-sm:px-2 md:ms-4"
inner_html=move || preview.get() inner_html=move || preview.get()
></div> ></div>
</Show> </Show>
</div> </div>
<div class="flex h-min items-center mb-4"> <div class="flex items-center mb-4 h-min">
<button <button
class="btn btn-secondary" class="btn btn-secondary"
on:click=move |_| { set_show_preview.update(|s| *s = !*s) } on:click=move |_| { set_show_preview.update(|s| *s = !*s) }

View file

@ -20,27 +20,27 @@ pub fn Nav() -> impl IntoView {
let (search_query, set_search_query) = signal(String::new()); let (search_query, set_search_query) = signal(String::new());
let mut dark_mode = expect_context::<DarkMode>(); let mut dark_mode = expect_context::<DarkMode>();
view! { view! {
<nav class="max-sm:navbar p-2.5 h-full md:fixed md:w-64 max-sm: border-b md:border-e border-slate-400 border-solid"> <nav class="p-2.5 h-full border-b border-solid md:fixed md:w-64 max-sm:navbar max-sm: border-slate-400 md:border-e">
<div <div
id="navbar-start" id="navbar-start"
class="max-sm:navbar-start max-sm:flex max-sm:dropdown max-sm:dropdown-bottom max-sm:dropdown-end max-sm:w-full md:h-full" class="md:h-full max-sm:navbar-start max-sm:flex max-sm:dropdown max-sm:dropdown-bottom max-sm:dropdown-end max-sm:w-full"
> >
<h1 class="w-min md:hidden text-3xl font-bold font-serif"> <h1 class="w-min font-serif text-3xl font-bold md:hidden">
{CLIENT.hostname.clone()} {CLIENT.hostname.clone()}
</h1> </h1>
<div class="flex-grow md:hidden"></div> <div class="flex-grow md:hidden"></div>
<button tabindex="0" class="btn btn-outline lg:hidden"> <button tabindex="0" class="lg:hidden btn btn-outline">
Menu Menu
</button> </button>
<div <div
tabindex="0" tabindex="0"
class="menu dropdown-content p-2 max-sm:rounded-box max-sm:z-[1] max-sm:shadow md:h-full" class="p-2 md:h-full menu dropdown-content max-sm:rounded-box max-sm:z-[1] max-sm:shadow"
> >
<Transition> <Transition>
<a href="/"> <a href="/">
<img src="/logo.png" class="m-auto max-sm:hidden" /> <img src="/logo.png" class="m-auto max-sm:hidden" />
</a> </a>
<h1 class="px-4 py-2 text-3xl font-bold font-serif sm:hidden"> <h1 class="py-2 px-4 font-serif text-3xl font-bold sm:hidden">
{CLIENT.hostname.clone()} {CLIENT.hostname.clone()}
</h1> </h1>
<ul> <ul>
@ -68,7 +68,7 @@ pub fn Nav() -> impl IntoView {
</Show> </Show>
<li> <li>
<form <form
class="form-control m-0 p-1" class="p-1 m-0 form-control"
on:submit=move |ev| { on:submit=move |ev| {
ev.prevent_default(); ev.prevent_default();
let navigate = use_navigate(); let navigate = use_navigate();
@ -83,7 +83,7 @@ pub fn Nav() -> impl IntoView {
> >
<input <input
type="text" type="text"
class="input input-secondary input-bordered input-xs w-full rounded" class="w-full rounded input input-secondary input-bordered input-xs"
placeholder="Search" placeholder="Search"
prop:value=search_query prop:value=search_query
on:keyup=move |ev: ev::KeyboardEvent| { on:keyup=move |ev: ev::KeyboardEvent| {
@ -126,7 +126,7 @@ pub fn Nav() -> impl IntoView {
</a> </a>
</p> </p>
<button <button
class="btn btn-outline btn-xs w-min self-center" class="self-center w-min btn btn-outline btn-xs"
on:click=move |_| { on:click=move |_| {
logout_action.dispatch(()); logout_action.dispatch(());
} }
@ -138,8 +138,8 @@ pub fn Nav() -> impl IntoView {
</Show> </Show>
<div class="grow min-h-2"></div> <div class="grow min-h-2"></div>
<div class="m-1 grid gap-2"> <div class="grid gap-2 m-1">
<label class="flex cursor-pointer gap-2"> <label class="flex gap-2 cursor-pointer">
<span class="label-text">Light</span> <span class="label-text">Light</span>
<input <input
type="checkbox" type="checkbox"

View file

@ -56,10 +56,10 @@ pub fn CreateArticle() -> impl IntoView {
}); });
view! { view! {
<h1 class="text-4xl font-bold font-serif my-4">Create new Article</h1> <h1 class="my-4 font-serif text-4xl font-bold">Create new Article</h1>
<Suspense> <Suspense>
<Show when=move || show_approval_message.get()> <Show when=move || show_approval_message.get()>
<div class="alert alert-warning mb-4"> <div class="mb-4 alert alert-warning">
New articles require admin approval before being published New articles require admin approval before being published
</div> </div>
</Show> </Show>
@ -70,7 +70,7 @@ pub fn CreateArticle() -> impl IntoView {
view! { view! {
<div class="item-view"> <div class="item-view">
<input <input
class="input input-primary w-full" class="w-full input input-primary"
type="text" type="text"
required required
placeholder="Title" placeholder="Title"
@ -93,7 +93,7 @@ pub fn CreateArticle() -> impl IntoView {
<div class="flex flex-row"> <div class="flex flex-row">
<input <input
class="input input-primary grow mr-4" class="mr-4 input input-primary grow"
type="text" type="text"
placeholder="Edit summary" placeholder="Edit summary"
on:keyup=move |ev| { on:keyup=move |ev| {

View file

@ -48,7 +48,7 @@ pub fn ListArticles() -> impl IntoView {
); );
view! { view! {
<h1 class="text-4xl font-bold font-serif my-4">Most recently edited Articles</h1> <h1 class="my-4 font-serif text-4xl font-bold">Most recently edited Articles</h1>
<Suspense fallback=|| view! { "Loading..." }> <Suspense fallback=|| view! { "Loading..." }>
<div class="divide-x"> <div class="divide-x">
<input <input
@ -74,7 +74,7 @@ pub fn ListArticles() -> impl IntoView {
} }
fallback=move || view! { <ConnectView res=articles /> } fallback=move || view! { <ConnectView res=articles /> }
> >
<ul class="list-none my-4"> <ul class="my-4 list-none">
<For <For
each=move || articles.get_default().unwrap_or_default() each=move || articles.get_default().unwrap_or_default()
key=|article| article.id key=|article| article.id
@ -83,7 +83,7 @@ pub fn ListArticles() -> impl IntoView {
{ {
view! { view! {
<li> <li>
<a class="link text-lg" href=article_path(&article)> <a class="text-lg link" href=article_path(&article)>
{article_title(&article)} {article_title(&article)}
</a> </a>
</li> </li>

View file

@ -28,9 +28,9 @@ pub fn EditDiff() -> impl IntoView {
render_date_time(edit.edit.published), render_date_time(edit.edit.published),
); );
view! { view! {
<h2 class="text-xl font-bold font-serif my-2">{label}</h2> <h2 class="my-2 font-serif text-xl font-bold">{label}</h2>
<p>"by " {user_link(&edit.creator)}</p> <p>"by " {user_link(&edit.creator)}</p>
<div class="bg-gray-200 p-2 rounded my-2"> <div class="p-2 my-2 bg-gray-200 rounded">
<pre class="text-wrap"> <pre class="text-wrap">
<code>{edit.edit.diff.clone()}</code> <code>{edit.edit.diff.clone()}</code>
</pre> </pre>

View file

@ -44,7 +44,7 @@ pub fn InstanceDetails() -> impl IntoView {
view! { view! {
<div class="grid gap-3 mt-4"> <div class="grid gap-3 mt-4">
<div class="flex flex-row items-center"> <div class="flex flex-row items-center">
<h1 class="text-4xl font-bold font-serif w-full"> <h1 class="w-full font-serif text-4xl font-bold">
{instance.domain} {instance.domain}
</h1> </h1>
<InstanceFollowButton instance=instance_.clone() /> <InstanceFollowButton instance=instance_.clone() />
@ -52,7 +52,7 @@ pub fn InstanceDetails() -> impl IntoView {
<div class="divider"></div> <div class="divider"></div>
<div>{instance.description}</div> <div>{instance.description}</div>
<h2 class="text-xl font-bold font-serif">Articles</h2> <h2 class="font-serif text-xl font-bold">Articles</h2>
<ul class="list-none"> <ul class="list-none">
{move || { {move || {
articles articles
@ -62,7 +62,7 @@ pub fn InstanceDetails() -> impl IntoView {
.map(|a| { .map(|a| {
view! { view! {
<li> <li>
<a class="link text-lg" href=article_path(&a)> <a class="text-lg link" href=article_path(&a)>
{article_title(&a)} {article_title(&a)}
</a> </a>
</li> </li>

View file

@ -9,13 +9,13 @@ pub fn ListInstances() -> impl IntoView {
); );
view! { view! {
<h1 class="text-4xl font-bold font-serif my-4">Instances</h1> <h1 class="my-4 font-serif text-4xl font-bold">Instances</h1>
<Suspense fallback=|| view! { "Loading..." }> <Suspense fallback=|| view! { "Loading..." }>
<Show <Show
when=move || { !instances.get().unwrap_or_default().is_empty() } when=move || { !instances.get().unwrap_or_default().is_empty() }
fallback=move || view! { <ConnectView res=instances /> } fallback=move || view! { <ConnectView res=instances /> }
> >
<ul class="list-none my-4"> <ul class="my-4 list-none">
{move || { {move || {
instances instances
.get() .get()
@ -25,7 +25,7 @@ pub fn ListInstances() -> impl IntoView {
view! { view! {
<li> <li>
<a <a
class="link text-lg" class="text-lg link"
href=format!("/instance/{}", i.domain) href=format!("/instance/{}", i.domain)
> >
{i.domain.to_string()} {i.domain.to_string()}

View file

@ -12,7 +12,7 @@ pub fn Notifications() -> impl IntoView {
); );
view! { view! {
<h1 class="text-4xl font-bold font-serif my-6 grow flex-auto">Notifications</h1> <h1 class="flex-auto my-6 font-serif text-4xl font-bold grow">Notifications</h1>
<Suspense fallback=|| view! { "Loading..." }> <Suspense fallback=|| view! { "Loading..." }>
<ul class="divide-y divide-solid"> <ul class="divide-y divide-solid">
{move || { {move || {
@ -69,10 +69,10 @@ pub fn Notifications() -> impl IntoView {
}); });
view! { view! {
<li class="py-2"> <li class="py-2">
<a class="link text-lg" href=link> <a class="text-lg link" href=link>
{title} {title}
</a> </a>
<div class="card-actions mt-2"> <div class="mt-2 card-actions">
<button <button
class="btn btn-sm btn-outline" class="btn btn-sm btn-outline"
style=my_style style=my_style

View file

@ -51,7 +51,7 @@ pub fn Search() -> impl IntoView {
}); });
view! { view! {
<h1 class="text-4xl font-bold font-serif my-6 grow flex-auto"> <h1 class="flex-auto my-6 font-serif text-4xl font-bold grow">
"Search results for " {query} "Search results for " {query}
</h1> </h1>
<Suspense fallback=|| { <Suspense fallback=|| {
@ -88,7 +88,7 @@ pub fn Search() -> impl IntoView {
vec![ vec![
view! { view! {
<li> <li>
<a class="link text-lg" href=format!("/instance/{domain}")> <a class="text-lg link" href=format!("/instance/{domain}")>
{domain.to_string()} {domain.to_string()}
</a> </a>
</li> </li>
@ -103,7 +103,7 @@ pub fn Search() -> impl IntoView {
.map(|a| { .map(|a| {
view! { view! {
<li> <li>
<a class="link text-lg" href=article_path(a)> <a class="text-lg link" href=article_path(a)>
{article_title(a)} {article_title(a)}
</a> </a>
</li> </li>

View file

@ -47,11 +47,11 @@ pub fn UserProfile() -> impl IntoView {
let edits = edits.await; let edits = edits.await;
let person = user_profile.await; let person = user_profile.await;
view! { view! {
<h1 class="text-4xl font-bold font-serif my-6 grow flex-auto"> <h1 class="flex-auto my-6 font-serif text-4xl font-bold grow">
{user_title(&person)} {user_title(&person)}
</h1> </h1>
<h2 class="text-xl font-bold font-serif">Edits</h2> <h2 class="font-serif text-xl font-bold">Edits</h2>
<EditList edits=edits for_article=false /> <EditList edits=edits for_article=false />
} }
})} })}