tailwind.config.js

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./src/pages/**/*.{js,ts,jsx,tsx}",
    "./src/components/**/*.{js,ts,jsx,tsx}",
    "./src/components/admin/**/*.{js,ts,jsx,tsx}",
  ],
  darkMode: 'class',
  theme: {
    extend: {
      colors: {
        'app-background': 'var(--app-background)',
        'text-color': 'var(--text-color)',
        'primary-color': 'var(--primary-color)',
        'dropzone-color': 'var(--dropzone-color)',
        'dropzone-background': 'var(--dropzone-background)',
        'dropzone-hover-background': 'var(--dropzone-hover-background)',
        'progress-bar-background': 'var(--progress-bar-background)',
        'progress-bar-fill': 'var(--progress-bar-fill)',
        'progress-bar-text': 'var(--progress-bar-text)',
        'input-border': 'var(--input-border)',
        'input-background': 'var(--input-background)',
        'input-text': 'var(--input-text)',
        'popup-text': 'var(--popup-text)',
        'primary-color-popup': 'var(--primary-color-popup)',
        'button-text': 'var(--button-text)',
        'button-background': 'var(--button-background)',
        'button-border': 'var(--button-border)',
        'button-hover': 'var(--button-hover)',
        'button-hover-background': 'var(--button-hover-background)',
        'button-border-active': 'var(--button-border-active)',
        'button-border-hover': 'var(--button-border-hover)',
        'history-item-border': 'var(--history-item-border)',
        'history-item-hover': 'var(--history-item-hover)',
        'history-item-text': 'var(--history-item-text)',
        'history-item-background': 'var(--history-item-background)',
        'history-item-hover-background': 'var(--history-item-hover-background)',
        'history-item-shadow': 'var(--history-item-shadow)',
        'status-tag-text': 'var(--status-tag-text)',
        'expired-color': 'var(--expired-color)',
        'low-expiration-color': 'var(--low-expiration-color)',
        'low-expiration-text': 'var(--low-expiration-text)',
        'active-button': 'var(--active-button)',
        'copy-icon-color': 'var(--copy-icon-color)',
        'copy-icon-hover-color': 'var(--copy-icon-hover-color)',
        'copy-icon-active-color': 'var(--copy-icon-active-color)',
        'overlay-background-color': 'var(--overlay-background-color)',
        'overlay-content-background-color': 'var(--overlay-content-background-color)',
        'overlay-content-text-color': 'var(--overlay-content-text-color)',
        'overlay-closebtn-color': 'var(--overlay-closebtn-color)',
        'overlay-closebtn-hover-color': 'var(--overlay-closebtn-hover-color)',
        'toast-background': 'rgba(var(--toast-background-rgb), 0.7)',
        'toast-border': 'rgba(var(--toast-border-rgb), 0.2)',
        'toast-progress-bar': 'var(--toast-progress-bar)',
        'dropzone-card-background': 'var(--dropzone-card-background)',
        'dropzone-active-color': 'var(--dropzone-active-color)',
        'dropzone-icon-color': 'var(--dropzone-icon-color)',
        'dropzone-subtext-color': 'var(--dropzone-subtext-color)',
      },
      animation: {
        bounce: 'bounce 1s infinite',
      },
      keyframes: {
        bounce: {
          '0%, 100%': { transform: 'translateY(-25%)', animationTimingFunction: 'cubic-bezier(0.8, 0, 1, 1)' },
          '50%': { transform: 'translateY(0)', animationTimingFunction: 'cubic-bezier(0, 0, 0.2, 1)' },
        },
      },
    },
  },
  plugins: [],
};