Clean up css

This commit is contained in:
araemer 2025-10-25 08:00:59 +02:00
parent 5a4e04a47c
commit c866c01dfe
17 changed files with 214 additions and 250 deletions

View file

@ -7,6 +7,7 @@ import ButtonLink from "../basics/ButtonLink"
import {mapRecipeDtoToModel} from "../../mappers/RecipeMapper"
import {NumberStepControl} from "../basics/NumberStepControl.tsx";
import {NumberedListItem} from "../basics/NumberedListItem.tsx";
import {ButtonType} from "../basics/BasicButtonDefinitions.ts";
/**
@ -81,7 +82,7 @@ export default function RecipeDetailPage() {
<div className="content-bg">
{/* Header - remains in position when scrolling */}
<div className="sticky-header">
<h1 className="content-title mb-0 pb-0">{recipeWorkingCopy.title}</h1>
<h1>{recipeWorkingCopy.title}</h1>
</div>
{/* Content */}
@ -111,13 +112,13 @@ export default function RecipeDetailPage() {
</div>
{/* Ingredients */}
<h2 className="section-heading">Zutaten</h2>
<h2>Zutaten</h2>
<ul>
{recipeWorkingCopy.ingredientGroupList.map((group, i) => (
<div key={i}>
{/* the title is optional, only print if present */}
{group.title && group.title.trim() !== "" && (
<h3 className="subsection-heading highlight-container-bg mb-2">{group.title}</h3>
<h3 className="highlight-container-bg mb-2">{group.title}</h3>
)}
<ul>
{group.ingredientList.map((ing, j) => (
@ -131,7 +132,7 @@ export default function RecipeDetailPage() {
</ul>
{/* Instructions */}
<h2 className="section-heading">Zubereitung</h2>
<h2>Zubereitung</h2>
<ol className="space-y-4">
{recipe.instructionStepList.map((step, j) => (
<NumberedListItem key={j} index={j} text={step.text}/>
@ -142,12 +143,11 @@ export default function RecipeDetailPage() {
<div className="button-group">
<ButtonLink
to={recipe.id !== undefined ? getRecipeEditUrl(recipe.id) : getRecipeListUrl()} // @todo show error instead
className="basic-button primary-button-bg primary-button-text"
buttonType={ButtonType.PrimaryButton}
text="Bearbeiten"
/>
<ButtonLink
to={getRecipeListUrl()}
className="basic-button default-button-bg default-button-text"
text="Zurueck"
/>
</div>