|
|
|
@ -76,21 +76,24 @@ button{border:0;background:transparent;} |
|
|
|
/*레이아웃*/ |
|
|
|
/*레이아웃*/ |
|
|
|
.pal-container{background:#ddd;height:100vh;position:relative;} |
|
|
|
.pal-container{background:#ddd;height:100vh;position:relative;} |
|
|
|
.map{width:calc(100% - 80px);position:absolute;right:0;} |
|
|
|
.map{width:calc(100% - 80px);position:absolute;right:0;} |
|
|
|
.left-layer{width:350px;height:100vh;background:#10163A;position:absolute;left:80px;color:#fff;z-index: 999;padding:14px;overflow: auto;} |
|
|
|
.left-layer{width:350px;height:100vh;background:#ddd;position:absolute;left:80px;color:#fff;z-index: 999;padding:14px;overflow: auto;} |
|
|
|
.right-layer{width:350px;height:100vh;background:#10163A;position:absolute;right:-350px;color:#fff;z-index: 999;padding:14px;transition: 0.5s ease;-webkit-transition: 0.5s ease;overflow:auto;} |
|
|
|
.right-layer{width:350px;height:100vh;background:#ddd;position:absolute;right:-350px;color:#fff;z-index: 999;padding:14px;transition: 0.5s ease;-webkit-transition: 0.5s ease;overflow:auto;} |
|
|
|
.right-layer.active{right:0px;transition: 0.5s ease;-webkit-transition: 0.5s ease;} |
|
|
|
.right-layer.active{right:0px;transition: 0.5s ease;-webkit-transition: 0.5s ease;} |
|
|
|
.right-layer-btn{width:40px;height:40px;position:absolute;right:0px;top:50%;transform: translateY(-50%);border:0;background:#7367f0;border-top-left-radius:5px;border-bottom-left-radius:5px;transition: 0.5s ease;-webkit-transition: 0.5s ease;} |
|
|
|
.right-layer-btn{width:40px;height:40px;position:absolute;right:0px;top:50%;transform: translateY(-50%);border:0;background:#7367f0;border-top-left-radius:5px;border-bottom-left-radius:5px;transition: 0.5s ease;-webkit-transition: 0.5s ease;} |
|
|
|
.right-layer-btn svg{color:#fff;} |
|
|
|
.right-layer-btn svg{color:#fff;} |
|
|
|
.right-menu.active .right-layer-btn{right:350px;transition: 0.5s ease;-webkit-transition: 0.5s ease;} |
|
|
|
.right-menu.active .right-layer-btn{right:350px;transition: 0.5s ease;-webkit-transition: 0.5s ease;} |
|
|
|
.layer-content + .layer-content{margin-top:14px;} |
|
|
|
.layer-content + .layer-content{margin-top:14px;} |
|
|
|
.right-menu{position: absolute;right:0;height: 100vh;} |
|
|
|
.right-menu{position: absolute;right:0;height: 100vh;} |
|
|
|
|
|
|
|
.dark-layout .left-layer{background:#10163A;} |
|
|
|
|
|
|
|
.dark-layout .right-layer{background:#10163A;} |
|
|
|
|
|
|
|
|
|
|
|
/*버튼 기본css*/ |
|
|
|
/*버튼 기본css*/ |
|
|
|
.btn{font-size:0.825rem;font-weight:400;} |
|
|
|
.btn{font-size:0.825rem;font-weight:400;} |
|
|
|
|
|
|
|
|
|
|
|
/*레이어 상세정보-상단타이틀*/ |
|
|
|
/*레이어 상세정보-상단타이틀*/ |
|
|
|
.layer-ti{display:flex;margin-bottom:10px;} |
|
|
|
.layer-ti{display:flex;margin-bottom:10px;} |
|
|
|
.layer-ti h4{flex:1;color:#bbb;font-weight:500;font-size:1rem;} |
|
|
|
.layer-ti h4{flex:1;color:#555;font-weight:500;font-size:1rem;} |
|
|
|
|
|
|
|
.dark-layout .layer-ti h4{color:#bbb;} |
|
|
|
.btn-icon{background:transparent;color:#bbb;border: 0;padding:0;margin-top: -3px;} |
|
|
|
.btn-icon{background:transparent;color:#bbb;border: 0;padding:0;margin-top: -3px;} |
|
|
|
.layer-ti .badge{font-weight:500;font-size:13px;} |
|
|
|
.layer-ti .badge{font-weight:500;font-size:13px;} |
|
|
|
|
|
|
|
|
|
|
|
@ -150,7 +153,8 @@ button{border:0;background:transparent;} |
|
|
|
.layer-content-list dl dt .list-right-txt{text-align: right;} |
|
|
|
.layer-content-list dl dt .list-right-txt{text-align: right;} |
|
|
|
|
|
|
|
|
|
|
|
/*레이어 상세정보-드론상세정보*/ |
|
|
|
/*레이어 상세정보-드론상세정보*/ |
|
|
|
.layer-content-box{background:#283046;border-radius: 5px;color:#bbb; border: 1px solid #404656;} |
|
|
|
.layer-content-box{background:#fff;border-radius: 5px;color:#bbb; border: 1px solid #ddd;} |
|
|
|
|
|
|
|
.dark-layout .layer-content-box{background:#283046;border: 1px solid #404656;} |
|
|
|
.layer-content-box .drone-ti{display:flex;align-items: center;font-weight:500; color: #f8c023;padding:10px;} |
|
|
|
.layer-content-box .drone-ti{display:flex;align-items: center;font-weight:500; color: #f8c023;padding:10px;} |
|
|
|
.layer-content-box .drone-ti img{margin-right:6px;} |
|
|
|
.layer-content-box .drone-ti img{margin-right:6px;} |
|
|
|
.layer-content-box .drone-img img{width:100%;} |
|
|
|
.layer-content-box .drone-img img{width:100%;} |
|
|
|
@ -217,8 +221,10 @@ button{border:0;background:transparent;} |
|
|
|
.layer-switch-list .custom-switch .custom-control-label:after{top:2px;} |
|
|
|
.layer-switch-list .custom-switch .custom-control-label:after{top:2px;} |
|
|
|
.map-btn .btn-group, .btn-group-vertical{width:100%;} |
|
|
|
.map-btn .btn-group, .btn-group-vertical{width:100%;} |
|
|
|
.map-btn button:hover{box-shadow:none!important;} |
|
|
|
.map-btn button:hover{box-shadow:none!important;} |
|
|
|
.map-btn button{color:#bbb!important;background:#283046!important;border-color:rgba(34, 41, 47, 0.08) !important;} |
|
|
|
.map-btn button{color:#555!important;background:#fff!important;border-color:#ddd!important;} |
|
|
|
.map-btn button:focus{color:#7367f0;background:#7367f0!important;color:#fff!important;border-color:rgba(34, 41, 47, 0.08) !important} |
|
|
|
.map-btn button:focus{color:#7367f0;background:#7367f0!important;color:#fff!important;border-color:rgba(34, 41, 47, 0.08) !important} |
|
|
|
|
|
|
|
.dark-layout .map-btn button{color:#bbb!important;background:#283046!important;border-color:rgba(34, 41, 47, 0.08) !important;} |
|
|
|
|
|
|
|
.dark-layout .map-btn button:focus{color:#7367f0;background:#7367f0!important;color:#fff!important;border-color:rgba(34, 41, 47, 0.08) !important} |
|
|
|
.map-btn .btn-primary{background:#7367f0!important;color:#fff!important;} |
|
|
|
.map-btn .btn-primary{background:#7367f0!important;color:#fff!important;} |
|
|
|
/* .map-btn .btn-group > .btn:not([class*='btn-outline-']):not([class*='btn-flat-']):not([class*='btn-gradient-']):not([class*='btn-relief-']):first-child, |
|
|
|
/* .map-btn .btn-group > .btn:not([class*='btn-outline-']):not([class*='btn-flat-']):not([class*='btn-gradient-']):not([class*='btn-relief-']):first-child, |
|
|
|
.map-btn .btn-group > .btn:not([class*='btn-outline-']):not([class*='btn-flat-']):not([class*='btn-gradient-']):not([class*='btn-relief-']):first-of-type{border-left-color:transparent!important;} |
|
|
|
.map-btn .btn-group > .btn:not([class*='btn-outline-']):not([class*='btn-flat-']):not([class*='btn-gradient-']):not([class*='btn-relief-']):first-of-type{border-left-color:transparent!important;} |
|
|
|
@ -227,7 +233,8 @@ button{border:0;background:transparent;} |
|
|
|
h1.logo{width:50px;height:50px;margin:0px auto 60px auto;text-align:center;} |
|
|
|
h1.logo{width:50px;height:50px;margin:0px auto 60px auto;text-align:center;} |
|
|
|
h1.logo img{width:100%;} |
|
|
|
h1.logo img{width:100%;} |
|
|
|
h1.logo span{display:block;color:#f4f4f4;font-weight:bold;letter-spacing:2px;font-size:0.9375rem;} |
|
|
|
h1.logo span{display:block;color:#f4f4f4;font-weight:bold;letter-spacing:2px;font-size:0.9375rem;} |
|
|
|
.left-menu{width:80px;height:100vh;background:#283046;padding-top:20px;position:fixed;} |
|
|
|
.left-menu{width:80px;height:100vh;background:#ddd;padding-top:20px;position:fixed;} |
|
|
|
|
|
|
|
.dark-layout .left-menu{background:#283046;} |
|
|
|
.left-menu-nav, .left-menu-footer{color:#bbb;} |
|
|
|
.left-menu-nav, .left-menu-footer{color:#bbb;} |
|
|
|
.left-menu-nav li, .left-menu-footer li{margin-top:20px;text-align:center;} |
|
|
|
.left-menu-nav li, .left-menu-footer li{margin-top:20px;text-align:center;} |
|
|
|
.left-menu-footer{position:absolute;bottom:20px;left:50%;transform: translateX(-50%);} |
|
|
|
.left-menu-footer{position:absolute;bottom:20px;left:50%;transform: translateX(-50%);} |
|
|
|
@ -272,22 +279,40 @@ h1.logo span{display:block;color:#f4f4f4;font-weight:bold;letter-spacing:2px;fon |
|
|
|
.layer-content-list dl.notice-list dt div.list-ti{display:flex;} |
|
|
|
.layer-content-list dl.notice-list dt div.list-ti{display:flex;} |
|
|
|
.layer-content-list dl.notice-list dt div.list-txt{margin-top:8px;} |
|
|
|
.layer-content-list dl.notice-list dt div.list-txt{margin-top:8px;} |
|
|
|
|
|
|
|
|
|
|
|
/*로그인*/ |
|
|
|
/*로그인*/ |
|
|
|
.login{display:flex;height:100vh;color:#bbb;position:relative;} |
|
|
|
.login{display:flex;height:100vh;color:#555;position:relative;} |
|
|
|
.login-logo{position:absolute;top:80px;left:100px;color:#bbb;font-weight:bold;font-size:1.8rem;width: 100%;} |
|
|
|
.login-logo{position:absolute;top:80px;left:100px;color:#555;font-weight:bold;font-size:1.8rem;width: 100%;} |
|
|
|
.login-img, .login-form {display: flex;align-items: center;justify-content: center;} |
|
|
|
.login-img, .login-form {display: flex;align-items: center;justify-content: center;} |
|
|
|
.login-img{flex:1.2;background:#161d31;} |
|
|
|
.login-img{flex:1.2;background:#fff;} |
|
|
|
.login-form{background:#283046;width:100%;flex:0.8;flex-direction: column;} |
|
|
|
.login-form{background:#fff;width:100%;flex:0.8;flex-direction: column;} |
|
|
|
.login-form form{width:100%;padding:0 120px;} |
|
|
|
.login-form form{width:100%;padding:0 120px;} |
|
|
|
.login-form .form-control{background:transparent;border:1px solid #404656;} |
|
|
|
.login-form .form-control{background:transparent} |
|
|
|
.login-form .form-control:focus{border-color:#7367f0;border-right:1px solid #7367f0;} |
|
|
|
.login-form .form-control:focus{border-color:#7367f0;border-right:1px solid #7367f0;} |
|
|
|
.login-form .form-label-group > label{color:#bbb;} |
|
|
|
/* .login-form .form-label-group > label{color:#bbb;} |
|
|
|
.login-form .form-control-position svg{color:#bbb;} |
|
|
|
.login-form .form-control-position svg{color:#bbb;} |
|
|
|
.login-form .form-control::placeholder{color:#bbb;} |
|
|
|
.login-form .form-control::placeholder{color:#bbb;} |
|
|
|
.login-form .vx-checkbox-con .vx-checkbox{border-color: #404656;} |
|
|
|
.login-form .vx-checkbox-con .vx-checkbox{border-color: #404656;} */ |
|
|
|
.login-txt{width:100%;margin-bottom:20px;} |
|
|
|
.login-txt{width:100%;margin-bottom:20px;} |
|
|
|
.login-txt h2{color:#f4f4f4;font-family: "Montserrat", serif;font-size:1.8rem;font-weight:bold;text-align: center;} |
|
|
|
.login-txt h2{color:#555;font-family: "Montserrat", serif;font-size:1.8rem;font-weight:bold;text-align: center;} |
|
|
|
.login-txt p{color:#bbb;font-family: "Montserrat", serif;font-size:1.125rem;font-weight:normal;text-align: center;margin-top:20px;} |
|
|
|
.login-txt p{color:#555;font-family: "Montserrat", serif;font-size:1.125rem;font-weight:normal;text-align: center;margin-top:20px;} |
|
|
|
|
|
|
|
.full-btn button{width:100%;margin-bottom:10px;} |
|
|
|
|
|
|
|
.login-link{margin-top:10px;} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.dark-layout .login{display:flex;height:100vh;color:#bbb;position:relative;} |
|
|
|
|
|
|
|
.dark-layout .login-logo{position:absolute;top:80px;left:100px;color:#bbb;font-weight:bold;font-size:1.8rem;width: 100%;} |
|
|
|
|
|
|
|
.dark-layout .login-img, .login-form {display: flex;align-items: center;justify-content: center;} |
|
|
|
|
|
|
|
.dark-layout .login-img{flex:1.2;background:#161d31;} |
|
|
|
|
|
|
|
.dark-layout .login-form{background:#283046;width:100%;flex:0.8;flex-direction: column;} |
|
|
|
|
|
|
|
.dark-layout .login-form form{width:100%;padding:0 120px;} |
|
|
|
|
|
|
|
.dark-layout .login-form .form-control{background:transparent;border:1px solid #404656;} |
|
|
|
|
|
|
|
.dark-layout .login-form .form-control:focus{border-color:#7367f0;border-right:1px solid #7367f0;} |
|
|
|
|
|
|
|
.dark-layout .login-form .form-label-group > label{color:#bbb;} |
|
|
|
|
|
|
|
.dark-layout .login-form .form-control-position svg{color:#bbb;} |
|
|
|
|
|
|
|
.dark-layout .login-form .form-control::placeholder{color:#bbb;} |
|
|
|
|
|
|
|
.dark-layout .login-form .vx-checkbox-con .vx-checkbox{border-color: #404656;} |
|
|
|
|
|
|
|
.dark-layout .login-txt{width:100%;margin-bottom:20px;} |
|
|
|
|
|
|
|
.dark-layout .login-txt h2{color:#f4f4f4;font-family: "Montserrat", serif;font-size:1.8rem;font-weight:bold;text-align: center;} |
|
|
|
|
|
|
|
.dark-layout .login-txt p{color:#bbb;font-family: "Montserrat", serif;font-size:1.125rem;font-weight:normal;text-align: center;margin-top:20px;} |
|
|
|
.full-btn button{width:100%;margin-bottom:10px;} |
|
|
|
.full-btn button{width:100%;margin-bottom:10px;} |
|
|
|
.login-link{margin-top:10px;} |
|
|
|
.login-link{margin-top:10px;} |
|
|
|
@media screen and (max-width:1280px){ |
|
|
|
@media screen and (max-width:1280px){ |
|
|
|
@ -844,8 +869,10 @@ background-size: 75% auto; |
|
|
|
.main-data-test{left:450px!important;transition: 0.5s ease;-webkit-transition: 0.5s ease;} |
|
|
|
.main-data-test{left:450px!important;transition: 0.5s ease;-webkit-transition: 0.5s ease;} |
|
|
|
.main-data{position:absolute;z-index: 999;top:10px;left:150px;display:flex;font-size:0.875rem;} |
|
|
|
.main-data{position:absolute;z-index: 999;top:10px;left:150px;display:flex;font-size:0.875rem;} |
|
|
|
.main-data-box + .main-data-box{margin-left:20px;} |
|
|
|
.main-data-box + .main-data-box{margin-left:20px;} |
|
|
|
.main-data-box .card{min-height:88px;margin:0;padding:10px 12px; background: #10163A;} |
|
|
|
.main-data-box .card{min-height:88px;margin:0;padding:10px 12px; background:#fff;} |
|
|
|
.box-ti{color: #f4f4f4;font-weight: 500;} |
|
|
|
.dark-layout .main-data-box .card{background: #10163A;} |
|
|
|
|
|
|
|
.box-ti{color: #555;font-weight: 500;} |
|
|
|
|
|
|
|
.dark-layout .box-ti{color: #f4f4f4;} |
|
|
|
.data-box-header{display:flex;;align-items:center;justify-content: space-between;} |
|
|
|
.data-box-header{display:flex;;align-items:center;justify-content: space-between;} |
|
|
|
.data-box-header svg{color:#fff;} |
|
|
|
.data-box-header svg{color:#fff;} |
|
|
|
.data-list-box{display:flex;margin:10px 0 4px 0;} |
|
|
|
.data-list-box{display:flex;margin:10px 0 4px 0;} |
|
|
|
|
