채팅을 활성화하면 모바일에서 main-outlet의 패딩이 다음과 같이 변경됩니다:
관련된 채팅 CSS는 여기 있습니다:
아직 개발 중이라 변경될 수 있다는 점은 이해합니다. 채팅 페이지에서 패딩을 0으로 설정하는 것은 합리적인 조치로 보이지만, 결과적으로 모든 페이지에 적용되고 있습니다.
두 번째로 발견한 문제는 모바일에서 키보드가 입력 중인 부분을 가린다는 점입니다 (Android/Chrome):
이것은 단순히 놓친 부분이 아니라 버그에 더 가까운 문제처럼 느껴집니다. 제 환경에서만 발생하는 버그라면, 다른 테마 컴포넌트나 원인이 무엇인지 더 깊이 조사해 볼 수 있습니다.
안드로이드 버전 / 크롬 버전을 알려주시겠어요?
이것이 채팅에서 오는 문제인 것을 확신합니까? AFAIK로 chat-mobile.scss 파일이 없는데.
일단 제가 채팅을 제대로 설치했는지 명확히 하고 싶습니다.
어젯밤에 인스턴스를 다시 빌드했는데, app.yml 파일에 채팅을 포함하지 않았습니다. 제 이해로는 이제 채팅이 Discourse 코어에 포함된 플러그인인 것 같습니다.
이 chat-mobile.scss가 어디서 오는지 찾아보겠습니다.
네, 이제 이것은 코어 플러그인입니다.
여기서 뭔가 놓치고 있는 것일 수도 있습니다… 하지만 바로 떠오르는 것으론, 현재 플러그인에서 이것이 어디에 있는지 모르겠습니다. 패딩(padding)이 있는 부분은 있지만, 이는 .has-full-page-chat에 스코프가 지정되어 있어야 하므로 다른 페이지에는 영향을 주지 않아야 합니다.
찾았어요. 제가 사용하는 Discourse Air 테마에서 온 것 같습니다.
저는 이 테마에 제 CSS를 덮어쓰는 방식으로 사용하고 있어서, 이 경우 제 문제인 것 같습니다.
키보드 문제를 살펴보겠습니다. 이 동작은 의도된 것이 아니라고 가정해도 될까요?
네, 의도된 것이 아닙니다 
그렇다면 실제로 어떻게 작동할까요? 채팅을 표시할 높이가 50px만 남게 됩니다.
주된 문제는 채팅 텍스트 박스를 터치하면 화면이 페이지 맨 위로 점프하고 below-site-header에 있는 내용이 표시된다는 점이라고 생각합니다.
대신 채팅 div의 하단이 키보드 바로 위에 오도록 페이지가 이동하는 것이 더 합리적일 것 같습니다. 또는 텍스트박스 div를 페이지 하단(키보드 상단)에 고정(sticky)시켜 항상 표시되고 모든 것을 덮도록 하는 것도 방법입니다.
이상적인 해결책이 무엇이든, 화면에 표시되는 요소 중 텍스트박스가 최우선이어야 합니다. 가용 공간이 50px에 불과하더라도 말입니다.
