README

Nova暗色主题

Nova暗色主题，专为Laravel Nova设计，以减轻您的视觉疲劳 👀

安装

首先使用Composer将项目拉取到本地

composer require david-griffiths/nova-dark-theme

(记住，您可以使用Nova安装多个主题。因此，您无需在两者之间做出选择。)

接下来，您需要激活暗黑模式。为了帮助您，我们提供了几个便利的命令...

从菜单中添加/移除开关

这可能是您想要的，因为它允许您在夜间轻松开启暗黑模式。

php artisan nova-dark-theme:add-switch

如果您尚未创建可覆盖的Nova用户菜单副本（右上角的那个），此命令首先会做这件事。然后，它将添加Vue组件，看起来像这样

        <li>
            <nova-dark-theme-toggle
                label="{{ __('Dark Theme') }}"
            ></nova-dark-theme-toggle>
        </li>
    </ul>
</dropdown-menu>

要从菜单中移除开关，您可以自己编辑文件，或者运行此命令

php artisan nova-dark-theme:remove-switch

默认开启/关闭暗黑模式

这可以与开关一起使用，也可以不使用开关。如果您不使用开关，则当您设置暗黑模式为开启时，它将保持开启状态，用户无法更改。如果您使用开关，则以下命令仅在页面首次加载时设置主题状态。然后，用户可以随时翻转开关。

php artisan nova-dark-theme:on

php artisan nova-dark-theme:off

这些命令会在Nova的主要布局模板中的HTML标签中添加或删除一个名为nova-dark-theme的CSS类。同样，在做出更改之前，我们将此文件复制到您的资源目录（如果尚未这样做）。

(:exclamation: 您可能需要运行php artisan view:clear或php artisan view:cache才能看到结果)

CSS的工作原理

我们使用CSS过滤器来反转颜色，然后对侧边栏和标志区域进行一些手动调整。因此，白色变为黑色，您在添加任何自定义CSS颜色时应该记住这一点。

代码字段

它不会为您设置的Nova 代码字段。我不想在您可以从这里选择一个并设置为这样时，强制您使用CodeMirror主题。

Code::make('MyTextField')->options(['theme' => 'base16-light'])

(:exclamation: 如果您想使它看起来在Nova中是暗色，在颜色反转后记得选择一个浅色的CodeMirror主题)

许可

MIT许可（MIT）。有关更多信息，请参阅许可文件。

david-griffiths / nova-dark-theme

维护者

详细信息