MarkdownX - TailwindCSS v.3 support

Hi there,

This is definitely on our todo list however we don't have an exact ETA yet. Thanks for mentioning it though, I will bring it up internally and will try to prioritize it if possible!

That would be great, it will be used for a Machine Learning project where content will be generated in Markdown format (Proof of Concept) in a Laravel 9 project.

I don't know the amount of work it means, but all new projects of the TALL stack will be using it I think.

Hello, I am a Pro member and new to the Devdojo platform, I am unable to validate my phone number here from Brazil. The phone number input field won't let me enter 9 digits. What is the platform's support email address?

Hey @claudiosilvadigital,

I've went ahead and manually verified your account, I will look into that problem with Brazillian numbers, thank you for reporting it!

Hey Peter,

So I've just tested the MarkdownX with Tailwind CSS v3 and it seems to be working as expected. Also the DevDojo website itself uses the MarkdownX editor and Tailwind CSS v3.

Can you provide some more information on what exactly does not work well on your end?

Super cool project btw! Feel free to share a post about the project once you've got the POC ready! I would love to learn more about it!

The / command is not looking good. No scrolling available there. I used a default "laravel new --jet scaffold" with L9. And the textarea is looking a bit weird. I will setup a new blank page to share here later today.

If I get it working nicely I will make sure to blog about it.

Hi Peter,

Thanks for the additional details! I will look into it further!

I've just installed the markdown-x editor in my Laravel 9 project. Whats strange is that the scrolling is not working... If i change de overflow class then i can make it scroll but it doenst work properly then.

i don't see any errors in de console.

Is it possible that markdown x doesnt work properly with Alpine v3 ? even if i dont get any error message?

Hey Guys,

I've went ahead and installed MarkdownX in the latest version of Laravel which contains Tailwind V3 and Alpine V3.

If the styling looks really off, you may need to include the location to the livewire view files inside your tailwind.config.js under the content array:

'./resources/views/livewire/*.php'

So, here is an example of how the whole tailwind.config.js would look in a default L9 project:

const defaultTheme = require('tailwindcss/defaultTheme');

module.exports = {
    theme: {
        extend: {
            fontFamily: {
                sans: ['Inter var', ...defaultTheme.fontFamily.sans],
            },
        },
    },
    variants: {
        extend: {
            backgroundColor: ['active'],
        }
    },
    content: [
        './app/**/*.php',
        './resources/**/*.html',
        './resources/**/*.js',
        './resources/**/*.jsx',
        './resources/**/*.ts',
        './resources/**/*.tsx',
        './resources/**/*.php',
        './resources/**/*.vue',
        './resources/**/*.twig',
        './resources/views/livewire/*.php'
    ],
    plugins: [
        require('@tailwindcss/forms'),
        require('@tailwindcss/typography'),
    ],
};

Please confirm that you've done this and it should stylize everything correctly. If you guys still have some issues with the layout, please post a screenshot and a little bit more info about the issue.

Appreciate it!