etkr4k/bedolaga-cabinet
1
0
Fork 0
mirror of https://github.com/chillpadclub/bedolaga-cabinet.git synced 2026-07-28 09:33:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: add fonts, animations, and shared utilities for dashboard redesign

Browse Source 
Add Outfit + IBM Plex Mono fonts, traffic progress animations
(shimmer, unlimited flow/pulse, trial glow), traffic zone utility,
and animated number hook.
This commit is contained in:
Fringg
2026-02-25 10:07:42 +03:00
parent d8b83ccdb8
commit 7e345fc7d0
4 changed files with 119 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
tailwind.config.js
View File

@@ -112,6 +112,8 @@ export default {
'Roboto',
'sans-serif',
],
display: ['Outfit', 'Manrope', 'system-ui', 'sans-serif'],
mono: ['IBM Plex Mono', 'ui-monospace', 'monospace'],
},
borderRadius: {
bento: '24px',
@@ -173,6 +175,11 @@ export default {
'move-horizontal': 'moveHorizontal 40s ease infinite',
'move-in-circle-fast': 'moveInCircle 20s ease infinite',
'spotlight-ace': 'spotlightAce 2s ease 0.75s 1 forwards',
// Dashboard traffic animations
'traffic-shimmer': 'trafficShimmer 2s ease-in-out infinite',
'unlimited-flow': 'unlimitedFlow 3s linear infinite',
'unlimited-pulse': 'unlimitedPulse 2s ease-in-out infinite',
'trial-glow': 'trialGlow 2s ease-in-out infinite',
},
keyframes: {
fadeIn: {
@@ -251,6 +258,23 @@ export default {
'0%': { opacity: '0', transform: 'translate(-72%, -62%) scale(0.5)' },
'100%': { opacity: '1', transform: 'translate(-50%, -40%) scale(1)' },
},
// Dashboard traffic keyframes
trafficShimmer: {
'0%': { transform: 'translateX(-100%)' },
'100%': { transform: 'translateX(200%)' },
},
unlimitedFlow: {
'0%': { backgroundPosition: '0% 50%' },
'100%': { backgroundPosition: '200% 50%' },
},
unlimitedPulse: {
'0%, 100%': { opacity: '0.6', transform: 'scale(1)' },
'50%': { opacity: '1', transform: 'scale(1.3)' },
},
trialGlow: {
'0%, 100%': { boxShadow: '0 0 15px rgba(var(--color-warning-500), 0.2)' },
'50%': { boxShadow: '0 0 30px rgba(var(--color-warning-500), 0.4)' },
},
},
transitionTimingFunction: {
smooth: 'cubic-bezier(0.4, 0, 0.2, 1)',