Sengi-Windows-MacOS-Linux/src/app/components/floating-column/floating-column.component.scss

54 lines
939 B
SCSS
Raw Normal View History

2018-09-11 06:54:41 +02:00
@import "variables";
2018-09-11 07:54:23 +02:00
@import "mixins";
2018-09-11 06:54:41 +02:00
2018-11-08 05:53:33 +01:00
2018-09-10 03:55:16 +02:00
.floating-column {
width: calc(100%);
2018-11-08 05:53:33 +01:00
width: $floating-column-size;
2018-09-11 06:54:41 +02:00
background-color: $color-secondary;
overflow: hidden;
2019-02-11 05:10:45 +01:00
z-index: 200;
2018-09-11 06:54:41 +02:00
position: fixed;
top: 0;
bottom: $stream-selector-height;
2018-09-11 07:54:23 +02:00
padding: 0;
white-space: normal;
2018-11-08 05:31:47 +01:00
// &__header {
2018-09-11 07:54:23 +02:00
2018-11-08 05:31:47 +01:00
// }
2018-09-11 07:54:23 +02:00
}
2018-11-08 05:31:47 +01:00
.stream-overlay {
position: absolute;
z-index: 50;
2018-11-08 05:53:33 +01:00
width: $floating-column-size;
2018-11-08 05:31:47 +01:00
height: calc(100%);
}
2018-09-11 07:54:23 +02:00
.close-button {
// display: inline-block;
background-color: $color-primary;
color: darken(white, 30);
border-radius: 999px;
width: 26px;
height: 26px;
text-align: center;
text-decoration: none;
padding: 1px;
z-index: 9999;
float: right;
margin: 10px;
transition: all .2s;
&:hover {
background-color: lighten($color-primary, 20);
color: white;
// transform: scale(1.2);
}
2018-09-10 03:55:16 +02:00
}