diff --git a/examples/with-carbon-components/.gitignore b/examples/with-carbon-components/.gitignore deleted file mode 100644 index c87c9b392c0200d..000000000000000 --- a/examples/with-carbon-components/.gitignore +++ /dev/null @@ -1,36 +0,0 @@ -# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. - -# dependencies -/node_modules -/.pnp -.pnp.js - -# testing -/coverage - -# next.js -/.next/ -/out/ - -# production -/build - -# misc -.DS_Store -*.pem - -# debug -npm-debug.log* -yarn-debug.log* -yarn-error.log* -.pnpm-debug.log* - -# local env files -.env*.local - -# vercel -.vercel - -# typescript -*.tsbuildinfo -next-env.d.ts diff --git a/examples/with-carbon-components/README.md b/examples/with-carbon-components/README.md deleted file mode 100644 index 5a884862ceebb33..000000000000000 --- a/examples/with-carbon-components/README.md +++ /dev/null @@ -1,37 +0,0 @@ -# Example app with carbon-components-react - -This example features how you use IBM's [carbon-components-react](https://github.com/IBM/carbon-components-react) [(Carbon Design System)](https://www.carbondesignsystem.com/components/overview) with Next.js. - -Create your own theme with Carbon Design System's [theming tools](https://themes.carbondesignsystem.com/) and put it all together as demonstrated in `static/myCustomTheme.scss` - -## Deploy your own - -Deploy the example using [Vercel](https://vercel.com?utm_source=github&utm_medium=readme&utm_campaign=next-example): - -[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/git/external?repository-url=https://github.com/vercel/next.js/tree/canary/examples/with-carbon-components&project-name=with-carbon-components&repository-name=with-carbon-components) - -## How to use - -Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io) to bootstrap the example: - -```bash -npx create-next-app --example with-carbon-components with-carbon-components-app -``` - -```bash -yarn create next-app --example with-carbon-components with-carbon-components-app -``` - -```bash -pnpm create next-app --example with-carbon-components with-carbon-components-app -``` - -Deploy it to the cloud with [Vercel](https://vercel.com/new?utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)). - -## Optimizations - -In this example we import carbon components in the `styles/custom-theme.scss` file like this: -@import '~carbon-components/scss/globals/scss/styles.scss'; - -When we start to consider the performance of this approach, however, it becomes clear that this will include every single bit of CSS that Carbon outputs. Sometimes, you totally need everything that the project provides, but for a good number of teams you may find yourself using only a subset of our components. Here is a great article about how you can optimize your application using carbon components: -https://medium.com/carbondesign/minimal-css-with-carbon-b0c089ccfa71 diff --git a/examples/with-carbon-components/package.json b/examples/with-carbon-components/package.json deleted file mode 100644 index 5e5bf647371e369..000000000000000 --- a/examples/with-carbon-components/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "private": true, - "scripts": { - "dev": "next", - "build": "next build", - "start": "next start" - }, - "dependencies": { - "@carbon/icons-react": "^10.3.0", - "carbon-components": "^10.3.0", - "carbon-components-react": "^7.3.0", - "carbon-icons": "^7.0.7", - "next": "latest", - "sass": "^1.32.4", - "react": "^18.2.0", - "react-dom": "^18.2.0" - } -} diff --git a/examples/with-carbon-components/pages/_app.js b/examples/with-carbon-components/pages/_app.js deleted file mode 100644 index 790cab606bc67a2..000000000000000 --- a/examples/with-carbon-components/pages/_app.js +++ /dev/null @@ -1,7 +0,0 @@ -import '../styles/custom-theme.scss' - -function MyApp({ Component, pageProps }) { - return -} - -export default MyApp diff --git a/examples/with-carbon-components/pages/index.js b/examples/with-carbon-components/pages/index.js deleted file mode 100644 index 44bd1c79b89f6d5..000000000000000 --- a/examples/with-carbon-components/pages/index.js +++ /dev/null @@ -1,11 +0,0 @@ -import { Button } from 'carbon-components-react' - -const Home = () => { - return ( - <> - - - ) -} - -export default Home diff --git a/examples/with-carbon-components/styles/custom-theme.scss b/examples/with-carbon-components/styles/custom-theme.scss deleted file mode 100644 index 1555b773e34a309..000000000000000 --- a/examples/with-carbon-components/styles/custom-theme.scss +++ /dev/null @@ -1 +0,0 @@ -@import '~carbon-components/scss/globals/scss/styles.scss';