Elements disappear

Abierto
#7 5 comentarios 0 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
4/5
Tiempo estimado
3-5 días
Aptitud para principiantes
25/100
Tipo de issue
Error
Claridad
Necesita aclaración
Estado de actividad
Estancado
Stack tecnológico
tailwindcss
Área
frontend, tooling

Línea de trabajo

Comienza con el tailwind.config.js personalizado, la configuración darkMode: 'class' y el enlace Alpine.js x-on:class mostrado en el fragmento HTML. Reproduce el problema cambiando el icono Moon e inspeccionando los elementos; después, determina las circunstancias que hacen que desaparezcan otros elementos. Se considera terminado cuando haya una reproducción fiable y una causa confirmada o una limitación de compatibilidad claramente documentada.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

bug

I'm not sure you would class this as a bug, or it's a compatibility issue - but it's driving me bonkers.

  • I'm using custom tailwind.config.js
    • darkMode: 'class'
  • alpine.js

My account on beyondcode - doesn't find the email my license was sent to, so can't PW reset, so i've signed up a new account and linked my GH profile, so you can verify the license with me directly.

Before activation:

image

If for example, I click on the "Moon" SVG icon (switch from dark / light mode) and inspect element.

toggle a class such as hover:text-gray-600

I loose other elements

image

I have had a hard time trying to replicate exact reproducible steps, as sometimes it works and sometimes it does the above. - under what circumstances I have no idea.

The only significan't things i'm using is TW darkmode class and alpine.js binding to x-on:class binding (but I would presume it ignores this)

<li :class="{'text-sm xl:text-lg hover:text-blue-400': $store.navPage.page !== 'home', 'text-sm xl:text-lg font-bold underline underline-offset-4 decoration-blue-500': $store.navPage.page === 'home'}" class="text-sm xl:text-lg hover:text-blue-400" data-tw-selected="1648081575803"><a href="/index.html" data-tw-selected="1648081573434" class="">Home</a></li>

Alpinejs class binding is no different to using Vuejs v-bind:class=

this might not even be the issue, but the only difference in standard css implementation that is in use.

Lenguaje dominante
Sin datos de lenguaje
Estrellas
5
Forks
0
Métricas de merge de PR
Sin PR fusionados en 30 d

Guía de contribución

No hay ninguna guía de contribución indexada para este repositorio

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 beyondcode/devtoolsfortailwind-community

Todos los issues de beyondcode/devtoolsfortailwind-community

Issues similares

Más issues de Web Dev

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.