ashatora/editor
1
0
Fork 0
mirror of https://github.com/maputnik/editor.git synced 2026-06-09 16:57:26 +00:00
Code Issues Projects Releases Wiki Activity

Styling fixes for firefox.

Browse Source
This commit is contained in:
orangemug
2017-04-02 16:01:56 +01:00
parent 0d4449b9c2
commit 396022e8ea
3 changed files with 17 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/modals/OpenModal.jsx
+1 -1
View File
@@ -132,7 +132,7 @@ class OpenModal extends React.Component {
<Button className="maputnik-upload-button"><FileUploadIcon /> Upload</Button> <Button className="maputnik-upload-button"><FileUploadIcon /> Upload</Button>
</FileReaderInput> </FileReaderInput>
</section> </section>
<section className="maputnik-modal-section"> <section className="maputnik-modal-section maputnik-modal-section--shrink">
<h2>Gallery Styles</h2> <h2>Gallery Styles</h2>
<p> <p>
Open one of the publicly available styles to start from. Open one of the publicly available styles to start from.
src/styles/_mixins.scss
+7
View File
@@ -12,3 +12,10 @@
@include vendor-prefix(flex-direction, row); @include vendor-prefix(flex-direction, row);
} }
@mixin flex-column {
display: flex;
display: -ms-flexbox;
@include vendor-prefix(flex-direction, column);
}
src/styles/_modal.scss
+9 -6
View File
@@ -10,12 +10,15 @@
.maputnik-modal-section { .maputnik-modal-section {
padding-top: $margin-3; padding-top: $margin-3;
padding-bottom: $margin-3; padding-bottom: $margin-3;
display: flex; @include flex-column;
flex-direction: column; flex-direction: column;
flex-shrink: 0;
/* Bug fix: <http://stackoverflow.com/questions/28636832/firefox-overflow-y-not-working-with-nested-flexbox> */
min-height: 0;
} }
.maputnik-modal-section--fill { .maputnik-modal-section--shrink {
flex: 1 1; flex-shrink: 1;
} }
.maputnik-modal-header { .maputnik-modal-header {
@@ -36,7 +39,7 @@
.maputnik-modal-content { .maputnik-modal-content {
padding: $margin-3; padding: $margin-3;
display: flex; @include flex-column;
flex-direction: column; flex-direction: column;
max-height: 90vh; max-height: 90vh;
} }
@@ -75,9 +78,8 @@
} }
.maputnik-style-gallery-container { .maputnik-style-gallery-container {
max-height: 400px;
overflow-y: scroll; overflow-y: scroll;
flex: 1; flex-shrink: 1;
} }
.maputnik-public-style { .maputnik-public-style {
@@ -221,6 +223,7 @@
.maputnik-modal-error-close { .maputnik-modal-error-close {
position: absolute; position: absolute;
right: 8px; right: 8px;
top: 8px;
text-decoration: none; text-decoration: none;
color: #ef5350; color: #ef5350;
} }