[GH-ISSUE #2879] [Bug]: Rollover overspending indicators pushed off screen in mobile view #42807

Closed
opened 2026-04-26 02:54:47 -05:00 by GiteaMirror · 7 comments
Owner

Originally created by @matt-fidd on GitHub (Jun 13, 2024).
Original GitHub issue: https://github.com/actualbudget/actual/issues/2879

Verified issue does not already exist?

  • I have searched and found no existing issue

What happened?

As above, image below.

image

Originally created by @matt-fidd on GitHub (Jun 13, 2024). Original GitHub issue: https://github.com/actualbudget/actual/issues/2879 ### Verified issue does not already exist? - [X] I have searched and found no existing issue ### What happened? As above, image below. ![image](https://github.com/actualbudget/actual/assets/81489167/30e59f28-f63e-415f-b607-d0f0512a76af)
GiteaMirror added the user interfacegood first issuebug labels 2026-04-26 02:54:47 -05:00
Author
Owner

@dymanoid commented on GitHub (Jun 18, 2024):

Will be happy to work on this. Please also see my comment in #2774.

<!-- gh-comment-id:2176879585 --> @dymanoid commented on GitHub (Jun 18, 2024): Will be happy to work on this. Please also see my comment in #2774.
Author
Owner

@youngcw commented on GitHub (Jun 24, 2024):

I think that the a better solution would be to somehow integrate the arrow into the pill around the value. Maybe the pill should run up against the side of the screen and then the arrow can be inside the pill along with the amount

<!-- gh-comment-id:2186815932 --> @youngcw commented on GitHub (Jun 24, 2024): I think that the a better solution would be to somehow integrate the arrow into the pill around the value. Maybe the pill should run up against the side of the screen and then the arrow can be inside the pill along with the amount
Author
Owner

@dymanoid commented on GitHub (Jun 25, 2024):

Here are three possible solutions. Which one do you prefer?
I don't like the 3rd one where the dark value containers extend to the right to cover the carryover arrow.
I personally prefer the 1st one where the arrows are outside of the value containers, so basically the current design. But the 2nd one is also okay.
So what are your thoughts?
Variant 1:
a1

Variant 2:
a2

Variant 3:
a3

<!-- gh-comment-id:2189359479 --> @dymanoid commented on GitHub (Jun 25, 2024): Here are three possible solutions. Which one do you prefer? I don't like the 3rd one where the dark value containers extend to the right to cover the carryover arrow. I personally prefer the 1st one where the arrows are outside of the value containers, so basically the current design. But the 2nd one is also okay. So what are your thoughts? **Variant 1:** ![a1](https://github.com/actualbudget/actual/assets/9433345/58848dd6-090a-4f73-a286-9ea356da247e) **Variant 2:** ![a2](https://github.com/actualbudget/actual/assets/9433345/5cad212e-5b14-4a66-a6c1-d5f1f8eb0a79) **Variant 3:** ![a3](https://github.com/actualbudget/actual/assets/9433345/78503c8a-42b0-43a1-a5cf-e96764a5cd5c)
Author
Owner

@youngcw commented on GitHub (Jun 25, 2024):

@dymanoid
option 1 would match desktop the most and is the most similar to existing. I wouldn't be against option 2 though if others liked that more.

With option 3 could the pill be squared against the side? So no rounded right side.
that might make it feel less inconsistent.

<!-- gh-comment-id:2189384113 --> @youngcw commented on GitHub (Jun 25, 2024): @dymanoid option 1 would match desktop the most and is the most similar to existing. I wouldn't be against option 2 though if others liked that more. With option 3 could the pill be squared against the side? So no rounded right side. that might make it feel less inconsistent.
Author
Owner

@dymanoid commented on GitHub (Jun 25, 2024):

Something like this?

image

<!-- gh-comment-id:2189461461 --> @dymanoid commented on GitHub (Jun 25, 2024): Something like this? ![image](https://github.com/actualbudget/actual/assets/9433345/288c35c4-ea42-4a3b-ac1a-08ff2ba2656a)
Author
Owner

@youngcw commented on GitHub (Jun 25, 2024):

@dymanoid Yeah that was what I was thinking. It still seems a bit weird, but its an option. My hope is that we don't have to lose more space just to make it look good if possible. That extended pill could maybe do that and maybe different enough from the regular pill to not look wrong or missaligned

<!-- gh-comment-id:2189468032 --> @youngcw commented on GitHub (Jun 25, 2024): @dymanoid Yeah that was what I was thinking. It still seems a bit weird, but its an option. My hope is that we don't have to lose more space just to make it look good if possible. That extended pill could maybe do that and maybe different enough from the regular pill to not look wrong or missaligned
Author
Owner

@dymanoid commented on GitHub (Jun 26, 2024):

After discussing on Discord, this what we decided to implement:
image

<!-- gh-comment-id:2191950790 --> @dymanoid commented on GitHub (Jun 26, 2024): After discussing on Discord, this what we decided to implement: ![image](https://github.com/actualbudget/actual/assets/9433345/781358b5-3900-4f41-a09f-59d3d1c1329b)
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/actual#42807