1
0
Fork 0
HANYANG_MES/show_dir/www/kadm2/_backup/main.php

234 lines
6.2 KiB
PHP

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>()Kuls Admin</title>
<link href="/include/bootstrap/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css">
</head>
<body>
<div id="root">
<div id="sidebar">
<div class="head-logo"><!--로고--></div>
<div id="side-pos">Admin Page</div>
<div id="side-nav">
<ul id="side-gnb">
<li><div><i class="bi bi-arrow-right-short selmnu"></i><i class="bi bi-patch-plus-fill"></i>Dash Board<i class="bi bi-chevron-right selmnusub"></i></div></li>
<li><div><i class="bi bi-arrow-right-short selmnu"></i><i class="bi bi-palette"></i>사원관리<i class="bi bi-chevron-right selmnusub"></i></div></li>
<li class="hassub open">
<div><i class="bi bi-arrow-right-short selmnu"></i><i class="bi bi-pc-display-horizontal"></i>컨테이너관리<i class="bi bi-chevron-down selmnusub"></i></div>
<ul id="side-lnb">
<li><div><i class="bi bi-arrow-right-short selmnu"></i><i class="bi bi-person-check"></i>입출입현황</div></li>
<li class="active"><div><i class="bi bi-arrow-right-short selmnu"></i><i class="bi bi-person-plus"></i>재고현황</div></li>
<li><div><i class="bi bi-arrow-right-short selmnu"></i><i class="bi bi-person-square"></i>상태푯기</div></li>
</ul>
</li>
<li><div><i class="bi bi-arrow-right-short selmnu"></i><i class="bi bi-gear-fill"></i>관리<i class="bi bi-chevron-right selmnusub"></i></div></li>
</ul>
</div>
</div>
<div id="main">
<div class="header-static">
<div class="header-status"> <i class="bi bi-list"> Dash Board</i> 우성 서비스 : 상단 대쉬보드 / 현위치 / 로그인 / mnb / Info 등등</div>
<div class="header-bcrumb"> <i class="bi bi-caret-right mr-3"></i> Admin Home > Home </div>
</div>
<div class="body">본문
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</div>
</div>
</div>
</body>
</html>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-u1OknCvxWvY5kfmNBILK2hRnQC3Pr17a+RTT6rIHI7NnikvbZlHgTPOOmMi466C8" crossorigin="anonymous"></script>
<style>
/*
https://bootstrap.build/app
** 메인색
#1F2937 - prim
#BAC5D7 - secon
#F0BC74 - X
#F1F1E6 - X
$spacer : 0.5rem
$font-size-base: 0.85rem
$input-btn-padding-y : .25rem
$input-btn-padding-x : .5rem
$input-btn-padding-y-sm : .15rem
$input-btn-padding-x-sm : .4rem
$input-btn-padding-y-lg : .3rem
$input-btn-padding-x-lg : .7em
*/
#root {
border:none;
}
#root #sidebar {
position: fixed;
top: 0;
bottom: 0;
float: left;
width: 250px;
color: #fff;
background: #1F2937;
z-index: 100;
-webkit-transition: left 0.3s;
transition: left 0.3s;
}
#root #sidebar .head-logo {
display: flex;
align-items: center;
justify-content: center;
height: 64px;
padding: 0 20px;
background-image: url("/include/img/kuls_ict.png");
background-repeat: no-repeat;
background-position: center center;
background-size: 70%;
background-color: #ffffff;
}
#root #sidebar #side-pos {
display: flex;
align-items: center;
justify-content: center;
height: 46px;
font-size: x-large;
background: #00000033;
}
#root #sidebar #side-nav {
position:absolute;
top:0;
left:0;
margin-top: 110px;
width:100%;
height: calc(100% - 110px);
overflow: auto;
}
#root #main {
position:relative;
width: 100%;
padding-left: 250px;
flex-basis: calc(100% - 250px);
background: #F4F5F7;
z-index: 50;
-webkit-transition: left 0.3s;
transition: left 0.3s;
}
#root #main .header-static {
position: sticky;
top:0;
height: 110px;
background: #F4F5F7;
z-index: 2;
}
#root #main .header-static .header-status {
display: flex;
align-items: center;
height: 64px;
padding: 0 10px;
}
#root #main .header-static .header-status .bi {
font-size: x-large;
padding-right: 20px;
}
#root #main .header-static .header-bcrumb {
display: flex;
align-items: center;
height: 46px;
padding: 5px 20px;
border-top: 1px #BAC5D7 solid;
border-bottom: 1px #BAC5D7 solid;
}
#root #main .body {
padding: 30px;
z-index: 1;
}
#root ul, #root li {
list-style-type: none;
margin-left: 0px;
padding-left: 0px;
}
#root #sidebar #side-gnb {
display: flex;
flex-direction: column;
}
#root #sidebar #side-gnb > li > div {
padding: 10px;
padding-left: 20px;
/*border-bottom: solid 1px #2D3C50;*/
}
#root #sidebar #side-gnb > li #side-lnb > li > div {
padding: 10px;
padding-left: 40px;
/*border-bottom: solid 1px #2D3C50;*/
}
#root #sidebar #side-nav li {
position: relative;
}
#root #sidebar #side-nav li .bi {
margin-right: 10px;
}
#root #sidebar #side-nav li .bi.selmnu, #root #sidebar #side-nav li .bi.selmnusub{
display: none;
}
#root #sidebar #side-nav li.active > div > .bi.selmnu {
display: block;
position: absolute;
color: #F0BC74;
font-size: large;
left: 3px;
top: 8px;
}
#root #sidebar #side-nav li.hassub .bi.selmnusub {
display: block;
position: absolute;
right: 3px;
top: 10px;
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
}
#root #sidebar #side-nav li.hassub.open .bi.selmnusub {
transform: rotate(180deg);
}
#root #sidebar #side-gnb > li:hover {
background-color: #fff3;
cursor: pointer;
}
#root #sidebar #side-gnb > li #side-lnb > li:hover {
background-color: #0003;
cursor: pointer;
}
</style>