Fix to make layer list header visible at all times.

Also improved scrollbar styling/positioning for toolbar and layers list.
This commit is contained in:
orangemug 2020-04-25 11:05:34 +01:00
parent 1d48ab7ecf
commit 4bbe2ce1ea
3 changed files with 8 additions and 3 deletions

View file

@ -2,11 +2,14 @@
.maputnik-layer-list { .maputnik-layer-list {
height: 100%; height: 100%;
overflow: auto; overflow: auto;
display: flex;
flex-direction: column;
&-header { &-header {
padding: $margin-2 $margin-2 $margin-3; padding: $margin-2 $margin-2 $margin-3;
@include flex-row; @include flex-row;
flex: 0 0;
> * { > * {
vertical-align: middle; vertical-align: middle;
@ -25,6 +28,9 @@
padding: 0; padding: 0;
margin: 0; margin: 0;
padding-bottom: $margin-5; padding-bottom: $margin-5;
flex: 1;
overflow-x: hidden;
overflow-y: auto;
} }
&-item-handle { &-item-handle {

View file

@ -1,5 +1,4 @@
// HACK: ::webkit-scrollbar selector covers to much of the UI. Bigger changes to come so for now just use :not() to ignore the toolbar * {
div:not(.maputnik-toolbar__actions) {
&::-webkit-scrollbar { &::-webkit-scrollbar {
background-color: #26282e; background-color: #26282e;
width: 8px; width: 8px;

View file

@ -17,7 +17,7 @@
text-decoration: none; text-decoration: none;
display: block; display: block;
flex: 0 0 190px; flex: 0 0 190px;
width: 190px; width: 200px;
text-align: left; text-align: left;
background-color: $color-black; background-color: $color-black;
padding: $margin-2; padding: $margin-2;