fix: move rollover arrow into view (#2774)

* fix: move rollover arrow into view

ref: https://github.com/actualbudget/actual/issues/2757

* fix: adds isNarrowWidth for responsive arrow

* ci: fix lint

* fix: update category name

packages/desktop-client/src/components/budget/BalanceWithCarryover.tsx

@@ -3,6 +3,7 @@ import React, { type ComponentProps } from 'react';
 
 import { useFeatureFlag } from '../../hooks/useFeatureFlag';
 import { SvgArrowThinRight } from '../../icons/v1';
+import { useResponsive } from '../../ResponsiveProvider';
 import { type CSSProperties } from '../../style';
 import { View } from '../common/View';
 import { CellValue } from '../spreadsheet/CellValue';
@@ -33,6 +34,9 @@ export function BalanceWithCarryover({
   const goalValue = useSheetValue(goal);
   const budgetedValue = useSheetValue(budgeted);
   const isGoalTemplatesEnabled = useFeatureFlag('goalTemplatesEnabled');
+
+  const { isNarrowWidth } = useResponsive();
+
   return (
     <>
       <CellValue
@@ -60,7 +64,7 @@ export function BalanceWithCarryover({
             alignSelf: 'center',
             marginLeft: 2,
             position: 'absolute',
-            right: -8,
+            right: isNarrowWidth ? '-8px' : '-4px',
             top: 0,
             bottom: 0,
             justifyContent: 'center',

upcoming-release-notes/2774.md

+---
+category: Bugfix
+authors: [Tigatok]
+---
+
+Move the rollover arrow into view.