diff --git a/umap/static/umap/img/16-white.svg b/umap/static/umap/img/16-white.svg index 8cf99581..2d484d8a 100644 --- a/umap/static/umap/img/16-white.svg +++ b/umap/static/umap/img/16-white.svg @@ -33,9 +33,6 @@ - - -   @@ -147,5 +144,6 @@ + diff --git a/umap/static/umap/img/source/16-white.svg b/umap/static/umap/img/source/16-white.svg index 1daaa9ea..269d82e4 100644 --- a/umap/static/umap/img/source/16-white.svg +++ b/umap/static/umap/img/source/16-white.svg @@ -1,14 +1,14 @@ - + - - + + @@ -50,9 +50,6 @@ - - -   @@ -167,5 +164,6 @@ + diff --git a/umap/static/umap/js/umap.controls.js b/umap/static/umap/js/umap.controls.js index 09588575..b5d729d9 100644 --- a/umap/static/umap/js/umap.controls.js +++ b/umap/static/umap/js/umap.controls.js @@ -995,16 +995,6 @@ L.U.Map.include({ name.href = '#' share_status.href = '#' logo.href = '/' - if (this.options.user) { - const userLabel = L.DomUtil.add( - 'a', - 'umap-user', - container, - L._(`My Dashboard ({username})`, { username: this.options.user.name }) - ) - userLabel.href = this.options.user.url - } - this.help.button(container, 'edit') L.DomEvent.on(name, 'click', this.edit, this) L.DomEvent.on(share_status, 'click', this.permissions.edit, this.permissions) this.on('postsync', L.bind(update, this)) @@ -1020,6 +1010,16 @@ L.U.Map.include({ disable.href = '#' disable.textContent = L._('Disable editing') disable.title = `${disable.textContent} (Ctrl+E)` + this.help.button(container, 'edit') + if (this.options.user) { + const userLabel = L.DomUtil.add( + 'a', + 'umap-user', + container, + L._(`My Dashboard ({username})`, { username: this.options.user.name }) + ) + userLabel.href = this.options.user.url + } L.DomEvent.addListener(disable, 'click', L.DomEvent.stop).addListener( disable, diff --git a/umap/static/umap/js/umap.core.js b/umap/static/umap/js/umap.core.js index 12917c79..39420847 100644 --- a/umap/static/umap/js/umap.core.js +++ b/umap/static/umap/js/umap.core.js @@ -431,6 +431,7 @@ L.U.Help = L.Class.extend({ button: function (container, entries) { const helpButton = L.DomUtil.create('a', 'umap-help-button', container) helpButton.href = '#' + helpButton.textContent = L._("Help") if (entries) { L.DomEvent.on(helpButton, 'click', L.DomEvent.stop).on( helpButton, diff --git a/umap/static/umap/map.css b/umap/static/umap/map.css index 7fe8e700..a5beae18 100644 --- a/umap/static/umap/map.css +++ b/umap/static/umap/map.css @@ -348,17 +348,8 @@ ul.photon-autocomplete { float: right; } .umap-help-button { - display: inline-block; - width: 16px; - height: 16px; - margin-left: 5px; - background-position: -4px -4px; - background-repeat: no-repeat; - background-image: url('./img/16.svg'); - vertical-align: middle; -} -.dark .umap-help-button { - background-image: url('./img/16-white.svg'); + float: right; + margin-right: 20px; } .umap-help-on .umap-help-box { visibility: visible; @@ -405,30 +396,25 @@ ul.photon-autocomplete { .leaflet-container a.leaflet-control-edit-cancel, .leaflet-container a.leaflet-control-edit-disable { display: block; - height: 36px; - line-height: 36px; - color: #efefef; border: none; font-size: 11px; margin-left: 10px; float: right; -} -.leaflet-container a.leaflet-control-edit-cancel, -.leaflet-container a.leaflet-control-edit-save { + border-radius: 20px; color: #f8f8f8; width: auto; height: 36px; line-height: 36px; min-height: 36px; - padding: 0 10px; + padding: 0 20px; min-width: 100px; } +.leaflet-container a.leaflet-control-edit-disable:before, .leaflet-container a.leaflet-control-edit-save:before, .leaflet-container a.leaflet-control-edit-cancel:before { display: inline-block; width: 24px; height: 24px; - margin-left: 5px; background-position: -50px -122px; background-repeat: no-repeat; background-image: url('./img/16-white.svg'); @@ -436,7 +422,14 @@ ul.photon-autocomplete { content: ' '; } .leaflet-container a.leaflet-control-edit-save:before { - background-position: -4px -25px; + background-position: -2px -25px; +} +.leaflet-container a.leaflet-control-edit-disable:before { + background-position: -28px -1px; +} +.leaflet-container a.leaflet-control-edit-cancel, +.leaflet-container a.leaflet-control-edit-disable { + border: 1px solid #555; } .leaflet-container a.leaflet-control-edit-save { opacity: 0.5; @@ -507,6 +500,15 @@ ul.photon-autocomplete { margin-right: 5px; font-weight: bold; } +a.map-name:after { + content: '\00a0'; + padding-left: 3px; + width: 5px; + display: inline-block; +} +.umap-is-dirty a.map-name:after { + content: '*'; +} .umap-main-edit-toolbox .share-status { margin: 0 20px; } @@ -522,6 +524,11 @@ ul.photon-autocomplete { } .umap-main-edit-toolbox .umap-user { margin-right: 20px; + float: right; +} +.umap-main-edit-toolbox .umap-user:after { + content: '|'; + padding-left: 20px; } .umap-edit-enabled .leaflet-top { top: 48px; @@ -1470,20 +1477,30 @@ a.add-datalayer:hover, @media all and (max-width: 980px) { .leaflet-container a.leaflet-control-edit-save, + .leaflet-container a.leaflet-control-edit-disable, .leaflet-container a.leaflet-control-edit-cancel { - text-indent: calc(100% - 20px); + text-indent: calc(100% - 10px); width: 35px; min-width: initial; } - .umap-main-edit-toolbox .umap-help-button, - .umap-main-edit-toolbox .share-status { + .umap-main-edit-toolbox .umap-help-button { + display: none; + } + .umap-main-edit-toolbox .umap-user { + margin-right: 10px; + } + .umap-main-edit-toolbox .umap-user:after { display: none; } } @media all and (max-width: 480px) { + .umap-main-edit-toolbox .share-status { + display: none; + } + .umap-main-edit-toolbox .map-name { max-width: 100px; }