Improve popup and panel layout

This commit is contained in:
Binnette 2020-04-09 00:08:30 +02:00
parent 87ae7d08ae
commit 8b28536bbb
6 changed files with 25 additions and 7 deletions

View file

@ -500,6 +500,17 @@ i.info {
.umap-edit-actions li:hover { .umap-edit-actions li:hover {
background-color: #353c3e; background-color: #353c3e;
} }
.permissions-panel,
.umap-upload,
.umap-share,
.umap-edit-container,
.umap-datalayer-container,
.umap-layer-properties-container,
.umap-footer-container,
.umap-browse-data,
.umap-browse-datalayers {
padding: 0 10px;
}
.umap-form-iconfield { .umap-form-iconfield {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
@ -589,7 +600,7 @@ input[type=hidden].blur + .button {
top: 0; top: 0;
bottom: 0; bottom: 0;
right: -400px; right: -400px;
padding: 0 20px; padding: 0 10px;
border-left: 1px solid #ddd; border-left: 1px solid #ddd;
overflow-x: auto; overflow-x: auto;
z-index: 1010; z-index: 1010;
@ -645,10 +656,10 @@ input[type=hidden].blur + .button {
} }
#umap-ui-container .body { #umap-ui-container .body {
clear: both; clear: both;
height: calc(100% - 46px); /* Minus size of toolbox */ height: calc(100% - 54px); /* Minus size of toolbox */
} }
#umap-ui-container .toolbox { #umap-ui-container .toolbox {
padding: 5px 0; padding: 5px 10px;
overflow: hidden; overflow: hidden;
} }
#umap-ui-container .toolbox li { #umap-ui-container .toolbox li {

View file

@ -85,7 +85,7 @@ L.U.FeatureMixin = {
edit: function(e) { edit: function(e) {
if(!this.map.editEnabled || this.isReadOnly()) return; if(!this.map.editEnabled || this.isReadOnly()) return;
var container = L.DomUtil.create('div'); var container = L.DomUtil.create('div', 'umap-datalayer-container');
var builder = new L.U.FormBuilder(this, ['datalayer'], { var builder = new L.U.FormBuilder(this, ['datalayer'], {
callback: function () {this.edit(e);} // removeLayer step will close the edit panel, let's reopen it callback: function () {this.edit(e);} // removeLayer step will close the edit panel, let's reopen it

View file

@ -1179,7 +1179,7 @@ L.U.Map.include({
edit: function () { edit: function () {
if(!this.editEnabled) return; if(!this.editEnabled) return;
var container = L.DomUtil.create('div'), var container = L.DomUtil.create('div','umap-edit-container'),
metadataFields = [ metadataFields = [
'options.name', 'options.name',
'options.description' 'options.description'

View file

@ -717,7 +717,7 @@ L.U.DataLayer = L.Evented.extend({
edit: function () { edit: function () {
if(!this.map.editEnabled || !this.isLoaded()) {return;} if(!this.map.editEnabled || !this.isLoaded()) {return;}
var container = L.DomUtil.create('div'), var container = L.DomUtil.create('div', 'umap-layer-properties-container'),
metadataFields = [ metadataFields = [
'options.name', 'options.name',
'options.description', 'options.description',

View file

@ -107,7 +107,8 @@ L.U.PopupTemplate.Default = L.Class.extend({
renderFooter: function () { renderFooter: function () {
if (this.feature.hasPopupFooter()) { if (this.feature.hasPopupFooter()) {
var footer = L.DomUtil.create('ul', 'umap-popup-footer', this.container), var footerContainer = L.DomUtil.create('div', 'umap-footer-container', this.container),
footer = L.DomUtil.create('ul', 'umap-popup-footer', footerContainer),
previousLi = L.DomUtil.create('li', 'previous', footer), previousLi = L.DomUtil.create('li', 'previous', footer),
zoomLi = L.DomUtil.create('li', 'zoom', footer), zoomLi = L.DomUtil.create('li', 'zoom', footer),
nextLi = L.DomUtil.create('li', 'next', footer), nextLi = L.DomUtil.create('li', 'next', footer),

View file

@ -881,6 +881,7 @@ a.add-datalayer:hover,
} }
.umap-caption { .umap-caption {
background-position: -170px -52px; background-position: -170px -52px;
padding: 0 10px;
} }
/* ********************************* */ /* ********************************* */
@ -1286,12 +1287,15 @@ a.add-datalayer:hover,
overflow-x: hidden; overflow-x: hidden;
margin-bottom: 4px; margin-bottom: 4px;
display: flex; display: flex;
flex-direction: column;
} }
.umap-popup-content iframe { .umap-popup-content iframe {
min-width: 310px; min-width: 310px;
} }
.umap-popup-container { .umap-popup-container {
flex-grow: 1; flex-grow: 1;
text-align: justify;
padding: 0 10px;
} }
.leaflet-popup-content h3 { .leaflet-popup-content h3 {
margin-bottom: 0; margin-bottom: 0;
@ -1310,6 +1314,7 @@ a.add-datalayer:hover,
} }
.umap-popup-content img { .umap-popup-content img {
max-width: 300px !important; max-width: 300px !important;
width: 100%;
} }
.umap-popup-large iframe, .umap-popup-large iframe,
.umap-popup-large img { .umap-popup-large img {
@ -1318,6 +1323,7 @@ a.add-datalayer:hover,
} }
#umap-ui-container .umap-popup-content img { #umap-ui-container .umap-popup-content img {
max-width: 400px !important; max-width: 400px !important;
width: 100%
} }
.umap-georss-link .popup-title { .umap-georss-link .popup-title {
text-align: center; text-align: center;