작은 화면에서 사용자 정의 CSS의 「저장」 버튼 문제

13인치 화면에서 풀/확장 모드(창의 가장 아래 부분)로 봤을 때 보이는 모습입니다:

"고급 표시"를 선택하면, 이마저도 보이지 않습니다:
image

3개의 좋아요

2560x1440 16:9 화면에서 재현할 수 있으며, 버튼이 창 밖으로 나가는 상태입니다:

1개의 좋아요

그리고 고급 보기(Show Advanced)조차 선택되어 있지 않네요… 이상하네요.
적어도 화면 크기 문제인 것은 아니라는 걸 알 수 있죠.
그리고 컴팩트 모드도 있으니 괜찮은 것 같습니다. 일할 수는 있잖아요. 그게 더 나았을 테니까 :wink:

1개의 좋아요

이 문제는 오랫동안 존재해 왔습니다. 이미 보고된 것이라고 확신했지만, 찾을 수 없었습니다. 다른 것과 혼동한 것 같습니다. 음.

1개의 좋아요

컴팩트 버전으로 작업할 수 있으니 그렇게 나쁘지는 않다.

1개의 좋아요

앞으로 몇 주 안에 누군가 검토할 수 있도록 우선순위를 정해 두었습니다. 하지만 PR로 CSS 수정을 시도해 보고 싶다면 자유롭게 진행해 주세요.

여기 PR이 있습니다:

4개의 좋아요

감사합니다! 병합했습니다

3개의 좋아요

사실이 분명해서 죄송합니다… 이걸 어떻게 업데이트하나요? 이미 사용 가능한 건가요? 그렇다면 /admin/update 페이지에서 일반 업데이트로 진행하면 되는 건가요?

1개의 좋아요

네, PR이 병합되면 일반 업데이트를 통해 사용할 수 있습니다.

2개의 좋아요

또 다른 문제를 겪었습니다.
커스텀 CSS 컴포넌트를 사용 중인데, 코드에 실수를 저질러 저장했을 때 오류 박스가 표시되었습니다:

이 오류 박스가 모든 요소를 아래로 밀어내어 수정된 버전(새로운 변경 사항)을 저장할 수 없었습니다. 줌을 내리면 버튼이 보일 줄 알았는데, 코드 박스의 높이가 계속 조정되어서 불가능했습니다.

결국 새로운 변경 사항을 저장할 수 있었던 유일한 방법은 브라우저의 검사(Inspect) 기능을 사용해 경고 박스의 스타일을 display:none;으로 설정한 후 다시 저장 버튼을 볼 수 있게 한 것이었습니다.

여기 계신 김에 2가지 제안을 드리고 싶습니다.
1 - 컴팩트 뷰일 때 하단의 이 여백을 활용할 수는 없을까요? 작은 박스가 정말… 작거든요.

2 - 저는 항상 확장된 뷰에서 코드를 편집하는 것을 선호합니다. 열릴 때마다 매번 확장해야 하는 번거로움을 피하기 위해 기본값을 확장된 뷰로 설정할 수 있으면 좋겠습니다.

1개의 좋아요

아래로 스크롤할 수 없어요? 제 로컬 환경에서는 스크롤할 수 있습니다. :thinking:

아니요. 코드 박스가 화면 하단에 닿아 있고, 브라우저의 줌을 줄여도 박스의 높이가 계속 조정됩니다.
제 화면은 13인치인데, 그게 문제라고 생각하지는 않아요… 아마도 박스와 버튼이 이미 컨테이너 안에 있지 않다면, 컨테이너 안에 있어야 할 것 같습니다. 그러면 오류 메시지가 아래로 밀어내더라도 화면 하단에 닿는 것은 박스가 아니라 버튼이 될 테니까요.

1개의 좋아요

말씀하신 뜻을 이해했습니다!
전체 화면 모드이므로 기본적으로 페이지를 스크롤할 수 없습니다.

컨테이너에 overflow: auto;를 추가하면 이 문제를 해결할 수 있으며, 에디터 위 영역을 사용하여 아래로 스크롤할 수 있습니다.

그러나 저장 버튼은 항상 표시되는 것이 더 좋다고 생각합니다. 관리자로서 더 나은 경험이 될 것입니다. 더 나은 방법을 찾아보겠습니다.

1개의 좋아요

해결책을 찾으시길 바랍니다.

1개의 좋아요

사용 가능한 화면 공간에 더 잘 적응할 수 있도록 일부 업데이트를 병합했습니다. 배너나 오류가 있든 없든 마찬가지입니다.

4개의 좋아요