style: make OpenImage dialog block selector more visible

This commit is contained in:
trafficlunar 2025-02-20 20:53:07 +00:00
parent 8330f5d42c
commit 4fcc15d888

View file

@ -1,5 +1,6 @@
import React, { useContext, useMemo, useRef, useState } from "react"; import React, { useContext, useMemo, useRef, useState } from "react";
import { Container, Graphics, Sprite, Stage } from "@pixi/react"; import { Container, Graphics, Sprite, Stage } from "@pixi/react";
import { AlphaFilter } from "pixi.js";
import { CanvasContext } from "@/context/Canvas"; import { CanvasContext } from "@/context/Canvas";
import { ThemeContext } from "@/context/Theme"; import { ThemeContext } from "@/context/Theme";
@ -69,6 +70,7 @@ function BlockSelector({ stageWidth, searchInput, selectedBlocks, setSelectedBlo
eventMode={"static"} eventMode={"static"}
pointerover={() => setHoverPosition({ x, y })} pointerover={() => setHoverPosition({ x, y })}
click={() => onClick(block)} click={() => onClick(block)}
filters={selectedBlocks.includes(block) ? [] : [new AlphaFilter(0.3)]}
/> />
{selectedBlocks.includes(block) && ( {selectedBlocks.includes(block) && (
@ -78,8 +80,7 @@ function BlockSelector({ stageWidth, searchInput, selectedBlocks, setSelectedBlo
y={y} y={y}
draw={(g) => { draw={(g) => {
g.clear(); g.clear();
g.beginFill(0x000000, 0.5); g.lineStyle(2, isDark ? 0xffffff : 0x000000, 0.5, 0);
g.lineStyle(2, isDark ? 0xffffff : 0x000000, 1, 1);
g.drawRect(0, 0, 32, 32); g.drawRect(0, 0, 32, 32);
}} }}
/> />
@ -94,7 +95,7 @@ function BlockSelector({ stageWidth, searchInput, selectedBlocks, setSelectedBlo
y={hoverPosition.y} y={hoverPosition.y}
draw={(g) => { draw={(g) => {
g.clear(); g.clear();
g.lineStyle(2, isDark ? 0xffffff : 0x000000, 1, 1); g.lineStyle(4, isDark ? 0xffffff : 0x000000, 1, 1);
g.drawRect(0, 0, 32, 32); g.drawRect(0, 0, 32, 32);
}} }}
/> />