react-common 0.7.0
Install from the command line:
Learn more about npm packages
$ npm install @codevachon/react-common@0.7.0
Install via package.json:
"@codevachon/react-common": "0.7.0"
About this version
A Library of Common Read Components
- Tailwindcss
- @tailwindcss/typography
- HeadlessUI
- HeroIcons
- @codevachon/utilities
- @codevachon/classnames
pnpm add @codevachon/react-common @codevachon/classnames @codevachon/utilities @headlessui/react @heroicons/reactyarn add @codevachon/react-common @codevachon/classnames @codevachon/utilities @headlessui/react @heroicons/reactnpm install @codevachon/react-common @codevachon/classnames @codevachon/utilities @headlessui/react @heroicons/reactPull in the Style Sheet and add the required values to the tailwind.config.js file.
// src/pages/_app.tsx
import "@codevachon/react-common/style.css"; // Import Preset Styling
import "./../styles/global.css";
export default function MyApp({ Component, pageProps }) {
return <Component {...pageProps} />;
}// tailwind.config.js
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./src/**/*.{ts,js,tsx,jsx}"],
preset: ["@codevachon/react-common/tailwind.preset"],
theme: {},
plugins: []
};// tailwind.config.js
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./src/**/*.{ts,js,tsx,jsx}"],
theme: {
extend: {
colors: {
primary: "rgb(var(--color-primary) / <alpha-value>)",
secondary: "rgb(var(--color-secondary) / <alpha-value>)",
tertiary: "rgb(var(--color-tertiary) / <alpha-value>)",
danger: "rgb(var(--color-danger) / <alpha-value>)",
success: "rgb(var(--color-success) / <alpha-value>)"
}
}
},
plugins: []
};