forked from
nonbinary.computer/weaver
atproto blogging
basic aria labels
+43
-9
+7
crates/weaver-app/src/components/editor/component.rs
+7
crates/weaver-app/src/components/editor/component.rs
···
1072
1072
input {
1073
1073
r#type: "text",
1074
1074
class: "title-input",
1075
+
aria_label: "Entry title",
1075
1076
placeholder: "Entry title...",
1076
1077
value: "{document.title()}",
1077
1078
oninput: {
···
1090
1091
input {
1091
1092
r#type: "text",
1092
1093
class: "path-input",
1094
+
aria_label: "URL path",
1093
1095
placeholder: "url-slug",
1094
1096
value: "{document.path()}",
1095
1097
oninput: {
···
1110
1112
"{tag}"
1111
1113
button {
1112
1114
class: "tag-remove",
1115
+
aria_label: "Remove tag {tag}",
1113
1116
onclick: {
1114
1117
let doc = document.clone();
1115
1118
let tag_to_remove = tag.clone();
···
1124
1127
input {
1125
1128
r#type: "text",
1126
1129
class: "tag-input",
1130
+
aria_label: "Add tag",
1127
1131
placeholder: "Add tag...",
1128
1132
value: "{new_tag}",
1129
1133
oninput: move |e| new_tag.set(e.value()),
···
1228
1232
id: "{editor_id}",
1229
1233
class: "editor-content",
1230
1234
contenteditable: "true",
1235
+
role: "textbox",
1236
+
aria_multiline: "true",
1237
+
aria_label: "Document content",
1231
1238
1232
1239
onkeydown: {
1233
1240
let mut doc = document.clone();
+1
crates/weaver-app/src/components/editor/image_upload.rs
+1
crates/weaver-app/src/components/editor/image_upload.rs
+5
-1
crates/weaver-app/src/components/editor/publish.rs
+5
-1
crates/weaver-app/src/components/editor/publish.rs
···
594
594
if show_dialog() {
595
595
div {
596
596
class: "publish-dialog-overlay",
597
+
role: "dialog",
598
+
aria_modal: "true",
599
+
aria_labelledby: "publish-dialog-title",
597
600
onclick: close_dialog,
598
601
599
602
div {
600
603
class: "publish-dialog",
601
604
onclick: move |e| e.stop_propagation(),
602
605
603
-
h2 { "Publish Entry" }
606
+
h2 { id: "publish-dialog-title", "Publish Entry" }
604
607
605
608
if let Some(uri) = success_uri() {
606
609
{
···
663
666
input {
664
667
r#type: "text",
665
668
class: "publish-input",
669
+
aria_label: "Notebook title",
666
670
placeholder: "Notebook title...",
667
671
value: "{notebook_title}",
668
672
oninput: move |e| notebook_title.set(e.value()),
+5
-1
crates/weaver-app/src/components/editor/report.rs
+5
-1
crates/weaver-app/src/components/editor/report.rs
···
140
140
if show_dialog() {
141
141
div {
142
142
class: "report-dialog-overlay",
143
+
role: "dialog",
144
+
aria_modal: "true",
145
+
aria_labelledby: "report-dialog-title",
143
146
onclick: close_dialog,
144
147
145
148
div {
146
149
class: "report-dialog",
147
150
onclick: move |e| e.stop_propagation(),
148
151
149
-
h2 { "Report a Bug" }
152
+
h2 { id: "report-dialog-title", "Report a Bug" }
150
153
151
154
div { class: "report-section",
152
155
label { "Describe the issue:" }
153
156
textarea {
154
157
class: "report-comment",
158
+
aria_label: "Describe the issue",
155
159
placeholder: "What happened? What did you expect?",
156
160
value: "{comment}",
157
161
oninput: move |e| comment.set(e.value()),
+2
crates/weaver-app/src/components/editor/sync.rs
+2
crates/weaver-app/src/components/editor/sync.rs
+16
-1
crates/weaver-app/src/components/editor/toolbar.rs
+16
-1
crates/weaver-app/src/components/editor/toolbar.rs
···
13
13
on_image: EventHandler<UploadedImage>,
14
14
) -> Element {
15
15
rsx! {
16
-
div { class: "editor-toolbar",
16
+
div {
17
+
class: "editor-toolbar",
18
+
role: "toolbar",
19
+
aria_label: "Text formatting",
20
+
aria_orientation: "vertical",
17
21
button {
18
22
class: "toolbar-button",
19
23
title: "Bold (Ctrl+B)",
24
+
aria_label: "Bold (Ctrl+B)",
20
25
onclick: move |_| on_format.call(FormatAction::Bold),
21
26
"B"
22
27
}
23
28
button {
24
29
class: "toolbar-button",
25
30
title: "Italic (Ctrl+I)",
31
+
aria_label: "Italic (Ctrl+I)",
26
32
onclick: move |_| on_format.call(FormatAction::Italic),
27
33
"I"
28
34
}
29
35
button {
30
36
class: "toolbar-button",
31
37
title: "Strikethrough",
38
+
aria_label: "Strikethrough",
32
39
onclick: move |_| on_format.call(FormatAction::Strikethrough),
33
40
"S"
34
41
}
35
42
button {
36
43
class: "toolbar-button",
37
44
title: "Code",
45
+
aria_label: "Code",
38
46
onclick: move |_| on_format.call(FormatAction::Code),
39
47
"<>"
40
48
}
···
44
52
button {
45
53
class: "toolbar-button",
46
54
title: "Heading 1",
55
+
aria_label: "Heading 1",
47
56
onclick: move |_| on_format.call(FormatAction::Heading(1)),
48
57
"H1"
49
58
}
50
59
button {
51
60
class: "toolbar-button",
52
61
title: "Heading 2",
62
+
aria_label: "Heading 2",
53
63
onclick: move |_| on_format.call(FormatAction::Heading(2)),
54
64
"H2"
55
65
}
56
66
button {
57
67
class: "toolbar-button",
58
68
title: "Heading 3",
69
+
aria_label: "Heading 3",
59
70
onclick: move |_| on_format.call(FormatAction::Heading(3)),
60
71
"H3"
61
72
}
···
65
76
button {
66
77
class: "toolbar-button",
67
78
title: "Bullet List",
79
+
aria_label: "Bullet List",
68
80
onclick: move |_| on_format.call(FormatAction::BulletList),
69
81
"•"
70
82
}
71
83
button {
72
84
class: "toolbar-button",
73
85
title: "Numbered List",
86
+
aria_label: "Numbered List",
74
87
onclick: move |_| on_format.call(FormatAction::NumberedList),
75
88
"1."
76
89
}
77
90
button {
78
91
class: "toolbar-button",
79
92
title: "Quote",
93
+
aria_label: "Quote",
80
94
onclick: move |_| on_format.call(FormatAction::Quote),
81
95
"❝"
82
96
}
···
86
100
button {
87
101
class: "toolbar-button",
88
102
title: "Link",
103
+
aria_label: "Link",
89
104
onclick: move |_| on_format.call(FormatAction::Link),
90
105
"🔗"
91
106
}
+1
crates/weaver-app/src/components/login.rs
+1
crates/weaver-app/src/components/login.rs
+2
-2
crates/weaver-renderer/src/atproto/writer.rs
+2
-2
crates/weaver-renderer/src/atproto/writer.rs
···
487
487
}
488
488
TaskListMarker(checked) => {
489
489
if checked {
490
-
self.write("<input disabled=\"\" type=\"checkbox\" checked=\"\"/>\n")?;
490
+
self.write("<input disabled=\"\" type=\"checkbox\" checked=\"\" aria-label=\"Completed task\"/>\n")?;
491
491
} else {
492
-
self.write("<input disabled=\"\" type=\"checkbox\"/>\n")?;
492
+
self.write("<input disabled=\"\" type=\"checkbox\" aria-label=\"Incomplete task\"/>\n")?;
493
493
}
494
494
}
495
495
WeaverBlock(text) => {
+2
-2
crates/weaver-renderer/src/base_html.rs
+2
-2
crates/weaver-renderer/src/base_html.rs
···
157
157
self.write("</a></sup>")?;
158
158
}
159
159
TaskListMarker(true) => {
160
-
self.write("<input disabled=\"\" type=\"checkbox\" checked=\"\"/>\n")?;
160
+
self.write("<input disabled=\"\" type=\"checkbox\" checked=\"\" aria-label=\"Completed task\"/>\n")?;
161
161
}
162
162
TaskListMarker(false) => {
163
-
self.write("<input disabled=\"\" type=\"checkbox\"/>\n")?;
163
+
self.write("<input disabled=\"\" type=\"checkbox\" aria-label=\"Incomplete task\"/>\n")?;
164
164
}
165
165
WeaverBlock(_text) => {}
166
166
}
+2
-2
crates/weaver-renderer/src/static_site/writer.rs
+2
-2
crates/weaver-renderer/src/static_site/writer.rs
···
546
546
self.pending_footnote = Some((name.into_static(), number));
547
547
}
548
548
TaskListMarker(true) => {
549
-
self.write("<input disabled=\"\" type=\"checkbox\" checked=\"\"/>\n")?;
549
+
self.write("<input disabled=\"\" type=\"checkbox\" checked=\"\" aria-label=\"Completed task\"/>\n")?;
550
550
}
551
551
TaskListMarker(false) => {
552
-
self.write("<input disabled=\"\" type=\"checkbox\"/>\n")?;
552
+
self.write("<input disabled=\"\" type=\"checkbox\" aria-label=\"Incomplete task\"/>\n")?;
553
553
}
554
554
WeaverBlock(text) => {
555
555
// Buffer WeaverBlock content for parsing on End