czl-screen/js/layui-v2.8.18/layui/css/layNotify.css

763 lines
14 KiB
CSS

[class^=layx-] {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background-color: transparent;
margin: 0;
padding: 0
}
#layx-body.zlayx-body-noscroll {
overflow: hidden !important
}
.layx-flexbox {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}
.layx-flex-row {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-flow: row;
-ms-flex-flow: row;
flex-flow: row
}
.layx-flex-row-reverse {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-webkit-flex-flow: row-reverse;
-ms-flex-flow: row-reverse;
flex-flow: row-reverse
}
.layx-flex-column {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-flow: column;
-ms-flex-flow: column;
flex-flow: column
}
.layx-flex-center, .layx-flex-vertical-center {
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center
}
.layx-flex-center {
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center
}
.layx-flex-item {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1
}
#layx-salver-bar {
position: fixed
}
#layx-salver-bar.layx-animate-salver-slide-up {
-webkit-animation-name: layx-animate-salver-slide-up;
animation-name: layx-animate-salver-slide-up
}
#layx-salver-bar.layx-animate-salver-slide-down {
-webkit-animation-name: layx-animate-salver-slide-down;
animation-name: layx-animate-salver-slide-down
}
.layx-salver-button {
position: relative;
overflow: hidden;
background-color: #f1f1f1
}
.layx-salver-button:after {
position: absolute;
content: "";
border-top: 5px solid #ddd;
left: 0;
top: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%
}
.layx-salver-button:hover {
background-color: #e9e9e9
}
.layx-salver-button.layx-salver-button-active {
background-color: #f5f5f5
}
.layx-salver-button.layx-salver-button-active:after {
border-top: 5px solid #3baced
}
.layx-salver-button .layx-icon {
font-size: 20px;
color: #666
}
.layx-salver-button.layx-salver-button-active .layx-icon {
color: #3baced
}
.layx-icon {
width: 1em;
height: 1em;
vertical-align: -.15em;
fill: currentColor;
overflow: hidden;
font-size: 14px;
display: inline-block;
line-height: normal;
pointer-events: none
}
.layx-window {
position: relative;
overflow: hidden
}
.layx-window.layx-window-layer {
position: fixed
}
.layx-window.layx-window-min {
opacity: 0;
display: none
}
.layx-drag-layer {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: transparent;
display: none
}
.layx-drag-layer.layx-drag-layer-active {
display: block
}
.layx-animate {
-webkit-animation-duration: .1s;
animation-duration: .1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both
}
.layx-animate-d3s {
-webkit-animation-duration: .3s;
animation-duration: .3s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both
}
.layx-animate-zoom-show {
-webkit-animation-name: layx-animate-zoom-show;
animation-name: layx-animate-zoom-show
}
.layx-animate-zoom-destroy {
-webkit-animation-name: layx-animate-zoom-destroy;
animation-name: layx-animate-zoom-destroy
}
.layx-animate-zoom-to-min {
-webkit-animation-name: layx-animate-zoom-to-min;
animation-name: layx-animate-zoom-to-min
}
.layx-animate-zoom-drag-to-normal {
-webkit-animation-name: layx-animate-zoom-drag-to-normal;
animation-name: layx-animate-zoom-drag-to-normal
}
.layx-animate-zoom-to-max, .layx-animate-zoom-to-normal {
-webkit-transition-property: left, top, width, height;
transition-property: left, top, width, height;
-webkit-transition-duration: .1s;
transition-duration: .1s;
-webkit-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out
}
@-webkit-keyframes layx-animate-zoom-show {
0% {
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9)
}
}
@keyframes layx-animate-zoom-show {
0% {
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9)
}
}
@-webkit-keyframes layx-animate-zoom-drag-to-normal {
0% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1)
}
}
@keyframes layx-animate-zoom-drag-to-normal {
0% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1)
}
}
@-webkit-keyframes layx-animate-zoom-destroy {
0% {
opacity: 1
}
50% {
opacity: 0
}
to {
opacity: 0;
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9)
}
}
@keyframes layx-animate-zoom-destroy {
0% {
opacity: 1
}
50% {
opacity: 0
}
to {
opacity: 0;
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9)
}
}
@-webkit-keyframes layx-animate-zoom-to-min {
0% {
opacity: 1
}
50% {
opacity: 0
}
to {
opacity: 0;
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9)
}
}
@keyframes layx-animate-zoom-to-min {
0% {
opacity: 1
}
50% {
opacity: 0
}
to {
opacity: 0;
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9)
}
}
@-webkit-keyframes layx-animate-salver-slide-up {
0% {
bottom: -45px
}
to {
bottom: 0
}
}
@keyframes layx-animate-salver-slide-up {
0% {
bottom: -45px
}
to {
bottom: 0
}
}
@-webkit-keyframes layx-animate-salver-slide-down {
0% {
bottom: 0
}
to {
bottom: -45px
}
}
@keyframes layx-animate-salver-slide-down {
0% {
bottom: 0
}
to {
bottom: -45px
}
}
@-webkit-keyframes layx-animate-fade-in-right {
0% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0)
}
to {
opacity: 1;
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
}
@keyframes layx-animate-fade-in-right {
0% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0)
}
to {
opacity: 1;
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
}
@-webkit-keyframes layx-animate-fade-in-right-reverse {
0% {
opacity: 1;
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0)
}
}
@keyframes layx-animate-fade-in-right-reverse {
0% {
opacity: 1;
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0)
}
}
@-webkit-keyframes layx-animate-fade-in-left {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0)
}
to {
opacity: 1;
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
}
@keyframes layx-animate-fade-in-left {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0)
}
to {
opacity: 1;
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
}
@-webkit-keyframes layx-animate-slide-to-top {
0% {
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0)
}
}
@keyframes layx-animate-slide-to-top {
0% {
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
to {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0)
}
}
.layx-parclose {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: transparent
}
.layx-context-menu-bar {
position: fixed;
background-color: #fff;
-webkit-box-shadow: rgba(0, 0, 0, .3) 0 2px 5px;
box-shadow: 0 2px 5px rgba(0, 0, 0, .3);
border: 1px solid #d5d5d5;
width: 180px;
max-width: 240px;
display: none
}
.layx-context-menu-bar.layx-context-menu-bar-active {
display: block
}
.layx-context-menu-button:hover {
background-color: #e9e9e9
}
.layx-context-menu-button-label {
padding-left: 10px;
display: inline-block;
font-size: 13px;
color: #444
}
.layx-context-menu-more {
color: #999;
padding: 0 5px
}
.layx-resize-bar > [class^=layx-resize-item-] {
position: absolute;
z-index: 3;
overflow: hidden;
-ms-touch-action: none;
touch-action: none
}
.layx-resize-item-bottom, .layx-resize-item-top {
height: 6px;
left: 6px;
right: 6px
}
.layx-resize-item-top {
top: 0;
cursor: n-resize
}
.layx-resize-item-bottom {
bottom: 0;
cursor: s-resize
}
.layx-resize-item-left, .layx-resize-item-right {
width: 6px;
top: 6px;
bottom: 6px
}
.layx-resize-item-left {
left: 0;
cursor: w-resize
}
.layx-resize-item-right {
right: 0;
cursor: e-resize
}
.layx-resize-item-left-bottom, .layx-resize-item-left-top, .layx-resize-item-right-bottom, .layx-resize-item-right-top {
width: 6px;
height: 6px
}
.layx-resize-item-left-top {
left: 0;
top: 0;
cursor: nw-resize
}
.layx-resize-item-right-top {
right: 0;
top: 0;
cursor: ne-resize
}
.layx-resize-item-left-bottom {
left: 0;
bottom: 0;
cursor: sw-resize
}
.layx-resize-item-right-bottom {
right: 0;
bottom: 0;
cursor: se-resize
}
.layx-resize-bar.layx-resize-bar-disabled > [class^=layx-resize-item-] {
cursor: default !important
}
.layx-tool-bar {
-ms-touch-action: none;
touch-action: none;
-webkit-overflow-scrolling: touch
}
.layx-action-button {
text-align: center
}
.layx-action-button:hover {
background-color: #e5e5e5
}
.layx-action-button.layx-action-button-destroy:hover {
background-color: #e81123;
color: #fff
}
.layx-action-button.layx-action-button-hidden {
display: none;
pointer-events: none
}
.layx-title-bar {
min-width: 0;
padding: 0 5px
}
.layx-window-title {
font-size: 14px;
min-width: 0;
line-height: 0
}
.layx-window-title .layx-window-title-label {
display: inline-block;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
max-width: 100%;
word-wrap: break-word;
line-height: normal
}
.layx-title-bar .layx-window-icon {
margin-right: 5px
}
.layx-top-menu-bar {
min-height: 25px;
background: #fff
}
.layx-top-menu-button {
float: left;
padding: 0 8px;
line-height: 25px
}
.layx-top-menu-button-label {
display: inline-block;
font-size: 13px;
color: #444
}
.layx-top-menu-button.layx-top-menu-button-active, .layx-top-menu-button:hover {
background-color: #e9e9e9
}
.layx-content-container {
width: 100%;
position: relative;
overflow: auto;
font-size: 14px;
opacity: 1
}
.layx-html-content {
-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
user-select: text
}
.layx-content-penetrate {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: 2;
background: transparent;
visibility: hidden
}
.layx-content-penetrate.layx-content-penetrate-active {
visibility: visible
}
.layx-content-container.layx-content-container-fade-out {
opacity: 0
}
.layx-url-content {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1
}
.layx-notice {
position: fixed;
margin-bottom: 10px;
padding: 16px;
-webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, .2);
box-shadow: 0 1px 6px rgba(0, 0, 0, .2);
background: #fff;
width: 320px;
right: 24px;
overflow: hidden
}
.layx-notice.layx-animate-fade-in-right {
-webkit-animation-name: layx-animate-fade-in-right;
animation-name: layx-animate-fade-in-right
}
.layx-notice.layx-animate-fade-in-right-reverse {
-webkit-animation-name: layx-animate-fade-in-right-reverse;
animation-name: layx-animate-fade-in-right-reverse
}
.layx-notice.layx-animate-slide-to-top {
-webkit-animation-name: layx-animate-slide-to-top;
animation-name: layx-animate-slide-to-top
}
.layx-notice-close-button {
position: absolute;
top: 10px;
right: 10px;
z-index: 1;
width: 16px;
height: 16px;
border-radius: 50%;
cursor: pointer
}
.layx-notice-close-button .layx-icon {
font-size: 10px
}
.layx-notice-close-button:hover {
background-color: #e81123
}
.layx-notice-close-button:hover .layx-icon {
color: #fff
}
.layx-notice-icon {
margin-right: 16px
}
.layx-notice-icon .layx-icon {
font-size: 26px
}
.layx-notice-title {
font-weight: 700;
margin-bottom: 8px;
font-size: 14px;
line-height: 17px;
color: #17233d;
white-space: nowrap
}
.layx-notice-content {
font-size: 13px;
color: #515a6e;
line-height: 1.5
}
.layx-notice-time {
font-size: 10px;
color: #999;
text-align: right;
margin-top: 8px
}
.layx-notice-process {
position: absolute;
left: 0;
bottom: 0;
height: 2px;
z-index: 1;
background: #dedede;
width: 0
}
.layx-notice-info {
color: #909399
}
.layx-notice-success {
color: #1890ff
}
.layx-notice-warning {
color: #ff9900
}
.layx-notice-error {
color: #fa3534
}
.layx-statu-bar {
position: relative;
font-size: 13px
}