@insaic/neon
Version:
A Mobile UI Components built on Vue
51 lines (49 loc) • 1.11 kB
CSS
@charset "UTF-8";
/*依赖 base 里的动画*/
.sq-notice-bar {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
height: 30px;
background: #4a4c5b;
color: #fffefe;
line-height: 1.5;
padding: 8px 15px;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-sizing: border-box;
box-sizing: border-box;
font-size: 0;
}
.sq-notice-bar-icon {
max-width: 20px;
margin-right: 5px;
}
.sq-notice-bar-content {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
font-size: 12px;
overflow: hidden;
}
.sq-notice-bar-text {
position: relative;
white-space: nowrap;
display: inline-block;
}
.sq-notice-bar-move {
-webkit-animation: move linear both;
animation: move linear both;
}
.sq-notice-bar-move-infinite {
-webkit-animation: move-infinite linear infinite both;
animation: move-infinite linear infinite both;
}
.sq-notice-bar-close {
max-width: 20px;
margin-left: 5px;
}