blob: bc0483cba4a69f53ed785831a390e7d64e838e1e [file] [log] [blame]
.Frame {
position: relative;
display: flex;
flex-direction: column;
min-width: 0;
word-wrap: break-word;
background-color: #fff;
background-clip: border-box;
border: 1px solid rgba(0, 0, 0, .125);
border-radius: .25rem;
margin-top: 1rem;
}
.Frame.FullScreen {
margin-top: 0;
}
.FrameBody {
transition: all 0.3s;
opacity: 1;
padding: 15px 30px;
}
.FrameBody.NoPadding {
padding: 0 !important;
}
.FrameBody.Contract {
opacity: 0;
height: 0;
padding: 0;
transition: all 0.3s;
}
.FrameHeader {
height: auto;
align-items: center;
background-color: rgba(0, 0, 0, .03);
padding: 10px 10px 10px 30px;
border-bottom: 1px solid rgba(0, 0, 0, .125);
display: flex;
color: #6c757d;
}
.FrameHeaderText {
flex: 1;
}
.FrameButton {
color: gray;
}
.FrameButton:focus {
color: gray;
}
.FrameButton:hover {
color: black;
}
.FrameButton.activate {
color: black;
}
.ButtonArea {
}
.FullScreen {
position: fixed;
left: 0;
top: 0;
width: 100vw;
height: 100vh;
z-index: 12;
display: flex;
flex-direction: column;
}
.FullScreen > .FrameBody {
flex: 1;
}
.FullScreen .NormalChart, .FullScreen .MetaChart {
flex: 1;
}
.Chart {
width: 100%;
display: block;
overflow: hidden;
}
.NormalChart {
@extend .Chart;
height: 417px;
}
.MetaChart {
@extend .Chart;
height: 517px;
}
.FlexContentWrapper {
display: flex;
flex-direction: column;
}
.FlexContentWrapper.DefaultLimitWrapper {
height: 500px;
}
.FullScreen .FlexContentWrapper {
height: 100% !important;
}