159. Solucionar problema de estilos en Ckeditor 5

Hola Steven, es una cuestion de estilos. Recuerda que Tailwind formatea todos los estilos.

Puedes hacer lo siguiente. Dirigete a la carpeta resources/css y crea un nuevo archivo css llamado ckeditor.css

En ese archivo css agrega lo siguiente

.ckeditor ul{
    @apply list-disc list-inside;
}

.ckeditor ol{
    @apply list-decimal list-inside;
}

.ckeditor a{
    @apply text-blue-600 visited:text-purple-600 underline;
}

.ckeditor h2{
    @apply text-2xl font-semibold;
}

.ckeditor h3{
    @apply text-xl font-semibold;
}

.ckeditor h4{
    @apply text-lg font-semibold;
}

.ckeditor strong{
    @apply font-bold;
}


.ckeditor ul:not(:last-child),
.ckeditor ol:not(:last-child),
.ckeditor p:not(:last-child),
.ckeditor h2:not(:last-child),
.ckeditor pre{
  @apply mb-4;
}

.ckeditor h3:not(:last-child),
.ckeditor h4:not(:last-child){
    @apply mb-3;
}

Luego dirigete a resources/css/app.css y agrega esta linea

@import 'ckeditor.css';

@tailwind base;
@tailwind components;
@tailwind utilities;

Es importante que lo agregues encima de las lineas que contienen @tailwind sino no funcionará.

Luego ejecuta npm run build para que reconozca los cambios, y finalmente a la hora de incluir tu ckeditor haz esto

<div class="ckeditor">
	<div id="ckeditor">
	</div>
</div>

la clase es para darle los estilos, y el id para iniciar el editor

gracias Victor