jam-cloud/web/app/assets/stylesheets/client/react-components/broadcast.scss

110 lines
1.7 KiB
SCSS

@import 'client/common';
#broadcast-notification-holder{
position:absolute;
bottom:0;
width:100%;
.guitar-center-logo img {
left: 25%;
position: relative;
bottom: 20px;
}
}
[data-react-class="BroadcastHolder"], [data-react-class="TopMessageHolder"] {
position:relative;
min-height: 125px;
bottom: 60px;
@include border_box_sizing;
.broadcast-notification {
border-width:1px;
border-color:$ColorScreenPrimary;
border-style:solid;
padding:5px 12px;
height:100%;
width:100%;
left:0;
top:0;
overflow:hidden;
@include border_box_sizing;
&.config {
border-width:0;
}
&.lesson {
p {
text-align:center;
color:$ColorTextTypical;
margin-bottom:10px;
}
.message {
width:100%;
}
}
}
.message {
float:left;
width:calc(100% - 150px);
font-size:12px;
}
.time {
font-size:20px;
color:white;
font-weight:bold;
}
.actions {
float:right;
text-align: right;
vertical-align: middle;
display:inline;
height:100%;
width:150px;
}
.actionsAligner {
display:inline-block;
vertical-align:middle;
text-align:center;
}
a { display:inline-block; }
.button-orange {
font-size:16px;
position:relative;
top:8px;
}
.not-now {
font-size:11px;
top:13px;
position:relative;
}
}
.bn-slidedown-enter {
max-height:0;
opacity: 0.01;
transition: max-height .5s ease-in;
}
.bn-slidedown-enter.bn-slidedown-enter-active {
max-height:60px;
opacity: 1;
}
.bn-slidedown-leave {
max-height:60px;
transition: max-height .5s ease-in;
}
.bn-slidedown-leave.bn-slidedown-leave-active {
max-height:0;
}