2606_UIUX_16 수정 내역
https://contents.k-village.co.kr/front/mobile/css/layout.css
@@ -365,11 +365,12 @@ color: rgba(0, 0, 0, 1);} .popup-wrap .popup .popup__title--fit {padding-left: 0;} .popup-wrap .cont-wrap--fit {padding-top: 0;} .popup-wrap.full .cont-wrap--fit {padding-top: 0;} -.popup-wrap .popup .popup__content .popup__message {font-size:16px;line-height:25px;font-weight:400;} +.popup-wrap .popup .popup__content .popup__message {font-size:16px;line-height:25px;} .popup-wrap .popup .popup__content .popup__message--primary {font-size:18px;line-height:26px;} +.popup-wrap .popup .popup__content .popup__message--info {font-size:14px;line-height:normal;} .popup-wrap .popup .popup__content .popup__message ~ .popup__message {margin-top: 20px;} .popup-wrap .popup .popup__content .popup__message ~ .popup__message--desc {margin-top: 5px;} -.popup-wrap .popup .popup__content .popup__message .lined-text {position:relative;display:inline-block;font-size:inherit} +.popup-wrap .popup .popup__content .popup__message .lined-text {position:relative;display:inline-block;font-size:inherit;font-weight:inherit;} .popup-wrap .popup .popup__content .popup__message .lined-text::before {content:"";position: absolute;bottom:0;left:0;right:0;height: 1px;background-color: #000;} .quantity-control { font-size: 0; } @@ -784,7 +785,7 @@ touch-action: pan-y;} background-size:20px;} .quick-wrap.hide .quick-close{ transform: rotate(180deg);} -.top-btn{position: fixed; right: 21px; bottom: 90px; cursor: pointer; z-index: 16;text-align: right; display:flex; flex-direction:column-reverse; align-items:flex-end; transition:transform .3s;} +.top-btn{position: fixed; right: 21px; bottom: calc(90px + env(safe-area-inset-bottom, 0px)); cursor: pointer; z-index: 16;text-align: right; display:flex; flex-direction:column-reverse; align-items:flex-end; transition:transform .3s;} .top-btn.down{transform:translateY(60px)} .top-btn a{display:inline-block;width: 36px; height: 36px;margin:15px 0 0 0;} .top-btn [data-menuanchor="top"] {display:none; order:-1;} @@ -2023,7 +2024,6 @@ p.essen {font-size: 12px; margin: 8px 0} height: 1px; background: #000; } -.popup-wrap.change-address .popup header {border-bottom: 1px solid #ccc;} .popup-wrap.change-address .div-header h1 { font-size: 18px; font-weight: 500; @@ -2225,8 +2225,6 @@ p.essen {font-size: 12px; margin: 8px 0} } .popup-wrap.mypage-dis header {border-bottom: 1px solid #ccc;} -.popup-wrap.send-mail header {border-bottom: 1px solid #ccc;} -.popup-wrap.pw-change .popup__message--primary {margin-block: 10px 30px;} /* UIUX4차 68 기획전, 이벤트 타임세일 */ .event-bnr .bnr-txt.white strong
https://contents.k-village.co.kr/front/mobile/css/product.css
@@ -384,6 +384,7 @@ footer.direct button.full::before{transform:none} height: 100%; padding: 20px 20px 135px 20px; } +.basic-popup.size .cont-wrap--fit {padding-inline:0} .comment-pop.on .popup{max-height:100%;height:100%} .comment-pop .cont-wrap{overflow-y:auto;height:100%;padding:0 20px 126px 20px} .comment-pop .review-item{padding:0 20px 0 20px;border:none;margin:0 0 0 -20px} @@ -666,7 +667,7 @@ margin: 0 0 10px 0;position: relative;z-index: 2;text-indent:-9999px;} .inquire-item{padding:10px 0 15px 0} .inquire-item li{height:77px;padding:0 0 0 95px;position:relative;margin:5px 0 10px 0;font-size:13px;color:#888} .inquire-item .img-wrap{width:77px;height:77px;position:absolute;overflow:hidden;left:0;background:#f5f5f5;border:1px solid #ddd;text-align:center;line-height:69px} -.inquire-item .img-wrap img{width:100%} +.inquire-item .img-wrap img{width:100%;height: 100%;object-fit: contain;} .inquire-item .img-wrap.bin img{width:auto} .inquire-item p{} .inquire-item p strong{display:block;color:#555;font-size:11px;padding:3px 0 3px 0} @@ -679,6 +680,7 @@ margin: 0 0 10px 0;position: relative;z-index: 2;text-indent:-9999px;} .info-inquire{border:1px solid #ddd;padding:15px 15px;margin:10px 0} .info-inquire strong{color:#000} .inquire-attach{padding:0 0 30px 0} +.inquire-attach--fit {padding:0} .inquire-attach h4{font-size:15px;padding:15px 0 7px 0;font-weight:500} .inquire-attach .add-file {display:block;} .inquire-attach .add-file ul{display:inline-block;vertical-align: top;} @@ -687,7 +689,7 @@ margin: 0 0 10px 0;position: relative;z-index: 2;text-indent:-9999px;} .inquire-attach .add-file li{position:relative;margin:0 4px 6px 0;display:inline-block;} .inquire-attach .add-file li img{width:77px;height:77px;object-fit:cover} .inquire-attach .add-file li video{width:77px;height:77px;object-fit:cover} -.inquire-attach .add-file li .del{display:block;width:16px;height:16px;position:absolute;right:0;top:0;background:#000 url(https://contents.k-village.co.kr/front/pc/images/common/remove-white_new.svg) center center no-repeat;text-indent:-9999px;background-size:12px} +.inquire-attach .add-file li .del{display:block;width:16px;height:16px;position:absolute;right:0;top:0;background: url(https://contents.k-village.co.kr/front/pc/images/common/remove-white_new.svg) center center no-repeat;text-indent:-9999px;background-size:12px} .answer .inquire-attach{padding: 20px 0 0 20px;} .attach-btns{padding:0 0 10px 0} .attach-btns li{padding:0 0 10px 0}
html/MY-030_inquiry_goods.html
@@ -1059,11 +1059,11 @@ groobee("serviceKey", "149537f7f34642698831c8fc30f4501f"); <!-- 비주얼 이미지 확대--> <!-- 상품 문의하기 팝업--> - <div class="basic-popup popup-wrap inquire"> + <div class="basic-popup popup-wrap inquire on dim"> <div class="popup"> <div class="layer-container"> - <header class="flex"> - <h4 id="ask-title">상품 문의하기</h4> + <header class="popup__header flex"> + <h1 class="popup__title popup__title--fit" id="ask-title">상품 문의하기</h1> <div class="flex end margin"> <button class="close"> <div class="box"> @@ -1095,11 +1095,11 @@ groobee("serviceKey", "149537f7f34642698831c8fc30f4501f"); <span class="txt-byte ask"><em>0</em> / 1,000</span> </div> </div> - <p class="form-info">작성 시 주민등록번호, 휴대폰번호, 주소 등 상세 개인정보가 문의내용에 저장되지 않도록 주의해 주시기 바랍니다.</p> <div class="flex info-inquire type1"> <ul> + <li>작성 시 주민등록번호, 휴대폰번호, 주소 등 상세 개인정보가 문의내용에 저장되지 않도록 주의해 주시기 바랍니다.</li> <li>배송, 교환, 반품 등의 문의사항은 <strong>고객센터 > 1:1문의</strong>를 이용해 주세요.</li> - <li>답글작성시 알림톡/문자로 알려드립니다.</li> + <li>답글 작성시 알림톡/문자로 알려드립니다.</li> </ul> </div> <div class="inquire-attach"> @@ -1119,14 +1119,7 @@ groobee("serviceKey", "149537f7f34642698831c8fc30f4501f"); <footer class="direct fix-type1"> <div class="flex full"> <div class="flex"> - <button class="btn-type-gray bright large"> - <div class="box"> - <span>취소</span> - </div> - </button> - </div> - <div class="flex"> - <button class="btn-type-normal large" id="ask-save-btn"> + <button class="btn-type-normal full large" id="ask-save-btn"> <div class="box"> <span id="ask-btn-text">문의작성</span> </div> @@ -1181,14 +1174,7 @@ groobee("serviceKey", "149537f7f34642698831c8fc30f4501f"); <footer class="direct fix-type1"> <div class="flex full"> <div class="flex"> - <button class="btn-type-gray bright large ask-atmt-cancel-btn"> - <div class="box"> - <span>취소</span> - </div> - </button> - </div> - <div class="flex"> - <button class="btn-type-normal large ask-atmt-save-btn"> + <button class="btn-type-normal full large ask-atmt-save-btn"> <div class="box"> <span>첨부완료</span> </div>