Vendor Dashboard updated
This commit is contained in:
113
frontend/src/index.css
Normal file
113
frontend/src/index.css
Normal file
@@ -0,0 +1,113 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');
|
||||
@import "tailwindcss";
|
||||
|
||||
|
||||
@theme {
|
||||
--font-sans: "Inter", "system-ui", "-apple-system", "sans-serif";
|
||||
--color-primary: #231651;
|
||||
--color-primary-light: #35217a;
|
||||
--color-primary-glow: rgba(35, 22, 81, 0.1);
|
||||
--color-bg-main: #D6FFF6;
|
||||
--color-bg-sidebar: #ffffff;
|
||||
--color-text-dark: #231651;
|
||||
--color-text-primary: #231651;
|
||||
--color-text-secondary: #4a3e7a;
|
||||
--color-text-muted: #7b71af;
|
||||
--color-border: rgba(35, 22, 81, 0.1);
|
||||
--color-border-light: rgba(35, 22, 81, 0.05);
|
||||
}
|
||||
|
||||
@layer base {
|
||||
* {
|
||||
@apply border-border;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
@apply bg-bg-main text-text-primary antialiased;
|
||||
font-family: var(--font-sans);
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
@apply font-bold tracking-tight text-text-dark;
|
||||
}
|
||||
}
|
||||
|
||||
@layer components {
|
||||
.premium-card {
|
||||
@apply bg-white rounded-[2rem] border border-border shadow-sm transition-all duration-500 hover:shadow-xl hover:shadow-primary/5 hover:-translate-y-1;
|
||||
}
|
||||
|
||||
.glass-effect {
|
||||
@apply bg-white/80 backdrop-blur-md border border-white/20;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
@apply bg-primary text-white px-6 py-3 rounded-2xl font-bold transition-all duration-300 hover:bg-[#4a0a38] hover:scale-105 active:scale-95 shadow-lg shadow-primary/20;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
@apply bg-white text-text-primary px-6 py-3 rounded-2xl font-bold border-2 border-border transition-all duration-300 hover:bg-gray-50 hover:border-primary/20;
|
||||
}
|
||||
}
|
||||
|
||||
/* Custom Scrollbar Override for v4 */
|
||||
* {
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: var(--color-border) transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: var(--color-border);
|
||||
border-radius: 100px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background-color: var(--color-text-muted);
|
||||
}
|
||||
|
||||
/* Animations */
|
||||
@keyframes slideUp {
|
||||
from { opacity: 0; transform: translateY(20px); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
|
||||
.animate-slideUp {
|
||||
animation: slideUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
|
||||
}
|
||||
|
||||
/* Chart Tooltip Customization (v4 compatibility) */
|
||||
.recharts-default-tooltip {
|
||||
background-color: rgba(255, 255, 255, 0.95) !important;
|
||||
backdrop-filter: blur(8px) !important;
|
||||
border: 1px solid var(--color-border) !important;
|
||||
border-radius: 1rem !important;
|
||||
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1) !important;
|
||||
padding: 1rem !important;
|
||||
}
|
||||
|
||||
.recharts-tooltip-label {
|
||||
font-size: 0.7rem !important;
|
||||
font-weight: 900 !important;
|
||||
color: var(--color-text-muted) !important;
|
||||
text-transform: uppercase !important;
|
||||
letter-spacing: 0.1em !important;
|
||||
margin-bottom: 0.5rem !important;
|
||||
}
|
||||
|
||||
.recharts-tooltip-item {
|
||||
color: var(--color-primary) !important;
|
||||
font-weight: 800 !important;
|
||||
font-size: 0.85rem !important;
|
||||
}
|
||||
Reference in New Issue
Block a user