XE3 는 화면 해상도에 따라서 3가지 모양으로 변합니다.
PC 같은 창이 넓은 해상도에서는 상단 메뉴 전체가 나오는 구조이고, 창 넓이를 줄이면 우측 상단에 메뉴가 포함되는 버턴 식으로 변경됩니다. 버턴식 메뉴에는 두가지 모양으로 변경됩니다.
폰같은 작은 화면에서 로그인창이 투명으로 될때 해결 가능한 방법 입니다.
해당 테마 css 파일을 수정합니다.
아래 코드를 파일 편집에서 맨 하단에 넣습니다.
설치폴더/plugins/devryan/Components/Themes/Devryan/assets/css/theme.css
.xe-theme__gnb.gnb--mobile.open .gnb-inner {
background-color: #ffffff !important;
}
위치 설정이 포함된 다른 코드
/* 해상도 관계없이 모바일 오픈 상태의 메뉴 박스를 강제 우측 정렬 */
.xe-theme__gnb.gnb--mobile.open .gnb-inner {
background-color: #ffffff !important;
width: 300px !important; /* 원하는 가로 폭 */
/* 1. 화면 기준 강제 우측 고정 (부모 구조 무시) */
position: fixed !important;
top: 0 !important;
right: 0 !important;
left: auto !important;
height: 100% !important;
/* 2. 작은 해상도에서 작동하는 미디어 쿼리용 밀어내기 치트키 */
margin-left: auto !important;
margin-right: 0 !important;
float: right !important;
/* 3. 작은 해상도에서 잡혀있을 수 있는 좌표 이동 및 정렬 강제 초기화 */
transform: none !important;
-webkit-transform: none !important;
display: block !important;
}