refactor : 최상위div요소 css클래스명 수정

main
이범준 2 years ago
parent bf0d07ed65
commit a5091a0b21

@ -9,7 +9,6 @@
<%@include file="/WEB-INF/jsp/framework/frameworkIncludeBase.jsp" %> <%@include file="/WEB-INF/jsp/framework/frameworkIncludeBase.jsp" %>
<link rel="stylesheet" type="text/css" href="${ctx}/resources/biz/layout/css/root.css" />
<link rel="stylesheet" type="text/css" href="${ctx}/resources/biz/common/css/bizMain.css" /> <link rel="stylesheet" type="text/css" href="${ctx}/resources/biz/common/css/bizMain.css" />
<!-- 메뉴 --> <!-- 메뉴 -->
<script src="${ctx}/resources/3rd-party/sneat/js/menu.js"></script> <script src="${ctx}/resources/3rd-party/sneat/js/menu.js"></script>
@ -33,7 +32,7 @@
</head> </head>
<body> <body>
<div class="layoutWrapper"> <div class="wrapper-layout">
<%@include file="header.jsp"%> <%@include file="header.jsp"%>

@ -10,15 +10,10 @@
<c:if test="${!empty pageTitle}"> <c:if test="${!empty pageTitle}">
<title>${pageTitle}</title> <title>${pageTitle}</title>
</c:if> </c:if>
<style>
#wrap {
padding: 5px 20px 5px 20px;
}
</style>
</head> </head>
<body> <body>
<div id="wrap"> <div id="wrap" class="wrapper-pop">
<t:insertAttribute name="content"/> <t:insertAttribute name="content"/>
</div> </div>

@ -15,11 +15,10 @@
</script> </script>
<link rel="stylesheet" href="<c:url value='/'/>resources/biz/common/css/iframe.css" />
</head> </head>
<body> <body>
<div class="iframe-wrap"> <div class="wrapper-list">
<t:insertAttribute name="content"/> <t:insertAttribute name="content"/>

@ -15,11 +15,10 @@
</script> </script>
<link rel="stylesheet" type="text/css" href="<c:url value='/'/>resources/biz/layout/css/dashboard.css" />
</head> </head>
<body> <body>
<div class="dashboard"> <div class="wrapper-dashboard">
<t:insertAttribute name="content"/> <t:insertAttribute name="content"/>

@ -47,7 +47,7 @@
</head> </head>
<body> <body>
<!-- wrap --> <!-- wrap -->
<div id="wrap"> <div id="wrap" class="wrapper-pop">
<t:insertAttribute name="content"/> <t:insertAttribute name="content"/>
</div> </div>
<!-- //wrap --> <!-- //wrap -->

@ -12,7 +12,7 @@
<!-- </Header end --> <!-- </Header end -->
<!-- biz contents start --> <!-- biz contents start -->
<div class="iframe-wrap"> <div class="wrapper-list">
<th:block layout:fragment="contents"/> <th:block layout:fragment="contents"/>
</div> </div>
<!-- biz contents start --> <!-- biz contents start -->

@ -9,7 +9,7 @@
<!-- <body> start --> <!-- <body> start -->
<body> <body>
<div class="layoutWrapper"> <div class="wrapper-layout">
<!-- <Header> start --> <!-- <Header> start -->
<Header> <Header>

@ -1,6 +0,0 @@
/*2023.03.22 iframe css 추가*/
.iframe-wrap {
height: 100vh;
overflow-y:scroll;
padding: 15px;
}

@ -1,65 +0,0 @@
div.dashboard {
display: grid;
grid-template-columns : repeat(auto-fill,minmax(145px, 145px));
grid-template-rows: repeat(auto-fill,minmax(116px, 116px));
justify-content: center;
grid-auto-flow: row;
grid-column-gap: 10px;
grid-row-gap: 10px;
height: 100vh;
overflow-y:scroll;
padding: 15px;
}
@media (max-width: 1300px) {
div.dashboard {
grid-template-columns : repeat(8,minmax(145px, 145px));
}
}
div.dashboard .card {
height: 100%;
font-size: 12px;
font-weight: bold;
}
div.dashboard .card-header {
margin: 0;
padding: 3px;
}
div.dashboard .card-body {
margin: 0;
padding: 3px;
}
div.dashboard .card-footer {
padding: 3px;
}
.dashboard-item-1-1 {
grid-column: span 1;
grid-row: span 1;
}
.dashboard-item-2-1 {
grid-column: span 2;
grid-row: span 1;
}
.dashboard-item-1-2 {
grid-column: span 1;
grid-row: span 2;
}
.dashboard-item-2-2 {
grid-column: span 2;
grid-row: span 2;
}
.dashboard-item-4-2 {
grid-column: span 4;
grid-row: span 2;
}
.dashboard-item-4-3 {
grid-column: span 4;
grid-row: span 3;
}

@ -1,37 +0,0 @@
/* CSS그리드 */
div.layoutWrapper {
display: grid;
grid-template-columns: min-content auto min-content;
grid-template-rows : 2.2rem minmax(27rem,54rem) 2.2rem;
grid-auto-flow: column;
grid-column-gap: 10px;
height: 100%;
transition: all 1s;
}
div.layoutWrapper > nav {
grid-area : 1 / 1 / 4 / 2;
background-color: #ffffff;
}
div.layoutWrapper > header {
grid-area : 1 / 2 / 2 / 4;
display: flex;
align-items: center;
height: 100%;
}
div.layoutWrapper > main {
margin-right: 3rem;
grid-area : 2 / 2 / 3 / 4;
}
div.layoutWrapper > footer {
grid-area : 3 / 2 / 4 / 4;
}
div.layoutWrapper > aside {
background-color: white;
border: 1px solid black;
z-index:1;
grid-area : 2 / 3 / 3 / 4;
}

@ -1,3 +1,117 @@
/* 최상위 태그 */
.wrapper-layout {
display: grid;
grid-template-columns: min-content auto min-content;
grid-template-rows : 2.2rem minmax(27rem,54rem) 2.2rem;
grid-auto-flow: column;
grid-column-gap: 10px;
height: 100%;
transition: all 1s;
}
.wrapper-layout > nav {
grid-area : 1 / 1 / 4 / 2;
background-color: #ffffff;
}
.wrapper-layout > header {
grid-area : 1 / 2 / 2 / 4;
display: flex;
align-items: center;
height: 100%;
}
.wrapper-layout > main {
margin-right: 3rem;
grid-area : 2 / 2 / 3 / 4;
}
.wrapper-layout > footer {
grid-area : 3 / 2 / 4 / 4;
}
.wrapper-layout > aside {
background-color: white;
border: 1px solid black;
z-index:1;
grid-area : 2 / 3 / 3 / 4;
}
.wrapper-dashboard {
display: grid;
grid-template-columns : repeat(auto-fill,minmax(145px, 145px));
grid-template-rows: repeat(auto-fill,minmax(116px, 116px));
justify-content: center;
grid-auto-flow: row;
grid-column-gap: 10px;
grid-row-gap: 10px;
height: 100vh;
overflow-y:scroll;
padding: 15px;
}
@media (max-width: 1300px) {
.wrapper-dashboard {
grid-template-columns : repeat(8,minmax(145px, 145px));
}
}
.wrapper-dashboard .card {
height: 100%;
font-size: 12px;
font-weight: bold;
}
.wrapper-dashboard .card-header {
margin: 0;
padding: 3px;
}
.wrapper-dashboard .card-body {
margin: 0;
padding: 3px;
}
.wrapper-dashboard .card-footer {
padding: 3px;
}
.dashboard-item-1-1 {
grid-column: span 1;
grid-row: span 1;
}
.dashboard-item-2-1 {
grid-column: span 2;
grid-row: span 1;
}
.dashboard-item-1-2 {
grid-column: span 1;
grid-row: span 2;
}
.dashboard-item-2-2 {
grid-column: span 2;
grid-row: span 2;
}
.dashboard-item-4-2 {
grid-column: span 4;
grid-row: span 2;
}
.dashboard-item-4-3 {
grid-column: span 4;
grid-row: span 3;
}
.wrapper-list {
height: 100vh;
overflow-y:scroll;
padding: 15px;
}
.wrapper-pop {
padding: 5px 20px 5px 20px;
}
/* 조회조건 영역 */ /* 조회조건 영역 */
.container-search { .container-search {
clear: both; clear: both;

Loading…
Cancel
Save