diff --git a/browser/extensions/onboarding/content/onboarding.css b/browser/extensions/onboarding/content/onboarding.css
index f6c59f675e5f..3f2d01a28fc6 100644
--- a/browser/extensions/onboarding/content/onboarding.css
+++ b/browser/extensions/onboarding/content/onboarding.css
@@ -47,7 +47,6 @@
vertical-align: top;
}
-#onboarding-notification-icon::after,
#onboarding-overlay-button::after {
background: #5ce6e6;
font-size: 12px;
@@ -55,9 +54,6 @@
text-align: center;
color: #10404a;
box-sizing: content-box;
-}
-
-#onboarding-overlay-button::after {
content: attr(aria-label);
display: inline-block;
offset-inline-start: 39px;
@@ -482,33 +478,6 @@
transform: translateY(0px);
}
-#onboarding-notification-icon {
- height: 36px;
- background: url("img/overlay-icon.svg") no-repeat;
- background-size: 36px;
- background-position: 34px;
- padding-inline-start: 190px;
- position: absolute;
- offset-block-start: 50%;
- transform: translateY(-50%);
-}
-
-#onboarding-notification-icon:dir(rtl) {
- background-position: right 34px center;
-}
-
-#onboarding-notification-icon::after {
- --height: 22px;
- --vpadding: 3px;
- position: absolute;
- content: attr(aria-label);
- top: 0;
- offset-inline-start: 73px;
- line-height: calc(var(--height) - var(--vpadding) * 2);
- border-radius: calc(var(--height) / 2);
- padding: var(--vpadding) 10px;
-}
-
#onboarding-notification-close-btn {
position: absolute;
offset-block-start: 50%;
@@ -564,11 +533,6 @@
min-width: 130px;
}
-@media all and (max-width: 960px) {
- #onboarding-notification-icon {
- display: none;
- }
-}
@media all and (max-width: 720px) {
#onboarding-notification-body {
width: 340px;
diff --git a/browser/extensions/onboarding/content/onboarding.js b/browser/extensions/onboarding/content/onboarding.js
index 00381e0341a6..3f9465a49396 100644
--- a/browser/extensions/onboarding/content/onboarding.js
+++ b/browser/extensions/onboarding/content/onboarding.js
@@ -912,11 +912,10 @@ class Onboarding {
let footer = this._window.document.createElement("footer");
footer.id = "onboarding-notification-bar";
footer.setAttribute("aria-live", "polite");
- footer.setAttribute("aria-labelledby", "onboarding-notification-icon")
+ footer.setAttribute("aria-labelledby", "onboarding-notification-tour-title")
// We use `innerHTML` for more friendly reading.
// The security should be fine because this is not from an external input.
footer.innerHTML = `
-
@@ -927,14 +926,6 @@ class Onboarding {
`;
- let toolTip = this._bundle.formatStringFromName(
- this._tourType === "new" ? "onboarding.notification-icon-tool-tip" :
- "onboarding.notification-icon-tooltip-updated",
- [BRAND_SHORT_NAME], 1);
-
- let icon = footer.querySelector("#onboarding-notification-icon");
- icon.setAttribute("aria-label", toolTip);
- icon.setAttribute("role", "presentation");
let closeBtn = footer.querySelector("#onboarding-notification-close-btn");
closeBtn.setAttribute("title",
diff --git a/browser/extensions/onboarding/locales/en-US/onboarding.properties b/browser/extensions/onboarding/locales/en-US/onboarding.properties
index b9dc8f72c758..d1322dd1e65f 100644
--- a/browser/extensions/onboarding/locales/en-US/onboarding.properties
+++ b/browser/extensions/onboarding/locales/en-US/onboarding.properties
@@ -6,8 +6,6 @@ onboarding.overlay-title2=Let’s get started
onboarding.hidden-checkbox-label-text=Mark all as complete, and hide the tour
#LOCALIZATION NOTE(onboarding.button.learnMore): this string is used as a button label, displayed near the message, and shared across all the onboarding notifications.
onboarding.button.learnMore=Learn More
-# LOCALIZATION NOTE(onboarding.notification-icon-tool-tip): This string will be used to show the tooltip alongside the notification icon in the notification bar. %S is brandShortName.
-onboarding.notification-icon-tool-tip=New to %S?
# LOCALIZATION NOTE(onboarding.overlay-icon-tooltip2): This string will be used
# to show the tooltip alongside the notification icon in the overlay tour. %S is
# brandShortName. The tooltip is designed to show in two lines. Please use \n to
diff --git a/browser/extensions/onboarding/test/browser/browser_onboarding_accessibility.js b/browser/extensions/onboarding/test/browser/browser_onboarding_accessibility.js
index 8711b0410a5e..8ae5f75ea3e9 100644
--- a/browser/extensions/onboarding/test/browser/browser_onboarding_accessibility.js
+++ b/browser/extensions/onboarding/test/browser/browser_onboarding_accessibility.js
@@ -42,17 +42,14 @@ add_task(async function test_onboarding_notification_bar() {
await ContentTask.spawn(tab.linkedBrowser, {}, function() {
let doc = content.document;
let footer = doc.getElementById("onboarding-notification-bar");
- let icon = doc.getElementById("onboarding-notification-icon")
+
+ is(footer.getAttribute("aria-labelledby"), doc.getElementById("onboarding-notification-tour-title").id,
+ "Notification bar should be labelled by the notification tour title text");
is(footer.getAttribute("aria-live"), "polite",
"Notification bar should be a live region");
- is(footer.getAttribute("aria-labelledby"), icon.id,
- "Notification bar should be labelled by the notification icon text");
- ok(icon.getAttribute("aria-label"),
- "Notification icon should have a text alternative");
// Presentational elements
[
- "onboarding-notification-icon",
"onboarding-notification-message-section",
"onboarding-notification-tour-icon",
"onboarding-notification-body"