Added buttons to dialog mockup
This commit is contained in:
@@ -142,16 +142,19 @@ export function Inventory({ side }: { side: "T" | "CT" }) {
|
|||||||
{knife && (
|
{knife && (
|
||||||
<SkinTile
|
<SkinTile
|
||||||
skin={knife}
|
skin={knife}
|
||||||
|
side={side}
|
||||||
></SkinTile>
|
></SkinTile>
|
||||||
)}
|
)}
|
||||||
{gloves && (
|
{gloves && (
|
||||||
<SkinTile
|
<SkinTile
|
||||||
skin={gloves}
|
skin={gloves}
|
||||||
|
side={side}
|
||||||
></SkinTile>
|
></SkinTile>
|
||||||
)}
|
)}
|
||||||
{agent && (
|
{agent && (
|
||||||
<SkinTile
|
<SkinTile
|
||||||
skin={agent}
|
skin={agent}
|
||||||
|
side={side}
|
||||||
></SkinTile>
|
></SkinTile>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
@@ -165,6 +168,7 @@ export function Inventory({ side }: { side: "T" | "CT" }) {
|
|||||||
<SkinTile
|
<SkinTile
|
||||||
key={i}
|
key={i}
|
||||||
skin={v}
|
skin={v}
|
||||||
|
side={side}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -7,10 +7,12 @@ export function SkinDialog({
|
|||||||
isOpen,
|
isOpen,
|
||||||
setIsOpen,
|
setIsOpen,
|
||||||
skin,
|
skin,
|
||||||
|
side
|
||||||
}: {
|
}: {
|
||||||
isOpen: boolean;
|
isOpen: boolean;
|
||||||
setIsOpen: Dispatch<SetStateAction<boolean>>;
|
setIsOpen: Dispatch<SetStateAction<boolean>>;
|
||||||
skin: WeaponInfo | AgentInfo;
|
skin: WeaponInfo | AgentInfo;
|
||||||
|
side: "T" | "CT"
|
||||||
}) {
|
}) {
|
||||||
const acolor = `${skin.color}64`;
|
const acolor = `${skin.color}64`;
|
||||||
return (
|
return (
|
||||||
@@ -91,6 +93,10 @@ export function SkinDialog({
|
|||||||
<Typography.Code>
|
<Typography.Code>
|
||||||
Transaction id: {skin.id}
|
Transaction id: {skin.id}
|
||||||
</Typography.Code>
|
</Typography.Code>
|
||||||
|
<div className="flex gap-2 justify-end">
|
||||||
|
<Button variant="secondary">Apply to both</Button>
|
||||||
|
<Button>Apply to {side}</Button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Modal.Body>
|
</Modal.Body>
|
||||||
</Modal.Dialog>
|
</Modal.Dialog>
|
||||||
|
|||||||
@@ -4,7 +4,13 @@ import { useState } from "react";
|
|||||||
import { SkinDialog } from "./skin_dialog";
|
import { SkinDialog } from "./skin_dialog";
|
||||||
import { WeaponInfo, AgentInfo } from "~/types/skin";
|
import { WeaponInfo, AgentInfo } from "~/types/skin";
|
||||||
|
|
||||||
export function SkinTile({ skin }: { skin: WeaponInfo | AgentInfo }) {
|
export function SkinTile({
|
||||||
|
skin,
|
||||||
|
side,
|
||||||
|
}: {
|
||||||
|
skin: WeaponInfo | AgentInfo;
|
||||||
|
side: "T" | "CT";
|
||||||
|
}) {
|
||||||
const [isDialogOpen, setIsDialogOpen] = useState(false);
|
const [isDialogOpen, setIsDialogOpen] = useState(false);
|
||||||
const acolor = `${skin.color}64`;
|
const acolor = `${skin.color}64`;
|
||||||
return (
|
return (
|
||||||
@@ -13,6 +19,7 @@ export function SkinTile({ skin }: { skin: WeaponInfo | AgentInfo }) {
|
|||||||
isOpen={isDialogOpen}
|
isOpen={isDialogOpen}
|
||||||
setIsOpen={setIsDialogOpen}
|
setIsOpen={setIsDialogOpen}
|
||||||
skin={skin}
|
skin={skin}
|
||||||
|
side={side}
|
||||||
/>
|
/>
|
||||||
<Button
|
<Button
|
||||||
onClick={() => setIsDialogOpen(true)}
|
onClick={() => setIsDialogOpen(true)}
|
||||||
|
|||||||
Reference in New Issue
Block a user