Ir al contenido principal

📢 El sistema de diseño de Flowtitude: optimización y flexibilidad con Tailwind CSS y WordPress

El sistema de diseño de Flowtitude es una configuración personalizada de Tailwind CSS, pensada para integrarse sin problemas con Bricks Builder y optimizar el flujo de trabajo en el desarrollo web. Su objetivo es garantizar consistencia, escalabilidad y flexibilidad, proporcionando herramientas que faciliten la creación de diseños bien estructurados.

🛠️ Características principales

📏 Tipografía y Espaciado Avanzado

✅ Preflight configurable para ajustar estilos base sin conflictos.
✅ Tamaños específicos para etiquetas semánticas en títulos y párrafos.
✅ Tipografía fluida, adaptándose dinámicamente a distintos tamaños de pantalla.
✅ Sistema de espaciado ampliado y fluido, garantizando flexibilidad en el diseño.

🎨 Diseño y Componentes Personalizados

✅ Bordes y redondeos personalizados para botones, tarjetas y secciones con valores independientes.
✅ Gestión de secciones y contenedores mejorada con espaciado inteligente y .has-background para definir secciones con padding completo.
✅ Sistema de grid de 12 + 4 columnas para máxima flexibilidad en el diseño de layouts.
✅ Mini componente para mejora de contenido dinámico, similar al plugin de tipografía.

✨ Transiciones y Animaciones

✅ Duraciones de transición ampliadas con valores semánticos (none, slower, slow, normal, fast, faster) y en pasos de 100 hasta 1000.
✅ Valores de delay extendidos, permitiendo un mayor control sobre las animaciones.
✅ Paquete de animaciones para efectos en scroll (próximamente).

📦 Componentes incluidos

  • 📌 Define imagenes o video como fondos de secciones o bloques.
  • 📌 Click Parent (clases para mejorar la usabilidad)
  • 📌 Botones básicos
  • 📌 Badges básicos
  • 📌 Tarjetas básicas
  • 📌 Muchos más proximamente...

🔧 Nuevas Utilidades y Funcionalidades

✅ Nuevas relaciones de aspecto para imágenes.
✅ Grids personalizados con diferentes anchos de columna.
✅ Grids autoresponsivos con auto-fit y auto-fill.
✅ Función de espejo horizontal y vertical para transformar elementos fácilmente.

🌙 Soporte para tecnologías avanzadas

✅ Query Containers para diseños más flexibles en Tailwind CSS 3.
✅ Modo oscuro optimizado con Nightwind.
✅ Plugin de variables para mayor personalización y escalabilidad.

💡 Este sistema de diseño no solo facilita la coherencia en los proyectos, sino que acelera el flujo de trabajo y proporciona herramientas avanzadas para construir interfaces dinámicas y bien estructuradas.

📢 Queremos seguir mejorándolo y nos encantaría contar con tu feedback.
🔹 ¿Tienes alguna idea para nuevas utilidades o componentes?
🔹 ¿Has encontrado algún error o aspecto que podríamos mejorar?

💬 Déjanos tus sugerencias y ayúdanos a hacer que el sistema de diseño de Flowtitude sea aún mejor. 🚀✨