vndangkhoa/kv-port
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

portfolio and cv static color for both views

Browse source
This commit is contained in:
vndangkhoa 2026-04-29 16:48:38 +07:00
parent fc4b1e657c
commit 11ca4110a6
1 changed files with 15 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
src/App.jsx
View file

@ -44,16 +44,14 @@ function TetrisPiece({ piece, isDark }) {
}
};
// For desktop: start gray, show hover color when hovering
// For mobile dark: use colorDark for less gray
// For mobile light: use actual color
const bgColor = piece.label === 'cv'
? piece.color
: (isMobile && isDark)
? (color || piece.colorDark || piece.color)
: (isMobile)
? (color || piece.color)
: '#cccccc'; // Start gray for desktop
// Static pieces (CV, Portfolio): always show their color
// Other pieces: desktop starts gray, mobile uses actual color
const isStaticPiece = piece.label === 'cv' || piece.featured;
const bgColor = isStaticPiece
? (isDark ? (piece.colorDark || piece.color) : piece.color)
: (isMobile)
? (color || piece.color)
: '#cccccc'; // Start gray for desktop
const rowDelay = (piece.startY * 10) + (piece.startX * 2); // Stagger based on both X and Y position
const textColor = '#ffffff';
const isStatic = piece.label === 'cv' || piece.featured;
@ -69,14 +67,16 @@ const bgColor = piece.label === 'cv'
animationFillMode: 'forwards',
};
// For desktop: use hoverColor when hovering, otherwise gray
// For mobile: use blinkColor for animation (will start dim via animation)
// For static pieces (CV, Portfolio): always show static color
// For non-static: desktop uses hover, mobile uses animation
const bgStyle = {
position: 'absolute',
inset: 0,
backgroundColor: isDark || isMobile
? (color || bgColor) // Use actual color for blink animation
: (isHovered ? (piece.hoverColor || color) : '#cccccc'), // Hover color or gray
backgroundColor: isStaticPiece
? bgColor // Static pieces always show their color
: (isDark || isMobile)
? (color || bgColor) // Use actual color for blink animation
: (isHovered ? (piece.hoverColor || color) : '#cccccc'), // Hover color or gray
transition: 'background-color 0.15s ease',
};