diff --git a/src/app/components/floating-column/floating-column.component.html b/src/app/components/floating-column/floating-column.component.html index 1c025ef4..5ca55e4d 100644 --- a/src/app/components/floating-column/floating-column.component.html +++ b/src/app/components/floating-column/floating-column.component.html @@ -1,11 +1,13 @@
-
- x -
+ - - - - - +
+ x +
+ + + + + +
\ No newline at end of file diff --git a/src/app/components/floating-column/floating-column.component.scss b/src/app/components/floating-column/floating-column.component.scss index bef2a731..0a6a161e 100644 --- a/src/app/components/floating-column/floating-column.component.scss +++ b/src/app/components/floating-column/floating-column.component.scss @@ -3,7 +3,7 @@ .floating-column { width: calc(100%); - max-width: 330px; + width: 330px; background-color: $color-secondary; overflow: hidden; @@ -13,12 +13,26 @@ bottom: $stream-selector-height; padding: 0; - &__header { + // &__header { - // @include clearfix; - } + // } } +.stream-overlay { + // margin-left: 5px; + // z-index: 50; + // opacity: 0.5; + + position: absolute; + // left: 10px; + + z-index: 50; + // width: $stream-column-width; + width: 330px; + height: calc(100%); + + outline: 1px +} .close-button { // display: inline-block; diff --git a/src/app/components/floating-column/floating-column.component.ts b/src/app/components/floating-column/floating-column.component.ts index 76ba73ad..d4c729e0 100644 --- a/src/app/components/floating-column/floating-column.component.ts +++ b/src/app/components/floating-column/floating-column.component.ts @@ -8,6 +8,7 @@ import { AccountWrapper } from '../../models/account.models'; styleUrls: ['./floating-column.component.scss'] }) export class FloatingColumnComponent implements OnInit { + overlayActive: boolean; userAccountUsed: AccountWrapper; openPanel: string; @@ -48,4 +49,9 @@ export class FloatingColumnComponent implements OnInit { return false; } + closeOverlay(): boolean { + this.overlayActive = false; + return false; + } + } diff --git a/src/app/components/stream/stream-overlay/stream-overlay.component.scss b/src/app/components/stream/stream-overlay/stream-overlay.component.scss index ba1ee222..429a88f3 100644 --- a/src/app/components/stream/stream-overlay/stream-overlay.component.scss +++ b/src/app/components/stream/stream-overlay/stream-overlay.component.scss @@ -1,13 +1,9 @@ @import "variables"; @import "commons"; .stream-overlay { - // position: absolute; - // z-index: 50; - width: $stream-column-width; + // width: $stream-column-width; height: calc(100%); - background-color: $column-color; // margin: 0 0 0 $stream-column-separator; - // outline: 1px red solid; - // float: left; + background-color: $column-color; &__header { width: calc(100%); height: 30px; @@ -16,7 +12,7 @@ & a { color: whitesmoke; font-size: 0.8em; - font-weight: normal; // margin: 0; + font-weight: normal; } } &__title { diff --git a/src/app/components/stream/stream.component.scss b/src/app/components/stream/stream.component.scss index a324fad4..aeb3219c 100644 --- a/src/app/components/stream/stream.component.scss +++ b/src/app/components/stream/stream.component.scss @@ -32,74 +32,10 @@ } } -// .flexcroll { -// scrollbar-face-color: #08090d; -// scrollbar-shadow-color: #08090d; -// scrollbar-highlight-color: #08090d; -// scrollbar-3dlight-color: #08090d; -// scrollbar-darkshadow-color: #08090d; -// scrollbar-track-color: #08090d; -// scrollbar-arrow-color: #08090d; -// &::-webkit-scrollbar { -// width: 7px; -// } -// &::-webkit-scrollbar-thumb { -// -webkit-border-radius: 0px; -// border-radius: 0px; -// // background: #08090d; -// background: lighten($color-primary, 5); -// // -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.5); -// } -// } - .stream-overlay { position: absolute; z-index: 50; width: $stream-column-width; height: calc(100%); - - // background-color: rgba(#ff0000, 0.3); - // // margin: 0 0 0 $stream-column-separator; - // // outline: 1px red solid; - // // float: left; - // &__header { - // width: calc(100%); - // height: 30px; - // background-color: $column-header-background-color; - // padding: 6px 10px 0 10px; - // & a { - // color: whitesmoke; - // font-size: 0.8em; - // font-weight: normal; - // margin: 0; - // } - // } - - // &__title { - // width: calc(100%); - // height: 30px; - // background-color: $column-header-background-color; - // border-top: 1px solid whitesmoke; - // border-bottom: 1px solid whitesmoke; - // padding: 3px 10px 0 10px; - // } -} - -// .overlay-previous { -// display: block; -// float: left; -// } - - -// .overlay-next { -// display: block; -// float: right; -// padding-right: 20px; -// } - - -// .overlay-close { -// display: block; -// float: right; -// } \ No newline at end of file +} \ No newline at end of file