diff --git a/src/components/map/MapFog.js b/src/components/map/MapFog.js index 208d9ac..95527c2 100644 --- a/src/components/map/MapFog.js +++ b/src/components/map/MapFog.js @@ -69,6 +69,7 @@ function MapFog({ const [gridSnappingSensitivity] = useSetting("map.gridSnappingSensitivity"); const [showFogGuides] = useSetting("fog.showGuides"); + const [editOpacity] = useSetting("fog.editOpacity"); const mapStageRef = useMapStage(); const [drawingShape, setDrawingShape] = useState(null); @@ -499,14 +500,18 @@ function MapFog({ onTouchEnd={eraseHoveredShapes} points={points} stroke={ - editable ? colors.lightGray : colors[shape.color] || shape.color + editable && active + ? colors.lightGray + : colors[shape.color] || shape.color } fill={colors[shape.color] || shape.color} closed lineCap="round" lineJoin="round" strokeWidth={gridStrokeWidth * shape.strokeWidth} - opacity={editable ? (!shape.visible ? 0.2 : 0.5) : 1} + opacity={ + editable ? (!shape.visible ? editOpacity / 2 : editOpacity) : 1 + } fillPatternImage={patternImage} fillPriority={editable && !shape.visible ? "pattern" : "color"} holes={holes} diff --git a/src/modals/SettingsModal.js b/src/modals/SettingsModal.js index 62ae7eb..13ebef0 100644 --- a/src/modals/SettingsModal.js +++ b/src/modals/SettingsModal.js @@ -30,6 +30,7 @@ function SettingsModal({ isOpen, onRequestClose }) { "map.gridSnappingSensitivity" ); const [showFogGuides, setShowFogGuides] = useSetting("fog.showGuides"); + const [fogEditOpacity, setFogEditOpacity] = useSetting("fog.editOpacity"); const [storageEstimate, setStorageEstimate] = useState(); const [isImportExportModalOpen, setIsImportExportModalOpen] = useState(false); @@ -111,6 +112,19 @@ function SettingsModal({ isOpen, onRequestClose }) { onChange={(e) => setShowFogGuides(e.target.checked)} /> +