diff --git a/css/80_app.css b/css/80_app.css index d4e99ea4d..6ec3b8572 100644 --- a/css/80_app.css +++ b/css/80_app.css @@ -4464,52 +4464,35 @@ img.tile-debug { /* Footer - About, Source Switcher ------------------------------------------------------- */ .map-footer-bar .info-block { - flex: 1 1 auto; + flex: 1 1 100%; + overflow: hidden; } .map-footer-list { - text-align: right; - margin-right: 10px; display: flex; - flex-direction: row-reverse; - flex-wrap: wrap; + flex-flow: row nowrap; position: relative; height: 100%; -} -.ideditor[dir='rtl'] .map-footer-list { - text-align: left; - margin-left: 10px; - margin-right: 0; + justify-content: flex-end; } .map-footer-list li { - border-left: 1px solid rgba(255,255,255,.5); - padding: 5px 0 5px 5px; - margin-left: 5px; height: 100%; display: flex; align-items: center; + white-space: nowrap; + padding: 5px; } -.ideditor[dir='rtl'] .map-footer-list li { - border-left: none; +.ideditor[dir='ltr'] .map-footer-list li:not(:last-child) { border-right: 1px solid rgba(255,255,255,.5); - margin-left: 0; - margin-right: 5px; - padding: 5px 5px 5px 0; +} +.ideditor[dir='rtl'] .map-footer-list li:not(:last-child) { + border-left: 1px solid rgba(255,255,255,.5); } .map-footer-list li:empty { display: none; } -.map-footer-list li:last-child { - border-left: 0; - margin-left: 0; - padding-left: 0; -} -.ideditor[dir='rtl'] .map-footer-list li:last-child { - border-right: none; -} - .map-footer-list a.chip { padding: 1px 4px 1px 4px; border-radius: 2px; diff --git a/modules/ui/account.js b/modules/ui/account.js index 91ab09fcd..2bc627e02 100644 --- a/modules/ui/account.js +++ b/modules/ui/account.js @@ -62,14 +62,15 @@ export function uiAccount(context) { return function(selection) { - selection.append('li') - .attr('class', 'logoutLink') - .classed('hide', true); selection.append('li') .attr('class', 'userLink') .classed('hide', true); + selection.append('li') + .attr('class', 'logoutLink') + .classed('hide', true); + if (osm) { osm.on('change.account', function() { update(selection); }); update(selection); diff --git a/modules/ui/init.js b/modules/ui/init.js index 3422e8d99..05bf29768 100644 --- a/modules/ui/init.js +++ b/modules/ui/init.js @@ -268,15 +268,30 @@ export function uiInit(context) { .append('ul') .attr('class', 'map-footer-list'); - if (!context.embed()) { + aboutList + .append('li') + .attr('class', 'user-list') + .call(uiContributors(context)); + + var apiConnections = context.apiConnections(); + if (apiConnections && apiConnections.length > 1) { aboutList - .call(uiAccount(context)); + .append('li') + .attr('class', 'source-switch') + .call(uiSourceSwitch(context) + .keys(apiConnections) + ); } aboutList .append('li') - .attr('class', 'version') - .call(uiVersion(context)); + .attr('class', 'issues-info') + .call(uiIssuesInfo(context)); + + aboutList + .append('li') + .attr('class', 'feature-warning') + .call(uiFeatureInfo(context)); var issueLinks = aboutList .append('li'); @@ -297,29 +312,14 @@ export function uiInit(context) { aboutList .append('li') - .attr('class', 'feature-warning') - .call(uiFeatureInfo(context)); + .attr('class', 'version') + .call(uiVersion(context)); - aboutList - .append('li') - .attr('class', 'issues-info') - .call(uiIssuesInfo(context)); - - var apiConnections = context.apiConnections(); - if (apiConnections && apiConnections.length > 1) { + if (!context.embed()) { aboutList - .append('li') - .attr('class', 'source-switch') - .call(uiSourceSwitch(context) - .keys(apiConnections) - ); + .call(uiAccount(context)); } - aboutList - .append('li') - .attr('class', 'user-list') - .call(uiContributors(context)); - // Setup map dimensions and move map to initial center/zoom. // This should happen after .main-content and toolbars exist.