本文档提供了 Bulma CSS 框架在各个版本演进的全面历史,重点介绍了主要的架构变更、功能添加和破坏性更改。它作为开发人员理解 Bulma 如何随时间演进的参考,并为当前架构和实现提供背景信息。
有关当前架构的信息,请参阅 架构,有关构建系统细节,请参阅 构建系统。
Bulma 的开发历程从早期版本 (0.0.x) 一直到最新版本 (1.0.x)。每个主要版本都对框架的架构、组件和功能进行了重大更改。
在整个开发过程中,Bulma 经历了数次重大的架构转型,这些转型从根本上改变了框架的构建和使用方式。
v1.0.0 版本标志着框架使用 Dart Sass 完成了彻底重写,取代了之前使用的 LibSass。此次迁移支持了更现代的功能并提高了性能,同时保持了 HTML 兼容性。
随着 v1.0.0 版本,Bulma 从仅使用 Sass 变量转向利用 CSS 自定义属性(变量)。这一根本性改变允许在不重新编译 CSS 的情况下进行运行时自定义。
此次变更的关键方面
--bulma-primary)v0.9.0 版本通过新的 Sass mixin 和 RTL 特定构建引入了全面的 RTL 支持。
v0.5.0 版本引入了一个新的变量命名系统,遵循 component-subcomponent-state-property 的模式,提高了规范性,并使自定义更加直观。
此更改影响了大量变量,特别是与颜色相关的变量,其中大多数被重命名为附加 -color(例如,$card-background 变为 $card-background-color)。
来源: CHANGELOG.md1244-1245 CHANGELOG.md1249-1333
随着框架的成熟,Bulma 的文件结构发生了显著变化,增加了新的目录和组件来支持扩展功能。
来源: CHANGELOG.md213-214 CHANGELOG.md439-440
v1.0.0 版本通过专门的主题系统引入了原生的黑暗模式支持,实现了光明和黑暗外观之间的无缝切换。
来源: CHANGELOG.md102
在 Bulma 的整个发展过程中,颜色系统发生了显著变化
来源: CHANGELOG.md322-336 CHANGELOG.md606-607
v0.9.0 版本引入了一套全面的间距助手,用于处理边距和内边距,支持所有方向和各种尺寸。
v1.0.0 版本引入了多个 Bulma 的构建变体
base/helpers.sass 移动到其自己的 /helpers 文件夹list 组件form.sass,并将其移动到自己的文件夹$link 颜色已包含在 $colors 映射中.button.is-link 现在是一个彩色按钮,而不是带下划线的按钮variables.sass 和 nav.sass 文件.field 元素;.control 被重新利用.pagination 尺寸$fullhd 断点 (1344px)$easing、$radius-rounded 和 $speed Sass 变量的使用问题来源: CHANGELOG.md3-18
is-col-mincurrentColor 和 inherit 作为颜色和背景辅助下表总结了未在上面详细介绍的其他重大变更
| 版本 | 功能 | 描述 |
|---|---|---|
| v0.9.4 | 响应式按钮 | 按钮大小随断点变化 |
| v0.9.3 | 带下划线的文本 | 新的 is-underlined 类 |
| v0.9.2 | 幽灵按钮 | 新的 is-ghost 按钮样式 |
| v0.9.1 | Flexbox 辅助 | 新的 flexbox 工具类 |
| v0.7.2 | 全高带导航栏 | is-fullheight-with-navbar hero 类 |
| v0.7.1 | 背景辅助 | 所有阴影变体都已添加 |
| v0.6.2 | 圆角元素 | 圆角按钮、输入框、分页 |
| v0.5.3 | 只读输入框 | 支持只读表单控件 |
| v0.5.1 | 文件上传 | 新的文件上传元素 |
来源: CHANGELOG.md107-115 CHANGELOG.md134-137 CHANGELOG.md170-172 CHANGELOG.md193-197 CHANGELOG.md558-564 CHANGELOG.md591-593 CHANGELOG.md1056-1058 CHANGELOG.md1187-1191 CHANGELOG.md1223-1224