Mi página personal está hecha en Symfony. Ya, ya sé, no es la mejor elección, pero empecé cuando era joven y más descuidado, pensando que iba a haber más dinamismo, haría muchas cosas, y una página web compilada no sería suficiente.
Hace un par de días decidí que ya era hora de empezar de cero y crear una página nueva, esta vez usando un generador estático. Acabé decidiéndome por Hugo.
Como la página antigua era un poco… malurria, quería sacar la nueva lo antes posible. Sin embargo, aún me faltaba un banner que dijese “eh, aún estoy trabajando en ello y seguro que faltan cosas”. Bueno, en realidad no es completamente necesario, pero queda chulo.
Mi objetivo era emular una especie de cinta de peligro, de estas negras y amarillas que te recuerdan a las obras. Hacer el fondo de rayas no fue difícil, gracias a herramientas como stripesgenerator.com, pero lo más importante es girar un poquito el componente, simulando una cinta mal colocada y cediendo ante la gravedad.
No fue tan difícil, gracias a la propiedad transform: rotate().
Al final quedó algo así:
See the Pen Untitled by David Davó (@daviddavo) on CodePen.
¿Qué opinas? Ha quedado chulo, ¿no? Si haces alguna modificación, ¡no te olvides de compartirla!