Last active
January 22, 2022 11:13
-
-
Save tecchan1107/b52cc80483bd08dfea21f3cf179c3f4b to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/tile-formatting.schema.json", | |
| "width": 300, | |
| "height": 450, | |
| "hideSelection": true, | |
| "formatter": { | |
| "elmType": "div", | |
| "style": { | |
| "width": "95%", | |
| "height": "95%", | |
| "border": "1px solid", | |
| "box-shadow": "0 3.2px 7.2px 0", | |
| "border-radius": "6px", | |
| "display": "flex", | |
| "flex-direction": "column", | |
| "justify-content": "center" | |
| }, | |
| "attributes": { | |
| "class": "ms-fontColor-neutralTertiaryAlt" | |
| }, | |
| "children": [ | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "width": "70%", | |
| "display": "flex", | |
| "flex-direction": "row-reverse", | |
| "height": "30px" | |
| }, | |
| "children": [ | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "position": "relative", | |
| "display": "flex", | |
| "justify-content": "center" | |
| }, | |
| "children": [ | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "position": "absolute", | |
| "width": "50px", | |
| "height": "50px", | |
| "border-radius": "50%", | |
| "border": "2px solid", | |
| "z-index": "2", | |
| "display": "flex", | |
| "justify-content": "center", | |
| "align-items": "center", | |
| "font-size": "28px" | |
| }, | |
| "attributes": { | |
| "class": "ms-bgColor-themePrimary ms-fontColor-white", | |
| "iconName": "[$Icon]" | |
| } | |
| }, | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "position": "absolute", | |
| "top": "45px", | |
| "z-index": "1" | |
| }, | |
| "children": [ | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "width": "40px", | |
| "height": "20px" | |
| }, | |
| "attributes": { | |
| "class": "ms-bgColor-themePrimary" | |
| } | |
| }, | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "border-left": "20px solid", | |
| "border-right": "20px solid", | |
| "border-bottom": "10px solid transparent" | |
| }, | |
| "attributes": { | |
| "class": "ms-fontColor-themePrimary" | |
| } | |
| } | |
| ] | |
| } | |
| ] | |
| } | |
| ] | |
| }, | |
| { | |
| "elmType": "img", | |
| "style": { | |
| "width": "150px", | |
| "height": "150px", | |
| "border-radius": "50%", | |
| "border": "1px solid" | |
| }, | |
| "attributes": { | |
| "src": "=getUserImage([$To.email], 'L')", | |
| "class": "ms-fontColor-neutralTertiaryAlt" | |
| }, | |
| "defaultHoverField": "[$To]" | |
| }, | |
| { | |
| "elmType": "div", | |
| "txtContent": "[$To.title]", | |
| "style": { | |
| "font-size": "15px", | |
| "padding": "5px" | |
| }, | |
| "attributes": { | |
| "class": "ms-fontColor-neutralSecondary" | |
| } | |
| }, | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "display": "flex", | |
| "flex-direction": "column", | |
| "width": "85%", | |
| "height": "27%", | |
| "overflow": "hidden", | |
| "margin-top": "15px" | |
| }, | |
| "attributes": { | |
| "class": "ms-fontColor-neutralSecondary" | |
| }, | |
| "children": [ | |
| { | |
| "elmType": "div", | |
| "txtContent": "[$Title]", | |
| "style": { | |
| "font-weight": "bold", | |
| "font-size": "23px" | |
| } | |
| }, | |
| { | |
| "elmType": "div", | |
| "txtContent": "[$Description]", | |
| "style": { | |
| "margin-top": "3px" | |
| } | |
| } | |
| ] | |
| }, | |
| { | |
| "elmType": "div", | |
| "txtContent": "= 'From : ' + [$From.title]", | |
| "defaultHoverField": "[$From]", | |
| "style": { | |
| "width": "90%", | |
| "display": "flex", | |
| "flex-direction": "row-reverse", | |
| "height": "25px", | |
| "align-items": "center", | |
| "overflow": "hidden" | |
| }, | |
| "attributes": { | |
| "class": "ms-fontColor-neutralSecondary" | |
| } | |
| }, | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "width": "90%", | |
| "display": "flex", | |
| "justify-content": "space-between", | |
| "font-size": "17px", | |
| "margin-top": "10px" | |
| }, | |
| "children": [ | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "display": "flex", | |
| "justify-content": "center", | |
| "align-items": "center", | |
| "width": "30px", | |
| "height": "30px", | |
| "cursor": "pointer", | |
| "border-radius": "50%" | |
| }, | |
| "attributes": { | |
| "iconName": "OpenPane", | |
| "class": "ms-fontColor-themePrimary ms-fontColor-themeDark--hover ms-bgColor-themeLighter--hover" | |
| }, | |
| "customRowAction": { | |
| "action": "defaultClick" | |
| } | |
| }, | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "display": "flex", | |
| "flex-direction": "row" | |
| }, | |
| "children": [ | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "display": "flex", | |
| "flex-direction": "row", | |
| "align-items": "center", | |
| "cursor": "pointer", | |
| "padding": "3px 5px 3px 5px", | |
| "border-radius": "5px" | |
| }, | |
| "attributes": { | |
| "class": "ms-fontColor-themePrimary ms-fontColor-themeDark--hover ms-bgColor-themeLighter--hover" | |
| }, | |
| "customRowAction": { | |
| "action": "setValue", | |
| "actionInput": { | |
| "Likes": "=if(indexOf([$Likes.email] , @me) > -1 , removeFrom([$Likes.email] , @me) , appendTo([$Likes.email] , @me) )" | |
| } | |
| }, | |
| "customCardProps": { | |
| "openOnEvent": "hover", | |
| "directionalHint": "rightCenter", | |
| "isBeakVisible": true, | |
| "formatter": { | |
| "elmType": "div", | |
| "style": { | |
| "max-height": "300px", | |
| "padding": "5px 20px 5px 20px", | |
| "display": "flex", | |
| "flex-direction": "column" | |
| }, | |
| "children": [ | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "padding": "10px", | |
| "font-weight": "bold", | |
| "font-size": "20px", | |
| "display": "flex", | |
| "align-items": "center", | |
| "flex-direction": "row" | |
| }, | |
| "attributes": { | |
| "class": "ms-fontColor-themePrimary" | |
| }, | |
| "children": [ | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "margin-right": "5px" | |
| }, | |
| "attributes": { | |
| "iconName": "HeartFill" | |
| } | |
| }, | |
| { | |
| "elmType": "div", | |
| "txtContent": "=length([$Likes])" | |
| } | |
| ] | |
| }, | |
| { | |
| "elmType": "div", | |
| "children": [ | |
| { | |
| "forEach": "personIterator in [$Likes]", | |
| "elmType": "div", | |
| "style": { | |
| "margin-bottom": "5px", | |
| "display": "flex", | |
| "align-items": "center" | |
| }, | |
| "children": [ | |
| { | |
| "elmType": "img", | |
| "style": { | |
| "width": "32px", | |
| "height": "32px", | |
| "border-radius": "50%", | |
| "margin-right": "5px" | |
| }, | |
| "attributes": { | |
| "src": "=getUserImage([$personIterator.email], 'S')", | |
| "title": "[$personIterator.title]" | |
| } | |
| }, | |
| { | |
| "elmType": "span", | |
| "txtContent": "[$personIterator.title]" | |
| } | |
| ] | |
| } | |
| ] | |
| } | |
| ] | |
| } | |
| }, | |
| "children": [ | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "margin-right": "5px" | |
| }, | |
| "attributes": { | |
| "iconName": "=if(indexOf([$Likes.email] , @me) > -1 , 'HeartFill' , 'Heart' )" | |
| } | |
| }, | |
| { | |
| "elmType": "div", | |
| "txtContent": "=length([$Likes])" | |
| } | |
| ] | |
| }, | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "display": "flex", | |
| "flex-direction": "row", | |
| "align-items": "center", | |
| "cursor": "pointer", | |
| "padding": "3px 5px 3px 5px", | |
| "border-radius": "5px" | |
| }, | |
| "attributes": { | |
| "class": "ms-fontColor-themePrimary ms-fontColor-themeDark--hover ms-bgColor-themeLighter--hover" | |
| }, | |
| "customRowAction": { | |
| "action": "defaultClick" | |
| }, | |
| "children": [ | |
| { | |
| "elmType": "div", | |
| "style": { | |
| "margin-right": "5px" | |
| }, | |
| "attributes": { | |
| "iconName": "Comment" | |
| } | |
| }, | |
| { | |
| "elmType": "div", | |
| "txtContent": "=if([$_CommentCount] == '' , 0 ,[$_CommentCount]) " | |
| } | |
| ] | |
| } | |
| ] | |
| } | |
| ] | |
| } | |
| ] | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment