Oct 25 2021 03:33 AM
We have the following built-in modern UI:-
Where we are trying to get the below UI, which have the following changes; Button color is different, Font Family is different & Font size/color is different , as follow:-
so is this something we can achieve in SharePoint online modern UI? and how?
Oct 25 2021 04:12 AM
@john john the button color is determined by the theme you have chosen in the "Change the look" menu setting.
You can set any column to have a different background, color, font-family, font-size etc by using JSON list column formatting. You select format this column then select advanced mode and add in the appropriate css styles. So in the example image below the expiry date column has been formatted:
with the following JSON:
{
"$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json",
"elmType": "div",
"txtContent": "@currentField",
"style": {
"background-color": "=if([$Status] == 'Failed', '#7d0000', ((if(@currentField <= @now, 'red', if((@currentField >= @now && @currentField <= @now + 7776000000),'orange','green')))",
"color": "white",
"font-family": "Rockwell",
"font-size": "22px"
}
}
You can see examples of JSON list and view column formatting at https://github.com/pnp/List-Formatting
Rob
Los Gallardos
Intranet, SharePoint and Power Platform Manager (and classic 1967 Morris Traveller driver)
Oct 25 2021 04:22 AM - edited Oct 25 2021 04:27 AM
@RobElliott but can i change the grid header font size and color using the JSON ? or it will only change the grid content font size and color?
Also i were trying to find a solution to change the whole font size,color, and size for the whole site and not just inside each list view...
Second point, for the button we also need to change the shape of the button to be bigger and have rounded edges as shown in the screen i provided..
Oct 25 2021 04:29 AM - edited Oct 25 2021 04:30 AM
@john john you can't do either of those out-of-the box but I believe you can with SPFx, although as we are not allowed it at my company I have no experience of it.
Rob
Los Gallardos
Intranet, SharePoint and Power Platform Manager (and classic 1967 Morris Traveller driver)