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.

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

[Bug]: Column Overflow Issue in Fixed Column Table #1272

Open
1 task done
hoahai opened this issue Oct 30, 2024 · 4 comments
Open
1 task done

[Bug]: Column Overflow Issue in Fixed Column Table #1272

hoahai opened this issue Oct 30, 2024 · 4 comments
Assignees
Labels
Components Dedicated to Frontend Visual Components Javascript Frontend Pull requests that update Javascript code

Comments

@hoahai
Copy link

hoahai commented Oct 30, 2024

Is there an existing issue for this?

  • I have searched the existing issues

Current Behavior

In a table with fixed columns, when scrolling horizontally, text from other columns overlays on top of the fixed columns, causing readability issues. Additionally, applying background color to rows solves the overlay issue for the row contents but does not affect the header. The background color fix for rows also fails when a row is selected or hovered.

Current Behavior

  • Text from scrollable columns overlays on fixed columns.
  • Row background workaround fails to apply to the header and does not work reliably on row selection or hover.
image

Expected Behavior

  • Fixed columns should retain a consistent background that prevents text overlay from scrollable columns.
  • Background color should apply to both rows and header consistently, regardless of selection or hover states.

Steps to reproduce

  1. Create a table with fixed columns and some scrollable columns.
  2. Add data with both active and inactive states to observe background color application.
  3. Scroll horizontally to observe the overlay issue.

Environment

OS: MacOs
Browser: Google Chrome

Additional Information

No response

@adnanqaops adnanqaops added Javascript Frontend Pull requests that update Javascript code Components Dedicated to Frontend Visual Components labels Nov 12, 2024
@adnanqaops adnanqaops moved this to 🆕 New in Lowcoder Nov 12, 2024
@adnanqaops
Copy link
Collaborator

  1. Text Overlay issue has been resolved.
  2. Background color should apply to both rows and header consistently, regardless of selection or hover states. --> This is not working fine. Background color is not applied to Selection or Hover States. and Selection or Hover State color is not customisable as well. It remains set to default settings.
Screenshot 2024-12-11 at 2 57 07 PM

@hoahai
Copy link
Author

hoahai commented Dec 11, 2024

@adnanqaops for #1, if the Name Column is set as "Fixed", it should be on top of the Date Column instead being scaled down in width
As you can see in the screenshot, some text in Date columns (Both header and row) is showing in the Name Column instead of being hidden under the Name Column
image

@adnanqaops
Copy link
Collaborator

@iamfaran , here's the App with demo of the issue :

V2.6.4.json

iamfaran added a commit to iamfaran/lowcoder that referenced this issue Mar 25, 2025
FalkWolsky added a commit that referenced this issue Mar 25, 2025
@prinskarnatie
Copy link

There is 1 remaining issue. If multi select is enabled (shown as the first column), horizontal grid lines disappear on some of the rows.

Image

In the screenshot all the columns except for the last one is fixed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Components Dedicated to Frontend Visual Components Javascript Frontend Pull requests that update Javascript code
Projects
Status: 🆕 New
Development

No branches or pull requests

5 participants