Mastodon
/
Sengi-Windows-MacOS-Linux
mirror of https://github.com/NicolasConstant/sengi
1
0
Fork 0
Code Issues Releases Wiki Activity

better column display for scrolling capabilities

This commit is contained in:
Nicolas Constant 2018-09-12 00:11:01 -04:00
parent afe9578deb
commit 4639f0076f
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
3 changed files with 26 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/components/stream/stream.component.html
View File

@ -1,8 +1,8 @@
<div id="mam-stream-column">
<div id="mam-stream-header">
<div class="stream-column">
<div class="stream-column__stream-header">
<a href title="return to top" (click)="goToTop()"><h1>{{ stream.streamName.toUpperCase() }}</h1></a>
</div>
<div id="mam-stream-toots" data-simplebar>
<div class="stream-toots" data-simplebar>
<div *ngFor="let toot of toots">
<app-toot [toot]="toot"></app-toot>
</div>

43
src/app/components/stream/stream.component.scss
View File

@ -1,34 +1,31 @@
#mam-stream-column {
width: 320px; /*320*/
@import "variables";
.stream-column {
width: $stream-column-width;
height: calc(100%);
background-color: #090b10;
background-color: #0f111a;
margin: 0 0 0 $stream-column-separator;
outline: 1px dotted greenyellow;
}
#mam-stream-header {
width: calc(100%);
height: 30px;
background-color: black;
&__stream-header {
width: calc(100%);
height: 30px;
border-bottom: 1px solid black;
background-color: black;
border-bottom: 1px solid black;
& h1 {
color: whitesmoke;
font-size: 0.8em;
font-weight: normal;
margin: 0;
padding: 8px 0 0 10px;
}
}
}
#mam-stream-header h1 {
color: whitesmoke;
font-size: 0.8em;
font-weight: normal;
margin: 0;
padding: 8px 0 0 10px;
}
#mam-stream-toots {
.stream-toots {
height: calc(100% - 30px);
width: 320px;
overflow: auto;
}

5
src/app/pages/streams-main-display/streams-main-display.component.scss
View File

@ -6,12 +6,13 @@
overflow-y: hidden;
&__stream-column {
height: calc(100%);
width: $stream-column-width;
width: $stream-column-width + $stream-column-separator;
display: inline-block;
overflow-x: hidden;
overflow-y: hidden;
white-space: normal;
margin: 0 0 0 $stream-column-separator;
// margin: 0 0 0 $stream-column-separator;
margin: 0;
}
}