perf: remove old tailwind config and duplicate globals.css
This commit is contained in:
121
app/globals.css
121
app/globals.css
@@ -1,121 +0,0 @@
|
||||
@import "tailwindcss";
|
||||
@plugin "@tailwindcss/typography";
|
||||
|
||||
@config "../tailwind.config.cjs";
|
||||
|
||||
/* E-TIB Custom Utilities */
|
||||
@layer utilities {
|
||||
.text-balance {
|
||||
text-wrap: balance;
|
||||
}
|
||||
|
||||
.hide-scrollbar {
|
||||
-ms-overflow-style: none !important; /* IE and Edge */
|
||||
scrollbar-width: none !important; /* Firefox */
|
||||
}
|
||||
.hide-scrollbar::-webkit-scrollbar {
|
||||
display: none !important; /* Chrome, Safari and Opera */
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
}
|
||||
|
||||
@keyframes bg-pulse-15 {
|
||||
0%, 90%, 100% { opacity: 0.04; }
|
||||
95% { opacity: 0.10; filter: brightness(1.2); }
|
||||
}
|
||||
@keyframes bg-pulse-20 {
|
||||
0%, 90%, 100% { opacity: 0.07; }
|
||||
95% { opacity: 0.14; filter: brightness(1.2); }
|
||||
}
|
||||
.animate-bg-pulse-15 { animation: bg-pulse-15 12s infinite ease-in-out; }
|
||||
.animate-bg-pulse-20 { animation: bg-pulse-20 12s infinite ease-in-out; }
|
||||
}
|
||||
|
||||
/* Base Styles */
|
||||
@layer base {
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
body {
|
||||
@apply bg-neutral font-sans text-neutral-dark antialiased;
|
||||
}
|
||||
/* Interactive elements pointer */
|
||||
a,
|
||||
button,
|
||||
[role="button"],
|
||||
input[type="button"],
|
||||
input[type="submit"],
|
||||
input[type="reset"],
|
||||
select,
|
||||
summary,
|
||||
label[for] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* Ensure disabled elements don't show pointer */
|
||||
button:disabled,
|
||||
[role="button"]:disabled,
|
||||
input:disabled,
|
||||
select:disabled,
|
||||
button[disabled] {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/* Custom Modern Scrollbar */
|
||||
::-webkit-scrollbar {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(14, 122, 92, 0.4);
|
||||
border-radius: 10px;
|
||||
border: 4px solid transparent;
|
||||
background-clip: padding-box;
|
||||
transition: background-color 0.2s ease;
|
||||
}
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background-color: rgba(14, 122, 92, 0.8);
|
||||
}
|
||||
|
||||
/* Firefox */
|
||||
html {
|
||||
scrollbar-color: rgba(14, 122, 92, 0.5) transparent;
|
||||
scrollbar-width: thin;
|
||||
}
|
||||
}
|
||||
/* trigger rebuild */
|
||||
|
||||
@layer utilities {
|
||||
@keyframes hero-fade-in-up {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(30px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.animate-hero-fade-in-up {
|
||||
animation: hero-fade-in-up 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
|
||||
}
|
||||
}
|
||||
|
||||
@layer utilities {
|
||||
@keyframes hero-zoom-out {
|
||||
from {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
to {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.animate-hero-zoom-out {
|
||||
animation: hero-zoom-out 1.5s ease-out forwards;
|
||||
}
|
||||
}
|
||||
@@ -1,226 +0,0 @@
|
||||
/* eslint-disable no-undef */
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
module.exports = {
|
||||
content: [
|
||||
'./app/**/*.{js,ts,jsx,tsx}',
|
||||
'./components/**/*.{js,ts,jsx,tsx}',
|
||||
'./content/**/*.{mdx,md}',
|
||||
'./node_modules/@mintel/annotator/dist/**/*.{js,ts,jsx,tsx,mjs}',
|
||||
'./node_modules/.pnpm/@mintel+annotator*/node_modules/@mintel/annotator/dist/**/*.{js,ts,jsx,tsx,mjs}'
|
||||
],
|
||||
theme: {
|
||||
extend: {
|
||||
// Custom Breakpoints for KLZ Cables
|
||||
screens: {
|
||||
'xs': '475px',
|
||||
'sm': '640px',
|
||||
'md': '768px',
|
||||
'lg': '1024px',
|
||||
'xl': '1280px',
|
||||
'2xl': '1400px',
|
||||
'3xl': '1600px',
|
||||
},
|
||||
colors: {
|
||||
// Brand Colors
|
||||
primary: {
|
||||
DEFAULT: '#0e7a5c',
|
||||
dark: '#0a5742',
|
||||
light: '#149d76',
|
||||
},
|
||||
secondary: {
|
||||
DEFAULT: '#194f3b',
|
||||
light: '#20654c',
|
||||
dark: '#13392a',
|
||||
},
|
||||
accent: {
|
||||
DEFAULT: '#0e7a5c',
|
||||
light: '#149d76',
|
||||
},
|
||||
neutral: {
|
||||
DEFAULT: '#fafafa',
|
||||
light: '#ffffff',
|
||||
dark: '#333333',
|
||||
black: '#1a1a1a',
|
||||
},
|
||||
// Text Colors
|
||||
text: {
|
||||
primary: '#1a1a1a',
|
||||
secondary: '#6c757d',
|
||||
light: '#adb5bd',
|
||||
},
|
||||
// Semantic Colors
|
||||
success: '#28a745',
|
||||
warning: '#ffc107',
|
||||
danger: '#dc3545',
|
||||
info: '#17a2b8',
|
||||
},
|
||||
fontFamily: {
|
||||
sans: ['Inter', 'system-ui', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Helvetica Neue', 'Arial', 'sans-serif'],
|
||||
heading: ['Inter', 'system-ui', 'sans-serif'],
|
||||
body: ['Inter', 'system-ui', 'sans-serif'],
|
||||
},
|
||||
// Standard Fluid Typography
|
||||
// Responsive scaling is handled globally via the html selector percentage in globals.css
|
||||
fontSize: {
|
||||
'xs': ['0.75rem', { lineHeight: '1.6' }],
|
||||
'sm': ['0.875rem', { lineHeight: '1.6' }],
|
||||
'base': ['1rem', { lineHeight: '1.7' }],
|
||||
'lg': ['1.125rem', { lineHeight: '1.7' }],
|
||||
'xl': ['1.25rem', { lineHeight: '1.6' }],
|
||||
'2xl': ['1.5rem', { lineHeight: '1.5' }],
|
||||
'3xl': ['1.875rem', { lineHeight: '1.4' }],
|
||||
'4xl': ['2.25rem', { lineHeight: '1.3' }],
|
||||
'5xl': ['3rem', { lineHeight: '1.25' }],
|
||||
'6xl': ['3.75rem', { lineHeight: '1.2' }],
|
||||
'7xl': ['4.5rem', { lineHeight: '1.15' }],
|
||||
'8xl': ['6rem', { lineHeight: '1.1' }],
|
||||
},
|
||||
fontWeight: {
|
||||
regular: '400',
|
||||
medium: '500',
|
||||
semibold: '600',
|
||||
bold: '700',
|
||||
extrabold: '800',
|
||||
},
|
||||
borderRadius: {
|
||||
'sm': '0.25rem',
|
||||
'DEFAULT': '0.5rem',
|
||||
'lg': '0.75rem',
|
||||
'xl': '1rem',
|
||||
'2xl': '1.5rem',
|
||||
},
|
||||
boxShadow: {
|
||||
'sm': '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
|
||||
'DEFAULT': '0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)',
|
||||
'md': '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',
|
||||
'lg': '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)',
|
||||
'xl': '0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)',
|
||||
},
|
||||
container: {
|
||||
center: true,
|
||||
padding: {
|
||||
DEFAULT: '1rem',
|
||||
sm: '1.5rem',
|
||||
md: '2rem',
|
||||
lg: '2.5rem',
|
||||
xl: '3rem',
|
||||
'2xl': '4rem',
|
||||
},
|
||||
screens: {
|
||||
xs: '475px',
|
||||
sm: '640px',
|
||||
md: '768px',
|
||||
lg: '1024px',
|
||||
xl: '1280px',
|
||||
'2xl': '1400px',
|
||||
'3xl': '1600px',
|
||||
},
|
||||
},
|
||||
maxWidth: {
|
||||
'xs': '20rem',
|
||||
'sm': '24rem',
|
||||
'md': '28rem',
|
||||
'lg': '32rem',
|
||||
'xl': '36rem',
|
||||
'2xl': '42rem',
|
||||
'3xl': '48rem',
|
||||
'4xl': '56rem',
|
||||
'5xl': '64rem',
|
||||
'6xl': '72rem',
|
||||
},
|
||||
zIndex: {
|
||||
'0': '0',
|
||||
'10': '10',
|
||||
'20': '20',
|
||||
'30': '30',
|
||||
'40': '40',
|
||||
'50': '50',
|
||||
'auto': 'auto',
|
||||
},
|
||||
},
|
||||
},
|
||||
plugins: [
|
||||
// Custom plugin for responsive utilities
|
||||
function ({ addUtilities }) {
|
||||
const newUtilities = {
|
||||
// Touch target utilities
|
||||
'.touch-target': {
|
||||
minHeight: '44px',
|
||||
minWidth: '44px',
|
||||
display: 'inline-flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
// Mobile-first responsive utilities
|
||||
'.mobile-hidden': {
|
||||
'@media (max-width: 767px)': {
|
||||
display: 'none !important',
|
||||
},
|
||||
},
|
||||
'.tablet-hidden': {
|
||||
'@media (min-width: 768px) and (max-width: 1023px)': {
|
||||
display: 'none !important',
|
||||
},
|
||||
},
|
||||
'.desktop-hidden': {
|
||||
'@media (min-width: 1024px)': {
|
||||
display: 'none !important',
|
||||
},
|
||||
},
|
||||
'.mobile-only': {
|
||||
'@media (min-width: 768px)': {
|
||||
display: 'none !important',
|
||||
},
|
||||
},
|
||||
'.tablet-only': {
|
||||
'@media (max-width: 767px), (min-width: 1024px)': {
|
||||
display: 'none !important',
|
||||
},
|
||||
},
|
||||
'.desktop-only': {
|
||||
'@media (max-width: 1023px)': {
|
||||
display: 'none !important',
|
||||
},
|
||||
},
|
||||
// Fluid spacing utilities
|
||||
'.fluid-spacing': {
|
||||
padding: 'clamp(1rem, 3vw, 3rem)',
|
||||
margin: 'clamp(0.5rem, 2vw, 2rem)',
|
||||
},
|
||||
// Responsive text alignment
|
||||
'.text-start-mobile': {
|
||||
'@media (max-width: 767px)': {
|
||||
textAlign: 'left',
|
||||
},
|
||||
},
|
||||
'.text-center-mobile': {
|
||||
'@media (max-width: 767px)': {
|
||||
textAlign: 'center',
|
||||
},
|
||||
},
|
||||
'.text-end-mobile': {
|
||||
'@media (max-width: 767px)': {
|
||||
textAlign: 'right',
|
||||
},
|
||||
},
|
||||
// Mobile-optimized grid
|
||||
'.grid-mobile-stacked': {
|
||||
'@media (max-width: 767px)': {
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
gap: '1rem',
|
||||
},
|
||||
},
|
||||
// Safe area padding for mobile notch
|
||||
'.safe-area-p': {
|
||||
paddingTop: 'env(safe-area-inset-top)',
|
||||
paddingBottom: 'env(safe-area-inset-bottom)',
|
||||
paddingLeft: 'env(safe-area-inset-left)',
|
||||
paddingRight: 'env(safe-area-inset-right)',
|
||||
},
|
||||
};
|
||||
|
||||
addUtilities(newUtilities, ['responsive', 'hover', 'focus']);
|
||||
},
|
||||
],
|
||||
}
|
||||
Reference in New Issue
Block a user