diff --git a/css/app.css b/css/app.css index ae9bf59a0..408813aca 100644 --- a/css/app.css +++ b/css/app.css @@ -526,7 +526,7 @@ button.save.has-count .count::before { } .icon.pre-text { - margin-right: 3px; + margin-right: 5px; } .icon.light { @@ -3481,7 +3481,7 @@ img.tile-removing { } [dir='rtl'] .icon.pre-text { - margin-left: 3px; + margin-left: 5px; margin-right: 0; } diff --git a/modules/ui/entity_editor.js b/modules/ui/entity_editor.js index 86072765a..e5fc7bb90 100644 --- a/modules/ui/entity_editor.js +++ b/modules/ui/entity_editor.js @@ -45,8 +45,7 @@ export function uiEntityEditor(context) { enter .append('button') .attr('class', 'fl preset-reset preset-choose') - .append('span') - .html((textDirection === 'rtl') ? '►' : '◄'); + .call(svgIcon((textDirection === 'rtl') ? '#icon-forward' : '#icon-backward')); enter .append('button') diff --git a/modules/ui/preset_list.js b/modules/ui/preset_list.js index d411b83ec..ee8275b99 100644 --- a/modules/ui/preset_list.js +++ b/modules/ui/preset_list.js @@ -43,8 +43,7 @@ export function uiPresetList(context) { .append('button') .attr('class', 'preset-choose') .on('click', function() { dispatch.call('choose', this, currentPreset); }) - .append('span') - .html((textDirection === 'rtl') ? '◄' : '►'); + .call(svgIcon((textDirection === 'rtl') ? '#icon-backward' : '#icon-forward')); } else { messagewrap .append('button') diff --git a/modules/ui/save.js b/modules/ui/save.js index b4da7c40e..c2071ab83 100644 --- a/modules/ui/save.js +++ b/modules/ui/save.js @@ -2,6 +2,7 @@ import * as d3 from 'd3'; import { d3keybinding } from '../lib/d3.keybinding.js'; import { t } from '../util/locale'; import { modeSave } from '../modes/index'; +import { svgIcon } from '../svg/index'; import { uiCmd } from './cmd'; import { uiTooltipHtml } from './tooltipHtml'; import { tooltip } from '../util/tooltip'; @@ -53,6 +54,7 @@ export function uiSave(context) { .call(tooltipBehavior); button + .call(svgIcon('#icon-save', 'pre-text')) .append('span') .attr('class', 'label') .text(t('save.title')); @@ -62,7 +64,7 @@ export function uiSave(context) { .attr('class', 'count') .text('0'); - var keybinding = d3keybinding('undo-redo') + var keybinding = d3keybinding('save') .on(key, save, true); d3.select(document) diff --git a/svg/iD-sprite.json b/svg/iD-sprite.json index 77bfbe314..05bbd4b46 100644 --- a/svg/iD-sprite.json +++ b/svg/iD-sprite.json @@ -8,9 +8,9 @@ "icon-undo": { "viewBox": "120 0 20 20" }, "icon-redo": { "viewBox": "140 0 20 20" }, "icon-apply": { "viewBox": "160 0 20 20" }, - "icon-save": { "viewBox": "180 0 20 20" }, - "icon-close": { "viewBox": "200 0 20 20" }, - "icon-inspect": { "viewBox": "220 0 20 20" }, + "icon-close": { "viewBox": "180 0 20 20" }, + "icon-save": { "viewBox": "200 0 20 20" }, + "icon-load": { "viewBox": "220 0 20 20" }, "icon-plus": { "viewBox": "240 0 20 20" }, "icon-minus": { "viewBox": "260 0 20 20" }, "icon-search": { "viewBox": "280 0 20 20" }, @@ -21,10 +21,15 @@ "icon-out-link": { "viewBox": "380 0 20 20" }, "icon-bug": { "viewBox": "400 0 20 20" }, "icon-translate": { "viewBox": "420 0 20 20" }, + "icon-inspect": { "viewBox": "440 0 20 20" }, "icon-help": { "viewBox": "460 0 20 20" }, "icon-data": { "viewBox": "480 0 20 20" }, "icon-full-screen": { "viewBox": "500 0 20 20" }, "icon-collapse-screen": { "viewBox": "520 0 20 20" }, + "icon-backward": { "viewBox": "540 0 20 20" }, + "icon-forward": { "viewBox": "560 0 20 20" }, + "icon-up": { "viewBox": "580 0 20 20" }, + "icon-down": { "viewBox": "600 0 20 20" }, "icon-alert-shape": { "fill": "currentColor" }, "icon-point-shape": { "fill": "currentColor" }, @@ -36,24 +41,31 @@ "icon-undo-shape": { "fill": "currentColor" }, "icon-redo-shape": { "fill": "currentColor" }, "icon-apply-shape": { "fill": "currentColor" }, - "icon-save-shape": { "fill": "currentColor" }, "icon-close-shape": { "fill": "currentColor" }, + "icon-save-shape1": { "fill": "currentColor" }, + "icon-save-shape2": { "fill": "currentColor" }, + "icon-load-shape1": { "fill": "currentColor" }, + "icon-load-shape2": { "fill": "currentColor" }, "icon-out-link-shape": { "fill": "currentColor" }, - "icon-inspect-shape": { "fill": "currentColor" }, "icon-plus-shape": { "fill": "currentColor" }, "icon-minus-shape": { "fill": "currentColor" }, "icon-search-shape": { "fill": "currentColor" }, "icon-layers-shape": { "fill": "currentColor" }, "icon-avatar-shape": { "fill": "currentColor" }, - "icon-nearby-shape": { "fill": "currentColor" }, + "icon-nearby-shape1": { "fill": "currentColor" }, "icon-nearby-shape2": { "fill": "currentColor" }, "icon-geolocate-shape": { "fill": "currentColor" }, "icon-bug-shape": { "fill": "currentColor" }, "icon-translate-shape": { "fill": "currentColor" }, + "icon-inspect-shape": { "fill": "currentColor" }, "icon-help-shape": { "fill": "currentColor" }, "icon-data-shape": { "fill": "currentColor" }, "icon-full-screen-shape": { "fill": "currentColor" }, "icon-collapse-screen-shape": { "fill": "currentColor" }, + "icon-backward-shape": { "fill": "currentColor" }, + "icon-forward-shape": { "fill": "currentColor" }, + "icon-up-shape": { "fill": "currentColor" }, + "icon-down-shape": { "fill": "currentColor" }, "highway-motorway": { "viewBox": "0 20 60 60" }, "highway-trunk": { "viewBox": "60 20 60 60" }, diff --git a/svg/iD-sprite.src.idraw b/svg/iD-sprite.src.idraw index 5df5a398c..02461725d 100644 Binary files a/svg/iD-sprite.src.idraw and b/svg/iD-sprite.src.idraw differ diff --git a/svg/iD-sprite.src.svg b/svg/iD-sprite.src.svg index 7a3195512..dbed29ff0 100644 --- a/svg/iD-sprite.src.svg +++ b/svg/iD-sprite.src.svg @@ -131,7 +131,7 @@ - + @@ -1078,11 +1078,23 @@ + + + + + + + + + + + + - + - + @@ -1090,6 +1102,9 @@ + + + @@ -1097,7 +1112,7 @@ - + @@ -1106,7 +1121,7 @@ - + @@ -1115,34 +1130,36 @@ - + - + - - - - + - - + + + - + + + + + - + - + - +