Skip to content

Commit e85cd71

Browse files
bhouselbhousel
committed
Reverse Rapid logo for RTL
(closes #1488) Also - checkbox checks should not reverse in RTL, so remove that css rule
1 parent bb1b6eb commit e85cd71

12 files changed

+55
-20
lines changed

‎css/80_app_fb.css

-6
Original file line numberDiff line numberDiff line change
@@ -687,15 +687,9 @@ hide this one and style something on top of it. */
687687
height: 12px;
688688
width: 6px;
689689
}
690-
.ideditor[dir='rtl'] .rapid-checkbox-label input:checked ~ .rapid-checkbox-custom::after {
691-
margin: 6px 6px;
692-
height: 6px;
693-
width: 12px;
694-
}
695690

696691

697692
/* Rapid Power User features */
698-
699693
.rapid-stack.poweruser .modal-section-heading {
700694
display: flex;
701695
flex-flow: column;

‎modules/ui/intro/rapid.js

+14-3
Original file line numberDiff line numberDiff line change
@@ -69,9 +69,13 @@ export function uiIntroRapid(context, curtain) {
6969
.setMapParamsAsync(loc, 18.5, 0, msec)
7070
.then(() => new Promise((resolve, reject) => {
7171
_rejectStep = reject;
72+
73+
const rtl = l10n.isRTL() ? '-rtl' : '';
7274
curtain.reveal({
7375
revealSelector: '.intro-nav-wrap .chapter-rapid',
74-
tipHtml: helpHtml(context, 'intro.rapid.start', { rapid: icon('#rapid-logo-rapid-wordmark', 'pre-text rapid') }),
76+
tipHtml: helpHtml(context, 'intro.rapid.start', {
77+
rapid: icon(`#rapid-logo-rapid-wordmark${rtl}`, 'pre-text rapid')
78+
}),
7579
buttonText: l10n.t('intro.ok'),
7680
buttonCallback: () => resolve(showHideRoadsAsync)
7781
});
@@ -84,9 +88,13 @@ export function uiIntroRapid(context, curtain) {
8488
function showHideRoadsAsync() {
8589
return new Promise((resolve, reject) => {
8690
_rejectStep = reject;
91+
92+
const rtl = l10n.isRTL() ? '-rtl' : '';
8793
curtain.reveal({
8894
revealSelector: 'button.rapid-features',
89-
tipHtml: helpHtml(context, 'intro.rapid.ai_roads', { rapid: icon('#rapid-logo-rapid-wordmark', 'pre-text rapid') }),
95+
tipHtml: helpHtml(context, 'intro.rapid.ai_roads', {
96+
rapid: icon(`#rapid-logo-rapid-wordmark${rtl}`, 'pre-text rapid')
97+
}),
9098
buttonText: l10n.t('intro.ok'),
9199
buttonCallback: () => resolve(selectRoadAsync)
92100
});
@@ -162,9 +170,12 @@ export function uiIntroRapid(context, curtain) {
162170

163171
_onModeChange = reject; // disallow mode change
164172

173+
const rtl = l10n.isRTL() ? '-rtl' : '';
165174
curtain.reveal({
166175
revealExtent: tulipLaneExtent,
167-
tipHtml: helpHtml(context, 'intro.rapid.add_road_not_saved_yet', { rapid: icon('#rapid-logo-rapid-wordmark', 'pre-text rapid') }),
176+
tipHtml: helpHtml(context, 'intro.rapid.add_road_not_saved_yet', {
177+
rapid: icon(`#rapid-logo-rapid-wordmark${rtl}`, 'pre-text rapid')
178+
}),
168179
buttonText: l10n.t('intro.ok'),
169180
buttonCallback: () => resolve(showIssuesButtonAsync)
170181
});

‎modules/ui/panes/help.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -260,9 +260,10 @@ export function uiPaneHelp(context) {
260260
};
261261

262262
// common replacements that we may use anywhere in the help text
263+
const rtl = l10n.isRTL() ? '-rtl' : '';
263264
const replacements = {
264265
version: `**${context.version}**`,
265-
rapidicon: `<svg class="icon pre-text rapid"><use xlink:href="#rapid-logo-rapid-wordmark"></use></svg>`
266+
rapidicon: `<svg class="icon pre-text rapid"><use xlink:href="#rapid-logo-rapid-wordmark${rtl}"></use></svg>`
266267
};
267268

268269

‎modules/ui/rapid_feature_inspector.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -172,6 +172,8 @@ export function uiRapidFeatureInspector(context, keybinding) {
172172

173173

174174
function rapidInspector(selection) {
175+
const rtl = l10n.isRTL() ? '-rtl' : '';
176+
175177
let inspector = selection.selectAll('.rapid-inspector')
176178
.data([0]);
177179

@@ -197,7 +199,7 @@ export function uiRapidFeatureInspector(context, keybinding) {
197199
// .attr('class', 'logo-rapid dark')
198200
.attr('class', 'logo-rapid')
199201
.append('use')
200-
.attr('xlink:href', '#rapid-logo-rapid-wordmark');
202+
.attr('xlink:href', `#rapid-logo-rapid-wordmark${rtl}`);
201203

202204
headerEnter
203205
.append('button')

‎modules/ui/rapid_feature_toggle_dialog.js

+5-1
Original file line numberDiff line numberDiff line change
@@ -110,6 +110,8 @@ export function uiRapidFeatureToggleDialog(context, AIFeatureToggleKey, featureT
110110
const rapidLayer = context.scene().layers.get('rapid');
111111
if (!rapidLayer) return;
112112

113+
const rtl = l10n.isRTL() ? '-rtl' : '';
114+
113115
/* Toggle All */
114116
let toggleAll = selection.selectAll('.rapid-toggle-all')
115117
.data([0]);
@@ -127,7 +129,9 @@ export function uiRapidFeatureToggleDialog(context, AIFeatureToggleKey, featureT
127129
toggleAllTextEnter
128130
.append('div')
129131
.attr('class', 'rapid-feature-label')
130-
.html(l10n.t('rapid_feature_toggle.toggle_all', { rapidicon: icon('#rapid-logo-rapid-wordmark', 'logo-rapid') }));
132+
.html(l10n.t('rapid_feature_toggle.toggle_all', {
133+
rapidicon: icon(`#rapid-logo-rapid-wordmark${rtl}`, 'logo-rapid')
134+
}));
131135

132136
toggleAllTextEnter
133137
.append('span')

‎modules/ui/rapid_first_edit_dialog.js

+4-1
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ export function uiRapidFirstEditDialog(context) {
88

99
return function(selection) {
1010
const modal = uiModal(selection);
11+
const rtl = l10n.isRTL() ? '-rtl' : '';
1112

1213
modal.select('.modal')
1314
.attr('class', 'modal rapid-modal');
@@ -18,7 +19,9 @@ export function uiRapidFirstEditDialog(context) {
1819
.append('div')
1920
.attr('class', 'modal-section')
2021
.append('h3')
21-
.html(l10n.t('rapid_first_edit.nice', { rapidicon: icon('#rapid-logo-rapid-wordmark', 'logo-rapid') }));
22+
.html(l10n.t('rapid_first_edit.nice', {
23+
rapidicon: icon(`#rapid-logo-rapid-wordmark${rtl}`, 'logo-rapid')
24+
}));
2225

2326
content
2427
.append('div')

‎modules/ui/rapid_splash.js

+3-2
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ export function uiRapidSplash(context) {
1717
storage.setItem('sawRapidSplash', true);
1818

1919
const modalSelection = uiModal(selection);
20+
const rtl = l10n.isRTL() ? '-rtl' : '';
2021

2122
modalSelection.select('.modal')
2223
.attr('class', 'modal rapid-modal modal-splash'); // Rapid styling
@@ -33,7 +34,7 @@ export function uiRapidSplash(context) {
3334
.attr('class','modal-section')
3435
.append('p')
3536
.html(l10n.t('rapid_splash.text', {
36-
rapidicon: icon('#rapid-logo-rapid-wordmark', 'logo-rapid'),
37+
rapidicon: icon(`#rapid-logo-rapid-wordmark${rtl}`, 'logo-rapid'),
3738
walkthrough: icon('#rapid-logo-walkthrough', 'logo-walkthrough'),
3839
edit: icon('#rapid-logo-features', 'logo-features')
3940
}));
@@ -72,7 +73,7 @@ export function uiRapidSplash(context) {
7273
.append('svg')
7374
.attr('class', 'logo logo-rapid')
7475
.append('use')
75-
.attr('xlink:href', '#rapid-logo-rapid-wordmark');
76+
.attr('xlink:href', `#rapid-logo-rapid-wordmark${rtl}`);
7677

7778
rapidWalkthrough
7879
.append('div')

‎modules/ui/splash.js

+4-1
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ export function uiSplash(context) {
2020

2121

2222
return function render(selection) {
23+
const rtl = l10n.isRTL() ? '-rtl' : '';
2324
storage.setItem('sawPrivacyVersion', context.privacyVersion);
2425

2526
// prefetch intro graph data now, while user is looking at the splash screen
@@ -34,7 +35,9 @@ export function uiSplash(context) {
3435
.append('div')
3536
.attr('class', 'modal-section')
3637
.append('h2')
37-
.html(l10n.t('splash.welcome', { rapidicon: icon('#rapid-logo-rapid-wordmark', 'pre-text rapid') }));
38+
.html(l10n.t('splash.welcome', {
39+
rapidicon: icon(`#rapid-logo-rapid-wordmark${rtl}`, 'pre-text rapid')
40+
}));
3841

3942

4043
let markdown = l10n.t('splash.text', { version: context.version }) + '\n\n';

‎modules/ui/tools/UiRapidTool.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -74,6 +74,7 @@ export class UiRapidTool {
7474

7575
const isPowerUser = urlhash.getParam('poweruser') === 'true';
7676
const isNarrow = context.container().selectAll('.map-toolbar.narrow').size();
77+
const rtl = l10n.isRTL() ? '-rtl' : '';
7778

7879
// Localize tooltips
7980
this.RapidTooltip
@@ -114,16 +115,15 @@ export class UiRapidTool {
114115
$$rapidButton
115116
.append('svg')
116117
.attr('class', 'logo-rapid')
117-
.append('use')
118-
.attr('xlink:href', '#rapid-logo-rapid-wordmark');
118+
.append('use');
119119

120120
// update
121121
$rapidButton = $rapidButton.merge($$rapidButton)
122122
.classed('layer-off', !this.isLayerEnabled());
123123

124124
$rapidButton
125125
.selectAll('.logo-rapid use')
126-
.attr('xlink:href', isNarrow ? '#rapid-logo-rapid' : '#rapid-logo-rapid-wordmark' );
126+
.attr('xlink:href', isNarrow ? `#rapid-logo-rapid${rtl}` : `#rapid-logo-rapid-wordmark${rtl}` );
127127

128128

129129
// Poweruser Button

‎modules/ui/whats_new.js

+4-1
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ export function uiWhatsNew(context) {
1818

1919
return function render(selection) {
2020
const $modal = uiModal(selection);
21+
const rtl = l10n.isRTL() ? '-rtl' : '';
2122

2223
$modal.select('.modal')
2324
.attr('class', 'modal rapid-modal modal-whatsnew');
@@ -27,7 +28,9 @@ export function uiWhatsNew(context) {
2728
.append('div')
2829
.attr('class', 'modal-section')
2930
.append('h2')
30-
.html(l10n.t('whats_new.welcome_v24', { rapidicon: icon('#rapid-logo-rapid-wordmark', 'pre-text rapid') }));
31+
.html(l10n.t('whats_new.welcome_v24', {
32+
rapidicon: icon(`#rapid-logo-rapid-wordmark${rtl}`, 'pre-text rapid')
33+
}));
3134

3235

3336
const markdown = l10n.t('whats_new.text_v24') + '\n\n';

‎svg/rapid-sprite/graphics/logo-rapid-rtl.svg

+7
Loading

‎svg/rapid-sprite/graphics/logo-rapid-wordmark-rtl.svg

+6
Loading

0 commit comments

Comments
 (0)