README

关于

这是为 Laravel Nova 2 设计的可折叠侧边栏。

安装

要在 Laravel Nova 项目中安装侧边栏，请运行以下命令

composer require pos-lifestyle/laravel-nova-collapsible-sidebar

用法

将 Laravel Nova 布局模板 vendor/laravel/nova/resources/views/layout.blade.php 复制到 resources/views/vendor/nova/layout.blade.php。

mkdir -p resources/views/vendor/nova
cp -r vendor/laravel/nova/resources/views/layout.blade.php resources/views/vendor/nova/layout.blade.php

在 resources/views/vendor/nova/layout.blade.php 中，您将找到如下所示的侧边栏

<!-- Sidebar -->
<div class="min-h-screen flex-none pt-header min-h-screen w-sidebar bg-grad-sidebar px-6">
    <a href="{{ \Laravel\Nova\Nova::path() }}">
        <div class="absolute pin-t pin-l pin-r bg-logo flex items-center w-sidebar h-header px-6 text-white">
           @include('nova::partials.logo')
        </div>
    </a>

    @foreach (\Laravel\Nova\Nova::availableTools(request()) as $tool)
        {!! $tool->renderNavigation() !!}
    @endforeach
</div>

将普通的 div 标签替换为 collapsible-sidebar

<collapsible-sidebar class="min-h-screen flex-none pt-header min-h-screen w-sidebar bg-grad-sidebar px-6">
    ...
</collapsible-sidebar>

现在您可以通过点击侧边栏右上角的图标来切换侧边栏。当鼠标指针移动到侧边栏上时，侧边栏会自动展开。

配置

要保存状态，请在 collapsible-sidebar 标签中添加 persist。

<collapsible-sidebar class="..." persist>
    ...
</collapsible-sidebar>

要仅在将鼠标指针移至侧边栏上时显示触发器，请在 collapsible-sidebar 标签中添加 shy-trigger。

<collapsible-sidebar class="..." shy-trigger>
    ...
</collapsible-sidebar>

屏幕截图