/* 带确定和取消的自定义弹出框 */
|
.myconfirm {
|
display: none;
|
position: fixed;
|
margin-left: 50%;
|
left: -190px;
|
top: 0;
|
z-index: 999997;
|
width:350px;
|
min-width: 350px;
|
max-width: 400px;
|
background-color: pink;
|
-webkit-user-select: none;
|
-moz-user-select: none;
|
-ms-user-select: none;
|
-o-user-select: none;
|
user-select: none;
|
}
|
/* 定义容器的before和after清除浮动 */
|
.myconfirm:before, .myconfirm:after,
|
.myconfirm .confirm-header:before, .myconfirm .confirm-header:after,
|
.myconfirm .confirm-footer:before, .myconfirm .confirm-footer:after {
|
display: table;
|
content: " ";
|
}
|
.myconfirm:after,
|
.myconfirm .confirm-header:after,
|
.myconfirm .confirm-footer:after {
|
clear: both;
|
}
|
|
/* 定义confirm的header */
|
.myconfirm .confirm-header {
|
background: url('../image/bg_13.jpg') repeat-x;
|
}
|
.myconfirm .confirm-header .title{
|
float: left;
|
widht: 80px;
|
height: 30px;
|
line-height: 30px;
|
text-indent: 2em;
|
font-weight: bold;
|
}
|
.myconfirm .confirm-header .close-confirm {
|
float: right;
|
width: 21px;
|
height: 21px;
|
margin-top: 5px;
|
margin-right: 5px;
|
background-image: url(../image/backgrounds.32.png);
|
background-position: -396px -20px;
|
background-repeat: no-repeat;
|
}
|
.myconfirm .confirm-header .close-confirm:hover {
|
background-position: -396px -108px;
|
}
|
|
/* 定义confirm的content */
|
.myconfirm .confirm-content {
|
background-color: #FFFFFF;
|
padding: 40px 0;
|
font-size: 14px;
|
text-align: center;
|
font-weight: bold;
|
}
|
/* 定义confirm的footer */
|
.myconfirm .confirm-footer {
|
background-color: #E9E7E7;
|
}
|
.myconfirm .confirm-footer .ipt {
|
float: left;
|
width:50%;
|
height: 60px;
|
text-align: center;
|
}
|
.myconfirm .confirm-footer input {
|
/*初始化按钮*/
|
font-size: 12px;
|
text-decoration: none!important;
|
font-family: Helvetica, Arial, sans serif;
|
padding: 6px 12px;
|
border-radius: 3px;
|
-moz-border-radius: 3px;
|
box-shadow: inset 0px 0px 2px #fff;
|
-o-box-shadow: inset 0px 0px 2px #fff;
|
-webkit-box-shadow: inset 0px 0px 2px #fff;
|
-moz-box-shadow: inset 0px 0px 2px #fff;
|
/*定义颜色和样式*/
|
color: #41788c;
|
border: 1px solid #6fb1c7;
|
background-image: -moz-linear-gradient(#aae5f7, #73d0f1);
|
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#73d0f1), to(#aae5f7));
|
background-image: -webkit-linear-gradient(#aae5f7, #73d0f1);
|
background-image: -o-linear-gradient(#aae5f7, #73d0f1);
|
text-shadow: 1px 1px 1px #bfeafb;
|
background-color: #73d0f1;
|
/* 自定义位置 */
|
margin-top: 15px;
|
}
|
.myconfirm .confirm-footer input:hover {
|
border: 1px solid #4690ad;
|
background-image: -moz-linear-gradient(#73d0f1, #aae5f7);
|
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#aae5f7), to(#73d0f1));
|
background-image: -webkit-linear-gradient(#73d0f1, #aae5f7);
|
background-image: -o-linear-gradient(#73d0f1, #aae5f7);
|
background-color: #aae5f7;
|
}
|
|
/* confirm遮罩层 */
|
.confirm-mask {
|
display:none;
|
position: fixed;
|
left: 0;
|
top: 0;
|
z-index: 999996;
|
width: 100%;
|
height: 100%;
|
background-color: #000000;
|
filter:alpha(opacity=30); /*IE滤镜,透明度50%*/
|
-moz-opacity:0.3; /*Firefox私有,透明度50%*/
|
opacity:0.3; /*其他,透明度50%*/
|
-webkit-user-select: none;
|
-moz-user-select: none;
|
-ms-user-select: none;
|
-o-user-select: none;
|
user-select: none;
|
|
}
|
|
/* tbl ui set */
|
.tbl-container {
|
background-color: #ffffff;
|
overflow: hidden;
|
}
|
.tbl-container .tbl-header {
|
position: relative;
|
z-index: 9;
|
height: 2.4em;
|
border-bottom: 1px solid #c9c7c2;
|
overflow:hidden;
|
background-color: #ffffff;
|
}
|
.tbl-container .tbl-header table{
|
position: absolute;
|
width: 100%;
|
border-collapse: collapse;
|
}
|
.tbl-container .tbl-header table thead {
|
line-height: 2.4em;
|
}
|
.tbl-container .tbl-header table thead td {
|
border: 1px solid #c9c7c2;
|
text-align: center;
|
white-space: nowrap;
|
font-size: 12px;
|
font-weight: bold;
|
background-image: url(../images/table_th_bg.gif);
|
background-repeat: repeat-x;
|
}
|
.tbl-container .tbl-header table tbody td {
|
border: 1px solid #c9c7c2;
|
padding-top: .5em;
|
padding-bottom: .5em;
|
padding-left: 1em;
|
padding-right: 1em;
|
text-align: center;
|
white-space: nowrap;
|
}
|
.tbl-container .tbl-body {
|
position: relative;
|
overflow: auto;
|
z-index: 8;
|
}
|
.tbl-container .tbl-body table{
|
position: absolute;
|
width: 100%;
|
top: -2.5em;
|
border-collapse: collapse;
|
}
|
.tbl-container .tbl-body table thead {
|
line-height: 2.4em;
|
}
|
.tbl-container .tbl-body table thead td {
|
border: 1px solid #c9c7c2;
|
text-align: center;
|
font-size: 12px;
|
white-space: nowrap;
|
font-weight: bold;
|
}
|
.tbl-container .tbl-body table tbody td {
|
border: 1px solid #c9c7c2;
|
padding-top: .5em;
|
padding-bottom: .5em;
|
padding-left: 1em;
|
padding-right: 1em;
|
text-align: center;
|
white-space: nowrap;
|
}
|
.tbl-container .tbl-body table tbody tr:hover {
|
background-color: #e2e0e0;
|
}
|
.tbl-container .tbl-body table tbody tr.active {
|
background-color: #ececff;
|
}
|
|
.loading-container {
|
position: relative;
|
overflow: hidden !important;
|
}
|
|
/* loading moudle css set */
|
.whyc-ui-loading {
|
display: none;
|
width: 100%;
|
height: 100%;
|
}
|
.whyc-ui-loading.show {
|
display: block;
|
}
|
.whyc-ui-loading.fixed {
|
position: fixed;
|
left: 0;
|
top: 0;
|
z-index: 999999;
|
}
|
.whyc-ui-loading.absolute {
|
position: absolute;
|
left: 0;
|
top: 0;
|
z-index: 999999;
|
}
|
.whyc-ui-loading .loading-content {
|
position: relative;
|
width: 100%;
|
height: 100%;
|
}
|
.whyc-ui-loading .loading-content .loading-bg {
|
position: absolute;
|
width: 100%;
|
height: 100%;
|
background-color: #989494;
|
|
}
|
/* opacity step */
|
.whyc-ui-loading .loading-content .loading-bg.opacity03 {
|
filter:Alpha(opacity=30); /* IE8 以及更早的浏览器 */
|
opacity: 0.3;
|
}
|
.whyc-ui-loading .loading-content .loading-bg.opacity0 {
|
filter:Alpha(opacity=0); /* IE8 以及更早的浏览器 */
|
opacity: 0;
|
}
|
|
.whyc-ui-loading .loading-content .loading-images {
|
position: absolute;
|
left: 50%;
|
top: 50%;
|
margin-left: -2.5em;
|
margin-top: -2.5em;
|
text-align: center;
|
}
|
.whyc-ui-loading .loading-content .loading-images i.fa.fa-spinner {
|
font-size: 5em;
|
color: #1313f0;
|
}
|
|
.whyc-ui-loading .loading-content .loading-images span.loading-desc {
|
display: block;
|
padding-top: .5em;
|
color: #000000;
|
font-weight: bold;
|
font-size: 16px;
|
}
|
|
/* scroll bar 设置 */
|
.whyc-scroll-bar {
|
position: fixed;
|
left: 0;
|
bottom: 0;
|
overflow-x: hidden;
|
width: 100%;
|
}
|
.whyc-scroll-bar .scroll-bar-container{
|
position: relative;
|
width: 100%;
|
height: 2.4em;
|
overflow-x: hidden;
|
}
|
.scroll-bar-container .items-list {
|
position: absolute;
|
white-space: nowrap;
|
}
|
.scroll-bar-container .scroll-items {
|
display: inline-block;
|
padding-left: 1em;
|
padding-right: 1em;
|
width: 300px;
|
line-height: 2.4em;
|
text-align: center;
|
background-color: #d8d8d8;
|
}
|
|
/* tooltip样式设置 */
|
.whyc-tooltip-container {
|
position: relative;
|
}
|
.whyc-tooltip {
|
display: none;
|
position: absolute;
|
background-color: #fff;
|
border: 1px solid #ccc;
|
box-shadow: 1px 1px 5px #d1d1d1;
|
font-weight: bold;
|
}
|
.whyc-tooltip-container .whyc-tooltip {
|
display: block;
|
visibility: hidden;
|
}
|
.whyc-tooltip-container .whyc-tooltip.show {
|
visibility: visible;
|
}
|
.whyc-tooltip.hide {
|
display: none;
|
font-size: 12px;
|
}
|
.whyc-tooltip .whyc-container {
|
position: relative;
|
}
|
.whyc-tooltip .tooltip-t {
|
position: absolute;
|
width: 24px;
|
height: 24px;
|
background-color: none;
|
}
|
.tooltip-t .t-container {
|
position: relative;
|
width: 100%;
|
height: 100%;
|
}
|
.t-container .t-item {
|
position: absolute;
|
width: 0;
|
height: 0;
|
}
|
/* 在尖头在上方的样式 */
|
.whyc-tooltip .tooltip-t.top {
|
top: -24px;
|
left: 1em;
|
}
|
|
.tooltip-t.top .t-container .t-border {
|
border: 12px solid transparent;
|
border-bottom-color: #ccc;
|
}
|
.tooltip-t.top .t-container .t-fill {
|
bottom: 0;
|
left: 2px;
|
border: 10px solid transparent;
|
border-bottom-color: #fff;
|
}
|
|
/* 在尖头在下方的样式 */
|
.whyc-tooltip .tooltip-t.bottom {
|
bottom: -24px;
|
left: 1em;
|
}
|
.tooltip-t.bottom .t-container .t-border{
|
border: 12px solid transparent;
|
border-top-color: #ccc;
|
}
|
.tooltip-t.bottom .t-container .t-fill {
|
left: 2px;
|
border: 10px solid transparent;
|
border-top-color: #fff;
|
}
|
/* tooltip提示框内容样式设置 */
|
.whyc-tooltip .tooltip-c {
|
min-width: 5em;
|
line-height: 2.3em;
|
text-align: center;
|
padding-left: 1em;
|
padding-right: 1em;
|
padding-top: .2em;
|
padding-bottom: .2em;
|
white-space: nowrap;
|
}
|
/* 字体颜色设置 */
|
.color-success {
|
color: #3146d7 !important;
|
}
|
.color-danger {
|
color: #ff0000 !important;
|
}
|
.color-normal {
|
color: #000000;
|
}
|
|
.layui-nav .layui-nav-item {
|
position: relative;
|
display: inline-block;
|
height: 50px;
|
text-align: center;
|
}
|
.layui-nav .layui-nav-item.active:after {
|
content: "";
|
position: absolute;
|
left: 0;
|
bottom: 0;
|
width: 100%;
|
height: 5px;
|
background-color: #5FB878
|
}
|
.layui-nav-strip {
|
position: absolute;
|
left: 0;
|
bottom: 0;
|
height: 5px;
|
background-color: #5FB878
|
}
|
.layui-nav .layui-nav-item a {
|
display: block;
|
padding: 0 20px;
|
line-height: 50px;
|
color: rgba(255,255,255,.7);
|
text-decoration: none;
|
cursor: pointer;
|
}
|
.layui-nav .layui-nav-item:hover a{
|
color: #fff;
|
}
|
.layui-nav .layui-nav-item.active a{
|
color: #fff;
|
}
|
.graph-container, .graph-content {
|
width: 100%;
|
height: 100%;
|
}
|