🎀 Neomorphism，Discourse 的现代主题

amanintech · 2021 年4 月 30 日 07:20

Neomorphism 主题为 Discourse 带来了全新的外观。它采用了拟态设计系统，为界面增添了类似纸张的逼真感。
功能：

全宽视图
可自定义配色方案
自定义欢迎横幅
宽搜索栏

截图：

可自定义的欢迎横幅：

首页：

首页布局 2：

主题页面：

全屏搜索：

这是我们的第一个主题，希望您会喜欢。我们期待您的反馈。


	预览	Theme Creator

	仓库	GitHub - twimbit/neomorphism-discourse: Discourse theme with neomorphism design · GitHub
	安装指南	如何安装主题或主题组件
	Discourse 主题新手？	Discourse 主题使用入门指南

贡献者
Shalini Bose (@shalinibose)
Siddhant Kumar (@siddhantdante)
Aman Sharma (@amanintech)

Zup · 2021 年5 月 2 日 01:40

做得真棒。

可自定义配色方案是一个便捷的功能。是否也可以支持自定义字体呢？

我该如何实现仅在滚动时显示搜索栏？

能否让标题仅在首页显示，而在其他页面隐藏？

amanintech · 2021 年5 月 2 日 08:58

忘了提一下，它还支持自定义字体。这就加上，谢谢 @Zup。

bubblecatcher · 2021 年5 月 4 日 09:21

你好，主题不错，但在使用横幅折叠时出现以下问题。

amanintech · 2021 年5 月 7 日 07:39

我们从未见过此问题，@bubblecatcher。能否深入排查一下，看看是哪个插件或设置导致了这个问题？

hollosch · 2022 年7 月 11 日 09:01

@amanintech 干得漂亮！\n如何更改/配置左侧边栏？\n\n谢谢

amanintech · 2022 年7 月 11 日 12:26

嘿 @hollosch，感谢您的赞赏。

目前我们还没有为侧边栏添加动态控件。
您需要为此付出一些额外的努力。

Fork 仓库 GitHub - twimbit/neomorphism-discourse: Discourse theme with neomorphism design
将此文件替换为您想要的项目 - neomorphism-discourse/desktop/after_header.html at main · twimbit/neomorphism-discourse · GitHub
将主题安装到 discourse

如果有所帮助，请告诉我。

hollosch · 2022 年8 月 3 日 09:11

嘿 @amanintech，它奏效了。非常感谢！
我该如何添加更多导航项？只需复制粘贴现有代码即可？

此致，
hollosch

amanintech · 2022 年8 月 3 日 11:22

很高兴能帮到你。

是的，目前直接编码是可行的方法，如果你能将其模块化并直接从设置中进行编辑，我将很乐意合并你的贡献。

Florian_Müller · 2022 年8 月 6 日 05:33

嘿，
有人能告诉我这里出了什么问题吗？为什么类别名称不再显示，图标也没有了？

amanintech · 2022 年8 月 7 日 17:50

以前从未见过此问题，是仅此主题还是其他主题也存在此问题？另外，请告知您正在使用的 Discourse 版本，我们上次在 2.9.0 beta 3 版本上进行了测试，当时运行正常。

Florian_Müller · 2022 年8 月 8 日 20:47

你好，
2.9.0.beta8
是版本

Rabbit · 2023 年1 月 22 日 02:32

navbar navpills 中版本 3 的中断

barto_95 · 2023 年7 月 16 日 16:34

您好，

感谢您的主题@amanintech，它很漂亮……

我遇到了同样的问题@amanintech（最新版本的 discourse）

isaac · 2023 年9 月 8 日 18:27

嘿 @amanintech，

搜索菜单及其逻辑已从（已弃用的）小部件转换为 Glimmer 组件 (https://github.com/discourse/discourse/pull/20482)。这些更改目前隐藏在一个基于组的功能标志后面，但我们打算在不久的将来将 Glimmer 搜索菜单设为新的默认设置。这些更改将破坏您主题中的任何 search 覆盖，因此我想在我们进行切换之前向您提出这个问题。

这是供您参考的拉取请求。

github.com/discourse/discourse

DEV: Upgrade search-menu to glimmer

main ← experimental-search-menu

opened 04:07PM - 28 Feb 23 UTC

janzenisaac

+3014 -51

# Top level view This PR is the first version of converting the search menu and… its logic from (deprecated) widgets to glimmer components. The changes are hidden behind a group based feature flag. This will give us the ability to test the new implementation in a production setting before fully committing to the new search menu. # What has changed The majority of the logic from the widget implementation has been updated to fit within the context of a glimmer component, but it has not fundamentally changed. Instead of having a single widget - [search-menu.js](https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/widgets/search-menu.js) - that built the bulk of the search menu logic, we split the logic into (20+) bite size components. This greatly increases the readability and makes extending a component in the search menu much more straightforward. That being said, certain pieces needed to be rewritten from scratch as they did not translate from widget -> glimmer, or there was a general code upgraded needed. There are a few of these changes worth noting: ### Search Service **Search Term** -> In the widget implementation we had a overly complex way of managing the current search term. We tracked the search term across multiple different states (`term`, `opts.term`, `searchData.term`) causing headaches. This PR introduces a single source of truth: ```js this.search.activeGlobalSearchTerm ``` This tracked value is available anywhere the `search` service is injected. In the case the search term should be needs to be updated you can call ```js this.search.activeGlobalSearchTerm = "foo" ``` **event listeners** -> In the widget implementation we defined event listeners **only** on the search input to handle things such as - keyboard navigation / shortcuts - closing the search menu - performing a search with "enter" Having this in one place caused a lot of bloat in our logic as we had to handle multiple different cases in one location. Do _x_ if it is this element, but do _y_ if it is another. This PR updates the event listeners to be attached to individual components, allowing for a more fine tuned set of actions per element. To not duplicate logic across multiple components, we have condensed shared logic to actions on the search service to be reused. For example - `this.search.handleArrowUpOrDown` - to handle keyboard navigation. ### Search Context We have unique logic based on the current search context (topic / tag / category / user / etc). This context is set within a models route file. We have updated the search service with a tracked value `searchContext` that can be utilized and updated from any component where the search service is injected. ```js # before this.searchService.set("searchContext", user.searchContext); # after this.searchService.searchContext = user.searchContext; ``` # Views <img width="434" alt="Screenshot 2023-06-15 at 11 01 01 AM" src="https://github.com/discourse/discourse/assets/50783505/ef57e8e6-4e7b-4ba0-a770-8f2ed6310569"> <img width="418" alt="Screenshot 2023-06-15 at 11 04 11 AM" src="https://github.com/discourse/discourse/assets/50783505/2c1e0b38-d12c-4339-a1d5-04f0c1932b08"> <img width="413" alt="Screenshot 2023-06-15 at 11 04 34 AM" src="https://github.com/discourse/discourse/assets/50783505/b871d164-88cb-405e-9b78-d326a6f63686"> <img width="419" alt="Screenshot 2023-06-15 at 11 07 51 AM" src="https://github.com/discourse/discourse/assets/50783505/c7309a19-f541-47f4-94ef-10fa65658d8c"> <img width="424" alt="Screenshot 2023-06-15 at 11 04 48 AM" src="https://github.com/discourse/discourse/assets/50783505/f3dba06e-b029-431c-b3d0-36727b9e6dce"> <img width="415" alt="Screenshot 2023-06-15 at 11 08 57 AM" src="https://github.com/discourse/discourse/assets/50783505/ad4e7250-040c-4d06-bf06-99652f4c7b7c">

谢谢，

isaac · 2024 年2 月 6 日 18:02

我已将主题标记为#broken。正如我在上方所解释的，该主题依赖于已弃用且现已从核心完全移除的小部件搜索菜单。需要对其进行重构，以适应基于组件的搜索菜单。

话题		回复	浏览量
Bringing popular features to Discourse: Header search, welcome banner, and category icons / emoji Announcements	18	1602	2025 年5 月 7 日
A reddit-ish theme for Discourse Theme	111	14623	2025 年11 月 21 日
Battle Axe - A free theme by the Tappara.co hockey community Theme	56	15484	2025 年12 月 21 日
Air Theme Theme air-theme	386	62409	2026 年2 月 14 日
How difficult would it be to make the Discourse UI more like Flarum? UX	37	12520	2024 年5 月 14 日

🎀 Neomorphism，Discourse 的现代主题

相关话题