@myissue/vue-website-page-builder/src/utils/builder/tailwind-font-sizes.ts

Vue 3 page builder component with drag & drop functionality.

interface TailwindFontSizes {
  fontBase: string[]
  fontDesktop: string[]
  fontTablet: string[]
  fontMobile: string[]
}

const tailwindFontSizes: TailwindFontSizes = {
  fontBase: [
    'none',
    'pbx-text-xs',
    'pbx-text-sm',
    'pbx-text-base',
    'pbx-text-lg',
    'pbx-text-xl',
    'pbx-text-2xl',
    'pbx-text-3xl',
    'pbx-text-4xl',
    'pbx-text-5xl',
    'pbx-text-6xl',
    'pbx-text-7xl',
    'pbx-text-8xl',
    'pbx-text-9xl',
  ],
  fontDesktop: [
    'none',
    'lg:pbx-text-xs',
    'lg:pbx-text-sm',
    'lg:pbx-text-base',
    'lg:pbx-text-lg',
    'lg:pbx-text-xl',
    'lg:pbx-text-2xl',
    'lg:pbx-text-3xl',
    'lg:pbx-text-4xl',
    'lg:pbx-text-5xl',
    'lg:pbx-text-6xl',
    'lg:pbx-text-7xl',
    'lg:pbx-text-8xl',
    'lg:pbx-text-9xl',
  ],
  fontTablet: [
    'none',
    'md:pbx-text-xs',
    'md:pbx-text-sm',
    'md:pbx-text-base',
    'md:pbx-text-lg',
    'md:pbx-text-xl',
    'md:pbx-text-2xl',
    'md:pbx-text-3xl',
    'md:pbx-text-4xl',
    'md:pbx-text-5xl',
    'md:pbx-text-6xl',
    'md:pbx-text-7xl',
    'md:pbx-text-8xl',
    'md:pbx-text-9xl',
  ],
  fontMobile: [
    'none',
    'sm:pbx-text-xs',
    'sm:pbx-text-sm',
    'sm:pbx-text-base',
    'sm:pbx-text-lg',
    'sm:pbx-text-xl',
    'sm:pbx-text-2xl',
    'sm:pbx-text-3xl',
    'sm:pbx-text-4xl',
    'sm:pbx-text-5xl',
    'sm:pbx-text-6xl',
    'sm:pbx-text-7xl',
    'sm:pbx-text-8xl',
    'sm:pbx-text-9xl',
  ],
}

export default tailwindFontSizes