app: Properly display recipe ratings
This commit is contained in:
parent
d614029931
commit
2ac56e2e7f
1 changed files with 22 additions and 25 deletions
|
|
@ -28,9 +28,11 @@ struct RecipeRatingProps {
|
||||||
fn RecipeRating(props: &RecipeRatingProps) -> Html {
|
fn RecipeRating(props: &RecipeRatingProps) -> Html {
|
||||||
let rating = (props.rating + 1).min(3);
|
let rating = (props.rating + 1).min(3);
|
||||||
html! {
|
html! {
|
||||||
<div aria-label={format!("Rating: {rating}")}>
|
<span aria-label={format!("Rating: {rating}")} class="ms-1">
|
||||||
{ for (0..rating).map(|_| html!{<i aria-hidden="true" class="bi-star-fill" />}) }
|
{ for (0..rating).map(|_| html!{
|
||||||
</div>
|
<i aria-hidden="true" class="bi-star-fill ms-1"/>
|
||||||
|
}) }
|
||||||
|
</span>
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -722,7 +724,7 @@ fn EditRating(props: &EditRatingProps) -> Html {
|
||||||
};
|
};
|
||||||
|
|
||||||
html! {<>
|
html! {<>
|
||||||
<ModalToggleButton modal_id="rcpEditRating" classes={classes!("btn", "btn-secondary")}>
|
<ModalToggleButton modal_id="rcpEditRating" classes={classes!("btn", "btn-secondary", "ms-2")}>
|
||||||
{"Edit Rating"}
|
{"Edit Rating"}
|
||||||
</ModalToggleButton>
|
</ModalToggleButton>
|
||||||
<FormModal
|
<FormModal
|
||||||
|
|
@ -794,27 +796,22 @@ fn RecipeViewerInner(props: &RecipeViewerInnerProps) -> HtmlResult {
|
||||||
|
|
||||||
Ok(match &*recipe {
|
Ok(match &*recipe {
|
||||||
Ok(r) => html! {<>
|
Ok(r) => html! {<>
|
||||||
<h1>{&r.name}</h1>
|
<h1>{&r.name} <RecipeRating rating={r.rating} /> </h1>
|
||||||
<EditName
|
<div class="mt-2">
|
||||||
token={props.token.clone()}
|
<EditName
|
||||||
id={props.id}
|
token={props.token.clone()}
|
||||||
household={props.household}
|
id={props.id}
|
||||||
name={r.name.clone()}
|
household={props.household}
|
||||||
update={update.clone()}
|
name={r.name.clone()}
|
||||||
/>
|
update={update.clone()}
|
||||||
<div class="container row mt-2">
|
/>
|
||||||
<div class="col-8">
|
<EditRating
|
||||||
<RecipeRating rating={r.rating} />
|
token={props.token.clone()}
|
||||||
</div>
|
recipe={props.id}
|
||||||
<div class="col-4">
|
household={props.household}
|
||||||
<EditRating
|
rating={r.rating + 1}
|
||||||
token={props.token.clone()}
|
update={update.clone()}
|
||||||
recipe={props.id}
|
/>
|
||||||
household={props.household}
|
|
||||||
rating={r.rating + 1}
|
|
||||||
update={update.clone()}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
if let Some(e) = &*error {
|
if let Some(e) = &*error {
|
||||||
<div class={classes!("alert", "alert-danger")} role="alert">
|
<div class={classes!("alert", "alert-danger")} role="alert">
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue