vinod/booksman
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

user-auth store frontend css v4

Browse Source
This commit is contained in:
Vinod J M
2023-01-04 23:10:41 +05:30
parent f7df920bba
commit f8e6b75952
1 changed files with 32 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
frontend/src/main.rs
View File

@@ -660,9 +660,9 @@ async fn ListDB<G: Html>(cx: Scope<'_>) -> View<G> {
view! {cx, view! {cx,
(if *app_state.openlibrary.get() == false && *app_state.editmode.get() == false { (if *app_state.openlibrary.get() == false && *app_state.editmode.get() == false {
view!{ cx, view!{ cx,
div(class="grid space-x-1 grid-cols-4 md:grid-cols-4") { div(class="grid gap-2 grid-cols-1 md:grid-cols-4") {
ul {
Keyed( Keyed(
iterable=docs, iterable=docs,
view=|cx, x| view! { cx, view=|cx, x| view! { cx,
@@ -671,11 +671,11 @@ async fn ListDB<G: Html>(cx: Scope<'_>) -> View<G> {
key =|x| x.id ) key =|x| x.id )
} }
} }
}
} else if *app_state.openlibrary.get() == false && *app_state.editmode.get() == true { } else if *app_state.openlibrary.get() == false && *app_state.editmode.get() == true {
view!{ cx, view!{ cx,
div(class="grid space-x-1 grid-cols-4 md:grid-cols-4") { div(class="grid grid-cols-1 md:grid-cols-4 gap-2 ") {
ul {
Keyed( Keyed(
iterable=docs, iterable=docs,
view=|cx, x| view! { cx, view=|cx, x| view! { cx,
@@ -684,7 +684,7 @@ async fn ListDB<G: Html>(cx: Scope<'_>) -> View<G> {
key =|x| x.id ) key =|x| x.id )
} }
} }
}
} else { } else {
view!{cx, ""} view!{cx, ""}
} }
@@ -709,9 +709,11 @@ pub fn BookDB<G: Html>(cx: Scope, bookitem: BookUIProp) -> View<G> {
let bookdisplay_div = bookitem.bookitem.clone(); let bookdisplay_div = bookitem.bookitem.clone();
let loctitle = bookitem.bookitem.clone().title.clone(); let loctitle = bookitem.bookitem.clone().title.clone();
let locauthors = bookitem.bookitem.clone().author_name.clone().unwrap_or(vec!["".to_string()]).join(", "); let locauthors = bookitem.bookitem.clone().author_name.clone().unwrap_or(vec!["".to_string()]).join(", ");
let locdesc = bookitem.bookitem.clone().description.unwrap_or("".to_string()); let mut locdesc = bookitem.bookitem.clone().description.unwrap_or("".to_string());
let locloc = bookitem.bookitem.clone().location.unwrap_or("".to_string()); let locloc = bookitem.bookitem.clone().location.unwrap_or("".to_string());
if locdesc.clone().len() > 200 {
locdesc = format!("{:.200}...",locdesc.clone())
}
//let locref = create_rc_signal(false); //let locref = create_rc_signal(false);
let coverurl = bookdisplay.clone().cover.clone().unwrap_or("None".to_string()); let coverurl = bookdisplay.clone().cover.clone().unwrap_or("None".to_string());
@@ -754,33 +756,32 @@ pub fn BookDB<G: Html>(cx: Scope, bookitem: BookUIProp) -> View<G> {
app_state.displayingbook.set(bookdisplay_div.clone()); app_state.displayingbook.set(bookdisplay_div.clone());
}; };
view! { cx, view! { cx,
div(class="column px-4 py-4 bg-gray-200 border-2 border-gray-400 rounded"){ div(class="column px-4 py-4 bg-gray-200 border-2 border-gray-400 rounded m-3"){
div(class="card"){
div(class="card-buttons"){ div(class="card-buttons flex gap-x-3"){
button( class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 border-black-500 rounded inline-flex items-center", on:click=handle_display){ i(class="fa-solid fa-circle-info") } button( class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 border-black-500 rounded inline-flex items-center", on:click=handle_display){ i(class="fa-solid fa-circle-info") }
button( class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 border-black-500 rounded inline-flex items-center", on:click=handle_update){ i(class="fa-solid fa-pen-to-square") } button( class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 border-black-500 rounded inline-flex items-center", on:click=handle_update){ i(class="fa-solid fa-pen-to-square") }
button( class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 border-black-500 rounded inline-flex items-center", on:click=handle_delete){ i(class="fa-solid fa-trash") } button( class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 border-black-500 rounded inline-flex items-center", on:click=handle_delete){ i(class="fa-solid fa-trash") }
} }
div(class="card-main",on:click=handle_display_div){ div(class="card-main",on:click=handle_display_div){
img(src=coverurl,width="100") img(class="float-right m-1",src=coverurl,width="100")
div(class="card-title"){ div(class="card-title font-bold text-lg"){
(format!("{}",loctitle)) (format!("{}",loctitle))
} }
div(class="card-authors"){ div(class="card-authors text-lg"){
(format!("{}",locauthors)) (format!("{}",locauthors))
} }
div(class="card-desc"){ div(class="card-desc"){
(format!("{}",locloc)) (format!("{}",locloc))
br{}br{} br{}br{}
(format!("{}",locdesc)) (format!("{}",locdesc.clone()))
} }
} }
}
} }
} }
@@ -793,8 +794,11 @@ pub fn BookDB_View<G: Html>(cx: Scope, bookitem: BookUIProp) -> View<G> {
let bookdisplay_div = bookitem.bookitem.clone(); let bookdisplay_div = bookitem.bookitem.clone();
let loctitle = bookitem.bookitem.clone().title.clone(); let loctitle = bookitem.bookitem.clone().title.clone();
let locauthors = bookitem.bookitem.clone().author_name.clone().unwrap_or(vec!["".to_string()]).join(", "); let locauthors = bookitem.bookitem.clone().author_name.clone().unwrap_or(vec!["".to_string()]).join(", ");
let locdesc = bookitem.bookitem.clone().description.unwrap_or("".to_string()); let mut locdesc = bookitem.bookitem.clone().description.unwrap_or("".to_string());
let locloc = bookitem.bookitem.clone().location.unwrap_or("".to_string()); let locloc = bookitem.bookitem.clone().location.unwrap_or("".to_string());
if locdesc.clone().len() > 200 {
locdesc = format!("{:.200}...",locdesc.clone())
}
let coverurl = bookdisplay.clone().cover.clone().unwrap_or("None".to_string()); let coverurl = bookdisplay.clone().cover.clone().unwrap_or("None".to_string());
let handle_display = move |_| { let handle_display = move |_| {
@@ -810,7 +814,7 @@ pub fn BookDB_View<G: Html>(cx: Scope, bookitem: BookUIProp) -> View<G> {
app_state.displayingbook.set(bookdisplay_div.clone()); app_state.displayingbook.set(bookdisplay_div.clone());
}; };
view! { cx, view! { cx,
div(class="px-4 py-4 bg-gray-200 border-2 border-gray-400 rounded"){ div(class="col-span-1 px-4 py-4 bg-gray-200 border-2 border-gray-400 rounded m-3"){
div(class="card-buttons"){ div(class="card-buttons"){
@@ -819,19 +823,19 @@ pub fn BookDB_View<G: Html>(cx: Scope, bookitem: BookUIProp) -> View<G> {
} }
div(class="card-main", on:click=handle_display_div){ div(class="card-main", on:click=handle_display_div){
img(src=coverurl,width="100") img(class="float-right m-1",src=coverurl,width="100")
div(class="card-title"){ div(class="card-title font-bold text-lg"){
(format!("{}",loctitle)) (format!("{}",loctitle))
} }
div(class="card-authors"){ div(class="card-authors text-lg"){
(format!("{}",locauthors)) (format!("{}",locauthors))
} }
div(class="card-desc"){ div(class="card-desc"){
(format!("{}",locloc)) (format!("{}",locloc))
br{}br{} br{}br{}
(format!("{}",locdesc)) (format!("{:.100}...",locdesc.clone()))
} }
} }
@@ -859,7 +863,7 @@ async fn ListOL<G: Html>(cx: Scope<'_>) -> View<G> {
let docs = create_memo(cx, || app_state.books.get().iter().cloned().collect::<Vec<_>>()); let docs = create_memo(cx, || app_state.books.get().iter().cloned().collect::<Vec<_>>());
view! {cx, view! {cx,
p {
(if *app_state.openlibrary.get() == true { (if *app_state.openlibrary.get() == true {
view!{ cx, view!{ cx,
div(class="grid space-x-1 grid-cols-4 md:grid-cols-4") { div(class="grid space-x-1 grid-cols-4 md:grid-cols-4") {
@@ -877,7 +881,6 @@ async fn ListOL<G: Html>(cx: Scope<'_>) -> View<G> {
} }
) )
} }
}
} }
#[component(inline_props)] #[component(inline_props)]
@@ -903,24 +906,23 @@ pub fn BookOL<G: Html>(cx: Scope, bookitem: BookUIProp) -> View<G> {
app_state.addingbook.set(book_div.clone()); app_state.addingbook.set(book_div.clone());
}; };
view! { cx, view! { cx,
div(class="column"){ div(class="column px-4 py-4 bg-gray-200 border-2 border-gray-400 rounded m-3",on:click=handle_add_div){
div(class="card-openlibrary px-4 py-4 bg-gray-200 border-2 border-gray-400 rounded",on:click=handle_add_div){
button( class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 border-black-500 rounded inline-flex items-center", on:click=handle_add){ i(class="fa-solid fa-plus") } button( class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 border-black-500 rounded inline-flex items-center", on:click=handle_add){ i(class="fa-solid fa-plus") }
div(class="card-main"){ div(class="card-main"){
img(src=coverurl,width="100") img(class="float-right m-1",src=coverurl,width="100")
div(class="card-title"){ div(class="card-title font-bold text-lg"){
(format!("{}",loctitle)) (format!("{}",loctitle))
} }
div(class="card-authors"){ div(class="card-authors text-lg"){
(format!("{}",locauthors)) (format!("{}",locauthors))
} }
//div(class="card-image"){ //div(class="card-image"){
//} //}
} }
} }
}
} }
} }