araemer/recipe-app
1
0
Fork 0
Code Issues 4 Pull requests Projects Releases Packages Wiki Activity Actions

Add NumberCircle Component

Browse source
This commit is contained in:
araemer 2025-10-25 18:36:03 +02:00
parent 0b549c878c
commit 9f550bbce1
5 changed files with 42 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

7
frontend/src/components/recipes/InstructionStepMobileListItem.tsx
View file

@ -3,6 +3,7 @@ import {X} from "lucide-react";
import {ButtonType} from "../basics/BasicButtonDefinitions.ts";
import type {InstructionStepModel} from "../../models/InstructionStepModel.ts";
import {MoveButtonControl} from "../basics/MoveButtonControl.tsx";
import {NumberCircle} from "../basics/NumberCircle.tsx";
type InstructionStepMobileListItemProps = {
/** Index of the instruction step */
@ -61,9 +62,9 @@ export function InstructionStepMobileListItem({
>
{/* Left column: Number of the instruction step and move controls */}
<div className="flex flex-col items-center pt-1">
<div className="circular-container">
{index + 1}
</div>
<NumberCircle
number={index + 1}
/>
<MoveButtonControl
isUpDisabled={isFirst}
isDownDisabled={isLast}