Skip to content

Commit 04b0fac

Browse files
Joseph Schickjschick04
Joseph Schick
authored and
jschick04
committed
Adjusted more labels
1 parent e0003ee commit 04b0fac

File tree

13 files changed

+50
-40
lines changed

13 files changed

+50
-40
lines changed

‎src/EventLogExpert/Components/EventTable.razor‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,14 +9,16 @@
99
<tr role="row">
1010
@foreach (ColumnName column in _enabledColumns)
1111
{
12-
<th class="@column.ToString().ToLower()" role="columnheader">
12+
_headerName = column.ToFullString();
13+
14+
<th aria-label="@_headerName" class="@column.ToString().ToLower()" role="columnheader">
1315
@if (column == ColumnName.DateAndTime)
1416
{
1517
<text>@GetDateColumnHeader()</text>
1618
}
1719
else
1820
{
19-
@column.ToFullString()
21+
@_headerName
2022
}
2123
@if (_eventTableState.OrderBy == column)
2224
{
@@ -35,7 +37,8 @@
3537
{
3638
<Virtualize Context="evt" Items="_currentTable.DisplayedEvents">
3739
@{ _rowIndex = _currentTable.DisplayedEvents.IndexOf(evt); }
38-
<tr class="@GetCss(evt)" @key="@($"{evt.OwningLog}_{evt.RecordId}")" @onmousedown="args => SelectEvent(args, evt)" role="row" tabindex="0">
40+
<tr aria-selected="@_selectedEventState.Contains(evt)" class="@GetCss(evt)" @key="@($"{evt.OwningLog}_{evt.RecordId}")"
41+
@onmousedown="args => SelectEvent(args, evt)" role="row" tabindex="0">
3942
@for (int i = 0; i < _enabledColumns.Length; i++)
4043
{
4144
<td aria-label="Row @(_rowIndex), Column @(i + 1)" role="gridcell">

‎src/EventLogExpert/Components/EventTable.razor.cs‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ public sealed partial class EventTable
2424
private EventTableModel? _currentTable;
2525
private ColumnName[] _enabledColumns = null!;
2626
private EventTableState _eventTableState = null!;
27+
private string _headerName = string.Empty;
2728
private int _rowIndex = 0;
2829
private ImmutableList<DisplayEventModel> _selectedEventState = [];
2930
private TimeZoneInfo _timeZoneSettings = null!;

‎src/EventLogExpert/Components/FilterPane.razor‎

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,8 @@
4747
</div>
4848
}
4949

50-
<span class="menu-toggle justify-self-right" data-rotate="@MenuState" @onclick="ToggleMenu" @onkeydown="HandleKeyDown" tabindex="0">
50+
<span aria-label="Toggle filter pane" class="menu-toggle justify-self-right" data-rotate="@MenuState"
51+
@onclick="ToggleMenu" @onkeydown="HandleKeyDown" role="button" tabindex="0">
5152
<i class="bi bi-caret-up"></i>
5253
</span>
5354
}
@@ -56,14 +57,14 @@
5657
<div class="filter-group" data-toggle="@MenuState">
5758
@if (IsDateFilterVisible)
5859
{
59-
<EditForm id="filter-form" class="flex-row" Model="_model">
60+
<EditForm class="flex-row" id="filter-form" Model="_model">
6061
<span>
61-
After: <InputDate class="input filter-datetime" Type="InputDateType.DateTimeLocal"
62-
@bind-Value="_model.After" disabled="@(!_canEditDate)" />
62+
After: <InputDate aria-label="After" @bind-Value="_model.After" class="input filter-datetime"
63+
disabled="@(!_canEditDate)" Type="InputDateType.DateTimeLocal" />
6364
</span>
6465
<span>
65-
Before: <InputDate class="input filter-datetime" Type="InputDateType.DateTimeLocal"
66-
@bind-Value="_model.Before" disabled="@(!_canEditDate)" />
66+
Before: <InputDate aria-label="Before" @bind-Value="_model.Before" class="input filter-datetime"
67+
disabled="@(!_canEditDate)" Type="InputDateType.DateTimeLocal" />
6768
</span>
6869

6970
@if (_canEditDate)
@@ -72,7 +73,7 @@
7273
<i class="bi bi-check-circle"></i> Apply
7374
</button>
7475

75-
<button class="button button-red" type="button" @onclick="RemoveDateFilter">
76+
<button class="button button-red" @onclick="RemoveDateFilter" type="button">
7677
<i class="bi bi-dash-circle"></i> Remove
7778
</button>
7879
}
@@ -82,7 +83,7 @@
8283
<i class="bi bi-funnel"></i> Edit
8384
</button>
8485

85-
<button class="button button-red" type="button" @onclick="RemoveDateFilter">
86+
<button class="button button-red" @onclick="RemoveDateFilter" type="button">
8687
<i class="bi bi-dash-circle"></i> Remove
8788
</button>
8889

‎src/EventLogExpert/Shared/Components/BooleanSelect.razor‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@
22
@inherits BaseComponent<bool>
33

44
<div aria-label="@AriaLabel" class="toggle" role="radiogroup">
5-
<input checked="@(!Value)" id="@Id false" name="@Id" @onchange="UpdateValue" type="radio" value="false" />
5+
<input aria-label="@AriaLabel @DisabledString" checked="@(!Value)" id="@Id false" name="@Id" @onchange="UpdateValue" type="radio" value="false" />
66
<label data-single-color="@IsSingleColor.ToString().ToLower()" for="@Id false">@DisabledString</label>
77

8-
<input checked="@(Value)" id="@Id true" name="@Id" @onchange="UpdateValue" type="radio" value="true" />
8+
<input aria-label="@AriaLabel @EnabledString" checked="@(Value)" id="@Id true" name="@Id" @onchange="UpdateValue" type="radio" value="true" />
99
<label data-single-color="@IsSingleColor.ToString().ToLower()" for="@Id true">@EnabledString</label>
1010
</div>

‎src/EventLogExpert/Shared/Components/Filters/AdvancedFilterRow.razor‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
@using EventLogExpert.UI
2-
@using EventLogExpert.UI.Store.FilterPane
32

43
<div class="flex-space-between">
54
<div class="flex-align-center">
@@ -19,11 +18,11 @@
1918
<span>
2019
@if (Value.IsExcluded)
2120
{
22-
<label for="@Id">Exclude Expression: </label>
21+
<label aria-label="Exclude Expression" for="@Id">Exclude Expression: </label>
2322
}
2423
else
2524
{
26-
<label for="@Id">Expression: </label>
25+
<label aria-label="Expression" for="@Id">Expression: </label>
2726
}
2827
<input class="input advanced-filter" @oninput="OnInputChanged" id="@Id"
2928
placeholder="(Id == 1000 || Id == 1001) && Description.Contains('Fault')"

‎src/EventLogExpert/Shared/Components/Filters/FilterCacheRow.razor‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
</ValueSelect>
1515
}
1616

17-
<span>Cache Type: </span>
17+
<label aria-label="Cache Type">Cache Type: </label>
1818
<ValueSelect CssClass="input filter-dropdown" T="CacheType" @bind-Value="_cacheType" ToStringFunc="x => x.ToFullString()">
1919
@foreach (CacheType item in Enum.GetValues(typeof(CacheType)))
2020
{
@@ -24,11 +24,11 @@
2424

2525
if (Value.IsExcluded)
2626
{
27-
<span>Exclude Value: </span>
27+
<label aria-label="Exclude Value">Exclude Value: </label>
2828
}
2929
else
3030
{
31-
<span>Value: </span>
31+
<label aria-label="Value">Value: </label>
3232
}
3333
<ValueSelect CssClass="input cache-dropdown" T="string" @bind-Value="_filterValue" IsInput>
3434
@if (Items.Any())

‎src/EventLogExpert/Shared/Components/Filters/FilterRow.razor‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
{
77
if (!Value.IsExcluded)
88
{
9-
<ValueSelect CssClass="@($"input color-dropdown {Value.Color.ToString().ToLower()}")" T="HighlightColor" @bind-Value="Value.Color">
9+
<ValueSelect AriaLabel="Highlight Color" CssClass="@($"input color-dropdown {Value.Color.ToString().ToLower()}")" T="HighlightColor" @bind-Value="Value.Color">
1010
@foreach (HighlightColor item in Enum.GetValues(typeof(HighlightColor)))
1111
{
1212
<ValueSelectItem CssClass="@($"color-dropdown-item {item.ToString().ToLower()}")" T="HighlightColor" Value="item" />
@@ -16,13 +16,13 @@
1616

1717
if (Value.IsExcluded)
1818
{
19-
<span>Exclude On: </span>
19+
<label aria-label="Exclude On" id="@($"{Id}_IsExcluded")">Exclude On: </label>
2020
}
2121
else
2222
{
23-
<span>Filter On: </span>
23+
<label aria-label="Filter On" id="@($"{Id}_IsExcluded")">Filter On: </label>
2424
}
25-
<ValueSelect CssClass="input filter-dropdown" T="FilterCategory" @bind-Value="Value.Data.Category" ToStringFunc="x => x.ToFullString()">
25+
<ValueSelect AriaLabelledBy="@($"{Id}_IsExcluded")" CssClass="input filter-dropdown" T="FilterCategory" @bind-Value="Value.Data.Category" ToStringFunc="x => x.ToFullString()">
2626
@foreach (FilterCategory item in Enum.GetValues(typeof(FilterCategory)))
2727
{
2828
if (item == FilterCategory.Xml && !FilterService.IsXmlEnabled) { continue; }
@@ -31,23 +31,23 @@
3131
}
3232
</ValueSelect>
3333

34-
<span>Comparison: </span>
35-
<ValueSelect CssClass="input filter-dropdown" T="FilterEvaluator" @bind-Value="Value.Data.Evaluator" ToStringFunc="x => x.ToFullString()">
34+
<label aria-label="Comparison" id="@($"{Id}_Comparison")">Comparison: </label>
35+
<ValueSelect AriaLabelledBy="@($"{Id}_Comparison")" CssClass="input filter-dropdown" T="FilterEvaluator" @bind-Value="Value.Data.Evaluator" ToStringFunc="x => x.ToFullString()">
3636
@foreach (FilterEvaluator item in Enum.GetValues(typeof(FilterEvaluator)))
3737
{
3838
<ValueSelectItem T="FilterEvaluator" Value="item" />
3939
}
4040
</ValueSelect>
4141

42-
<span>Value: </span>
42+
<label aria-label="Value" id="@($"{Id}_Value")">Value: </label>
4343
<div>
4444
@if (Value.Data.Category is FilterCategory.Description)
4545
{
46-
<TextInput CssClass="input filter-description" @bind-Value="@Value.Data.Value" />
46+
<TextInput aria-labelledby="@($"{Id}_Value")" CssClass="input filter-description" @bind-Value="@Value.Data.Value" />
4747
}
4848
else if (Value.Data.Evaluator == FilterEvaluator.MultiSelect)
4949
{
50-
<ValueSelect CssClass="input filter-multiselect-dropdown" T="string" @bind-Values="Value.Data.Values" IsMultiSelect
50+
<ValueSelect AriaLabelledBy="@($"{Id}_Value")" CssClass="input filter-multiselect-dropdown" T="string" @bind-Values="Value.Data.Values" IsMultiSelect
5151
ToStringFunc="@(x => string.IsNullOrWhiteSpace(x) ? "All" : x)">
5252
<ValueSelectItem T="string" ClearItem>All</ValueSelectItem>
5353
@foreach (var item in Items)
@@ -58,7 +58,7 @@
5858
}
5959
else
6060
{
61-
<ValueSelect CssClass="input filter-value-dropdown" T="string" @bind-Value="Value.Data.Value" IsInput>
61+
<ValueSelect AriaLabelledBy="@($"{Id}_Value")" CssClass="input filter-value-dropdown" T="string" @bind-Value="Value.Data.Value" IsInput>
6262
<ValueSelectItem T="string" ClearItem>All</ValueSelectItem>
6363
@foreach (var item in FilteredItems)
6464
{

‎src/EventLogExpert/Shared/Components/Filters/FilterRow.razor.cs‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,8 @@ namespace EventLogExpert.Shared.Components.Filters;
1616

1717
public sealed partial class FilterRow
1818
{
19+
[Parameter] public string Id { get; set; } = Guid.NewGuid().ToString();
20+
1921
[Parameter] public FilterModel Value { get; set; } = null!;
2022

2123
[Inject] private IAlertDialogService AlertDialogService { get; init; } = null!;

‎src/EventLogExpert/Shared/Components/Filters/SubFilterRow.razor‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -13,22 +13,22 @@
1313
}
1414
</ValueSelect>
1515

16-
<span>Comparison: </span>
17-
<ValueSelect CssClass="input filter-dropdown" T="FilterEvaluator" @bind-Value="Value.Data.Evaluator" ToStringFunc="x => x.ToFullString()">
16+
<label aria-label="Comparison" id="@($"{Id}_Comparison")">Comparison: </label>
17+
<ValueSelect AriaLabelledBy="@($"{Id}_Comparison")" CssClass="input filter-dropdown" T="FilterEvaluator" @bind-Value="Value.Data.Evaluator" ToStringFunc="x => x.ToFullString()">
1818
@foreach (FilterEvaluator item in Enum.GetValues(typeof(FilterEvaluator)))
1919
{
2020
<ValueSelectItem T="FilterEvaluator" Value="item" />
2121
}
2222
</ValueSelect>
2323

24-
<span>Value: </span>
24+
<label aria-label="Value" id="@($"{Id}_Value")">Value: </label>
2525
@if (Value.Data.Category is FilterCategory.Description)
2626
{
27-
<TextInput CssClass="input filter-description" @bind-Value="@Value.Data.Value" />
27+
<TextInput aria-labelledby="@($"{Id}_Value")" CssClass="input filter-description" @bind-Value="@Value.Data.Value" />
2828
}
2929
else if (Value.Data.Evaluator == FilterEvaluator.MultiSelect)
3030
{
31-
<ValueSelect CssClass="input filter-multiselect-dropdown" T="string" @bind-Values="Value.Data.Values" IsMultiSelect
31+
<ValueSelect AriaLabelledBy="@($"{Id}_Value")" CssClass="input filter-multiselect-dropdown" T="string" @bind-Values="Value.Data.Values" IsMultiSelect
3232
ToStringFunc="@(x => string.IsNullOrWhiteSpace(x) ? "All" : x)">
3333
<ValueSelectItem T="string" ClearItem>All</ValueSelectItem>
3434
@foreach (var item in Items)
@@ -39,7 +39,7 @@
3939
}
4040
else
4141
{
42-
<ValueSelect CssClass="input filter-value-dropdown" T="string" @bind-Value="Value.Data.Value" IsInput>
42+
<ValueSelect AriaLabelledBy="@($"{Id}_Value")" CssClass="input filter-value-dropdown" T="string" @bind-Value="Value.Data.Value" IsInput>
4343
<ValueSelectItem T="string" ClearItem>All</ValueSelectItem>
4444
@foreach (var item in FilteredItems)
4545
{

‎src/EventLogExpert/Shared/Components/Filters/SubFilterRow.razor.cs‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,8 @@ public sealed partial class SubFilterRow
1717
{
1818
[Parameter] public FilterId ParentId { get; set; }
1919

20+
[Parameter] public string Id { get; set; } = Guid.NewGuid().ToString();
21+
2022
[Parameter] public FilterModel Value { get; set; } = null!;
2123

2224
[Inject] private IDispatcher Dispatcher { get; init; } = null!;

0 commit comments

Comments
 (0)