minor UI changes
This commit is contained in:
@@ -128,11 +128,11 @@ export default function ShipPlacementScreen({
|
|||||||
prev.map((s) =>
|
prev.map((s) =>
|
||||||
s.id === ship.id
|
s.id === ship.id
|
||||||
? {
|
? {
|
||||||
...s,
|
...s,
|
||||||
x: rot.x,
|
x: rot.x,
|
||||||
y: rot.y,
|
y: rot.y,
|
||||||
orientation: rot.orientation,
|
orientation: rot.orientation,
|
||||||
}
|
}
|
||||||
: s
|
: s
|
||||||
)
|
)
|
||||||
)
|
)
|
||||||
@@ -235,12 +235,12 @@ export default function ShipPlacementScreen({
|
|||||||
prev.map((s) =>
|
prev.map((s) =>
|
||||||
s.id === drag.ship.id
|
s.id === drag.ship.id
|
||||||
? {
|
? {
|
||||||
...s,
|
...s,
|
||||||
placed: true,
|
placed: true,
|
||||||
x: drag.candidate.x,
|
x: drag.candidate.x,
|
||||||
y: drag.candidate.y,
|
y: drag.candidate.y,
|
||||||
orientation: drag.candidate.orientation,
|
orientation: drag.candidate.orientation,
|
||||||
}
|
}
|
||||||
: s
|
: s
|
||||||
)
|
)
|
||||||
)
|
)
|
||||||
@@ -250,12 +250,12 @@ export default function ShipPlacementScreen({
|
|||||||
prev.map((s) =>
|
prev.map((s) =>
|
||||||
s.id === drag.ship.id
|
s.id === drag.ship.id
|
||||||
? {
|
? {
|
||||||
...s,
|
...s,
|
||||||
placed: false,
|
placed: false,
|
||||||
x: 0,
|
x: 0,
|
||||||
y: 0,
|
y: 0,
|
||||||
orientation: false,
|
orientation: false,
|
||||||
}
|
}
|
||||||
: s
|
: s
|
||||||
)
|
)
|
||||||
)
|
)
|
||||||
@@ -313,11 +313,9 @@ export default function ShipPlacementScreen({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="placement-screen-layout">
|
<div className="placement-screen-layout">
|
||||||
{opponentReady && (
|
<div className="placement-opponent-badge">
|
||||||
<div className="placement-opponent-badge">
|
{opponentReady ? "Соперник готов к бою!" : "Соперник расставляет корабли..."}
|
||||||
Соперник готов к бою!
|
</div>
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<div className="placement-container">
|
<div className="placement-container">
|
||||||
{/* Левая половина: игровое поле 10x10 с линейками и кнопками под ним */}
|
{/* Левая половина: игровое поле 10x10 с линейками и кнопками под ним */}
|
||||||
@@ -421,28 +419,23 @@ export default function ShipPlacementScreen({
|
|||||||
{/* Парящий под курсором корабль при перетаскивании */}
|
{/* Парящий под курсором корабль при перетаскивании */}
|
||||||
{activeDrag && (
|
{activeDrag && (
|
||||||
<div
|
<div
|
||||||
className={`floating-drag-ship ${
|
className={`floating-drag-ship ${activeDrag.orientation ? 'vertical' : 'horizontal'
|
||||||
activeDrag.orientation ? 'vertical' : 'horizontal'
|
}`}
|
||||||
}`}
|
|
||||||
style={{
|
style={{
|
||||||
left: `${
|
left: `${activeDrag.currentPos.x -
|
||||||
activeDrag.currentPos.x -
|
|
||||||
(!activeDrag.orientation ? activeDrag.segIndex * 33 + 15 : 15)
|
(!activeDrag.orientation ? activeDrag.segIndex * 33 + 15 : 15)
|
||||||
}px`,
|
}px`,
|
||||||
top: `${
|
top: `${activeDrag.currentPos.y -
|
||||||
activeDrag.currentPos.y -
|
|
||||||
(activeDrag.orientation ? activeDrag.segIndex * 33 + 15 : 15)
|
(activeDrag.orientation ? activeDrag.segIndex * 33 + 15 : 15)
|
||||||
}px`,
|
}px`,
|
||||||
width: `${
|
width: `${!activeDrag.orientation
|
||||||
!activeDrag.orientation
|
|
||||||
? activeDrag.ship.size * 30 + (activeDrag.ship.size - 1) * 3
|
? activeDrag.ship.size * 30 + (activeDrag.ship.size - 1) * 3
|
||||||
: 30
|
: 30
|
||||||
}px`,
|
}px`,
|
||||||
height: `${
|
height: `${activeDrag.orientation
|
||||||
activeDrag.orientation
|
|
||||||
? activeDrag.ship.size * 30 + (activeDrag.ship.size - 1) * 3
|
? activeDrag.ship.size * 30 + (activeDrag.ship.size - 1) * 3
|
||||||
: 30
|
: 30
|
||||||
}px`,
|
}px`,
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{Array.from({ length: activeDrag.ship.size }).map((_, segIdx) => (
|
{Array.from({ length: activeDrag.ship.size }).map((_, segIdx) => (
|
||||||
|
|||||||
Reference in New Issue
Block a user