From 511eebd7934e67a2106f4ecd721bdbd88e48c822 Mon Sep 17 00:00:00 2001
From: tophf <tophf@gmx.com>
Date: Mon, 19 Apr 2021 15:40:08 +0300
Subject: [PATCH] add a USW link in the manager

---
 _locales/en/messages.json |  4 ++++
 manage.html               |  3 +++
 manage/manage.css         | 18 ++++++++++++++++++
 3 files changed, 25 insertions(+)

diff --git a/_locales/en/messages.json b/_locales/en/messages.json
index f7cb74fa..d735ab85 100644
--- a/_locales/en/messages.json
+++ b/_locales/en/messages.json
@@ -630,6 +630,10 @@
     "message": "Translate",
     "description": "Transifex link text on the manage page"
   },
+  "linkUSW": {
+    "message": "Upload and discover styles on userstyles.world",
+    "description": "Link text for https://userstyles.world/ on the manage page"
+  },
   "linterCSSLintIncompatible": {
     "message": "CSSLint doesn't support $preprocessorname$ preprocessor",
     "placeholders": {
diff --git a/manage.html b/manage.html
index f22b5e47..f6f9ea5c 100644
--- a/manage.html
+++ b/manage.html
@@ -333,6 +333,9 @@
         <span><a href="https://add0n.com/stylus.html#features" target="_blank" i18n-text="linkGetHelp"></a></span>
         <span><a href="https://github.com/openstyles/stylus/wiki" target="_blank" i18n-text="linkStylusWiki"></a></span>
         <span><a href="https://www.transifex.com/github-7/Stylus" target="_blank" i18n-text="linkTranslate"></a></span>
+        <span><a href="https://userstyles.world/" target="_blank" i18n-text-append="linkUSW" id="link-usw">
+          <img src="https://userstyles.world/favicon.ico">
+        </a></span>
       </div>
     </div>
   </div>
diff --git a/manage/manage.css b/manage/manage.css
index 88fd8083..8e66ccd3 100644
--- a/manage/manage.css
+++ b/manage/manage.css
@@ -440,6 +440,24 @@ a:hover {
   margin: 0 .5em;
 }
 
+#link-usw {
+  display: flex;
+  align-items: center;
+  margin-top: .5em;
+}
+
+#link-usw img {
+  max-width: 2.5em;
+  max-height: 2.5em;
+  margin-right: .75em;
+  filter: grayscale(1);
+  transition: filter .5s;
+}
+
+#link-usw:hover img {
+  filter: none;
+}
+
 .newUI .entry .svg-icon.checked,
 .newUI .entry:hover .svg-icon.checked {
   fill: #000;