doxa-life/doxa-maps
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Mirror the region chevrons in Arabic, the way their own rotate-90 utility does

Browse source 
In Arabic the chevrons moved to the correct side of the label but kept
pointing right, so "forward" pointed backwards. Measured on the live site,
the same selector in both directions: .region-card__link svg is
matrix(0, 1, -1, 0, 0, 0) at /regions and matrix(0, -1, 1, 0, 0, 0) at
/ar/regions. Ours was the LTR matrix in both.

Their utilities/_shapes.scss already answers this:

  .rotate-90 { transform: rotate(90deg);
    [dir="rtl"] & { transform: rotate(-90deg); } }

and their .rotate-180 pointedly has no such variant. That distinction is the
rule worth keeping: a chevron meaning "forward" mirrors, a disclosure caret
meaning "open or closed" does not. So of the three rotations here only the
chevron gains the variant; both 180-degree carets were already right.

The open-state rule beside it is load-bearing rather than decorative. The new
[dir="rtl"] selector outweighs the --open modifier, and without its own RTL
rule the poster caret would have frozen mid-turn in Arabic.
This commit is contained in:
doxa-maps-88655c70 2026-09-24 12:00:20 +00:00
parent 670a2dc3f7
commit 3e7df7ecce
7 changed files with 21 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
plugin-designs/regions-dashboard/regions-list.vue
View file

@ -446,6 +446,18 @@ useShadowStyles(
// which is what makes open/closed legible at a glance.
'.region-card__posters-toggle{ margin-top:0; }' +
'.region-card__icon--open{ transform:rotate(180deg); }' +
// RTL MIRRORING, ported from their utilities/_shapes.scss:
// .rotate-90 { transform:rotate(90deg); [dir="rtl"] & { transform:rotate(-90deg); } }
// Their .rotate-180 has NO rtl variant, and that distinction is the whole rule: a chevron that
// means "forward" must mirror, a disclosure caret that means "open/closed" must not. MEASURED
// on live doxa.life: .region-card__link svg is matrix(0,1,-1,0,0,0) at /regions and
// matrix(0,-1,1,0,0,0) at /ar/regions — ours stayed at +90deg in Arabic, so the chevron sat on
// the correct side pointing the WRONG WAY. Found by looking at the Arabic screenshot.
// The selector works inside our shadow root because .rl-root carries :dir itself.
'[dir="rtl"] .region-card__icon{ transform:rotate(-90deg); }' +
// ...and this one is load-bearing: [dir="rtl"] .region-card__icon is specificity 0-2-0, which
// would otherwise beat the 0-1-0 --open modifier and freeze the poster caret in Arabic.
'[dir="rtl"] .region-card__icon--open{ transform:rotate(180deg); }' +
'.region-card__posters{ margin-top:13.3px; }' +
'.region-card__footer{ display:flex; justify-content:flex-end; margin:0; margin-top:23.5264px;' +
' padding:0 clamp(17.689px, 4cqw, 41.6158px) 23.5264px; }' +

2
public/doxa-maps/index.html generated
View file

File diff suppressed because one or more lines are too long

8
public/doxa-maps/manifest.json generated
View file

@ -856,7 +856,7 @@
"bundle": "regions-dashboard",
"scriptUrl": "./regions-dashboard/regions-dashboard.js",
"output": "doxa-maps/regions-dashboard/regions-dashboard.js",
"integrity": "sha384-x6Y5MyFFI78z+SZk1XVlMvkpFfkE83JQ488bebTCfs/RAbaWafcrOsa0sRnR7VpI",
"integrity": "sha384-hZYMaTCk51T//RWUnAZHAwGSttATtfqC2li3HmAHguiJ+2lGp/uONctoWdLHahup",
"elements": [
"regions-dashboard"
],
@ -876,7 +876,7 @@
"scriptUrl": "./regions-dashboard/regions-dashboard.js",
"embed": {
"iframe": "<iframe src=\"./regions-dashboard/region-dashboards/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
"script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./regions-dashboard/regions-dashboard.js\" integrity=\"sha384-x6Y5MyFFI78z+SZk1XVlMvkpFfkE83JQ488bebTCfs/RAbaWafcrOsa0sRnR7VpI\" crossorigin=\"anonymous\"></script>\n<regions-dashboard profile-config='{\"profile\":\"region-dashboards\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></regions-dashboard>"
"script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./regions-dashboard/regions-dashboard.js\" integrity=\"sha384-hZYMaTCk51T//RWUnAZHAwGSttATtfqC2li3HmAHguiJ+2lGp/uONctoWdLHahup\" crossorigin=\"anonymous\"></script>\n<regions-dashboard profile-config='{\"profile\":\"region-dashboards\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></regions-dashboard>"
}
},
{
@ -890,7 +890,7 @@
"scriptUrl": "./regions-dashboard/regions-dashboard.js",
"embed": {
"iframe": "<iframe src=\"./regions-dashboard/regions-list/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
"script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./regions-dashboard/regions-dashboard.js\" integrity=\"sha384-x6Y5MyFFI78z+SZk1XVlMvkpFfkE83JQ488bebTCfs/RAbaWafcrOsa0sRnR7VpI\" crossorigin=\"anonymous\"></script>\n<regions-dashboard profile-config='{\"profile\":\"regions-list\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></regions-dashboard>"
"script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./regions-dashboard/regions-dashboard.js\" integrity=\"sha384-hZYMaTCk51T//RWUnAZHAwGSttATtfqC2li3HmAHguiJ+2lGp/uONctoWdLHahup\" crossorigin=\"anonymous\"></script>\n<regions-dashboard profile-config='{\"profile\":\"regions-list\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></regions-dashboard>"
}
},
{
@ -904,7 +904,7 @@
"scriptUrl": "./regions-dashboard/regions-dashboard.js",
"embed": {
"iframe": "<iframe src=\"./regions-dashboard/regions-mfe/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
"script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./regions-dashboard/regions-dashboard.js\" integrity=\"sha384-x6Y5MyFFI78z+SZk1XVlMvkpFfkE83JQ488bebTCfs/RAbaWafcrOsa0sRnR7VpI\" crossorigin=\"anonymous\"></script>\n<regions-dashboard profile-config='{\"profile\":\"regions-mfe\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></regions-dashboard>"
"script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./regions-dashboard/regions-dashboard.js\" integrity=\"sha384-hZYMaTCk51T//RWUnAZHAwGSttATtfqC2li3HmAHguiJ+2lGp/uONctoWdLHahup\" crossorigin=\"anonymous\"></script>\n<regions-dashboard profile-config='{\"profile\":\"regions-mfe\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></regions-dashboard>"
}
}
]

2
public/doxa-maps/regions-dashboard/region-dashboards/index.html generated
View file

@ -29,7 +29,7 @@
<script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
<!-- Bundle IIFE — registers the <regions-dashboard> custom element. -->
<script src="../regions-dashboard.js" integrity="sha384-x6Y5MyFFI78z+SZk1XVlMvkpFfkE83JQ488bebTCfs/RAbaWafcrOsa0sRnR7VpI" crossorigin="anonymous"></script>
<script src="../regions-dashboard.js" integrity="sha384-hZYMaTCk51T//RWUnAZHAwGSttATtfqC2li3HmAHguiJ+2lGp/uONctoWdLHahup" crossorigin="anonymous"></script>
<script>
// Mapbox token resolution — the A3 ladder, in precedence order:

2
public/doxa-maps/regions-dashboard/regions-dashboard.js generated
View file

File diff suppressed because one or more lines are too long

2
public/doxa-maps/regions-dashboard/regions-list/index.html generated
View file

@ -29,7 +29,7 @@
<script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
<!-- Bundle IIFE — registers the <regions-dashboard> custom element. -->
<script src="../regions-dashboard.js" integrity="sha384-x6Y5MyFFI78z+SZk1XVlMvkpFfkE83JQ488bebTCfs/RAbaWafcrOsa0sRnR7VpI" crossorigin="anonymous"></script>
<script src="../regions-dashboard.js" integrity="sha384-hZYMaTCk51T//RWUnAZHAwGSttATtfqC2li3HmAHguiJ+2lGp/uONctoWdLHahup" crossorigin="anonymous"></script>
<script>
// Mapbox token resolution — the A3 ladder, in precedence order:

2
public/doxa-maps/regions-dashboard/regions-mfe/index.html generated
View file

@ -40,7 +40,7 @@
<script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
<!-- Bundle IIFE — registers the <regions-dashboard> custom element. -->
<script src="../regions-dashboard.js" integrity="sha384-x6Y5MyFFI78z+SZk1XVlMvkpFfkE83JQ488bebTCfs/RAbaWafcrOsa0sRnR7VpI" crossorigin="anonymous"></script>
<script src="../regions-dashboard.js" integrity="sha384-hZYMaTCk51T//RWUnAZHAwGSttATtfqC2li3HmAHguiJ+2lGp/uONctoWdLHahup" crossorigin="anonymous"></script>
<script>
// Mapbox token resolution — the A3 ladder, in precedence order: