quick-config-styles v1.2.1

quick-config-styles

Regla para crear componente

• Ingresar a la carpeta correspondiente (light o dark)
• Crear la carpeta del componente en iniciando en mayuscula
• Cada palabra del componente debe iniciar siempre en mayuscula
• El nombre del componente debe estar en inglés
• Dentro de la carpeta se debe crear un index.jsx
• El nombre del componente debe ser el mismo nombre de la carpeta

Regla para mostrar el componente en el indice de la pagina

• Se debe ingresar el nombre del componente en el json que se encuentra dentro de la carpeta (light o dark, según sea el caso)
• Se ingresa a la carpeta data -> index.js
• Al final del archivo se ingresa el id, value y name, para el id se continua con el consecutivo, el value debe ser el mismo nombre con el que se creo la carpeta y el componente (respetando las mayusculas y minusculas) y el name es el que se muestra en el indice de la página, asi que puede ser cualquier nombre que identifique de forma clara para el usuario el componente que se maqueto
• No es necesario ingresar en el json el nombre de forma alfabetica, ya que en el componente del indice se hace un sort para ordenar los nombre de los componentes.

Regla para poner estilo al componente

• Se utiliza el framework Tailwind
• En el archivo global.css se crean las clases personalizadas
• En el archivo index.js se configura los colores, extensiones y demás variables que se van a utilizar, es necesario leer la documentación cuando se quiere utilizar una clase especifica de Tailwind ya que normalmente se debe configurar en este archivo para que funcione el estilo. Este archivo index.js se encuentra dentro de la carpeta principal del proyecto, proyecto/src/index.js
• Para ocultar o mostrar clases se realiza con la libreria 'clsx'