SharePoint のリストの行の背景を、1行ずつ変更する

f:id:tecchan365:20190505091424p:plain SharePointのリストの行の背景を、1行ずつ変更する方法をご紹介します。
何も手を加えなければ、のっぺりとした感じになりますよね。

ビューの書式設定をする

変更したいビューを表示し、以下のコードを、ビューの書式設定に入力します。

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/view-formatting.schema.json",
  "additionalRowClass": "= if (@rowIndex % 2 == 0 , 'ms-bgColor-themeLighter ms-bgColor-themeLight--hover' , '' )"
}

f:id:tecchan365:20190504194137g:plain

css クラスに「ms-bgColor-themeLighter ms-bgColor-themeLight--hover」と設定しているので、
サイトのデザインに応じたカラーが表示されるようになっています。

SharePoint の配色については、下記を参照するのが良いかもしれません。
fluentfabric.azurewebsites.net

余談

クラシックのJS Linkを、モダンUIに移すときはどうしましょうか…(;_:)
かなりカスタマイズしてしまっている現実。