From 087a2a16ce90dbd36693138342210a5b30ab2529 Mon Sep 17 00:00:00 2001 From: Omar <35841910+omarelanis@users.noreply.github.com> Date: Wed, 28 Jul 2021 02:11:33 +0100 Subject: [PATCH 1/9] Update to Hero webpart Following updates applied: - Updated to automatically detect how many items are being displayed and adjust the display layout based on this - Updated design to show the title on all images - Updated description area on hover - Updated hover effect of image to show a zoom effect when hovering over an item - General cleaning up of CSS and code --- .../HeroWebpartWebPart.manifest.json | 3 +- .../heroWebpart/HeroWebpartWebPart.ts | 41 ++--- .../heroWebpart/components/HeroLayout.tsx | 11 +- .../components/HeroWebpart.module.scss | 143 ++++++++++-------- .../heroWebpart/components/HeroWebpart.tsx | 5 - 5 files changed, 114 insertions(+), 89 deletions(-) diff --git a/samples/react-hero-webpart/src/webparts/heroWebpart/HeroWebpartWebPart.manifest.json b/samples/react-hero-webpart/src/webparts/heroWebpart/HeroWebpartWebPart.manifest.json index 92a471386..592117881 100644 --- a/samples/react-hero-webpart/src/webparts/heroWebpart/HeroWebpartWebPart.manifest.json +++ b/samples/react-hero-webpart/src/webparts/heroWebpart/HeroWebpartWebPart.manifest.json @@ -25,7 +25,8 @@ "isPaginated":false, "hideFirstPageJump":false, "hideLastPageJump":false, - "showAllHero":false + "showAllHero":false, + "totalShow":5 } }] } diff --git a/samples/react-hero-webpart/src/webparts/heroWebpart/HeroWebpartWebPart.ts b/samples/react-hero-webpart/src/webparts/heroWebpart/HeroWebpartWebPart.ts index 0b3993b64..f3a3dcda2 100644 --- a/samples/react-hero-webpart/src/webparts/heroWebpart/HeroWebpartWebPart.ts +++ b/samples/react-hero-webpart/src/webparts/heroWebpart/HeroWebpartWebPart.ts @@ -12,6 +12,7 @@ import HeroWebpart from './components/HeroWebpart'; import { IHeroWebpartProps } from './components/IHeroWebpartProps'; import { PropertyFieldToggleWithCallout } from '@pnp/spfx-property-controls/lib/PropertyFieldToggleWithCallout'; +import { PropertyFieldSliderWithCallout } from '@pnp/spfx-property-controls/lib/PropertyFieldSliderWithCallout'; import { CalloutTriggers } from '@pnp/spfx-property-controls/lib/PropertyFieldHeader'; import { PropertyFieldCollectionData, CustomCollectionFieldType } from '@pnp/spfx-property-controls/lib/PropertyFieldCollectionData'; @@ -105,27 +106,27 @@ export default class HeroWebpartWebPart extends BaseClientSideWebPart { - return ( - React.createElement(FilePicker, { - key: itemId, - context: this.context, - buttonLabel:"Select File", - onChange: (selectedFile: IFilePickerResult[]) => { - onUpdate(field.id, selectedFile); + return ( + React.createElement(FilePicker, { + key: itemId, + context: this.context, + buttonLabel:"Select File", + onChange: (selectedFile: IFilePickerResult[]) => { + onUpdate(field.id, selectedFile); + return Event; + }, + onSave: (filePickerResult: IFilePickerResult[]) => { + // write code to save file to SharePoint doc library + // if you are uploading the file via the upload tab which I've not implemented here + onUpdate(field.id, filePickerResult); return Event; - }, - onSave: (filePickerResult: IFilePickerResult[]) => { - // write code to save file to SharePoint doc library - // if you are uploading the file via the upload tab which I've not implemented here - onUpdate(field.id, filePickerResult); - return Event; - }, - hideLocalUploadTab: true, - hideLocalMultipleUploadTab: true, - hideLinkUploadTab: true - }) - ); - } + }, + hideLocalUploadTab: true, + hideLocalMultipleUploadTab: true, + hideLinkUploadTab: true + }) + ); + } } ], disabled: false diff --git a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroLayout.tsx b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroLayout.tsx index 965b0f940..bbb6bcd65 100644 --- a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroLayout.tsx +++ b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroLayout.tsx @@ -11,12 +11,15 @@ export default class Hero extends React.Component { public render(): React.ReactElement { + //const classTotal = "itemShow"+this.props.totalShow; const items = this.props.items; + const viewType = items.length==1 ? "heroOne" : items.length==2 ? "heroTwo" : items.length==3 ? "heroThree" : + items.length==4 ? "heroFour" : items.length==5 ? "heroFive" : "heroFive"; var arr = []; arr.push(items); return ( -
+
{
@@ -57,7 +61,8 @@ export default class Hero extends React.Component { ))} diff --git a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.module.scss b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.module.scss index 7bbdfd7cf..3482f5c44 100644 --- a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.module.scss +++ b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.module.scss @@ -87,76 +87,62 @@ height:530px; } - .carouselContentOne{ - :global(.ms-List-page .ms-List-cell){ - width: 100%!important; - padding:0% - } - :global(.ms-List-page .ms-List-cell div) { - width: 100%!important; - } - } - - .carouselContentTwo { - :global(.ms-List-page .ms-List-cell){ - width: 46%!important; - padding:2% - } - :global(.ms-List-page .ms-List-cell div) { - width: 100%!important; - } - } - - .carouselContentThree{ - :global(.ms-List-page .ms-List-cell){ - width: 29%!important; - padding:2% - } - :global(.ms-List-page .ms-List-cell div) { - width: 100%!important; - } - } - - .carouselContentFour{ - :global(.ms-List-page .ms-List-cell){ - width: 24%!important; - padding:1% - } - :global(.ms-List-page .ms-List-cell div) { - width: 100%!important; - } - } - - .heroTitle{ + .heroTitleHover{ @include ms-font-xl; padding-bottom: 10px; font-weight: 600; } + .heroTitle{ + @include ms-fontColor-white; + font-size: 26px; + font-weight: 600; + position: absolute; + bottom: 5px; + width: 100%; + padding: 30px 0px;; + text-align: center; + background-image: linear-gradient(180deg,transparent 15%,rgba(0,0,0,.7)); + height: fit-content!important; + } + + .info,.heroTitleHover{ + opacity: 0; + } + .heroItem { flex: auto; flex-grow: 0; flex-shrink: 0; display: flex; + .flexcontainer .flexitems:hover img{ + transform: scale(1.1); + transition: .4s ease; + } + + .flexcontainer .flexitems:hover .heroTitle{ + opacity: 0; + } + .flexcontainer .flexitems:hover .description { - opacity: 1; + background: rgba(0, 0, 0, 0.9); + .info,.heroTitleHover{ + opacity: 1; + } } .flexcontainer .flexitems .description{ - @include ms-fontColor-white; - position: absolute; - bottom: 5px; - background: rgba(0, 0, 0, 0.9); - color: #f1f1f1; - width: calc(100% - 40px); - transition: .5s ease; - opacity: 0; - color: white; - font-size: 16px; - padding: 20px 0px;; - text-align: center; - } + @include ms-fontColor-white; + position: absolute; + bottom: 0px; + background: rgba(0, 0, 0, 0); + width: calc(100% - 40px); + transition: .5s ease; + font-size: 18px; + padding: 20px 0px;; + text-align: center; + } .flexcontainer .flexitems{ overflow: hidden; @@ -164,10 +150,14 @@ .flexcontainer:nth-child(1){ flex: auto; - flex-basis: 40%; + flex-basis: 50%; flex-shrink: 1; padding-right:5px; - padding-bottom: 7px; + padding-bottom: 5px; + + .heroTitle{ + width: 100%; + } *{ height: 100%; @@ -201,33 +191,67 @@ .flexcontainer:nth-child(2) { flex: auto; - flex-basis: 60%; + flex-basis: 50%; flex-grow: 0; flex-shrink: 0; display: flex; display: flex; flex-direction: row; flex-wrap: wrap; + + .heroTitle{ + width: calc(100% - 5px); + } + img{ width:100%; height:100%; } .description { - width: calc(100% - 5px); + width: 100%; } .flexitems{ padding-right:5px; flex-basis: calc(50% - 5px); flex-shrink: 1; + flex-grow: 1; align-self: auto; position: relative; padding-bottom: 5px; + min-height: 200px; + } + + .flexitems:hover{ + margin-bottom: 5px; } } } + + :global(.heroThree) .heroItem { + .flexcontainer:nth-child(1){ + flex-basis: 60%; + .focusItem .flexitems{ + padding-bottom: 5px; + } + } + .flexcontainer:nth-child(2) + { + flex-basis: 40%; + .flexitems { + flex-basis: 50%; + flex-direction: column; + } + } + } + + :global(.heroFive) .heroItem { + .flexcontainer:nth-child(1){ + min-height: 400px; + } + } @media all and (max-width: 768px) { .heroItem { @@ -278,7 +302,6 @@ .subGroup ~ .subGroup a{ display:inline-block; width: 48%!important; - float: left; } } :global(.ms-List-page .ms-List-cell){ diff --git a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx index 2cbac12de..17ab84b0a 100644 --- a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx +++ b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx @@ -2,10 +2,7 @@ import * as React from 'react'; import styles from './HeroWebpart.module.scss'; import { IHeroWebpartProps } from './IHeroWebpartProps'; import {IHeroState} from './IHeroWebpartState'; -import { escape } from '@microsoft/sp-lodash-subset'; import { Pagination } from "@pnp/spfx-controls-react/lib/pagination"; -import { PnPClientStorage } from "@pnp/common"; -import { IHeroLayoutProps } from './IHeroLayoutProps'; import Hero from './HeroLayout'; import { sp } from '@pnp/sp'; import { Stack, IStackProps, IStackTokens } from 'office-ui-fabric-react/lib/Stack'; @@ -25,8 +22,6 @@ const tokens = { }, }; -const storage = new PnPClientStorage(); - export default class HeroWebpart extends React.Component { constructor(props: IHeroWebpartProps) { From 53250fbe72d7d187eb13b8f90d3d3d8d2f24af83 Mon Sep 17 00:00:00 2001 From: Omar <35841910+omarelanis@users.noreply.github.com> Date: Wed, 28 Jul 2021 02:33:06 +0100 Subject: [PATCH 2/9] Update HeroWebpart.module.scss --- .../components/HeroWebpart.module.scss | 61 ++++--------------- 1 file changed, 11 insertions(+), 50 deletions(-) diff --git a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.module.scss b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.module.scss index 3482f5c44..f6bcfdd38 100644 --- a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.module.scss +++ b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.module.scss @@ -253,6 +253,17 @@ } } + :global(.heroOne) .heroItem { + display: inline-block; + width: 100%; + .flexcontainer:nth-child(1){ + min-height: 400px; + .focusItem .flexitems{ + max-height: 400px; + } + } + } + @media all and (max-width: 768px) { .heroItem { flex-direction: column; @@ -264,54 +275,4 @@ } } } - - @media only screen and (max-width: 600px) { - .carouselContentOne, .carouselContentTwo, .carouselContentThree, .carouselContentFour{ - :global(.ms-List-page .ms-List-cell){ - width: 100%!important; - height: 160px; - } - :global(.ms-List-page .ms-List-cell img){ - width: 100%!important; - height: 100px!important; - } - :global(.ms-List-page .ms-List-cell .ms-Image){ - width: 100%!important; - height: 100px!important; - } - :global(.ms-List-page .ms-List-cell div){ - max-height: 100px; - } - :global(.ms-List-page .ms-List-cell div){ - max-height: 100px; - } - :global(.ms-List-page .ms-List-cell .ms-DocumentCardLocation){ - display:none; - } - :global(.ms-List-page .ms-List-cell){ - .subGroup{ - display:none; - } - } - :global(.ms-List-page .ms-List-cell){ - .subGroup ~ .subGroup{ - display:inline-block; - } - } - :global(.ms-List-page .ms-List-cell){ - .subGroup ~ .subGroup a{ - display:inline-block; - width: 48%!important; - } - } - :global(.ms-List-page .ms-List-cell){ - .subGroup ~ .subGroup a *{ - font-size:8px - } - } - :global(.ms-List-page .ms-List-cell .ms-DocumentCardDetails .ms-DocumentCardTitle:nth-child(2)){ - display:none; - } - } - } } From 5ee69a21e57162457f434f41fd2c8b3183f7925e Mon Sep 17 00:00:00 2001 From: Omar <35841910+omarelanis@users.noreply.github.com> Date: Wed, 28 Jul 2021 02:41:06 +0100 Subject: [PATCH 3/9] Update HeroLayout.tsx Fix hyperlink --- .../src/webparts/heroWebpart/components/HeroLayout.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroLayout.tsx b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroLayout.tsx index bbb6bcd65..dfd8184c3 100644 --- a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroLayout.tsx +++ b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroLayout.tsx @@ -40,7 +40,7 @@ export default class Hero extends React.Component { const thumbRend = "https://media.akamai.odsp.cdn.office.net/uksouth1-mediap.svc.ms/transform/thumbnail?provider=url&inputFormat=jpg&docid="; const secondItems = items.slice(1,5); const firstItem = items.slice(0,1)[0]; - var firstItemUrl = firstItem.filePicker[0].Hyperlink ? firstItem.filePicker[0].Hyperlink : "#"; + var firstItemUrl = firstItem.Hyperlink ? firstItem.Hyperlink : "#"; var smalltemUrl; return(
@@ -57,7 +57,7 @@ export default class Hero extends React.Component {
{secondItems.map((item) => ( - smalltemUrl= item.filePicker[0].Hyperlink ? item.filePicker[0].Hyperlink : "#", + smalltemUrl= item.Hyperlink ? item.Hyperlink : "#",
From 94a7f97ab5722216fcdd9d78a70c73d033f5ce31 Mon Sep 17 00:00:00 2001 From: Omar <35841910+omarelanis@users.noreply.github.com> Date: Wed, 28 Jul 2021 12:46:32 +0100 Subject: [PATCH 4/9] Update HeroWebpart.module.scss Update to hero styling for the different layout options --- .../components/HeroWebpart.module.scss | 52 +++++++++++++------ 1 file changed, 37 insertions(+), 15 deletions(-) diff --git a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.module.scss b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.module.scss index f6bcfdd38..f7e3970da 100644 --- a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.module.scss +++ b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.module.scss @@ -72,21 +72,6 @@ } } - .carouselContent{ - color:"[theme: themeSecondary, default: #0078d7]"; - min-height:600px; - height:600px; - } - .carouselButtonsContainer{ - color:"[theme: themeSecondary, default: #0078d7]"; - } - - .carouselContentOne, .carouselContentTwo, .carouselContentThree, .carouselContentFour{ - color:"[theme: themeSecondary, default: #0078d7]"; - min-height:530px; - height:530px; - } - .heroTitleHover{ @include ms-font-xl; padding-bottom: 10px; @@ -264,6 +249,43 @@ } } + :global(.heroThree) .heroItem .flexcontainer:nth-child(2) { + .heroTitle { + font-size: 24px; + } + .heroTitleHover{ + font-size: 22px; + } + .info{ + font-size: 18px; + } + } + + :global(.heroFour) .heroItem .flexcontainer:nth-child(2){ + .heroTitle { + font-size: 20px; + } + .heroTitleHover{ + font-size: 18px; + } + .info{ + font-size: 14px; + } + } + + :global(.heroFive) .heroItem .flexcontainer:nth-child(2){ + .heroTitle { + font-size: 20px; + } + .heroTitleHover{ + font-size: 18px; + } + .info{ + font-size: 14px; + } + } + + @media all and (max-width: 768px) { .heroItem { flex-direction: column; From e43321bcc29102f6a338426dc2c9af851fd404a2 Mon Sep 17 00:00:00 2001 From: Omar <35841910+omarelanis@users.noreply.github.com> Date: Thu, 29 Jul 2021 10:22:37 +0100 Subject: [PATCH 5/9] Update to rerender on item change Refreshes the webpart when an item is changed within the properties panel --- .../src/webparts/heroWebpart/components/HeroWebpart.tsx | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx index 17ab84b0a..b2eb9edf2 100644 --- a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx +++ b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx @@ -68,6 +68,15 @@ export default class HeroWebpart extends React.Component { if(this.state.items.length<=0){ this._getItems(); From 6acf4addf4957d2bc31552b1d157d9fe188bbfdf Mon Sep 17 00:00:00 2001 From: Omar <35841910+omarelanis@users.noreply.github.com> Date: Thu, 29 Jul 2021 10:25:01 +0100 Subject: [PATCH 6/9] Update to rerender on item change Refreshes the webpart when an item is changed within the properties panel --- .../src/webparts/heroWebpart/components/HeroWebpart.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx index b2eb9edf2..00b33f2ed 100644 --- a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx +++ b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx @@ -73,7 +73,7 @@ export default class HeroWebpart extends React.Component Date: Thu, 29 Jul 2021 10:53:22 +0100 Subject: [PATCH 7/9] Rerender paginated list on collection update Rerender paginated list on collection update --- .../src/webparts/heroWebpart/HeroWebpartWebPart.ts | 3 ++- .../webparts/heroWebpart/components/HeroWebpart.tsx | 13 ++++++++----- 2 files changed, 10 insertions(+), 6 deletions(-) diff --git a/samples/react-hero-webpart/src/webparts/heroWebpart/HeroWebpartWebPart.ts b/samples/react-hero-webpart/src/webparts/heroWebpart/HeroWebpartWebPart.ts index f3a3dcda2..4ca51d8d3 100644 --- a/samples/react-hero-webpart/src/webparts/heroWebpart/HeroWebpartWebPart.ts +++ b/samples/react-hero-webpart/src/webparts/heroWebpart/HeroWebpartWebPart.ts @@ -126,7 +126,8 @@ export default class HeroWebpartWebPart extends BaseClientSideWebPart { From 0a5f66ca91b18eec28006d0917ddfc9568fceabb Mon Sep 17 00:00:00 2001 From: Omar <35841910+omarelanis@users.noreply.github.com> Date: Thu, 29 Jul 2021 16:14:36 +0100 Subject: [PATCH 8/9] Update HeroWebpart.tsx Fix SetState loop --- .../src/webparts/heroWebpart/components/HeroWebpart.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx index 0706a9394..4230376c5 100644 --- a/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx +++ b/samples/react-hero-webpart/src/webparts/heroWebpart/components/HeroWebpart.tsx @@ -71,7 +71,7 @@ export default class HeroWebpart extends React.Component Date: Sun, 1 Aug 2021 21:15:48 -0400 Subject: [PATCH 9/9] Updated readme, sample, solutions version --- samples/react-hero-webpart/README.md | 1 + samples/react-hero-webpart/assets/sample.json | 2 +- samples/react-hero-webpart/config/package-solution.json | 2 +- samples/react-hero-webpart/package.json | 2 +- .../71d58a4f-1896-46aa-94a5-dbef33d14166.manifest.json | 3 ++- 5 files changed, 6 insertions(+), 4 deletions(-) diff --git a/samples/react-hero-webpart/README.md b/samples/react-hero-webpart/README.md index 94f2f4ea1..a01a46978 100644 --- a/samples/react-hero-webpart/README.md +++ b/samples/react-hero-webpart/README.md @@ -33,6 +33,7 @@ hero-webpart | [Omar El-Anis](https://github.com/omarelanis) @ SP Bytes www.spby Version|Date|Comments -------|----|-------- +1.2|July 27, 2021|Updated to automatically detect how many items are being displayed and adjust the display layout based on this
Updated design to show the title on all images
Updated description area on hover
Updated hover effect of image to show a zoom effect when hovering over an item
General cleaning up of CSS and code 1.1|March 10, 2021|Update comment 1.0|January 29, 2021|Initial release diff --git a/samples/react-hero-webpart/assets/sample.json b/samples/react-hero-webpart/assets/sample.json index dd05769af..c0ac18f2a 100644 --- a/samples/react-hero-webpart/assets/sample.json +++ b/samples/react-hero-webpart/assets/sample.json @@ -9,7 +9,7 @@ "This solution creates a customisable Hero web part, it uses a stored collection from the PnP PropertyFieldCollectionData control " ], "creationDateTime": "2021-04-02", - "updateDateTime": "2021-04-02", + "updateDateTime": "2021-07-27", "products": [ "SharePoint", "Office" diff --git a/samples/react-hero-webpart/config/package-solution.json b/samples/react-hero-webpart/config/package-solution.json index 15f4a7ee5..3a5037c60 100644 --- a/samples/react-hero-webpart/config/package-solution.json +++ b/samples/react-hero-webpart/config/package-solution.json @@ -3,7 +3,7 @@ "solution": { "name": "Hero Layout Webpart", "id": "5efc0426-3e59-4fc7-b638-73eb77aaf788", - "version": "1.0.0.0", + "version": "1.2.0.0", "includeClientSideAssets": true, "skipFeatureDeployment": true, "isDomainIsolated": false, diff --git a/samples/react-hero-webpart/package.json b/samples/react-hero-webpart/package.json index edbf1a1a0..6fd635d6b 100644 --- a/samples/react-hero-webpart/package.json +++ b/samples/react-hero-webpart/package.json @@ -1,6 +1,6 @@ { "name": "hero-webpart", - "version": "0.0.1", + "version": "1.2.0", "private": true, "main": "lib/index.js", "scripts": { diff --git a/samples/react-hero-webpart/release/manifests/71d58a4f-1896-46aa-94a5-dbef33d14166.manifest.json b/samples/react-hero-webpart/release/manifests/71d58a4f-1896-46aa-94a5-dbef33d14166.manifest.json index 9156a5bb9..a0959b101 100644 --- a/samples/react-hero-webpart/release/manifests/71d58a4f-1896-46aa-94a5-dbef33d14166.manifest.json +++ b/samples/react-hero-webpart/release/manifests/71d58a4f-1896-46aa-94a5-dbef33d14166.manifest.json @@ -26,7 +26,8 @@ "isPaginated": false, "hideFirstPageJump": false, "hideLastPageJump": false, - "showAllHero": false + "showAllHero": false, + "totalShow": 5 } } ],