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,
(if *app_state.openlibrary.get() == false && *app_state.editmode.get() == false {
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(
iterable=docs,
view=|cx, x| view! { cx,
@@ -671,11 +671,11 @@ async fn ListDB<G: Html>(cx: Scope<'_>) -> View<G> {
key =|x| x.id )
}
}
}
} else if *app_state.openlibrary.get() == false && *app_state.editmode.get() == true {
view!{ cx,
div(class="grid space-x-1 grid-cols-4 md:grid-cols-4") {
ul {
div(class="grid grid-cols-1 md:grid-cols-4 gap-2 ") {
Keyed(
iterable=docs,
view=|cx, x| view! { cx,
@@ -684,7 +684,7 @@ async fn ListDB<G: Html>(cx: Scope<'_>) -> View<G> {
key =|x| x.id )
}
}
}
} else {
view!{cx, ""}
}
@@ -709,9 +709,11 @@ pub fn BookDB<G: Html>(cx: Scope, bookitem: BookUIProp) -> View<G> {
let bookdisplay_div = bookitem.bookitem.clone();
let loctitle = bookitem.bookitem.clone().title.clone();
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());
if locdesc.clone().len() > 200 {
locdesc = format!("{:.200}...",locdesc.clone())
}
//let locref = create_rc_signal(false);
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());
};
view! { cx,
div(class="column px-4 py-4 bg-gray-200 border-2 border-gray-400 rounded"){
div(class="card"){
div(class="column px-4 py-4 bg-gray-200 border-2 border-gray-400 rounded m-3"){
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_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") }
}
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))
}
div(class="card-authors"){
div(class="card-authors text-lg"){
(format!("{}",locauthors))
}
div(class="card-desc"){
(format!("{}",locloc))
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 loctitle = bookitem.bookitem.clone().title.clone();
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());
if locdesc.clone().len() > 200 {
locdesc = format!("{:.200}...",locdesc.clone())
}
let coverurl = bookdisplay.clone().cover.clone().unwrap_or("None".to_string());
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());
};
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"){
@@ -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){
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))
}
div(class="card-authors"){
div(class="card-authors text-lg"){
(format!("{}",locauthors))
}
div(class="card-desc"){
(format!("{}",locloc))
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<_>>());
view! {cx,
p {
(if *app_state.openlibrary.get() == true {
view!{ cx,
div(class="grid space-x-1 grid-cols-4 md:grid-cols-4") {
@@ -878,7 +882,6 @@ async fn ListOL<G: Html>(cx: Scope<'_>) -> View<G> {
)
}
}
}
#[component(inline_props)]
pub fn BookOL<G: Html>(cx: Scope, bookitem: BookUIProp) -> View<G> {
@@ -903,24 +906,23 @@ pub fn BookOL<G: Html>(cx: Scope, bookitem: BookUIProp) -> View<G> {
app_state.addingbook.set(book_div.clone());
};
view! { cx,
div(class="column"){
div(class="card-openlibrary px-4 py-4 bg-gray-200 border-2 border-gray-400 rounded",on:click=handle_add_div){
div(class="column px-4 py-4 bg-gray-200 border-2 border-gray-400 rounded m-3",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") }
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))
}
div(class="card-authors"){
div(class="card-authors text-lg"){
(format!("{}",locauthors))
}
//div(class="card-image"){
//}
}
}
}
}
}