F NAV - 모바일 내비게이션 탭

커스터마이징 테마 컴포넌트
22

Don, 감사합니다. 제가 찾던 답변이네요. :+1:

다만, 이 설정을 어떻게 활성화하는지 자세히 확인해 봐야 합니다.

2개의 좋아요
23

휴대전화의 접근성 설정에서 ‘모션 감소’ 옵션을 찾을 수 있습니다. 현재 켜져 있을 가능성이 높으므로, 이 옵션을 끄면 메뉴 바깥을 탭했을 때 메뉴가 닫히도록 작동할 것입니다. 하지만 이 설정에는 좋은 이유가 있을 수 있고, 스와이프 제스처로 메뉴를 닫는 것이 더 편할 수도 있습니다. :slightly_smiling_face:

3개의 좋아요
24

정말 좋아요, Don

하지만 햄버거 메뉴를 숨기려는 경우, 여기와 아래처럼 fkb pro 테마에 문제가 있는 것 같습니다:

The image appears to be part of a user interface with a menu showing buttons and a profile picture, featuring a dark theme with icons and a watermark text. (Legendado por IA)
The image appears to be part of a user interface with a menu showing buttons and a profile picture, featuring a dark theme with icons and a watermark text. (Legendado por IA)651×322 32.3 KB

여전히 햄버거 아이콘 공간이 남아 있습니다.

2개의 좋아요
25

안녕하세요 :wave:
리포트 감사합니다. FKB Pro - Social 테마에 이 문제에 대한 수정 사항을 병합했습니다 :slightly_smiling_face:

3개의 좋아요
26

버그 보고서: 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 내비게이션을 숨기고 기본 채팅 헤더를 사용합니다.

Meta에서처럼 다음과 같습니다:

The screenshot shows a messaging app interface with a chat channel named "lounge" and a profile picture with a cap icon at the top right. (Captioned by AI)
The screenshot shows a messaging app interface with a chat channel named "lounge" and a profile picture with a cap icon at the top right. (Captioned by AI)750×838 51.3 KB

28

네, 알겠습니다. 그러면 CSS로 수동으로 숨기는 것 외에는 방법이 없나요?

29

CSS를 사용하여 완전히 숨길 수 있습니다.

모바일/CSS

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

참고: 채널에 있을 때 채팅 알림을 볼 수 있는 유일한 장소입니다.

1개의 좋아요
30

채팅 아이콘은 제거하되, 새 메시지 버블 표시기는 유지할 수 있을까요?

수정: a svg를 추가하여 직접 해결했습니다.

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

안녕하세요 @don, 아이콘 아래에 홈페이지, 메뉴 등의 텍스트를 추가할 수 있을까요?

32

메시지 관련 문제가 있습니다. 메시지가 로드되지 않아요.

The image shows a social media post by a user named Justine with a photo of hands holding each other, along with text in German, and a circle highlighting an envelope icon. (Beschriftet durch KI)
The image shows a social media post by a user named Justine with a photo of hands holding each other, along with text in German, and a circle highlighting an envelope icon. (Beschriftet durch KI)1179×1180 133 KB

This image shows a mobile app notification panel with information about an upcoming ADHS SHG appointment scheduled for Monday, 08.05.25, with a time reminder set for 19:30. (Beschriftet durch KI)
This image shows a mobile app notification panel with information about an upcoming ADHS SHG appointment scheduled for Monday, 08.05.25, with a time reminder set for 19:30. (Beschriftet durch KI)1179×2556 66.5 KB

1개의 좋아요
33

설치 관련 세부 사항을 공유해 주시겠어요? 현재 Tests-passed 상태이며, 메시지 기능이 정상적으로 작동하고 있습니다

The image shows a notification screen displaying multiple "New advice on your site dashboard" messages from the game "Xenoblade Chronicles Definitive Edition". (Captioned by AI)
The image shows a notification screen displaying multiple "New advice on your site dashboard" messages from the game "Xenoblade Chronicles Definitive Edition". (Captioned by AI)864×1920 171 KB

34

아이폰의 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가 고정(sticky) 상태로 유지되고, 동시에 F NAV가 기본적으로 헤더를 숨기도록 설정되어 있습니다. 그래서 스크린샷에 공유하신 것처럼 이 간격이 발생하는 것입니다.

아래의 작은 CSS 스니펫이 Horizon 테마에서 작동할 것입니다.

스크롤 시 헤더 높이에 고정되는 대신, 페이지 상단에 고정되도록 합니다.

모바일 / CSS

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

향후 헤더 표시 방식을 제어할 수 있는 설정을 추가하는 것이 좋은 아이디어일 수 있습니다.

4개의 좋아요
39

최신 Discourse에서 작동하지 않습니다.

40

더 자세히 설명해 주시겠어요?

41

아, 알겠습니다. 보고해 주셔서 감사합니다. scrollTop 믹신이 코어에서 제거되면서 문제가 발생한 것 같습니다. 하지만 실제로는 사용하지 않고 있어서 아마 실수로 남아 있던 것 같습니다. 여기에서 수정했습니다: FIX: ScrollTop mixin removed from core · VaperinaDEV/f-nav-for-mobile@6ec554c · GitHub

컴포넌트를 업데이트해 주세요.

3개의 좋아요