55 lines
1.1 KiB
Plaintext
55 lines
1.1 KiB
Plaintext
:global {
|
|
@vertical-board-prefix: vertical-board;
|
|
|
|
.@{vertical-board-prefix} {
|
|
width : 100%;
|
|
height: 100%;
|
|
|
|
&.fullscreen {
|
|
.@{vertical-board-prefix}__left {
|
|
width: 100%;
|
|
|
|
.@{vertical-board-prefix}__left-top {
|
|
height: 100%;
|
|
}
|
|
|
|
.@{vertical-board-prefix}__left-bottom {
|
|
height: 0;
|
|
}
|
|
}
|
|
|
|
.@{vertical-board-prefix}__right {
|
|
width: 0;
|
|
}
|
|
}
|
|
|
|
&__left {
|
|
float : left;
|
|
width : ~'calc(100% - 270px + 4px)';
|
|
height : ~'calc(100% + 8px)';
|
|
margin : -4px 0 -4px -4px;
|
|
transition: width 0.4s ease;
|
|
|
|
&-top {
|
|
width : 100%;
|
|
height : 55%;
|
|
transition: height 0.4s ease;
|
|
}
|
|
|
|
&-bottom {
|
|
width : 100%;
|
|
height : 45%;
|
|
transition: height 0.4s ease;
|
|
}
|
|
}
|
|
|
|
&__right {
|
|
float : right;
|
|
width : 270px;
|
|
height : ~'calc(100% + 8px)';
|
|
margin : -4px 0;
|
|
overflow : hidden;
|
|
transition: width 0.4s ease;
|
|
}
|
|
}
|
|
} |