原文： https://thub.freeflarum.com/d/6 HubUi-X 第一代 ThemeHub 样式主题，将您的 Flarum 用户体验提升到一个全新水平！ ⚠ 其他注意事项使用此主题时请关闭所有主题包（除 Mobile Tab），并删除所有 CSS。介绍这是参考 Asirem、OXO、Fluent 和其他主题设计的，使用这款样式，它将为您带来现代、柔和的体验。第一代 HubUi-X 样式主题，以其创新的设计，将您的 Flarum 视觉提升到一个全新水平。这不仅仅是一次简单的视觉更新，而是一次全面的体验革新。HubUi-X 主题通过精心设计的用户界面和直观的交互元素，确保了用户在使用 Flarum 论坛时能够享受到无与伦比的流畅性和便捷性。这种主题的设计理念是“简约而不简单”，在保持界面整洁的同时，不牺牲任何功能和细节。色彩搭配上，HubUi-X 采用了柔和而现代的色调，既能够吸引用户的眼球，又不会分散用户对内容的关注。布局上，它采用了灵活的响应式设计，无论是在桌面还是移动设备上，都能提供最佳的浏览体验。交互设计上，HubUi-X 主题提供了平滑的动画效果和即时的反馈机制，使用户的操作更加直观和自然。为了提升用户体验，HubUi-X 主题还特别注重了性能优化，通过减少 HTTP 请求、压缩资源文件和优化图片等手段，显著提高了页面加载速度，减少了等待时间。总的来说，第一代 HubUi-X 样式主题是一个全面友好的解决方案，它将彻底改变您对 Flarum 论坛的看法，为您带来一个更加丰富、高效和愉悦的在线交流体验。

如果不想安装扩展，也可以使用 CSS 代码，完美还原。 @border-radius: 12px; .WelcomeHero { color: #fdfdfd; background: linear-gradient(160deg, var(--control-bg-shaded), var(--button-primary-bg-hover)); } body, #app .App-content { background-color: var(--control-bg-light); } #drawer, #app-navigation, #header { & when (@config-colored-header = false){ background-color: var(--control-bg-light); } } .AfruxWidgets-Widget-content { border-radius: @border-radius; } .item-like .Button--link .Button-label,.item-dislike .Button--link .Button-label,.item-reply .Button--link .Button-label { display:none; } .item-like .Button:before { font-family:'Font Awesome 5 Free'; font-weight:600; font-size:14px; content:'\f164'; vertical-align:-1px; } .item-dislike .Button:before { font-family:'Font Awesome 5 Free'; font-weight:600; font-size:14px; content:'\f165'; vertical-align:-3px; } .item-reply .Button--link:before { font-family:'Font Awesome 5 Free'; font-weight:600; font-size:15px; content:'\f3e5'; margin-right:4px; vertical-align:-2px; } .PostStream { border-radius: @border-radius; margin: 4px; padding: 4px 22px 4px 22px; & when (@config-dark-mode = false) { background-color: rgba(255,255,255,0.8); } & when (@config-dark-mode = true) { background-color: rgba(14,14,14,0.8); } } .PostsUserPage { border-radius: @border-radius; margin: 4px; padding: 12px 22px 12px 22px; & when (@config-dark-mode = false) { background-color: rgba(255,255,255,0.8); } & when (@config-dark-mode = true) { background-color: rgba(14,14,14,0.8); } } .DiscussionListItem { margin: 8px 0px 8px 0px; border-radius: @border-radius !important; & when (@config-dark-mode = false) { background-color: rgba(255,255,255,0.8); } & when (@config-dark-mode = true) { background-color: rgba(14,14,14,0.8); } } .DiscussionListItem-content { border-radius: @border-radius !important; } aside.DiscussionPage-list { padding: 4px; } .Slidable-content { margin-top: 4px; } @media @phone { .DiscussionListItem { margin: 8px; } } @media @tablet-up { li.item-nav { padding: 2px 12px 2px 12px; border-radius: @border-radius; & when (@config-dark-mode = false) { background-color: rgba(255,255,255,0.8); } & when (@config-dark-mode = true) { background-color: rgba(14,14,14,0.8); } } } .Badge { opacity: 0.9; color: #fff; } .Hero-close { display: none; } header.Hero.DiscussionHero, header.Hero.WelcomeHero { border-radius: @border-radius; } .darkenBackground,.Hero { border-radius: @border-radius; } .Hero { margin: 12px; } .Dropdown-menu { border-radius: @border-radius; padding: 1px; &>li { margin: 4px; &>a, &>button { border-radius: @border-radius; } } } ul.NotificationGroup-content { &>li { margin: 4px 8px; &>a { &.Notification { border-radius: @border-radius; } &.unread .Notification-title:after { content: ''; display: inline-block; width: 1em; height: 1em; border-radius: 50%; background-color: var(--primary-color); transform: translateY(10%); margin-left: 8px; } } } } .Composer { border-radius: 12px 12px 0 0; } .ComposerBody-loading { border-radius: 12px; } @media (min-width:992px){ .TagTiles>li{ width: 30% !important; border-radius: @border-radius !important; margin: 15px; } } @media (max-width:991px) and (min-width:768px){ .TagTiles>li{ width: 45% !important; border-radius: @border-radius !important; margin: 15px; } } @media (max-width: 767px){ .TagTiles>li{ border-radius: @border-radius !important; margin: 15px; } } .Button:active, .Button.active, .open>.Button.Dropdown-toggle { box-shadow: unset; } if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); }

对了，Composer 命令：安装： composer require kk14569/flarum-hubui-x if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } 更新： php flarum migrate php flarum cache:clear if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); }

Mobile tab可以用，OXO不可以。

小小白哦原贴https://thub.freeflarum.com/d/6 里面写了如需转载代码，请不要直接发布代码，而是让用户转到 https://thub.freeflarum.com/d/6 中注册 ThemeHub 社区获取最新版代码。

小小白哦第一代 HubUi-X 样式主题，以其创新的设计，将您的 Flarum 视觉提升到一个全新水平。这不仅仅是一次简单的视觉更新，而是一次全面的体验革新。HubUi-X 主题通过精心设计的用户界面和直观的交互元素，确保了用户在使用 Flarum 论坛时能够享受到无与伦比的流畅性和便捷性。这种主题的设计理念是“简约而不简单”，在保持界面整洁的同时，不牺牲任何功能和细节。色彩搭配上，HubUi-X 采用了柔和而现代的色调，既能够吸引用户的眼球，又不会分散用户对内容的关注。布局上，它采用了灵活的响应式设计，无论是在桌面还是移动设备上，都能提供最佳的浏览体验。交互设计上，HubUi-X 主题提供了平滑的动画效果和即时的反馈机制，使用户的操作更加直观和自然。为了提升用户体验，HubUi-X 主题还特别注重了性能优化，通过减少 HTTP 请求、压缩资源文件和优化图片等手段，显著提高了页面加载速度，减少了等待时间。总的来说，第一代 HubUi-X 样式主题是一个全面友好的解决方案，它将彻底改变您对 Flarum 论坛的看法，为您带来一个更加丰富、高效和愉悦的在线交流体验。原文不是这样写的

HubUi-X

JntmIkun

阿思米賽？谁说我死了？？我只是 QQ 没了好吧。

小小白哦

JntmIkun ？我这个用的不是原帖，原帖字太少了，不符合扩展贴，所以我用的是 AI 生成的，然后修改了一下。

JntmIkun

怎么没更新日志，国际站都有。
https://discuss.flarum.org/d/34823-hubui-x-theme/11

小小白哦

Release-1.0.5

Fix FontAwesome 6 incompatibility problem.

修复 FontAwesome 6 不兼容问题。

Release-1.0.6

Add button color transition animation;

添加按钮颜色过渡动画;

Update the “Load More” button style.

更新“加载更多”按钮样式。

Release-1.0.7

Add settings page background;

添加设置页面背景;

Add loading indicator style.

添加加载指示器样式。

Release-1.1.0

Add admin page support.

添加管理页面支持。

Release-1.1.1

Fine-tune the distance between the elements.

微调元素之间的距离。

JntmIkun

小小白哦又更新了，这里还没更新日志？

小小白哦

JntmIkun nnd，没法编辑

k08255-lxm

这个仓库似乎是私有的，pull的时候都不成功

JntmIkun

k08255-lxm https://github.com/kk14569/flarum-hubui-x

k08255-lxm

JntmIkun Failed to download zerosonesfun/elint from dist: The “https://api.github.com/repos/zerosonesfun/elint/zipball/832ba7d6d0c6320a5c259668da90b0500e789691” file could not be downloaded (HTTP/1.1 404 Not Found):
{“message”:“Not Found”,“documentation_url”:“https://docs.github.com/rest/repos/contents#download-a-repository-archive-zip","status":"404″}
Now trying to download from source

Syncing zerosonesfun/elint (3.4) into cache
1/1 [============================] 100%
In Git.php line 473:

Failed to execute git clone –mirror – ’https://git...GxE:x-oauth-basic@gi
thub.com/zerosonesfun/elint.git’ '/root/.cache/composer/vcs/https—github.
com-zerosonesfun-elint.git/'

Cloning into bare repository '/root/.cache/composer/vcs/https—github.com-
zerosonesfun-elint.git’…
remote: Repository not found.
fatal: repository ‘https://github.com/zerosonesfun/elint.git/’ not found

JntmIkun

k08255-lxm elint 啊，这个好像已经被删了。

小小白哦

让我们重新启程：

Release-1.1.2

Fix bug of FoF OAuth;

修复 FoF OAuth bug;

Add FoF Masquerade support.

添加 FoF Masquerade 兼容.

Release-1.1.3

Display the background of the settings page only on the desktop to increase mobile compatibility.

仅在桌面上显示设置页面的背景，以提高移动兼容性。

Release-1.1.4

MIT license -> GPL-3.0 license

MIT 许可证 -> GPL-3.0 许可证

Release-1.1.5

Update loading indicator style;

更新加载指示器样式；

Update extend.php.

更新 extend.php。

JntmIkun

小小白哦 Release-1.1.5
Update loading indicator style;
更新加载指示器样式；
Update extend.php.
更新 extend.php。

14569他说改就改

小小白哦

JntmIkun en，话说 Flarum 中文社区发表回复后改不了

JntmIkun

小小白哦确实