Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

Animate column task count when number changes 🔢

Abierto
  • ¿Algo no está bien?
#308 3 comentarios 0 reacciones 1 asignado Ver en GitHub

Los mantenedores suelen responder en 1 día

@Suriya-Haidari ya está trabajando en esto.

Desde el 17/8/2026.

Evaluación

Este issue todavía no se ha evaluado.

Descripción

good first issue

Animate column task count when number changes 🔢

File: client/src/components/Board/Column.jsx

When you add/move a task the count number
just instantly changes 💀 boring fr!!

Fix: add a pop animation using Tailwind:
const [animate, setAnimate] = useState(false)

useEffect(() => {
setAnimate(true)
const t = setTimeout(() => setAnimate(false), 300)
return () => clearTimeout(t)
}, [tasks.length])

<span className={text-[10px] font-bold bg-purple-500/20 text-purple-400 px-2 py-0.5 rounded-full transition-transform ${animate ? 'scale-125' : 'scale-100'}}>
{tasks.length}

~8 lines! No backend needed 🎯
Looks SO satisfying when moving cards!! 🔥

Lenguaje dominante
JavaScript
Estrellas
39
Forks
105
Merge medio
1 d 20 h
PR fusionados (30 d)
28

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de anoopcodehack/DevBoard

Todos los issues de anoopcodehack/DevBoard

Issues similares

Más issues de JavaScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.