diff --git a/css/80_app.css b/css/80_app.css index 08dfca96d..908729b02 100644 --- a/css/80_app.css +++ b/css/80_app.css @@ -507,6 +507,14 @@ button[disabled].action { .ideditor[dir='rtl'] .top-toolbar .toolbar-item:last-child .item-content { margin-left: 10px; } +.ideditor[dir='ltr'] .top-toolbar .toolbar-item:last-child .item-label, +.ideditor[dir='rtl'] .top-toolbar .toolbar-item:first-child .item-label { + padding-right: 5px; +} +.ideditor[dir='ltr'] .top-toolbar .toolbar-item:first-child .item-label, +.ideditor[dir='rtl'] .top-toolbar .toolbar-item:last-child .item-label { + padding-left: 5px; +} .top-toolbar .toolbar-item .item-label { text-align: center; font-size: 11px; @@ -623,15 +631,17 @@ button.add-note svg.icon { border-bottom: 1px solid #ccc; height: 60px; position: relative; + display: flex; + align-items: center; + justify-content: center; } .header h3 { text-align: center; margin-bottom: 0; - white-space: nowrap; text-overflow: ellipsis; overflow: hidden; - padding: 20px; + padding: 0; } .header button, @@ -648,20 +658,14 @@ button.add-note svg.icon { } .field-help-title button.close, -.sidebar-component .header button.data-editor-close, -.sidebar-component .header button.note-editor-close, -.sidebar-component .header button.qa-editor-close, -.entity-editor-pane .header button.preset-close, +.sidebar .header button.close, .preset-list-pane .header button.preset-choose { position: absolute; right: 0; top: 0; } .ideditor[dir='rtl'] .field-help-title button.close, -.ideditor[dir='rtl'] .sidebar-component .header button.data-editor-close, -.ideditor[dir='rtl'] .sidebar-component .header button.note-editor-close, -.ideditor[dir='rtl'] .sidebar-component .header button.qa-editor-close, -.ideditor[dir='rtl'] .entity-editor-pane .header button.preset-close, +.ideditor[dir='rtl'] .sidebar .header button.close, .ideditor[dir='rtl'] .preset-list-pane .header button.preset-choose { left: 0; right: auto; @@ -719,6 +723,10 @@ button.add-note svg.icon { justify-content: space-between; } +.header-block { + display: flex; + align-items: center; +} .header-block-outer { width: 20%; } @@ -726,6 +734,7 @@ button.add-note svg.icon { .header-block-close { display: flex; justify-content: flex-end; + height: 100%; } /* Hide/Toggle collapsable sections (aka Disclosure) @@ -1373,12 +1382,17 @@ a.hide-toggle { overflow: hidden; } .field-label .label-text { + overflow: hidden; + text-overflow: ellipsis; flex: 1 1 auto; padding: 5px 0 5px 10px; } .ideditor[dir='rtl'] .field-label .label-text { padding: 5px 10px 5px 0; } +.field-label .label-text span { + white-space: nowrap; +} .label-text .label-textannotation svg.icon { margin: 0 8px; @@ -4672,16 +4686,12 @@ img.tile-debug { padding: 20px; border-bottom: 1px solid #ccc; } -.modal-section p:not(:last-of-type), -.modal-section ul { +.modal-section p:not(:last-of-type) { padding-bottom: 20px; } .modal-section h4 { padding-bottom: 0; } -.modal-section.header h3 { - padding: 0; -} .modal-section.buttons { text-align: center; } @@ -4701,7 +4711,6 @@ img.tile-debug { display: flex; flex-wrap: wrap; justify-content: space-around; - margin-bottom: 30px; } .save-section .buttons .action, @@ -4966,6 +4975,9 @@ svg.mouseclick use.right { .settings-custom-background .instructions-template p { margin-bottom: 0; } +.settings-custom-background .instructions-template ul { + padding-bottom: 20px; +} .settings-custom-background .instructions-template ul li { list-style-type: disc; list-style-position: inside; diff --git a/modules/ui/commit.js b/modules/ui/commit.js index a0f494952..01271385a 100644 --- a/modules/ui/commit.js +++ b/modules/ui/commit.js @@ -270,7 +270,7 @@ export function uiCommit(context) { saveSection = saveSection.enter() .append('div') - .attr('class','modal-section save-section fillL cf') + .attr('class','modal-section save-section fillL') .merge(saveSection); var prose = saveSection.selectAll('.commit-info') @@ -355,7 +355,7 @@ export function uiCommit(context) { // enter var buttonEnter = buttonSection.enter() .append('div') - .attr('class', 'buttons fillL cf'); + .attr('class', 'buttons fillL'); buttonEnter .append('button') diff --git a/modules/ui/data_editor.js b/modules/ui/data_editor.js index df5370c24..7048f04a2 100644 --- a/modules/ui/data_editor.js +++ b/modules/ui/data_editor.js @@ -25,7 +25,7 @@ export function uiDataEditor(context) { headerEnter .append('button') - .attr('class', 'fr data-editor-close') + .attr('class', 'close') .on('click', function() { context.enter(modeBrowse(context)); }) diff --git a/modules/ui/entity_editor.js b/modules/ui/entity_editor.js index e18387fda..9cb24141e 100644 --- a/modules/ui/entity_editor.js +++ b/modules/ui/entity_editor.js @@ -45,12 +45,12 @@ export function uiEntityEditor(context) { headerEnter .append('button') - .attr('class', 'fl preset-reset preset-choose') + .attr('class', 'preset-reset preset-choose') .call(svgIcon((localizer.textDirection() === 'rtl') ? '#iD-icon-forward' : '#iD-icon-backward')); headerEnter .append('button') - .attr('class', 'fr preset-close') + .attr('class', 'close') .on('click', function() { context.enter(modeBrowse(context)); }) .call(svgIcon(_modified ? '#iD-icon-apply' : '#iD-icon-close')); diff --git a/modules/ui/improveOSM_editor.js b/modules/ui/improveOSM_editor.js index 784a6b815..932f62f74 100644 --- a/modules/ui/improveOSM_editor.js +++ b/modules/ui/improveOSM_editor.js @@ -30,7 +30,7 @@ export function uiImproveOsmEditor(context) { headerEnter .append('button') - .attr('class', 'fr qa-editor-close') + .attr('class', 'close') .on('click', () => context.enter(modeBrowse(context))) .call(svgIcon('#iD-icon-close')); diff --git a/modules/ui/intro/navigation.js b/modules/ui/intro/navigation.js index d34a3b69d..6b9e20b6b 100644 --- a/modules/ui/intro/navigation.js +++ b/modules/ui/intro/navigation.js @@ -356,7 +356,7 @@ export function uiIntroNavigation(context, reveal) { function closeTownHall() { if (!isTownHallSelected()) return clickTownHall(); - var selector = '.entity-editor-pane button.preset-close svg use'; + var selector = '.entity-editor-pane button.close svg use'; var href = d3_select(selector).attr('href') || '#iD-icon-close'; reveal('.entity-editor-pane', @@ -369,7 +369,7 @@ export function uiIntroNavigation(context, reveal) { context.history().on('change.intro', function() { // update the close icon in the tooltip if the user edits something. - var selector = '.entity-editor-pane button.preset-close svg use'; + var selector = '.entity-editor-pane button.close svg use'; var href = d3_select(selector).attr('href') || '#iD-icon-close'; reveal('.entity-editor-pane', @@ -492,7 +492,7 @@ export function uiIntroNavigation(context, reveal) { function editorStreet() { - var selector = '.entity-editor-pane button.preset-close svg use'; + var selector = '.entity-editor-pane button.close svg use'; var href = d3_select(selector).attr('href') || '#iD-icon-close'; reveal('.entity-editor-pane', @@ -509,7 +509,7 @@ export function uiIntroNavigation(context, reveal) { context.history().on('change.intro', function() { // update the close icon in the tooltip if the user edits something. - var selector = '.entity-editor-pane button.preset-close svg use'; + var selector = '.entity-editor-pane button.close svg use'; var href = d3_select(selector).attr('href') || '#iD-icon-close'; reveal('.entity-editor-pane', diff --git a/modules/ui/intro/point.js b/modules/ui/intro/point.js index a5ddcae03..a10c96072 100644 --- a/modules/ui/intro/point.js +++ b/modules/ui/intro/point.js @@ -261,7 +261,7 @@ export function uiIntroPoint(context, reveal) { // reset pane, in case user happened to change it.. context.container().select('.inspector-wrap .panewrap').style('right', '0%'); - var selector = '.entity-editor-pane button.preset-close svg use'; + var selector = '.entity-editor-pane button.close svg use'; var href = d3_select(selector).attr('href') || '#iD-icon-close'; context.on('exit.intro', function() { diff --git a/modules/ui/keepRight_editor.js b/modules/ui/keepRight_editor.js index 4145d98aa..1cf31797e 100644 --- a/modules/ui/keepRight_editor.js +++ b/modules/ui/keepRight_editor.js @@ -29,7 +29,7 @@ export function uiKeepRightEditor(context) { headerEnter .append('button') - .attr('class', 'fr qa-editor-close') + .attr('class', 'close') .on('click', () => context.enter(modeBrowse(context))) .call(svgIcon('#iD-icon-close')); diff --git a/modules/ui/note_editor.js b/modules/ui/note_editor.js index f16a71339..c49dcdfaa 100644 --- a/modules/ui/note_editor.js +++ b/modules/ui/note_editor.js @@ -46,7 +46,7 @@ export function uiNoteEditor(context) { headerEnter .append('button') - .attr('class', 'fr note-editor-close') + .attr('class', 'close') .on('click', function() { context.enter(modeBrowse(context)); }) diff --git a/modules/ui/osmose_editor.js b/modules/ui/osmose_editor.js index 84c36bec1..6423d23c1 100644 --- a/modules/ui/osmose_editor.js +++ b/modules/ui/osmose_editor.js @@ -29,7 +29,7 @@ export function uiOsmoseEditor(context) { headerEnter .append('button') - .attr('class', 'fr qa-editor-close') + .attr('class', 'close') .on('click', () => context.enter(modeBrowse(context))) .call(svgIcon('#iD-icon-close')); diff --git a/modules/ui/success.js b/modules/ui/success.js index f3b62160b..46454d7e2 100644 --- a/modules/ui/success.js +++ b/modules/ui/success.js @@ -72,16 +72,16 @@ export function uiSuccess(context) { .append('div') .attr('class', 'header fillL'); - header - .append('button') - .attr('class', 'fr') - .on('click', () => dispatch.call('cancel')) - .call(svgIcon('#iD-icon-close')); - header .append('h3') .text(t('success.just_edited')); + header + .append('button') + .attr('class', 'close') + .on('click', () => dispatch.call('cancel')) + .call(svgIcon('#iD-icon-close')); + let body = selection .append('div') .attr('class', 'body save-success fillL');