Lionel CASTRO
Rank: #2970
9Views
1Comments
Solved
[Lisbon Template] Responsive Table Records doesn't work. Cannot find ResponsiveBehavior property.
Question
UI
Reactive
Forge
Lisbon Template
Forge component by OutSystems R&D
33
Published on 09 Mar 2020
Application Type
Reactive
Service Studio Version
11.9.2 (Build 34232)
Platform Version
11.10.0 (Build 22910)

Hi dear comunity members,

I create a very simple React Web app based on Silk UI theme. I drag and drop "Responsible Table Records" widget in a container and then I drag and drop my table on this widget. My table contains only one record for testing.

1) Test with large sreen is OK : all columns are displayed

2) Test with small screen shows only one column with the value of the first column. There's no dropdown icon to display the other columns

3) When I check the properties of the widget, there is no ResponsiveBehavior property (as it should be regarding the documentation of this widget)


Can someone help me to solve my issue ?

Best Regards,

Lionel

0
0
on 2020-11-26
Copy link to comment
Lionel CASTRO
Rank: #2970
Solution

I solved my issue in the ResponsiveTableRecords RichWidget style sheet by replacing "before" pseudo-element with "after". Exemple below :

.Responsive .TableRecords td:first-child:after {
        content: "\f0dd";
        float: right;
        font-family: FontAwesome;
        color: #AAA;
        margin-right:5px;
}

Now the arrow is displayed correctly when responsive is activated on small screens :


My feeling is that there is a conflict in CSS. Using "after" instead of "before" is a workaround and contributes to solve this conflict.

I hope that this could help anyone having such problem.


0
0
on 2020-11-28
Copy link to comment