tolag3/kcc_adr_advc_git
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

220921

Browse Source 
레드마인 #2725
나의사건관리 > 조정진행상황 상세 step 말풍선 호버효과
나의사건관리 > 조정진행상황 목록 신청내용 말풍선 호버효과
This commit is contained in:
HappyITN 2022-09-21 15:59:48 +09:00
parent 8d96950b1f
commit d883eed521
6 changed files with 42 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/main/webapp/WEB-INF/jsp/web/kccadr/accdnt/ai/adjstIncidentList.jsp
View File

@ -227,8 +227,13 @@
<a href="#none" onclick="fncCloseDetail('${list.adrSeq}', '${list.adrSn}');"><c:out value="${list.resPonDentNm}"/></a>
</td>
<td class="td_tit">
<div class="hover_content_wrap">
<span class="read_only m_th_text">신청내용</span>
<a href="#none" onclick="fncCloseDetail('${list.adrSeq}', '${list.adrSn}');"><kc:code codeId="CC002" code="${list.ccTy}"/></a>
<div class="hover_content_box">
신청취지 : 피신청인은 신청인에게 저작권 침해에 따른 손해배상 및 위자료로서 금삼백만원(￦3,000,000)을 지급한다.
</div>
</div>
</td>
</c:when>
<c:when test="${list.statCd eq '101050' or (list.statCd >= '201010' and list.statCd <= '309050')}">
@ -241,8 +246,13 @@
<a href="#none" onclick="fncGoingDetail('${list.adrSeq}', '${list.adrSn}');"><c:out value="${list.resPonDentNm}"/></a>
</td>
<td class="td_tit">
<div class="hover_content_wrap">
<span class="read_only m_th_text">신청내용</span>
<a href="#none" onclick="fncGoingDetail('${list.adrSeq}', '${list.adrSn}');"><kc:code codeId="CC002" code="${list.ccTy}"/></a>
<div class="hover_content_box">
신청취지 : 피신청인은 신청인에게 저작권 침해에 따른 손해배상 및 위자료로서 금삼백만원(￦3,000,000)을 지급한다.
</div>
</div>
</td>
</c:when>
@ -256,8 +266,13 @@
<a href="#none" onclick="fncGoDetail('${list.adrSeq}');"><c:out value="${list.resPonDentNm}"/></a>
</td>
<td class="td_tit">
<div class="hover_content_wrap">
<span class="read_only m_th_text">신청내용</span>
<a href="#none" onclick="fncGoDetail('${list.adrSeq}');"><kc:code codeId="CC002" code="${list.ccTy}"/></a>
<div class="hover_content_box">
신청취지 : 피신청인은 신청인에게 저작권 침해에 따른 손해배상 및 위자료로서 금삼백만원(￦3,000,000)을 지급한다.
</div>
</div>
</td>
</c:otherwise>
</c:choose>

10
src/main/webapp/WEB-INF/jsp/web/kccadr/accdnt/ars/tab/adjstReqStatusTabDetail.jsp
View File

@ -179,13 +179,16 @@ resInfo--%>
</p>
<i class="next">다음</i>
</div>
<div class="step step03 <c:out value="${statusActive eq '3' ? 'active' : ''}" />">
<div class="step step03 <c:out value="${statusActive eq '3' ? 'active' : ''}" /> hover_content_wrap">
<i></i>
<p>
STEP. 03
<span>기일개최</span>
</p>
<i class="next">다음</i>
<div class="hover_content_box">
조정 진행과정 중 하나의 절차로써, 사건 당사자들의 합의를 위해 한국저작권위원회가 중재하는 자리로 조정위원, 사건당사자, 그 밖의 사건관계인이 출석 하는 날을 말합니다.
</div>
</div>
<div class="step step04 <c:out value="${statusActive eq '4' ? 'active' : ''}" />">
<i></i>
@ -209,7 +212,7 @@ resInfo--%>
<div class="work_flow_wrap off">
<div class="work_tit">
<p>조정진행 워크플로우</p>
<button type="button" class="btn_open"><i></i></button>
<button type="button" title="열림" class="btn_open"><i></i></button>
</div>
<div class="work_cont">
<ul class="top_work">
@ -261,6 +264,7 @@ resInfo--%>
<div class="tb_wrap">
<table class="tbType01">
<caption>신청인, 대리인, 피신청인1, 피신청인2등의 정보제공</caption>
<colgroup>
<col style="width: 250px;">
<col style="width: auto;">
@ -334,7 +338,7 @@ resInfo--%>
</div>
</div>
<table class="tbType01">
<caption>신청인, 주소등의 정보제공</caption>
<caption>신청인, 주소, 신청인 분류등의 정보제공</caption>
<colgroup>
<col style="width: 200px;">
<col style="width: auto;">

12
src/main/webapp/kccadrPb/usr/css/content.css
View File

@ -56,6 +56,11 @@
.read-only,.disabled{background-color: #eee !important; color: #aaa !important; font-size: 16px;}
.cf_text02{font-size: 16px; font-weight: 300; color: #e40000; text-align: right; margin: 10px 0 0 0;}
.hover_content_wrap {position:relative;}
.hover_content_wrap .hover_content_box {display:none;position:absolute;left:0;top:30px;width:370px;padding:15px 20px;font-size:16px;line-height:24px;color:#fff;background:#000;border-radius:5px;box-sizing:border-box;z-index:1;}
.hover_content_wrap .hover_content_box:after {content:'';position:absolute;left:57px;top:-18px;width:26px;height:18px;background:url(/kccadrPb/usr/image/icon_hover_arrow.png) no-repeat left top;}
.hover_content_wrap:hover .hover_content_box {display:block;}
/* //서브 공통 */
/* 로그인 */
@ -236,6 +241,7 @@ table .label{position: absolute;width: 1px; height: 1px; margin: 0; border: none
.tb_list01 tbody p,.tb_list01 tbody a{width: 95%; display: inline-block; padding: 0 5px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; box-sizing: border-box; line-height: 1.4}
.tb_list01 tbody .td_tit a{color: #222; font-weight: 400;}
.tb_list01 tbody .td_date p{overflow: visible; text-overflow: unset; white-space: normal;}
.tb_list01 tbody .hover_content_box {left:-10px;top:50px;}
.tb_list01 .td_status p,.tb_list01 .td_status a,.tb_list01 .td_status button{display: inline-block; width: auto; padding: 4.5px 10px; box-sizing: border-box; border-radius: 20px; border: 1px solid #ccc; background-color: #fff; line-height: 1.2; font-size: 16px}
.tb_list01 .td_status .status_write{border: 1px solid #1b6fcd; color: #1b6fcd;}
@ -418,8 +424,8 @@ table .label{position: absolute;width: 1px; height: 1px; margin: 0; border: none
.step_wrap .step.active p{color: #222; font-weight: 500;}
.step_wrap .step span{display: block; font-size: 20px; margin-top: 8px;}
.step_wrap .step.active span{color: #d43403; font-weight: 500;}
.step_wrap .step .hidden{position: absolute; width: 1px; height: 1px; clip: rect(0,0,0,0); overflow: hidden; margin: 0;}
.step_wrap .step .hover_content_box {left:50px;top:85px;}
.status_detail .step{width: calc(100% / 5.8); margin-left: -1px;}
.status_detail.num02 .step{width: calc(100% / 1.8); border-right: 1px solid #d5d5d5;}
@ -691,7 +697,7 @@ table .label{position: absolute;width: 1px; height: 1px; margin: 0; border: none
.btn_open, .work_flow_wrap .btn_close{width: 30px; height: 30px; border-radius: 5px; background-color: #fff;}
.btn_open i{display: inline-block; width: 100%; height: 100%; background-image: url(/kccadrPb/usr/image/common/btn_plus.png); background-repeat: no-repeat; background-position: center;}
.work_flow_wrap .btn_close i{display: inline-block; width: 100%; height: 100%; background-image: url(/kccadrPb/usr/image/common/btn_minus.png); background-repeat: no-repeat; background-position: center;}
.work_cont{background-color: #fff; border-radius: 5px; padding: 20px 25px; margin: 0 0 25px 0;transition: all 0.5s ease;}
.work_cont{background-color: #fff; border-radius: 5px; padding: 20px 25px; margin: 0 0 25px 0;transition: all 0.5s ease;height:714px;overflow:hidden;}
.work_flow_wrap .top_work{display: flex; justify-content: space-between; align-items: center;}
.work_flow_wrap .work_cont .top_work li{overflow: visible;}
@ -707,7 +713,7 @@ table .label{position: absolute;width: 1px; height: 1px; margin: 0; border: none
.nexticon_4{position: absolute; top: -58px; left: 235px;}
.nexticon_5{position: absolute; top: 22px; left: 215px;}
.work_flow_wrap.off .work_cont{height: 0; padding: 0 25px; margin: 0; transition: all 0.5s ease; overflow: hidden;}
.work_flow_wrap.off .work_cont{height: 0; padding: 0 25px; margin: 0; transition: all 0.5s ease;}
.work_cont .status01 p{border: 1px solid #ea5404; color: #ea5404;}
.work_cont .status02 p{border: 2px solid #1b6fcd; color: #1b6fcd; font-weight: 500;}
/* //워크플로우 */

2
src/main/webapp/kccadrPb/usr/css/content_media.css
View File

@ -67,6 +67,7 @@
/* 조정진행상세 */
.status_detail .step{flex-flow: column; justify-content: center; text-align: center;}
.status_detail .step i{margin-right: 0; margin-bottom: 10px;}
.step_wrap .step .hover_content {left:30px;top:135px;}
/* //조정진행상세 */
/* cont - 이용안내 */
@ -313,6 +314,7 @@
.status_detail.num07 .step:nth-child(4),.status_detail.num08 .step:nth-child(4){border-radius: 0;}
.status_detail.num07 .step:last-child{border-left: 1px solid #d5d5d5;}
.step_wrap .step:hover .hover_content {display:none;}
/* //조정진행상세 */

BIN
src/main/webapp/kccadrPb/usr/image/icon_hover_arrow.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

4
src/main/webapp/kccadrPb/usr/script/content.js
View File

@ -659,10 +659,10 @@ $(document).ready(function(){
$(".work_flow_wrap .btn_open").click(function(){
if($(".work_flow_wrap").is(".off") == true){
$(".work_flow_wrap").removeClass("off");
$(this).addClass("btn_close").removeClass("btn_open");
$(this).addClass("btn_close").removeClass("btn_open").attr('title','닫힘');
}else{
$(".work_flow_wrap").addClass("off");
$(this).removeClass("btn_close").addClass("btn_open");
$(this).removeClass("btn_close").addClass("btn_open").attr('title','열림');
}
});
})