Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Actions and mobile UI problem's #30303

Closed
Sirherobrine23 opened this issue Apr 6, 2024 · 2 comments
Closed

Actions and mobile UI problem's #30303

Sirherobrine23 opened this issue Apr 6, 2024 · 2 comments
Labels
issue/confirmed Issue has been reviewed and confirmed to be present or accepted to be implemented topic/ui Change the appearance of the Gitea UI type/bug

Comments

@Sirherobrine23
Copy link
Contributor

Description

On some pages, the buttons are misaligned from the text and remain inside it, and the actions have transparent parts that make the screen ineligible

Screenshots

Screenshot_20240406-042747_Chrome

Screenshot_20240406-043326_Chrome

Screenshot_20240406-043637_Chrome

This is same to Desktop

Gitea Version

latest

Can you reproduce the bug on the Gitea demo site?

Yes

Operating System

Ubuntu Server

Browser Version

123.0.6312.99 64 bits
@Sirherobrine23 Sirherobrine23 added topic/ui Change the appearance of the Gitea UI type/bug labels Apr 6, 2024
@silverwind
Copy link
Member

silverwind commented Apr 6, 2024 •
edited
Loading

The first problem is a regression from #30162 as the mobile CSS targets input and that element was previouly hidden but now is visible. I will fix it soon.

@silverwind silverwind added the issue/confirmed Issue has been reviewed and confirmed to be present or accepted to be implemented label Apr 6, 2024
This was referenced Apr 6, 2024
Merged
Merged
@silverwind
Copy link
Member

#30308 and #30309 will fix all problems.

silverwind added a commit that referenced this issue Apr 7, 2024
@silverwind @GiteaBot
Fix checkboxes on mobile view, remove some dead css (#30308)
644ade5 
Fix the checkbox issues in
#30303 which were existing
problems with these selectors, but made visible with
#30162.

There is a lot of dead/useless CSS in `form.css`, I only fixed the two
problems and remove CSS that was definitely not in use or needed.

<img width="369" alt="Screenshot 2024-04-06 at 18 00 08"
src="https://github.com/go-gitea/gitea/assets/115237/720f178b-1b22-48d4-8704-becb8ce66129">
<img width="405" alt="Screenshot 2024-04-06 at 18 00 28"
src="https://github.com/go-gitea/gitea/assets/115237/61c0f8ec-34af-46c5-a3fa-7c5c4d30c7d2">

Co-authored-by: Giteabot <teabot@gitea.io>
GiteaBot added a commit to GiteaBot/gitea that referenced this issue Apr 7, 2024
@silverwind @GiteaBot
Fix checkboxes on mobile view, remove some dead css (go-gitea#30308)
937bf78 
Fix the checkbox issues in
go-gitea#30303 which were existing
problems with these selectors, but made visible with
go-gitea#30162.

There is a lot of dead/useless CSS in `form.css`, I only fixed the two
problems and remove CSS that was definitely not in use or needed.

<img width="369" alt="Screenshot 2024-04-06 at 18 00 08"
src="https://github.com/go-gitea/gitea/assets/115237/720f178b-1b22-48d4-8704-becb8ce66129">
<img width="405" alt="Screenshot 2024-04-06 at 18 00 28"
src="https://github.com/go-gitea/gitea/assets/115237/61c0f8ec-34af-46c5-a3fa-7c5c4d30c7d2">

Co-authored-by: Giteabot <teabot@gitea.io>
@GiteaBot GiteaBot mentioned this issue Apr 7, 2024
Merged
silverwind added a commit that referenced this issue Apr 7, 2024
@silverwind
Action view mobile improvements and fixes (#30309)
0178eae 
Fix the action issue in #30303,
specifically:

- Use opaque step header hover background to avoid transparency issue
- Un-sticky the `action-view-left` on mobile, it would otherwise overlap
into right view
- Improve commit summary, let it wrap
- Fix and comment z-indexes
- Tweak width for run-list-item-right so it wastes less space on desktop
- Synced latest changes to console colors from dark to light theme

<img width="467" alt="Screenshot 2024-04-06 at 18 58 15"
src="https://github.com/go-gitea/gitea/assets/115237/8ad26b72-6cd9-4522-8ad1-6fd86b2d0d53">
GiteaBot pushed a commit to GiteaBot/gitea that referenced this issue Apr 7, 2024
@silverwind @GiteaBot
Action view mobile improvements and fixes (go-gitea#30309)
fa58e25 
Fix the action issue in go-gitea#30303,
specifically:

- Use opaque step header hover background to avoid transparency issue
- Un-sticky the `action-view-left` on mobile, it would otherwise overlap
into right view
- Improve commit summary, let it wrap
- Fix and comment z-indexes
- Tweak width for run-list-item-right so it wastes less space on desktop
- Synced latest changes to console colors from dark to light theme

<img width="467" alt="Screenshot 2024-04-06 at 18 58 15"
src="https://github.com/go-gitea/gitea/assets/115237/8ad26b72-6cd9-4522-8ad1-6fd86b2d0d53">
@GiteaBot GiteaBot mentioned this issue Apr 7, 2024
Merged
silverwind added a commit that referenced this issue Apr 7, 2024
@GiteaBot @silverwind
Fix checkboxes on mobile view, remove some dead css (#30308) (#30319)
d26ec5f 
Backport #30308 by @silverwind

Fix the checkbox issues in
#30303 which were existing
problems with these selectors, but made visible with
#30162.

There is a lot of dead/useless CSS in `form.css`, I only fixed the two
problems and remove CSS that was definitely not in use or needed.

<img width="369" alt="Screenshot 2024-04-06 at 18 00 08"
src="https://github.com/go-gitea/gitea/assets/115237/720f178b-1b22-48d4-8704-becb8ce66129">
<img width="405" alt="Screenshot 2024-04-06 at 18 00 28"
src="https://github.com/go-gitea/gitea/assets/115237/61c0f8ec-34af-46c5-a3fa-7c5c4d30c7d2">

Co-authored-by: silverwind <me@silverwind.io>
silverwind added a commit that referenced this issue Apr 7, 2024
@GiteaBot @silverwind
Action view mobile improvements and fixes (#30309) (#30320)
10d83ae 
Backport #30309 by @silverwind

Fix the action issue in #30303,
specifically:

- Use opaque step header hover background to avoid transparency issue
- Un-sticky the `action-view-left` on mobile, it would otherwise overlap
into right view
- Improve commit summary, let it wrap
- Fix and comment z-indexes
- Tweak width for run-list-item-right so it wastes less space on desktop
- Synced latest changes to console colors from dark to light theme

<img width="467" alt="Screenshot 2024-04-06 at 18 58 15"
src="https://github.com/go-gitea/gitea/assets/115237/8ad26b72-6cd9-4522-8ad1-6fd86b2d0d53">

Co-authored-by: silverwind <me@silverwind.io>
AvengerMoJo pushed a commit to AvengerMoJo/gitea that referenced this issue Apr 8, 2024
@silverwind @GiteaBot @AvengerMoJo
Fix checkboxes on mobile view, remove some dead css (go-gitea#30308)
5ca0851 
Fix the checkbox issues in
go-gitea#30303 which were existing
problems with these selectors, but made visible with
go-gitea#30162.

There is a lot of dead/useless CSS in `form.css`, I only fixed the two
problems and remove CSS that was definitely not in use or needed.

<img width="369" alt="Screenshot 2024-04-06 at 18 00 08"
src="https://github.com/go-gitea/gitea/assets/115237/720f178b-1b22-48d4-8704-becb8ce66129">
<img width="405" alt="Screenshot 2024-04-06 at 18 00 28"
src="https://github.com/go-gitea/gitea/assets/115237/61c0f8ec-34af-46c5-a3fa-7c5c4d30c7d2">

Co-authored-by: Giteabot <teabot@gitea.io>
AvengerMoJo pushed a commit to AvengerMoJo/gitea that referenced this issue Apr 8, 2024
@silverwind @AvengerMoJo
Action view mobile improvements and fixes (go-gitea#30309)
064d40c 
Fix the action issue in go-gitea#30303,
specifically:

- Use opaque step header hover background to avoid transparency issue
- Un-sticky the `action-view-left` on mobile, it would otherwise overlap
into right view
- Improve commit summary, let it wrap
- Fix and comment z-indexes
- Tweak width for run-list-item-right so it wastes less space on desktop
- Synced latest changes to console colors from dark to light theme

<img width="467" alt="Screenshot 2024-04-06 at 18 58 15"
src="https://github.com/go-gitea/gitea/assets/115237/8ad26b72-6cd9-4522-8ad1-6fd86b2d0d53">
DennisRasey pushed a commit to DennisRasey/forgejo that referenced this issue Apr 16, 2024
@silverwind @algernon
Fix checkboxes on mobile view, remove some dead css (#30308)
0bd1e13 
Fix the checkbox issues in
go-gitea/gitea#30303 which were existing
problems with these selectors, but made visible with
go-gitea/gitea#30162.

There is a lot of dead/useless CSS in `form.css`, I only fixed the two
problems and remove CSS that was definitely not in use or needed.

<img width="369" alt="Screenshot 2024-04-06 at 18 00 08"
src="https://github.com/go-gitea/gitea/assets/115237/720f178b-1b22-48d4-8704-becb8ce66129">
<img width="405" alt="Screenshot 2024-04-06 at 18 00 28"
src="https://github.com/go-gitea/gitea/assets/115237/61c0f8ec-34af-46c5-a3fa-7c5c4d30c7d2">

Co-authored-by: Giteabot <teabot@gitea.io>
(cherry picked from commit 644ade5ae6805a3db063b3f81a596febe49bacaf)
DennisRasey pushed a commit to DennisRasey/forgejo that referenced this issue Apr 16, 2024
@silverwind @algernon
Action view mobile improvements and fixes (#30309)
50e0587 
Fix the action issue in go-gitea/gitea#30303,
specifically:

- Use opaque step header hover background to avoid transparency issue
- Un-sticky the `action-view-left` on mobile, it would otherwise overlap
into right view
- Improve commit summary, let it wrap
- Fix and comment z-indexes
- Tweak width for run-list-item-right so it wastes less space on desktop
- Synced latest changes to console colors from dark to light theme

<img width="467" alt="Screenshot 2024-04-06 at 18 58 15"
src="https://github.com/go-gitea/gitea/assets/115237/8ad26b72-6cd9-4522-8ad1-6fd86b2d0d53">

(cherry picked from commit 0178eaec256a349371c75e582edd7fefca2085d0)
DennisRasey pushed a commit to DennisRasey/forgejo that referenced this issue Apr 16, 2024
@GiteaBot @earl-warren
Fix checkboxes on mobile view, remove some dead css (#30308) (#30319)
deeb268 
Backport #30308 by @silverwind

Fix the checkbox issues in
go-gitea/gitea#30303 which were existing
problems with these selectors, but made visible with
go-gitea/gitea#30162.

There is a lot of dead/useless CSS in `form.css`, I only fixed the two
problems and remove CSS that was definitely not in use or needed.

<img width="369" alt="Screenshot 2024-04-06 at 18 00 08"
src="https://github.com/go-gitea/gitea/assets/115237/720f178b-1b22-48d4-8704-becb8ce66129">
<img width="405" alt="Screenshot 2024-04-06 at 18 00 28"
src="https://github.com/go-gitea/gitea/assets/115237/61c0f8ec-34af-46c5-a3fa-7c5c4d30c7d2">

Co-authored-by: silverwind <me@silverwind.io>
(cherry picked from commit d26ec5f2eb74a6437f998ab0af2ae058a64e06a2)
DennisRasey pushed a commit to DennisRasey/forgejo that referenced this issue Apr 16, 2024
@GiteaBot @earl-warren
Action view mobile improvements and fixes (#30309) (#30320)
3f6f134 
Backport #30309 by @silverwind

Fix the action issue in go-gitea/gitea#30303,
specifically:

- Use opaque step header hover background to avoid transparency issue
- Un-sticky the `action-view-left` on mobile, it would otherwise overlap
into right view
- Improve commit summary, let it wrap
- Fix and comment z-indexes
- Tweak width for run-list-item-right so it wastes less space on desktop
- Synced latest changes to console colors from dark to light theme

<img width="467" alt="Screenshot 2024-04-06 at 18 58 15"
src="https://github.com/go-gitea/gitea/assets/115237/8ad26b72-6cd9-4522-8ad1-6fd86b2d0d53">

Co-authored-by: silverwind <me@silverwind.io>
(cherry picked from commit 10d83ae6435134177253569a2f244935c2bb708c)
@go-gitea go-gitea locked as resolved and limited conversation to collaborators Jul 7, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
issue/confirmed Issue has been reviewed and confirmed to be present or accepted to be implemented topic/ui Change the appearance of the Gitea UI type/bug
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@silverwind @Sirherobrine23