const colors = require('tailwindcss/colors')
const appWidth = '1280px'
const sideBarWidth = '220px'
const sideBarWidthMobile ='320px'
const primary = '#1E4BC4'
const secondary = colors.gray[500]

/** @type {import('tailwindcss').Config} */
export default {
  content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
  theme: {
    extend: {
      colors: {
        primary,
        secondary
      },
      maxWidth: {
        app: appWidth,
        sidebar: sideBarWidth,
        'sidebar-mobile': sideBarWidthMobile
      },
      width: {
        sidebar: sideBarWidth,
        'sidebar-mobile': sideBarWidthMobile
      },
      margin: {
        sidebar: sideBarWidth,
        'sidebar-mobile': sideBarWidthMobile
      }
    }
  },
  plugins: [require('daisyui')],
  daisyui: {
    themes: [
      {
        contexted: {
          primary,
          secondary,
          accent: '#37CDBE',
          neutral: '#F7F7F7',
          'base-100': '#FFFFFF',
          info: '#3ABFF8',
          success: '#36D399',
          warning: '#FBBD23',
          error: '#F87272'
        }
      }
    ],
    logs: false
  }
}