schnabu/maputnik
1
0
Fork 0
mirror of https://github.com/a-nyx/maputnik-with-pmtiles.git synced 2024-12-30 21:50:32 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #165 from gregorywolanski/master

Browse source 
Modal scrolling #156
This commit is contained in:
Orange Mug 2017-10-12 10:29:07 +01:00 committed by GitHub
commit 232b48ff62
2 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/modals/Modal.jsx
View file

@ -21,8 +21,10 @@ class Modal extends React.Component {
<CloseIcon /> <CloseIcon />
</a> </a>
</header> </header>
<div className="maputnik-modal-scroller">
<div className="maputnik-modal-content">{this.props.children}</div> <div className="maputnik-modal-content">{this.props.children}</div>
</div> </div>
</div>
</Overlay> </Overlay>
} }
} }

8
src/styles/_modal.scss
View file

@ -2,6 +2,7 @@
.maputnik-modal { .maputnik-modal {
min-width: 350px; min-width: 350px;
max-width: 600px; max-width: 600px;
overflow: hidden;
background-color: $color-black; background-color: $color-black;
box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3); box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
z-index: 3; z-index: 3;
@ -39,9 +40,13 @@
cursor: pointer; cursor: pointer;
} }
.maputnik-modal-scroller {
max-height: calc(100vh - 35px);
overflow-y: auto;
}
.maputnik-modal-content { .maputnik-modal-content {
padding: $margin-3; padding: $margin-3;
max-height: 90vh;
@include flex-column; @include flex-column;
} }
@ -80,7 +85,6 @@
} }
.maputnik-style-gallery-container { .maputnik-style-gallery-container {
overflow-y: scroll;
flex-shrink: 1; flex-shrink: 1;
} }