steven/gpx.studio
1
0
Fork 0
mirror of https://github.com/gpxstudio/gpx.studio.git synced 2025-09-05 09:52:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

add aria labels

Browse Source
This commit is contained in:
vcoppe
2024-09-23 16:41:12 +02:00
parent 2e1ead31ea
commit 195671acb6
4 changed files with 75 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
website/src/lib/components/ElevationProfile.svelte
View File

@@ -625,13 +625,13 @@
type="single"
bind:value={elevationFill}
>
<ToggleGroup.Item class="p-0 w-5 h-5" value="slope">
<ToggleGroup.Item class="p-0 w-5 h-5" value="slope" aria-label={$_('chart.show_slope')}>
<Tooltip side="left">
<TriangleRight slot="data" size="15" />
<span slot="tooltip">{$_('chart.show_slope')}</span>
</Tooltip>
</ToggleGroup.Item>
<ToggleGroup.Item class="p-0 w-5 h-5" value="surface">
<ToggleGroup.Item class="p-0 w-5 h-5" value="surface" aria-label={$_('chart.show_surface')}>
<Tooltip side="left">
<BrickWall slot="data" size="15" />
<span slot="tooltip">{$_('chart.show_surface')}</span>
@@ -645,33 +645,41 @@
type="multiple"
bind:value={additionalDatasets}
>
<ToggleGroup.Item class="p-0 w-5 h-5" value="speed">
<ToggleGroup.Item
class="p-0 w-5 h-5"
value="speed"
aria-label={$velocityUnits === 'speed' ? $_('chart.show_speed') : $_('chart.show_pace')}
>
<Tooltip side="left">
<Zap slot="data" size="15" />
<span slot="tooltip"
>{$velocityUnits === 'speed' ? $_('chart.show_speed') : $_('chart.show_pace')}</span
>
<span slot="tooltip">
{$velocityUnits === 'speed' ? $_('chart.show_speed') : $_('chart.show_pace')}
</span>
</Tooltip>
</ToggleGroup.Item>
<ToggleGroup.Item class="p-0 w-5 h-5" value="hr">
<ToggleGroup.Item class="p-0 w-5 h-5" value="hr" aria-label={$_('chart.show_heartrate')}>
<Tooltip side="left">
<HeartPulse slot="data" size="15" />
<span slot="tooltip">{$_('chart.show_heartrate')}</span>
</Tooltip>
</ToggleGroup.Item>
<ToggleGroup.Item class="p-0 w-5 h-5" value="cad">
<ToggleGroup.Item class="p-0 w-5 h-5" value="cad" aria-label={$_('chart.show_cadence')}>
<Tooltip side="left">
<Orbit slot="data" size="15" />
<span slot="tooltip">{$_('chart.show_cadence')}</span>
</Tooltip>
</ToggleGroup.Item>
<ToggleGroup.Item class="p-0 w-5 h-5" value="atemp">
<ToggleGroup.Item
class="p-0 w-5 h-5"
value="atemp"
aria-label={$_('chart.show_temperature')}
>
<Tooltip side="left">
<Thermometer slot="data" size="15" />
<span slot="tooltip">{$_('chart.show_temperature')}</span>
</Tooltip>
</ToggleGroup.Item>
<ToggleGroup.Item class="p-0 w-5 h-5" value="power">
<ToggleGroup.Item class="p-0 w-5 h-5" value="power" aria-label={$_('chart.show_power')}>
<Tooltip side="left">
<SquareActivity slot="data" size="15" />
<span slot="tooltip">{$_('chart.show_power')}</span>