Skip to content

Use ID of operating sysems instead of name in selectors #13506

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
parlough merged 3 commits into from
Jun 16, 2026
+12 −12
Merged

Use ID of operating sysems instead of name in selectors #13506

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
2a597d5
Use ID of operating sysems instead of name in selectors
parlough Jun 16, 2026
b481c67
Account for Gemini review suggestion
parlough Jun 16, 2026
a6a1f58
Merge branch 'main' into fix/os-selector-ids
parlough Jun 16, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 12 additions & 12 deletions sites/docs/lib/src/components/common/client/os_selector.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,36 +46,36 @@ class _OsSelectorState extends State<OsSelector> {
}

final bodyClasses = web.document.body!.classList;
for (final os in OperatingSystem.values) {
bodyClasses.remove('show-${os.name}');
for (final supportedOS in OperatingSystem.values) {
bodyClasses.remove('show-${supportedOS.id}');
}
bodyClasses.add('show-${os.name}');
bodyClasses.add('show-${os.id}');
}

@override
Component build(BuildContext context) {
return div(classes: 'card-grid narrow os-selector', [
for (final os in OperatingSystem.values)
for (final supportedOS in OperatingSystem.values)
button(
id: 'install-${os.name}',
id: 'install-${supportedOS.id}',
classes: [
'card outlined-card install-card',
if (selectedOs == os) 'selected-card',
if (selectedOs == supportedOS) 'selected-card',
].toClasses,
attributes: {
'data-os': os.name,
'aria-label': 'Update docs to cover ${os.label}',
'data-os': supportedOS.id,
'aria-label': 'Update docs to cover ${supportedOS.label}',
},
events: {
'click': (event) {
setOS(os);
setOS(supportedOS);
},
},
[
div(classes: 'card-leading', [
img(
src: '/assets/images/docs/brand-svg/${os.id}.svg',
alt: '${os.label} logo',
src: '/assets/images/docs/brand-svg/${supportedOS.id}.svg',
alt: '${supportedOS.label} logo',
attributes: {
'width': '72',
'height': '72',
Expand All @@ -85,7 +85,7 @@ class _OsSelectorState extends State<OsSelector> {
]),
div(classes: 'card-header text-center', [
span(classes: 'card-title', [
.text(os.label),
.text(supportedOS.label),
]),
]),
],
Expand Down
Loading