How to use the @uifabric/experiments.renderFolderCoverWithLayout function in @uifabric/experiments

To help you get started, we’ve selected a few @uifabric/experiments examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github OfficeDev / office-ui-fabric-react / apps / vr-tests / src / stories / FolderCover.stories.tsx View on Github external
const FolderCoverWithImage: React.StatelessComponent = (
  props: IFolderCoverWithImageProps
): JSX.Element => {
  const { originalImageSize, ...folderCoverProps } = props;

  const folderCover = ;

  const { contentSize } = getFolderCoverLayout(folderCover);

  const imageSize = fitContentToBounds({
    contentSize: originalImageSize,
    boundsSize: contentSize,
    mode: 'cover'
  });

  return renderFolderCoverWithLayout(folderCover, {
    children: (
      <img src="{`//placehold.it/${Math.round(imageSize.width)}x${Math.round(imageSize.height)}`}">
    )
  });
};
github OfficeDev / office-ui-fabric-react / packages / experiments / src / components / FolderCover / examples / FolderCover.Basic.Example.tsx View on Github external
const FolderCoverWithImage: React.StatelessComponent = (props: IFolderCoverWithImageProps): JSX.Element =&gt; {
  const { originalImageSize, ...folderCoverProps } = props;

  const folderCover = ;

  const { contentSize } = getFolderCoverLayout(folderCover);

  const imageSize = fitContentToBounds({
    contentSize: originalImageSize,
    boundsSize: contentSize,
    mode: 'cover'
  });

  return renderFolderCoverWithLayout(folderCover, {
    children: <img src="{`//placehold.it/${Math.round(imageSize.width)}x${Math.round(imageSize.height)}`}">
  });
};