Permanently change the font size and weight inside a sharepoint modern page (the class name keeps changinag)

Question

I have added the list modern web part inside a sharepoint modern page >> and i need to change the font size and weight >> so using the F12 dev tools i inspected the related class (.root-135) as follow:-

and i added this style using the modern script web part :-

    .root-135 {  

        font-size: 15px;  
        font-weight: bold;  
    }  

but after couple of minutes the bold and size increase effect were removed, i recheck the class name and i found that it was changed from .root-135 to .root-152.. so my questions are:-

1) How i can permanently change the font size and weight inside a sharepoint modern page?

2) if using custom script using the modern script web part will not work, then what are the other approaches i can follow to increase the font size + font weight of my modern page?

Answer 1

Hi @john john ,

I noticed that you have already got a solution for this requirement in this post.
Just go to column settings > format this column and use the JSON below:

{  
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",  
  "elmType": "div",  
  "style": {  
    "font-size": "20px",  
    "font-weight":"bold"  
  },  
  "txtContent": "@currentField.title"  
}  

---

If the answer is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.