F NAV - 移动导航标签

主题组件
22

谢谢你，Don。这就是我想要的答案。 :+1:

不过，我需要详细了解如何启用此设置。

2 个赞
23

您可以在手机的辅助功能设置中找到“减弱动态效果”。它现在可能已打开，因此如果您将其关闭，外部菜单点击将起作用。但也许启用它是出于好理由，并且通过滑动关闭菜单更容易。:slightly_smiling_face:

3 个赞
24

我喜欢它，Don

但如果想隐藏汉堡菜单，fkb pro 主题似乎存在问题，就像这里和这里一样：

图片似乎是用户界面的一部分，其中包含一个显示按钮和个人资料图片的菜单，采用深色主题，带有图标和水印文字。（由 AI 配字幕）
图片似乎是用户界面的一部分，其中包含一个显示按钮和个人资料图片的菜单，采用深色主题，带有图标和水印文字。（由 AI 配字幕）651×322 32.3 KB

仍然有汉堡图标空间

2 个赞
25

你好 :wave:
感谢你的报告，我已经将修复合并到 FKB Pro - Social theme 中了 :slightly_smiling_face:

3 个赞
26

Bug 报告：在 3.4.0beta 版本中，切换到聊天后聊天图标未隐藏：

CleanShot 2025-02-18 at 14.56.01@2x
CleanShot 2025-02-18 at 14.56.01@2x836×1390 32.5 KB

27

你好 :waving_hand:

这是设计使然。我们在 /chat 页面上隐藏 f nav，并使用默认的聊天标题。

就像我们在 Meta 上一样：

截图显示了一个消息应用程序界面，顶部右侧有一个名为“lounge”的聊天频道和一个带有帽子图标的个人资料图片。（由 AI 标注）
截图显示了一个消息应用程序界面，顶部右侧有一个名为“lounge”的聊天频道和一个带有帽子图标的个人资料图片。（由 AI 标注）750×838 51.3 KB

28

好的，明白了。那么唯一的方法就是通过 CSS 手动隐藏它？

29

您可以使用 CSS 完全隐藏它。

移动端/CSS

.d-header-icons {
  .header-dropdown-toggle {
    &.chat-header-icon {
      display: none;
    }
  }
}

注意：当您在频道中时，这是您唯一可以看到聊天通知的地方。

1 个赞
30

是否可以移除聊天图标，但保留新消息的气泡指示器？

编辑：已自行解决，添加了 一个 svg

.d-header-icons {
  .header-dropdown-toggle {
    &.chat-header-icon a svg {
      display: none;
    }
  }
}
31

您好 @don，我可以在图标下方添加主页、菜单等文本吗？

32

消息有问题 - 它们没有加载。

图片显示了用户 Justine 的一条社交媒体帖子，其中包含一张手拉手的照片，以及德语文字，并用一个圆圈突出显示了一个信封图标。(由人工智能标注)
图片显示了用户 Justine 的一条社交媒体帖子，其中包含一张手拉手的照片，以及德语文字，并用一个圆圈突出显示了一个信封图标。(由人工智能标注)1179×1180 133 KB

此图片显示了一个移动应用程序通知面板，其中包含有关即将举行的 ADHS SHG 会议的信息，该会议安排在 2025 年 5 月 8 日星期一举行，并设置了晚上 7:30 的时间提醒。(由人工智能标注)
此图片显示了一个移动应用程序通知面板，其中包含有关即将举行的 ADHS SHG 会议的信息，该会议安排在 2025 年 5 月 8 日星期一举行，并设置了晚上 7:30 的时间提醒。(由人工智能标注)1179×2556 66.5 KB

1 个赞
33

您能分享一些设置细节吗？我的“Tests-passed”和“messages”功能工作正常。

图片显示了一个通知屏幕，其中显示了游戏“异度神剑 决定版”的多个“您的网站仪表板上的新建议”消息。(由AI配图)
图片显示了一个通知屏幕，其中显示了游戏“异度神剑 决定版”的多个“您的网站仪表板上的新建议”消息。(由AI配图)864×1920 171 KB

34

在 iPhone 的 Safari 中它不起作用，在 Chrome 浏览器中可以。

1 个赞
35

好的，感谢您提供的额外详细信息。我使用的是 Android。

1 个赞
36

The image shows a screenshot of a social media profile with a status line and categories list, timestamped at 21:30 and indicating the last post was made 11 hours ago. (AI 生成的标题)
The image shows a screenshot of a social media profile with a status line and categories list, timestamped at 21:30 and indicating the last post was made 11 hours ago. (AI 生成的标题)1080×524 53.9 KB

This image is a screenshot of a Discord server's community chat interface, showing various community posts under different categories such as "Support," "Site Management," and "Developers" with their respective comments and likes. (AI 生成的标题)
This image is a screenshot of a Discord server's community chat interface, showing various community posts under different categories such as "Support," "Site Management," and "Developers" with their respective comments and likes. (AI 生成的标题)1080×2400 126 KB

使用 Horizon 主题时，主题列表中的一个组件会导致滚动时顶部区域（徽标/元素区域）变为空白。

37

很遗憾，我无法重现此问题。

看来它与标题更改不太兼容。我将检查 Horizon 中发生的情况。

3 个赞
38

好的，我想我明白了这里发生了什么。在 Horizon 主题中，list-controls 在您向下滚动时会固定在顶部，而 F NAV 默认会隐藏标题。这会导致您在屏幕截图中看到的这个间隙。

这段小 CSS 代码应该可以与 Horizon 主题配合使用。

它会在您向下滚动时将其固定在页面顶部，而不是根据标题的高度。

移动端 / CSS

body.f-nav-hidden {
  .list-controls {
    top: 0;
  }
}

未来，也许可以添加一个设置来处理标题的外观。

4 个赞
39

在最新的 Discourse 上不起作用。

40

你能澄清一下吗？

41

好的，明白了。感谢你的报告。scrollTop mixin 已从核心中移除，这导致了问题。但我们实际上并未将其用作，所以它可能只是被意外地留在了那里。已在此修复：FIX: ScrollTop mixin removed from core · VaperinaDEV/f-nav-for-mobile@6ec554c · GitHub

请更新组件。

3 个赞