minimalistic.css incorrect adaptive behavior when connecting tailwind @utilities

[savosik]

MoonShine Version

2.18.1

Laravel Version

10.4.1

PHP Version

8.2

Database Driver & Version

MySQL 8.2

Description

When connected original tailwind utilities, Instead of the full logo, the mobile logo is displayed, and instead of the full search, the mobile search is shown.

Steps To Reproduce

MoonShineLayout:

final class MoonShineLayout implements MoonShineLayoutContract
{
    public static function build(): LayoutBuilder
    {
        return LayoutBuilder::make([...])->bodyClass('theme-minimalistic');
    }
}

MoonShineServiceProvider:

class MoonShineServiceProvider extends MoonShineApplicationServiceProvider
{
    public function boot(): void
    {
        parent::boot();

        moonShineAssets()->add([
            Vite::asset('resources/css/app.css'),
        ]);
...

resources/css/app.css :

@import "minimalistic.css";

@tailwind base;
@tailwind components;
@tailwind utilities;  /* Whoops... it is conflicting file */

vite.config.json:

import {defineConfig} from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: [
                'resources/css/app.css',
                'resources/js/app.js',
            ],
            refresh: true,
        }),
    ],
});

npm run build

[DissNik]

Не смог повторить ваш случай.

Что за файл minimalistic.css вы подключаете и зачем? Какой возникает конфликт? У вас на скрине не минималистичная тема.

[DissNik]

Точнее она, но похоже, что вы ее кастомизируете, при билде у вас ошибки не возникают?

[savosik]

можно воспроизвести так:

/resources/css/app.css:

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

monshineServiceProvider:

        moonShineAssets()->add([
            '/vendor/moonshine/assets/minimalistic.css',
               Vite::asset('resources/css/app.css')
        ]);

А утилиты нужны для того чтобы удобно было писать классы, например: text-right и т.д.

[DissNik]

А что у вас в tailwind.config.js?

[lee-to]

Слишком долго нет ответа