43 lines
1.3 KiB
HTML
43 lines
1.3 KiB
HTML
@let recipe = recipeView().recipe;
|
|
<article>
|
|
<div id="recipe-header">
|
|
<div>
|
|
<h1>{{ recipe.title }}</h1>
|
|
@if (isLoggedIn()) {
|
|
<button id="star" (click)="starMutation.mutate()">
|
|
<fa-icon [icon]="faStar" />
|
|
<span>Star</span>
|
|
<span id="star-count">{{ recipe.starCount }}</span>
|
|
</button>
|
|
} @else {
|
|
<div>
|
|
<fa-icon [icon]="faStar" />
|
|
<span id="star-count">{{ recipe.starCount }}</span>
|
|
</div>
|
|
}
|
|
</div>
|
|
<div>
|
|
<div>
|
|
<fa-icon [icon]="faUser" />
|
|
<span>{{ recipe.owner.username }}</span>
|
|
</div>
|
|
@if (recipe.isPublic) {
|
|
<fa-icon [icon]="faGlobe" />
|
|
} @else {
|
|
<fa-icon [icon]="faLock" />
|
|
}
|
|
</div>
|
|
</div>
|
|
@if (mainImageUrl.isSuccess()) {
|
|
<img
|
|
id="main-image"
|
|
[src]="mainImageUrl.data()"
|
|
[alt]="recipe.mainImage.alt"
|
|
[height]="recipe.mainImage.height"
|
|
[width]="recipe.mainImage.width"
|
|
/>
|
|
}
|
|
<div [innerHTML]="recipe.text"></div>
|
|
<app-comments-list [recipeUsername]="recipe.owner.username" [recipeSlug]="recipe.slug" />
|
|
</article>
|