Add tailwind base

samples/react-birthdays-per-month/assets/tailwind.css

@@ -1,2 +1,3 @@
+@import "tailwindcss/base";
 @import "tailwindcss/components";
 @import "tailwindcss/utilities";

samples/react-birthdays-per-month/config/package-solution.json

@@ -3,7 +3,7 @@
   "solution": {
     "name": "React Birthdays Per Month",
     "id": "e4cd97a3-4515-42cd-8a12-f765eaf60caa",
-    "version": "1.1.0.0",
+    "version": "1.2.0.0",
     "includeClientSideAssets": true,
     "skipFeatureDeployment": true,
     "isDomainIsolated": false,

samples/react-birthdays-per-month/src/webparts/birthdaysPerMonth/BirthdaysPerMonthWebPart.manifest.json

@@ -21,7 +21,6 @@
     "title": { "default": "Birthdays Per Month" },
     "description": { "default": "" },
     "officeFabricIconFontName": "BirthdayCake",
-    "properties": {
-    }
+    "properties": {}
   }]
 }

samples/react-birthdays-per-month/src/webparts/birthdaysPerMonth/BirthdaysPerMonthWebPart.ts

@@ -3,12 +3,10 @@ import * as ReactDom from "react-dom";
 import { Version } from "@microsoft/sp-core-library";
 import {
   IPropertyPaneConfiguration,
-  PropertyPaneTextField,
 } from "@microsoft/sp-property-pane";
 import { BaseClientSideWebPart } from "@microsoft/sp-webpart-base";
 import { spfi, SPFx, SPFI } from "@pnp/sp";
 
-import * as strings from "BirthdaysPerMonthWebPartStrings";
 import "../../../assets/dist/tailwind.css";
 import {
   BirthdaysPerMonth,
@@ -17,9 +15,7 @@ import {
 import { BirthdaysInMonth } from "../../models/BirthdaysInMonth";
 import { SharePointService } from "../../utils/SharePointService";
 
-export interface IBirthdaysPerMonthWebPartProps {
-  description: string;
-}
+export interface IBirthdaysPerMonthWebPartProps {}
 
 export default class BirthdaysPerMonthWebPart extends BaseClientSideWebPart<IBirthdaysPerMonthWebPartProps> {
   private _spfi: SPFI;
@@ -54,19 +50,7 @@ export default class BirthdaysPerMonthWebPart extends BaseClientSideWebPart<IBir
     return {
       pages: [
         {
-          header: {
-            description: strings.PropertyPaneDescription,
-          },
-          groups: [
-            {
-              groupName: strings.BasicGroupName,
-              groupFields: [
-                PropertyPaneTextField("description", {
-                  label: strings.DescriptionFieldLabel,
-                }),
-              ],
-            },
-          ],
+          groups: [],
         },
       ],
     };

samples/react-birthdays-per-month/src/webparts/birthdaysPerMonth/components/MonthSection.tsx

@@ -3,6 +3,7 @@ import formatDistance from "date-fns/formatDistance";
 import set from "date-fns/set";
 import { Icon, IconButton } from "office-ui-fabric-react";
 import * as React from "react";
+
 import { BirthdaysInMonth } from "../../../models/BirthdaysInMonth";
 
 interface IMonthSectionProps {

samples/react-birthdays-per-month/tailwind.config.js

@@ -1,9 +1,12 @@
 /** @type {import('tailwindcss').Config} */
 module.exports = {
-  prefix: 'tw-',
+  prefix: "tw-",
   content: ["./src/**/*.{html,js,ts,tsx}"],
   theme: {
     extend: {},
   },
   plugins: [],
-}
+  corePlugins: {
+    preflight: false,
+  },
+};