mirror of
https://github.com/Vikeo/LifeTrinket.git
synced 2025-11-15 23:37:59 +00:00
fix side recent difference rotation
This commit is contained in:
@@ -79,7 +79,7 @@ const fadeOut = keyframes`
|
|||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
export const RecentDifference = styled.span`
|
export const RecentDifference = styled.span<{ $rotation: Rotation }>`
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 40%;
|
top: 40%;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
@@ -95,6 +95,20 @@ export const RecentDifference = styled.span`
|
|||||||
font-size: 8vmin;
|
font-size: 8vmin;
|
||||||
color: #333333;
|
color: #333333;
|
||||||
animation: ${fadeOut} 3s 1s ease-out forwards;
|
animation: ${fadeOut} 3s 1s ease-out forwards;
|
||||||
|
|
||||||
|
${(props) => {
|
||||||
|
if (
|
||||||
|
props.$rotation === Rotation.SideFlipped ||
|
||||||
|
props.$rotation === Rotation.Side
|
||||||
|
) {
|
||||||
|
return css`
|
||||||
|
top: 27%;
|
||||||
|
left: 30%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
rotate: 270deg;
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
}}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
type HealthProps = {
|
type HealthProps = {
|
||||||
@@ -195,7 +209,10 @@ const Health = ({
|
|||||||
{player.lifeTotal}
|
{player.lifeTotal}
|
||||||
</OutlinedText>
|
</OutlinedText>
|
||||||
{recentDifference !== 0 && (
|
{recentDifference !== 0 && (
|
||||||
<RecentDifference key={differenceKey}>
|
<RecentDifference
|
||||||
|
key={differenceKey}
|
||||||
|
$rotation={player.settings.rotation}
|
||||||
|
>
|
||||||
{recentDifference > 0 ? '+' : ''}
|
{recentDifference > 0 ? '+' : ''}
|
||||||
{recentDifference}
|
{recentDifference}
|
||||||
</RecentDifference>
|
</RecentDifference>
|
||||||
|
|||||||
Reference in New Issue
Block a user