We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
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
H2O Wave 0.25.2 20230317093151 Linux Rocky 8.7 Firefox Extended Support Release 102.8.0esr
When creating a column with tags and setting the cell overflow to wrap, tags within a cell will overlap and split across lines
I would expect tags to not overlap, and only split across lines if column width was less than the tag width
Run the following app:
# Table / Tags # Use tags in order to emphasize a specific value. For multiple tags in a single row use `,` as a delimiter. # --- from h2o_wave import main, app, Q, ui _id = 0 class Issue: def __init__(self, text: str, tags: str): global _id _id += 1 self.id = f'I{_id}' self.text = text self.tags = tags # Create some issues issues = [] issues.append(Issue("Issue 1", "DONE,SUCCESS,Feature")) issues.append(Issue("Issue 2", "FAIL,Critical")) issues.append(Issue("Issue 3", "DONE,SUCCESS,Critical, Feature")) issues.append(Issue("Issue 4", "DONE,SUCCESS,Backlog")) issues.append(Issue("Issue 5", "DONE,SUCCESS,Refactor,Backlog")) columns = [ ui.table_column(name='text', label='Issue', min_width='100px'), ui.table_column(name='tag', label='Badge', max_width='150px', cell_overflow='wrap', cell_type=ui.tag_table_cell_type(name='tags', tags=[ ui.tag(label='FAIL', color='$red'), ui.tag(label='Critical', color= '$red'), ui.tag(label='DONE', color='#D2E3F8', label_color='#053975'), ui.tag(label='Feature', color= '$green'), ui.tag(label='Backlog', color= '$yellow'), ui.tag(label='Refactor', color= '$orange'), ui.tag(label='SUCCESS', color='$mint'), ])), ] @app('/demo') async def serve(q: Q): q.page['example'] = ui.form_card(box='1 1 -1 -1', items=[ ui.table( name='issues', columns=columns, height='500px', width='300px', rows=[ui.table_row(name=issue.id, cells=[issue.text, issue.tags]) for issue in issues], ) ]) await q.page.save()
The text was updated successfully, but these errors were encountered:
fix: display tags in wrapped cells correctly #1917
d7e7a70
chore: simplify tag stylings #1917
c2c7986
chore: tag styling refactor #1917
b543de4
chore: replace div with span #1917
890dd2e
fix: make equal margins for wrapped and not wrapped tags #1917
6666ff3
chore: remove unused type #1917
46ff4e5
chore: add vertical margin only if tags should be wrapped #1917
0be9414
fix: Display tags in wrapped cells correctly #1917 (#1925)
06fd39d
marek-mihok
Successfully merging a pull request may close this issue.
Wave SDK Version, OS
H2O Wave 0.25.2 20230317093151
Linux Rocky 8.7
Firefox Extended Support Release 102.8.0esr
Actual behavior
When creating a column with tags and setting the cell overflow to wrap, tags within a cell will overlap and split across lines
Expected behavior
I would expect tags to not overlap, and only split across lines if column width was less than the tag width
Steps To Reproduce
Run the following app:
The text was updated successfully, but these errors were encountered: