Github/screenshot-to-code
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

AppState.CODING show multiple reference images when applicable

Browse Source
This commit is contained in:
Piyush Mishra 2023-11-27 09:59:09 +05:30
parent 3442ce3ae6
commit 9034048089
1 changed files with 27 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
frontend/src/App.tsx
View File

@ -500,37 +500,34 @@ function App() {
{/* Reference image display */} {/* Reference image display */}
<div className="flex gap-x-2 mt-2"> <div className="flex gap-x-2 mt-2">
{referenceImages.length > 0 && ( <div className="flex flex-col">
<div className="flex flex-col"> <div
<div className={classNames({
className={classNames({ "scanning relative": appState === AppState.CODING,
"scanning relative": appState === AppState.CODING, })}
})} >
> {referenceImages.length > 1 ? (
{inputMode === "image" && ( <div className="grid grid-cols-2 gap-2">
<img {referenceImages.map((image, i) => (
className="w-[340px] border border-gray-200 rounded-md" <img
src={referenceImages[0]} className="border max-h-40 w-full h-full object-contain border-gray-200 rounded-md"
alt="Reference" src={image}
/> alt={`Reference image: ${i}`}
)} />
{inputMode === "video" && ( ))}
<video </div>
muted ) : (
autoPlay <img
loop className="w-[340px] border border-gray-200 rounded-md"
className="w-[340px] border border-gray-200 rounded-md" src={referenceImages[0]}
src={referenceImages[0]} alt-="Reference Image"
/> />
)} )}
</div>
<div className="text-gray-400 uppercase text-sm text-center mt-1">
{inputMode === "video"
? "Original Video"
: "Original Screenshot"}
</div>
</div> </div>
)} <div className="text-gray-400 uppercase text-sm text-center mt-1">
Original Screenshot{referenceImages.length > 1 ? "s" : ""}
</div>
</div>
<div className="bg-gray-400 px-4 py-2 rounded text-sm hidden"> <div className="bg-gray-400 px-4 py-2 rounded text-sm hidden">
<h2 className="text-lg mb-4 border-b border-gray-800"> <h2 className="text-lg mb-4 border-b border-gray-800">
Console Console