diff --git a/frontend/src/assets/css/checktoggle.css b/frontend/src/assets/css/checktoggle.css index 814a102..508b2c3 100644 --- a/frontend/src/assets/css/checktoggle.css +++ b/frontend/src/assets/css/checktoggle.css @@ -1,5 +1,5 @@ .contents .table table input[type="checkbox"] + label.toggle_switch { width: 68px; height: 28px; border-radius: 14px; border: 1px solid #b7b9be; background: #cecece; transition: all 0.3s; } -.contents .table table input[type="checkbox"] + label.toggle_switch:before { content:"정지";position: absolute; display: block; width: 100%; height:100%; font-size: 14px; color:#fff; line-height: 28px; padding: 0 0 0 15px; font-family: 'SpoqaHanSansNeo', sans-serif; box-sizing: border-box; transition: all 0.3s; } +.contents .table table input[type="checkbox"] + label.toggle_switch:before { content:"미사용";position: absolute; display: block; width: 100%; height:100%; font-size: 14px; color:#fff; line-height: 28px; padding: 0 0 0 15px; font-family: 'SpoqaHanSansNeo', sans-serif; box-sizing: border-box; transition: all 0.3s; } .contents .table table input[type="checkbox"] + label.toggle_switch:after { content:""; position: absolute; display: block; width:14px; height: 14px; top:50%; left: 7px; transform: translateY(-50%); background: #fff; border-radius: 100%; transition: all 0.5s; } .contents .table table input[type="checkbox"]:checked + label.toggle_switch { border-color:#eb008b; background:#fff; } .contents .table table input[type="checkbox"]:checked + label.toggle_switch:before { content:"사용"; color:#eb008b; padding: 0 15px 0 0; } diff --git a/frontend/src/assets/css/layout.css b/frontend/src/assets/css/layout.css index 11b7a92..9072b4a 100644 --- a/frontend/src/assets/css/layout.css +++ b/frontend/src/assets/css/layout.css @@ -118,7 +118,7 @@ body{ .popup-wrap {display: none;} .popup-wrap.open {display: block !important;} .popup {width: 390px; z-index: 998; border-radius: 12px; background: #fff; padding: 0 30px; box-sizing: border-box; border: 1px solid rgba(197,197,197,0.36); box-shadow: 2px 2px 8px rgba(171,171,171,0.30); position: fixed; top: 50%; left: 50%; transform: translate(calc(-50% + 0.5px), calc(-50% + 0.5px)); -webkit-transform: translate(calc(-50% + 0.5px), calc(-50% + 0.5px)); -moz-transform: translate(calc(-50% + 0.5px), calc(-50% + 0.5px)); -o-transform: translate(calc(-50% + 0.5px), calc(-50% + 0.5px)); display: none; -max-height: 90vh; overflow: auto;}/*스크린 height 100%를 벗어나는 긴 팝업의 경우 추가 class*/ +max-height: 90vh; overflow-y: auto; overflow-x: hidden;}/*스크린 height 100%를 벗어나는 긴 팝업의 경우 추가 class*/ .popup.open {display: block !important;} .popup .pop-head {padding: 30px 0 25px; @@ -129,10 +129,11 @@ max-height: 90vh; overflow: auto;}/*스크린 height 100%를 벗어나는 긴 .popup .pop-cont {} .popup .pop-cont p {font-size: 16px; color: #666666; font-weight: 400; letter-spacing: -0.8px; line-height: 100%;} .popup .pop-cont p + p {margin-top: 10px;} -.popup .popup-btn1 {display: flex; justify-content: center; align-items: center; margin: 35px 0 25px;} -.popup .popup-btn2 {display: flex; justify-content: space-between; align-items: center; margin: 35px 0 25px;} -.popup .popup-btn1 button {width: 49%; height: 40px; font-size: 16px; font-weight: 400; letter-spacing: -1.1px;} -.popup .popup-btn2 button {width: 49%; height: 40px; font-size: 16px; font-weight: 400; letter-spacing: -1.1px;} +.popup .popup-btn1 {display: flex; justify-content: flex-start; align-items: center; margin: 35px 0 25px;} +.popup .popup-btn2 {display: flex; justify-content: flex-end; align-items: center; margin: 35px 0 25px;} +.popup .popup-btn1 button {width: 140px; height: 40px; font-size: 16px; font-weight: 400; letter-spacing: -1.1px;} +.popup .popup-btn2 button {width: 140px; height: 40px; font-size: 16px; font-weight: 400; letter-spacing: -1.1px;} + diff --git a/frontend/src/assets/css/style.css b/frontend/src/assets/css/style.css index 785fc72..0aef45c 100644 --- a/frontend/src/assets/css/style.css +++ b/frontend/src/assets/css/style.css @@ -1238,18 +1238,18 @@ header .user_wrap .user_info .logout { margin-bottom: -1px; } -.popup.popup_form .popup-btn2 { - -webkit-box-pack: end; - -ms-flex-pack: end; - justify-content: flex-end; +.popup.popup_form .popup-btn1, .popup.popup_form .popup-btn2 { + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; } -.popup.popup_form .popup-btn2 button { - width: 30%; +.popup .popup-btn2 button:last-child{ + margin-left: 8px; } -.popup.popup_form .popup-btn2 button:last-child { - margin-left: 10px; +.popup .pop-btn2 button:last-child{ + margin-left: 8px; } .popup.popup_form table { diff --git a/frontend/src/modules/attractMgt/views/ChannelList.vue b/frontend/src/modules/attractMgt/views/ChannelList.vue index 02bf6bf..8424b0f 100644 --- a/frontend/src/modules/attractMgt/views/ChannelList.vue +++ b/frontend/src/modules/attractMgt/views/ChannelList.vue @@ -32,7 +32,7 @@ -