Can I use css to change the list collection alignment and text style in list title field?

Hi:

I am rebuilding a classic app in the new default format.

One problem I am having is that in the classic app I have (1) a text component (2) below the text an inline list which opens to a detail screen for each item in the list. This pattern repeats several times on the screen. This looks neat because all the text and list items align left.

In the new format I have the same basic structure: (1) a text component (2) below the text a list collection linking to detailed screen on click. BUT: this now looks very messy because (a) the list items are all indented slightly on the left - so the screen layout on the left is irregular and (2) whereas the text for the title of the item in the list is normal (not bold) in the new format the list text is either BOLD (in the title of the list item) or GREY (in the description of the list item).

I would like regular black in the title field of the list collection (I only need one text field) - not bold / not grey and aligned left with the normal text entry components.

I have a glide business plan - so I think I should be able to add css to enable this. But I do not know how to do it.

Can anyone help?

Thanks

Paul

I will try to upload a screen shot of the existing classic app (which I am trying to replicate) and the new version as it is currently:

.your-list p[class*="StyledP2"] {
font-weight: 500;
}

With your-list being your collection’s class name.

1 Like

Thanks

I have done this successfully. I have also fixed the indent issue - where the list text does not align with the text above - by setting a negative left margin for the list text (-5px). I am not sure whether this is a good solution but it appears to fix it on my screen.

Paul

1 Like

That sounds like the correct way to do it.