5a18ec9e87
- Configure Next.js 14 with TypeScript and App Router - Set up Tailwind CSS for styling - Add comprehensive dependencies for motorcycle adventure features - Configure authentication with NextAuth.js - Set up map integration with React Leaflet - Add GPX file support for route tracking - Configure image processing and file uploads - Set up forms, charts, and animations - Add ESLint and development tooling
74 lines
2.0 KiB
JavaScript
74 lines
2.0 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
module.exports = {
|
|
content: [
|
|
'./src/pages/**/*.{js,ts,jsx,tsx,mdx}',
|
|
'./src/components/**/*.{js,ts,jsx,tsx,mdx}',
|
|
'./src/app/**/*.{js,ts,jsx,tsx,mdx}',
|
|
],
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
primary: {
|
|
50: '#fef7ee',
|
|
100: '#fcecd6',
|
|
200: '#f8d4ad',
|
|
300: '#f3b679',
|
|
400: '#ec8f43',
|
|
500: '#e8711e',
|
|
600: '#d95914',
|
|
700: '#b44213',
|
|
800: '#903517',
|
|
900: '#752d15',
|
|
950: '#3f1408',
|
|
},
|
|
dark: {
|
|
50: '#f6f6f6',
|
|
100: '#e7e7e7',
|
|
200: '#d1d1d1',
|
|
300: '#b0b0b0',
|
|
400: '#888888',
|
|
500: '#6d6d6d',
|
|
600: '#5d5d5d',
|
|
700: '#4f4f4f',
|
|
800: '#454545',
|
|
900: '#3d3d3d',
|
|
950: '#1a1a1a',
|
|
},
|
|
},
|
|
backgroundImage: {
|
|
'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
|
|
'gradient-conic':
|
|
'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
|
|
'hero-pattern': "url('/images/hero-bg.jpg')",
|
|
},
|
|
fontFamily: {
|
|
'adventure': ['Roboto Condensed', 'sans-serif'],
|
|
'body': ['Inter', 'sans-serif'],
|
|
},
|
|
animation: {
|
|
'parallax': 'parallax 1s ease-out forwards',
|
|
'fade-in': 'fadeIn 0.6s ease-out forwards',
|
|
'slide-up': 'slideUp 0.8s ease-out forwards',
|
|
},
|
|
keyframes: {
|
|
parallax: {
|
|
'0%': { transform: 'translateY(0px)' },
|
|
'100%': { transform: 'translateY(-50px)' },
|
|
},
|
|
fadeIn: {
|
|
'0%': { opacity: '0', transform: 'translateY(20px)' },
|
|
'100%': { opacity: '1', transform: 'translateY(0px)' },
|
|
},
|
|
slideUp: {
|
|
'0%': { opacity: '0', transform: 'translateY(60px)' },
|
|
'100%': { opacity: '1', transform: 'translateY(0px)' },
|
|
},
|
|
},
|
|
},
|
|
},
|
|
plugins: [
|
|
require('@tailwindcss/typography'),
|
|
require('@tailwindcss/forms'),
|
|
],
|
|
}
|