0.3.7 • Published 9 months ago
@mentor-inc/ui v0.3.7
Mentor Inc. UI Library
Installation
This package can be used for Nextjs project
pnpm add -D tailwindcss postcss autoprefixer
pnpm add @mentor-inc/uiUsage
- Create tailwind.config.ts in root directory and paste the following code:
import configSrc from '@mentor-inc/ui/tailwind.config';
import path from 'path';
const modulePath = require.resolve('@mentor-inc/ui/tailwind.config');
const config: Config = {...configSrc};
config.content = [
...(config.content as string[]),
path.join(path.dirname(modulePath), 'src/**/*.tsx'),
];
export default config;You can modify the config, this is the example
if (!config.theme) {
config.theme = {};
}
if (!config.theme.extend) {
config.theme.extend = {};
}
config.theme.extend.keyframes = {
...config.theme.extend.keyframes,
'floatUp': {
'0%': {transform: 'translateY(100%)'},
'100%': {transform: 'translateY(0)'},
},
'zoom': {
'0%': {transform: 'scale(0)'},
'100%': {transform: 'scale(1)'},
},
'zoom-pulse': {
'0%': {transform: 'scale(1)'},
'50%': {transform: 'scale(1.1)'},
'100%': {transform: 'scale(1)'},
},
'btn-pulse': {
'0%': {boxShadow: '0 0 0 0 #25d366', opacity: '1'},
'100%': {boxShadow: '0 0 0 15px #25d366', opacity: '0'},
},
};- Create postcss.config.js in root directory and paste the following code:
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
};Make sure the
moduleResolutionoption intsconfig.jsonis set toBundlerImport the globals.css in root layout and add Inter font
import {Metadata} from 'next';
import {Inter} from 'next/font/google';
import '../../globals.css';
const inter = Inter({subsets: ['latin'], variable: '--font-inter'});
export default function RootLayout({children}: {children: React.ReactNode}) {
return (
<html lang="en">
<body className={inter.variable}>{children}</body>
</html>
);
}- Import the component you want to use
import {Button} from '@mentor-inc/ui/button';- To use the SvgLink component, you need to make the api route. Create file app/icons/url/route.ts and paste the following code
export * from '@mentor-inc/ui/svg-api';0.3.7
9 months ago
0.3.6
10 months ago
0.3.5
10 months ago
0.3.4
10 months ago
0.3.3
1 year ago
0.3.2
1 year ago
0.3.1
1 year ago
0.2.21
1 year ago
0.2.20
1 year ago
0.2.16
1 year ago
0.2.15
1 year ago
0.2.19
1 year ago
0.2.18
1 year ago
0.2.17
1 year ago
0.2.14
1 year ago
0.2.13
1 year ago
0.2.12
1 year ago
0.2.11
1 year ago
0.2.10
2 years ago
0.2.7
2 years ago
0.2.9
2 years ago
0.2.8
2 years ago
0.2.6
2 years ago
0.2.5
2 years ago
0.2.4
2 years ago
0.2.3
2 years ago