diff --git a/i18n/en.json b/i18n/en.json
index 71cf4ae77..ee7e50130 100644
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -91,5 +91,9 @@
"vector-night-mode-issue-reporting-link-notification": "Report received!",
"vector-night-mode-issue-reporting-preload-title": "$1 dark mode error",
"vector-night-mode-issue-reporting-preload-content": "\n'''Issue Description'''",
- "vector-night-mode-beta-tag": "(beta)"
+ "vector-night-mode-beta-tag": "(beta)",
+ "vector-night-mode-launch-title": "Wikipedia's new colors",
+ "vector-night-mode-launch-subtitle": "Try dark mode today",
+ "vector-night-mode-launch-description-day": "Wikipedia is now available in dark mode. Try it out by clicking \"Dark\" in the \"Color\" section of the Appearance menu on the right.",
+ "vector-night-mode-launch-close-label": "Close"
}
diff --git a/i18n/qqq.json b/i18n/qqq.json
index 448265945..17d3606e2 100644
--- a/i18n/qqq.json
+++ b/i18n/qqq.json
@@ -108,5 +108,9 @@
"vector-night-mode-issue-reporting-link-notification": "Notification that shows after clicking link.",
"vector-night-mode-issue-reporting-preload-title": "The prefilled title of the form used to submit dark mode errors. $1 is a link to the current page, formatted as a wikitext external link, for example \"[https://en.wikipedia.org/wiki/Songhai_Empire Songhai Empire]\".",
"vector-night-mode-issue-reporting-preload-content": "The prefilled content of the form used to submit dark mode errors",
- "vector-night-mode-beta-tag": "A tag appearing in the Appearance menu informing users that this feature is in beta."
+ "vector-night-mode-beta-tag": "A tag appearing in the Appearance menu informing users that this feature is in beta.",
+ "vector-night-mode-launch-title": "Title of a modal that appears informing users of the new dark mode feature",
+ "vector-night-mode-launch-subtitle": "Subtitle of a modal that appears informing users of the new dark mode feature. \"Dark\" should be translated consistently with {{msg-mw|Skin-theme-night-label}}.",
+ "vector-night-mode-launch-description-day": "Text in the dark mode launch modal describing the dark mode feature, when dark mode is disabled. \"Settings\" is {{msg-mw|Mobile-frontend-main-menu-settings-heading}}.",
+ "vector-night-mode-launch-close-label": "Label for button to close the dark-mode launch modal"
}
diff --git a/jest.config.js b/jest.config.js
index eee486d91..21cb7b039 100644
--- a/jest.config.js
+++ b/jest.config.js
@@ -26,7 +26,8 @@ module.exports = {
// An array of regexp pattern strings used to skip coverage collection
coveragePathIgnorePatterns: [
- '/node_modules/'
+ '/node_modules/',
+ 'DarkModeLaunchBanner.js'
],
// An object that configures minimum threshold enforcement for coverage results
diff --git a/resources/skins.vector.DarkModeLaunchBanner/DarkModeLaunchBanner.js b/resources/skins.vector.DarkModeLaunchBanner/DarkModeLaunchBanner.js
new file mode 100644
index 000000000..c5ab6d2ab
--- /dev/null
+++ b/resources/skins.vector.DarkModeLaunchBanner/DarkModeLaunchBanner.js
@@ -0,0 +1,74 @@
+const makeTemplate = function () {
+ const templateString = `