Merge pull request #1349 from umap-project/toggle-attribution
Hide attribution on small screen and add a small ? to display it
This commit is contained in:
commit
c2feba1df0
2 changed files with 34 additions and 5 deletions
|
@ -1131,34 +1131,39 @@ L.U.AttributionControl = L.Control.Attribution.extend({
|
|||
|
||||
_update: function () {
|
||||
L.Control.Attribution.prototype._update.call(this)
|
||||
// Use our how container, so we can hide/show on small screens
|
||||
const credits = this._container.innerHTML
|
||||
this._container.innerHTML = ''
|
||||
const container = L.DomUtil.add('div', 'attribution-container', this._container, credits)
|
||||
if (this._map.options.shortCredit) {
|
||||
L.DomUtil.add(
|
||||
'span',
|
||||
'',
|
||||
this._container,
|
||||
container,
|
||||
` — ${L.Util.toHTML(this._map.options.shortCredit)}`
|
||||
)
|
||||
}
|
||||
if (this._map.options.captionMenus) {
|
||||
const link = L.DomUtil.add('a', '', this._container, ` — ${L._('About')}`)
|
||||
const link = L.DomUtil.add('a', '', container, ` — ${L._('About')}`)
|
||||
L.DomEvent.on(link, 'click', L.DomEvent.stop)
|
||||
.on(link, 'click', this._map.displayCaption, this._map)
|
||||
.on(link, 'dblclick', L.DomEvent.stop)
|
||||
}
|
||||
if (window.top === window.self && this._map.options.captionMenus) {
|
||||
// We are not in iframe mode
|
||||
const home = L.DomUtil.add('a', '', this._container, ` — ${L._('Home')}`)
|
||||
const home = L.DomUtil.add('a', '', container, ` — ${L._('Home')}`)
|
||||
home.href = '/'
|
||||
}
|
||||
if (this._map.options.captionMenus) {
|
||||
const poweredBy = L.DomUtil.add(
|
||||
'a',
|
||||
'',
|
||||
this._container,
|
||||
container,
|
||||
` — ${L._('Powered by uMap')}`
|
||||
)
|
||||
poweredBy.href = 'https://github.com/umap-project/umap/'
|
||||
}
|
||||
L.DomUtil.create('a', 'attribution-toggle', this._container)
|
||||
},
|
||||
})
|
||||
|
||||
|
|
|
@ -147,7 +147,14 @@ a.umap-control-less {
|
|||
margin-bottom: 5px!important;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.attribution-toggle {
|
||||
display: none;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
vertical-align: middle;
|
||||
background-image: url('./img/16.svg');
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
@ -1542,6 +1549,23 @@ a.add-datalayer:hover,
|
|||
.umap-popup-large .umap-popup-content {
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.attribution-toggle {
|
||||
display: inline-block;
|
||||
}
|
||||
.attribution-container {
|
||||
display: none;
|
||||
}
|
||||
.leaflet-control-attribution:active .attribution-container,
|
||||
.leaflet-control-attribution:hover .attribution-container {
|
||||
display: inline;
|
||||
background-color: #fff;
|
||||
}
|
||||
.leaflet-control-attribution:hover .attribution-toggle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
/* ****** */
|
||||
|
|
Loading…
Reference in a new issue