ablecloud-homepage/tailwind.config.ts at master · ablecloud-team/ablecloud-homepage · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
import type { Config } from 'tailwindcss';

const config: Config = {
  content: [
    './src/app/**/*.{js,ts,jsx,tsx,mdx}',
    './src/components/**/*.{js,ts,jsx,tsx,mdx}',
    './src/templates/**/*.{js,ts,jsx,tsx,mdx}',
    './src/constants/**/*.{js,ts,jsx,tsx,mdx}',
    './post/*.{js,ts,jsx,tsx,mdx}',
  ],
  theme: {
    backgroundImage: {
      //home
      'home-header-1': "url('/images/home/header-1.png')",
      'home-header-2': "url('/images/home/header-2.png')",
      'home-header-3': "url('/images/home/header-3.png')",
      'home-header-4': "url('/images/home/header-4.png')",
      'home-header-5': "url('/images/home/header-5.png')",
      'home-mobile-header-1': "url('/images/home/mobile-header-1.png')",
      'home-mobile-header-2': "url('/images/home/mobile-header-2.png')",
      'home-mobile-header-3': "url('/images/home/mobile-header-3.png')",
      'home-mobile-header-4': "url('/images/home/mobile-header-4.png')",
      'home-mobile-header-5': "url('/images/home/mobile-header-5.png')",
      'home-main-card-1': "url('/images/home/main-card-1.png')",
      'home-main-card-2': "url('/images/home/main-card-2.png')",
      'home-main-card-3': "url('/images/home/main-card-3.png')",
      'home-application-1': "url('/images/home/application-1.png')",
      'home-application-2': "url('/images/home/application-2.png')",
      'home-application-3': "url('/images/home/application-3.png')",
      'home-application-4': "url('/images/home/application-4.png')",
      'home-application-5': "url('/images/home/application-5.png')",
      //products
      'products-header-ablestack-hci': "url('/images/products/header-ablestack-hci.png')",
      'products-header-ablestack-vm': "url('/images/products/header-ablestack-vm.png')",
      'products-header-cube': "url('/images/products/header-cube.png')",
      'products-header-cell': "url('/images/products/header-cell.png')",
      'products-header-glue': "url('/images/products/header-glue.png')",
      'products-header-mold': "url('/images/products/header-mold.png')",
      'products-header-track': "url('/images/products/header-track.png')",
      'products-header-wall': "url('/images/products/header-wall.png')",
      'products-header-koral': "url('/images/products/header-koral.png')",
      'products-header-genie': "url('/images/products/header-genie.png')",
      'products-header-silo': "url('/images/products/header-silo.png')",
      'products-header-over': "url('/images/products/header-over.png')",
      'products-header-link': "url('/images/products/header-link.png')",
      'products-hci-content-wrapper': "url('/images/products/hci-content.png')",
      'products-vm-card-1': "url('/images/products/vm-card-1.png')",
      'products-vm-card-2': "url('/images/products/vm-card-2.png')",
      'products-vm-card-3': "url('/images/products/vm-card-3.png')",
      //application
      'application-header': "url('/images/applications/header-application.png')",
      //resource
      'resource-header': "url('/images/resource/header-resource.png')",
      //interview
      'interview-header': "url('/images/interview/header-interview.png')",
      //contact
      'contact-header': "url('/images/contact/header-contact.png')",
      //company
      'company-header': "url('/images/company/header-company.png')",
      'company-about-card-1': "url('/images/company/about-card-bg-1.png')",
      'company-about-card-2': "url('/images/company/about-card-bg-2.png')",
      'company-about-card-3': "url('/images/company/about-card-bg-3.png')",
      //partners
      'partners-header': "url('/images/partners/header-partners.png')",
      //about
      'about-header-performance': "url('/images/about/header-about-performance.png')",
      'about-header-effect': "url('/images/about/header-about-effect.png')",
    },
    extend: {
      scale: {
        '102': '1.02',
      },
      animation: {
        bannermovetoleft: 'bannermovetoleft 15s linear infinite',
        bannermovetoright: 'bannermovetoright 15s linear infinite',
        'fade-in': 'fade-in 0.3s ease-in-out',
      },

      keyframes: {
        bannermovetoleft: {
          '0%': { transform: 'translateX(var(--start-x, 0px))' },
          '100%': { transform: 'translateX(var(--end-x, 0px))' },
        },
        bannermovetoright: {
          '0%': { transform: 'translateX(var(--start-x, 0px))' },
          '100%': { transform: 'translateX(var(--end-x, 0px))' },
        },
        'fade-in': {
          from: {
            opacity: '0',
            transform: 'translateY(5px)',
          },
          to: {
            opacity: '1',
            transform: 'translateY(0)',
          },
        },
      },
      screens: {
        xsm: '400px',
        sm: '640px',
        md: '768px', // ~ mobile
        lg: '960px', // ~ tablet
        xl: '1260px', // ~ pc
        max: '1440px', // maxSize
      },
    },
  },
  plugins: [require('tailwind-scrollbar-hide')],
};
export default config;