chore(blog-starter): update tailwindcss to v3 (vercel#32398)

Updates the [blog-starter](https://github.com/vercel/next.js/tree/canary/examples/blog-starter) example to use the new [tailwindcss v3](https://tailwindcss.com/blog/tailwindcss-v3) by following the [upgrade guide](https://tailwindcss.com/docs/upgrade-guide).

Thanks!

## Documentation / Examples

- [x] Make sure the linting passes by running `yarn lint`

examples/blog-starter/README.md

@@ -61,4 +61,4 @@ Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&ut
 
 # Notes
 
-This blog-starter uses [Tailwind CSS](https://tailwindcss.com). To control the generated stylesheet's filesize, this example uses Tailwind CSS' v2.0 [`purge` option](https://tailwindcss.com/docs/controlling-file-size/#removing-unused-css) to remove unused CSS.
+This blog-starter uses [Tailwind CSS](https://tailwindcss.com) [(v3.0)](https://tailwindcss.com/blog/tailwindcss-v3).

examples/blog-starter/package.json

@@ -16,8 +16,8 @@
     "remark-html": "13.0.1"
   },
   "devDependencies": {
-    "autoprefixer": "^10.2.1",
-    "postcss": "^8.2.4",
-    "tailwindcss": "^2.0.2"
+    "autoprefixer": "^10.4.0",
+    "postcss": "^8.4.4",
+    "tailwindcss": "^3.0.1"
   }
 }

examples/blog-starter/styles/index.css

@@ -1,15 +1,3 @@
 @tailwind base;
-
-/* Write your own custom base styles here */
-
-/* Start purging... */
 @tailwind components;
-/* Stop purging. */
-
-/* Write you own custom component styles here */
-
-/* Start purging... */
 @tailwind utilities;
-/* Stop purging. */
-
-/* Your own custom utilities */

examples/blog-starter/tailwind.config.js

@@ -1,5 +1,5 @@
 module.exports = {
-  purge: ['./components/**/*.js', './pages/**/*.js'],
+  content: ['./components/**/*.js', './pages/**/*.js'],
   theme: {
     extend: {
       colors: {