diff --git a/CRUSH.md b/CRUSH.md new file mode 100644 index 0000000..c922779 --- /dev/null +++ b/CRUSH.md @@ -0,0 +1,47 @@ +# CRUSH.md - Healthy Oil Project Guide + +## Development Commands +- `npm run dev` - Start development server on port 3000 +- `npm run build` - Build for production (`tsc -b && vite build`) +- `npm run lint` - Run ESLint on entire codebase +- `npm run preview` - Preview production build on port 3000 + +## Code Style Guidelines + +### File Naming & Structure +- Components: lowercase filenames (header.tsx, hero1.tsx, oil_info.tsx) +- UI components: `/src/components/ui/` directory +- Use function declarations for components, not arrow functions + +### Import Conventions +```typescript +// Chakra UI imports (named, grouped) +import { Box, Flex, Image } from '@chakra-ui/react'; + +// Local imports (default preferred) +import Header from './components/header'; +``` + +### Component Pattern +```typescript +function ComponentName() { + return ( + + {/* JSX content */} + + ); +} + +export default ComponentName; +``` + +### TypeScript & Configuration +- Strict mode enabled with `noUnusedLocals`, `noUnusedParameters` +- Path aliases available: `@/*` → `./src/*` +- Use Chakra UI props for responsive design +- Framer Motion for animations (`motion()` wrapper pattern) + +### Styling Approach +- Primary: Chakra UI props and components +- External: colors.tsx for color system, fonts.css for typography +- Responsive: `useBreakpointValue()` hook for breakpoints \ No newline at end of file diff --git a/public/fonts/NotoSerif-Italic-VariableFont_wdth,wght.ttf b/public/fonts/NotoSerif-Italic-VariableFont_wdth,wght.ttf new file mode 100644 index 0000000..f4bd437 Binary files /dev/null and b/public/fonts/NotoSerif-Italic-VariableFont_wdth,wght.ttf differ diff --git a/public/fonts/_NotoSerif-Italic-VariableFont_wdth,wght (1).ttf b/public/fonts/_NotoSerif-Italic-VariableFont_wdth,wght (1).ttf new file mode 100644 index 0000000..7447f0e Binary files /dev/null and b/public/fonts/_NotoSerif-Italic-VariableFont_wdth,wght (1).ttf differ diff --git a/public/fonts/_NotoSerifCJKjp-Black.otf b/public/fonts/_NotoSerifCJKjp-Black.otf new file mode 100644 index 0000000..fbf5a53 Binary files /dev/null and b/public/fonts/_NotoSerifCJKjp-Black.otf differ diff --git a/src/index.css b/src/index.css index 51b895c..afb726f 100644 --- a/src/index.css +++ b/src/index.css @@ -106,6 +106,16 @@ font-display: swap; } +/* NotoSerif Font Family */ +@font-face { + font-family: 'NotoSerif'; + src: url('/fonts/NotoSerif-Italic-VariableFont_wdth,wght.ttf') format('truetype'); + font-weight: 100 900; + font-style: italic; + font-stretch: 62.5% 100%; + font-display: swap; +} + :root { font-family: 'NotoSansCJKtc', 'MElleHK', system-ui, Avenir, Helvetica, Arial, sans-serif; line-height: 1.5;