README

一套用于使用 LESS 创建 Silverstripe 主题的工具

SiteConfig 和 Page 扩展

添加此模块时，ThemeSiteConfigExtension 会在您的 SiteConfig 上激活。它将创建一个新主题选项卡，您可以在其中配置您的主题。

您可以配置主题的基本、主要和次要颜色以及标志/ favicon。

ThemePageControllerExtension 将确保

• 您包含 jQuery（如果需要，包括 jQuery UI）。始终最好先加载它，以避免任何可能导致插件损坏的进一步包含（通常在加载完整版本而不是最小版本时）。
• 如果需要，它将编译样式。请注意，样式仅在开发模式下自动刷新。

主题框架使用两种约定

• 您的主题必须在 css 文件夹中包含一个 "all.less" 文件。此 all.less 必须编译为 all.css 文件，如果找不到编译后的样式，则将默认使用。
• 您的主题应该在 js 文件夹中包含一个 "init.js" 文件。

所有编译后的样式都存储在 assets/Theme 文件夹中，以避免版本控制主题的编译版本。

您可以通过定义以下常量来禁用自动编译（如果您在本地开发，则此操作较慢）

define('THEME_FRAMEWORK_DISABLE_COMPILE',true);

UI 工具包

对于 Web 应用程序，我建议使用 UI 工具包框架来获取您所需的大部分功能 https://uikit.cn/

要启用，请使用以下 yml 配置

ThemePageControllerExtension:
  uikit:
	enabled: true
    theme_enabled: false
	theme: 'almost-flat'

您可以选择使用已编译的主题或使用 less 文件。如果您想根据您自己的配色方案覆盖变量，则使用 less 文件很有用。

注意：不要忘记 less 变量是惰性评估的，这意味着您可以在导入 uikit.less 之后定义变量

注意：如果选择导入 less 文件，您可以选择任何基础主题。对于图标，为了避免处理路径，最好将 "fonts" 目录直接复制到您的主题文件夹中

Google 字体

默认情况下，主题框架将加载 Open Sans 作为默认字体。您可以选择定义您选择的字体或禁用此设置

SiteConfig:
  google_fonts: 'Open+Sans:400italic,400,600&subset=latin,latin-ext'

Noty

主题框架附带了一个使用 Noty 的通知系统 https://github.com/needim/noty

您也可以通过在控制器上使用 SetSessionMessage 方法从会话中获取消息

旧版浏览器

此插件默认与 IE9 集成并启用，作为最低要求 https://github.com/burocratik/outdated-browser

Icomoon

此模块捆绑了所有 Fontawesome。您可以自由包含通过在线应用程序创建的自己的图标集：https://icomoon.io/app/

Silverstripe 的默认 CSS

库

• 混入
• Normalize

请注意，由于 less 文件通过 PHP 编译，因此您的 less 库不应使用 JavaScript 函数（例如 Lesshat 所做的）。

默认样式

• 布局
• 排版
• 表单

CSS 框架附带了一系列断点，应适用于大多数项目。您可以检查 "variables.less" 文件。

网格

此模块包括一个与 Silverstripe 表单兼容的独立网格系统

如何创建主题？

像往常一样创建主题！只需包含您需要的 less 文件。通常，我会有以下文件

• 包含所有其他文件的 all.less
• typography.less
• variables.less
• layout.less
• form.less
• fonts.less
• editor.less

在每个文件中包含主题框架的基础 less 文件，例如在 variables.less 中

@import "../../../theme-framework/css/variables.less";

或在 layout.less 中

@import "variables.less";
@import "../../../theme-framework/css/mixins.less";
@import "../../../theme-framework/css/layout.less";

Google Analytics Helper

在项目中集成 Google Analytics 是一个常见的场景。尽管 Silverstripe 中存在用于此目的的模块，但我总觉得仅仅为了在页面底部添加一个片段而包含整个模块有些遗憾。也常常需要让用户配置他们的跟踪代码。因此，本模块附带一个小助手来包含跟踪代码。

第三方库

图标生成器 https://github.com/chrisbliss18/php-ico

Less 编译器 https://github.com/oyejorge/less.php

兼容性

已测试与 3.1 版本兼容

维护者

LeKoala - thomas@lekoala.be