React themes update (#198)

* themePrimary variable example added

* web part screenshot updated

samples/react-themes/README.md

@@ -21,6 +21,7 @@ react-themes | Alex Terentiev ([Sharepointalist Inc.](http://www.sharepointalist
 Version|Date|Comments
 -------|----|--------
 1.0|April 27, 2017|Initial release
+1.1|May 8, 2017| themePrimary variable example added
 
 ## 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.**

samples/react-themes/src/webparts/themes/components/Themes.module.scss

@@ -1,8 +1,13 @@
 $primary: "[theme:primaryBackground, default: #0273eb]";
 $primaryText: "[theme:primaryText, default: #333333]";
+$themePrimary: "[theme:themePrimary, default: #0078d7]";
 
 .main {
   background: $primary;
   color: $primaryText;
   font-size: 14px;
+
+  .themePrimary {
+    background: $themePrimary;
+  }
 }

samples/react-themes/src/webparts/themes/components/Themes.tsx

@@ -37,11 +37,12 @@ export default class Themes extends React.Component<IThemesProps, void> {
     return (
       <div className={styles.main}>
         <p>{'This web part shows usage of SharePoint Themes.'}</p>
-        <p>{'Background color is set to "primaryBackgroud" and font color is set to "primaryColor"'}</p>
+        <p>{'Background color of paragraphs is set to "primaryBackgroud", variables list backogrud color is set to "themePrimary", font color is set to "primaryColor"'}</p>
         <p>{'Full list of available theme variables is available in windows.__themeState__.theme property and listed below'}</p>
         <p>{'You can use theme variables in your .scss files like $yourVariable:"[theme:primaryBackground, default:#0273eb]"'}</p>
         <p>{'Change the theme (Site Settings -> Change the look) and see what\'s happenning'}</p>
         <DetailsList
+        className={styles.themePrimary}
           items={items}
           columns={_columns}
           layoutMode={DetailsListLayoutMode.justified}