sp-dev-fx-webparts/samples/react-css-in-js-typestyle/README.md

1.9 KiB

"CSS in JS" with SharePoint Framework and TypeStyle

Summary

The web part demonstrates the usage of "CSS in JS" pattern with SharePoint Framework. "CSS in JS" is implemented using TypeStyle library. Read more in the blog post here.

picture of the web part in action

Used SharePoint Framework Version

1.10.0

Applies to

Solution

Solution Author(s)
react-css-in-js-typestyle @Sergei Sergeev - Mastaq

Version history

Version Date Comments
1.0 April 24, 2020 Initial release

Disclaimer

THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.


Minimal Path to Awesome

  • Clone this repository
  • in the command line run:
    • npm install
    • gulp build
    • gulp bundle --ship
    • gulp package-solution --ship
  • add the webpart to your tenant app store
  • add the app to a SharePoint site and then add the webpart to the page

Features

This Web Part illustrates the following concepts on top of the SharePoint Framework:

  • "CSS in JS" pattern adopted to SharePoint Framework
  • Theme support using SharePoint Framework's ThemeProvider
  • Dynamically reacting to theme changes without affecting performance
  • React hooks