@ohu-mobile/core
Version:
61 lines • 1.14 kB
CSS
.ohu-notice-bar {
box-sizing: border-box;
position: relative;
padding: 10px 30px;
font-size: 28px;
}
.ohu-notice-bar.is-default {
background: #FEFCEB;
color: #ff9434;
}
.ohu-notice-bar.is-warning {
background: #FFF1F2;
color: #ff2d31;
}
.ohu-notice-bar.has-icon {
padding-left: 80px;
}
.ohu-notice-bar.has-action {
padding-right: 80px;
}
.ohu-notice-bar__icon {
font-size: 1.4em;
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 10px;
width: 48px;
height: 48px;
display: flex;
align-items: center;
justify-content: center;
}
.ohu-notice-bar__text {
line-height: 1.43em;
}
.ohu-notice-bar__text.is-wrap div {
word-wrap: break-word;
white-space: pre-wrap;
word-break: break-word;
}
.ohu-notice-bar__text.is-inline {
overflow: hidden;
}
.ohu-notice-bar__text.is-inline div {
white-space: nowrap;
}
.ohu-notice-bar__text div {
display: inline-block;
}
.ohu-notice-bar__action {
font-size: 1.4em;
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 10px;
width: 48px;
height: 48px;
display: flex;
align-items: center;
justify-content: center;
}