diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index d05c308..b185db8 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -1,3 +1,5 @@ +Read this in other languages: [Français](CONTRIBUTINGfr.md) + # Welcome To Return YouTube Dislikes contributing guide Thank you for investing your time in contributing to our project! All your changes will be reflected in the next version of the extension (or the [website](https://www.returnyoutubedislike.com/)). diff --git a/CONTRIBUTINGfr.md b/CONTRIBUTINGfr.md new file mode 100644 index 0000000..5a8f07a --- /dev/null +++ b/CONTRIBUTINGfr.md @@ -0,0 +1,59 @@ +Lisez ceci dans d'autres langues : [English](CONTRIBUTING.md) + +# Bienvenue dans le guide de contribution à Return YouTube Dislikes + +Merci d'investir votre temps pour contribuer à notre projet ! Toutes vos modifications seront prises en compte dans la prochaine version de l'extension (ou du site web). + +## Pour commencer +Veuillez utiliser [Prettier](https://prettier.io/) avec les paramètres par défaut pour le formatage du code. + +#### Prérequis +Vous devez avoir installé node et npm pour créer la version bundle depuis le code source. + +Versions utilisées lors de la mise en place : + +- node: 12.18.4 +- npm: 6.14.6 + +Pour créer le fichier `bundled-content-script.js` qui contient la plupart de la logique de cette extension, vous devez d'abord installer toutes les dépendances. + +1. Allez à la racine du repo et exécutez : + +``` +npm install +``` + +2. Exécutez la commande suivante pour créer le fichier `bundled-content-script.js` qui est utilisé dans le fichier `manifest.json`. + +``` +npm start // pour créer le(s) fichier(s) de construction et lancer un observateur de fichiers qui recharge à chaud lors de la sauvegarde. + +// ou + +npm run build // pour créer le(s) fichier(s) de construction une seule fois +``` + +Félicitations, vous êtes maintenant prêt·e à développer ! + +Si vous n'avez jamais développé d'extensions pour Chrome ou si vous avez besoin d'une aide supplémentaire, consultez [ce tutoriel YouTube](https://www.youtube.com/watch?v=mdOj6HYE3_0) (en anglais). + + +### Problèmes (aussi appelé issues en anglais) +#### Signaler un problème +Si vous rencontrez des problèmes avec l'extension, vérifiez que le problème n'a pas déjà été signalé. Si ce n'est pas le cas, [signalez le problème](https://github.com/Anarios/return-youtube-dislike/issues/new?assignees=&labels=bug&template=bug.yml&title=%28Bug%29%3A+), en utilisant le formulaire qui est fortement recommandé mais pas obligatoire. + +#### Résoudre un problème +Si vous avez trouvé un problème que vous pensez pouvoir résoudre, ne soyez pas timide. Ouvrez une [PR](https://github.com/Anarios/return-youtube-dislike/pulls) [(C'est quoi ?)](https://blog.zenika.com/2017/01/24/pull-request-demystifie/) avec la solution et assurez-vous de mentionner le problème que vous résolvez (écrivez # puis le numéro de l'issue). + +### Demande de fonctionnalité (aussi appelé feature request en anglais) +#### Ouverture d'une nouvelle demande de fonctionnalité +Si vous avez une idée pour l'extension, n'hésitez pas à [ouvrir une demande de fonctionnalité](https://github.com/Anarios/return-youtube-dislike/issues/new?assignees=&labels=enhancement&template=feature-request.yml&title=%28Feature+Request%29%3A+), mais veuillez effectuer une recherche préalable pour vous assurer que la fonctionnalité n'est pas déjà proposée. L'utilisation du formulaire de demande de fonctionnalité est fortement recommandée mais pas obligatoire. + +#### Implémenter une demande de fonctionnalité +Si vous avez trouvé une fonctionnalité que vous pensez pouvoir mettre en œuvre, ne soyez pas timide. Ouvrez une [PR](https://github.com/Anarios/return-youtube-dislike/pulls) [(C'est quoi ?)](https://blog.zenika.com/2017/01/24/pull-request-demystifie/) avec le correctif et assurez-vous de mentionner la fonctionnalité que vous implémentez (écrivez # puis le numéro de l'issue). + +### Quels PR acceptons-nous ? +- Correction de problèmes. +- Implémentation de fonctionnalités. +- Fautes de frappe ou utilisation de mots plus simples et plus efficaces. +- Contributions au site web. \ No newline at end of file diff --git a/CONTRIBUTINGru.md b/CONTRIBUTINGru.md new file mode 100644 index 0000000..e217046 --- /dev/null +++ b/CONTRIBUTINGru.md @@ -0,0 +1,60 @@ +Прочитать на других языках: [English](CONTRIBUTING.md) + +# Добро пожаловать в руководство по внесению вклада Return YouTube Dislikes + +Благодарим вас за то, что вы потратили своё время на участие в нашем проекте! Все ваши изменения будут отражены в следующей версии расширения (или на [сайте](https://www.returnyoutubedislike.com/)). + +## Приступая к работе +Пожалуйста, используйте Prettier с настройками по умолчанию для форматирования кода. + +#### Необходимое + +Вам необходимо иметь установленные node и npm, чтобы создать bundled-версию источника. + +Версии, используемые при настройке: + +- node: 12.18.4 +- npm: 6.14.6 + +Для создания `bundled-content-script.js` который содержит большую часть бизнес-логики этого расширения, вы должны сначала установить все зависимости. + +1. Перейдите в корень репозитория и выполните следующее: + +``` +npm install +``` + +2. Выполните следующую команду, чтобы создать `bundled-content-script.js`, который используется в `manifest.json` + +``` +npm start // для создания файла(ов) сборки и запуска наблюдателя за файлами, который выполняет hot-reload при сохранении + +// или + +npm run build // для создания файла(ов) сборки один раз +``` + +Поздравляем, теперь вы готовы к разработке! + +Если вы новичок в разработке расширений Chrome или вам нужна дополнительная помощь, посмотрите [это руководство на YouTube (англ.)](https://www.youtube.com/watch?v=mdOj6HYE3_0) + + +### Вопросы +#### Открытие нового вопроса/проблемы +Если у вас возникли проблемы с расширением, пожалуйста, поищите, чтобы убедиться, что о проблеме ещё не сообщалось. Если это не так, откройте вопрос(issue), использование формы проблемы настоятельно рекомендуется, но не является обязательным. + +#### Решение вопроса +Если вы нашли проблему, которую, как вам кажется, вы можете решить, не стесняйтесь. Откройте запрос на извлечение(pull request) с исправлением и обязательно укажите вопрос, который вы устраняете. + +### Запрос функции +#### Открытие запроса на новую функцию +Если у вас есть идея для расширения, не стесняйтесь открыть запрос на функцию, но, пожалуйста, прежде поищите другие запросы, чтобы убедиться, что функция уже не предложена. Использование формы запроса функции настоятельно рекомендуется, но не является обязательным + +#### Внедрение запроса на функцию +Если вы нашли функцию, которую, как вам кажется, вы могли бы реализовать, не стесняйтесь. Откройте запрос на извлечение(pull request) с исправлением и обязательно укажите функцию, которую вы реализуете. + +### Какие запросы на извлечение(pull request) мы принимаем? +- Исправления проблем. +- Внедрения новых функций. +- Исправления опечаток и упрощение текста. +- Улучшения сайта. \ No newline at end of file diff --git a/Docs/FAQ.md b/Docs/FAQ.md index 02336f4..8efc8c9 100644 --- a/Docs/FAQ.md +++ b/Docs/FAQ.md @@ -1,21 +1,55 @@ +Read this in other languages: [Français](FAQfr.md) + # Frequently Asked Questions ## Before asking a question on GitHub or Discord, please refer to this. +
+ ### **1. Where does this extension get the data?** A Combination of Google APIs and scraped data. We save all available data to our DB for it to be available after Google shuts down dislike counts in their API. +
+ ### **2. Video dislike count doesn't update** Right now video dislikes are cached, and aren't updated very frequenly. Once every 2-3 days, not more often. Yeah, it's not ideal, but it is what it is. Working on improving how often we can update them. +
+ ### **3. How does this work?** The extension collects the video id of the video you are watching, fetches the dislike (and other fields like views, likes etc) using our API, if this is the first time the video was fetched by our API, it will use the YouTube API to get the data, then stores the data in a database for caching (cached for around 2-3 days) and archiving purposes and returns it to you. The extension then displays the dislikes to you. +
+ ### **4. What will happen after the YouTube API stops returning the dislike count?** The backend will switch to using a combination of archived dislike stats, estimates extrapolated from extension user data and estimates based on view/like ratios for videos whose dislikes weren't archived and for outdated dislike archives. +
+ +### **5. How is the dislike count calculated?** + +RYD uses the votes from it's users to extrapolate the dislike count. + +- If the video was uploaded after the API was shut down: + + $$ \textup{RYD Dislike Count} = \left( \frac{\textup{RYD Users Like Count}}{\textup{RYD Users Dislike Count}} \right) \times \textup{Public Like Count} $$ + +- If the RYD database somehow had the actual like and dislike count (provided by the uploader or from the archive), the dislike count will be calculated based on both - the users' votes and the archived value. The archived value will have less influence on the final count as it ages. + +
+ +--- + +This in video form + +[![IReturn YouTube Dislike Explained](https://yt-embed.herokuapp.com/embed?v=GSmmtv-0yYQ)](https://www.youtube.com/watch?v=GSmmtv-0yYQ) + +--- + +
+ ## I have security / privacy concerns See [this page](SECURITY-FAQ.md) for more info. diff --git a/Docs/FAQfr.md b/Docs/FAQfr.md new file mode 100644 index 0000000..c6c702e --- /dev/null +++ b/Docs/FAQfr.md @@ -0,0 +1,23 @@ +Lisez ceci dans d'autres langues : [English](FAQ.md) + +# Foire Aux Questions +## Avant de poser une question sur GitHub ou Discord, veuillez vous référer à ceci. + +### **1. Où cette extension obtient-elle les données ?** +Une combinaison d'API de Google et de données scrapées. + +Nous sauvegardons toutes les données disponibles dans notre base de données pour qu'elles soient disponibles après que Google ait supprimé le compteur de dislikes dans son API. + +### **2. Le nombre de dislikes sur les vidéos n'est pas mis à jour** +Actuellement, les dislike sont mis en cache et ne sont pas mis à jour très fréquemment. Une fois tous les 2-3 jours, pas plus souvent. + +Oui, ce n'est pas idéal, mais c'est ce que c'est. Nous travaillons à améliorer la fréquence des mises à jour. + +### **3. Comment cela fonctionne-t-il ?** +L'extension collecte l'ID de la vidéo que vous regardez, récupère les dislikes (et d'autres champs comme les vues, les likes etc.) en utilisant notre API, si c'est la première fois que la vidéo a été récupérée par notre API, elle utilisera l'API YouTube pour obtenir les données, puis stocke les données dans une base de données pour la mise en cache (mise en cache pendant environ 2-3 jours) et à des fins d'archivage et vous les renvoie. L'extension vous affiche ensuite les dislikes. + +### **4. Que se passera-t-il lorsque l'API YouTube ne renverra plus le nombre de dislikes ?** +Le backend utilisera une combinaison de statistiques du nombre de dislikes archivées, d'estimations extrapolées à partir des données d'extension des utilisateurs et d'estimations basées sur les ratios vues/likes pour les vidéos dont les dislikes n'ont pas été archivées et pour les archives dont le nombre de dislikes est obsolète. + +## Je suis préoccupé par la sécurité / la confidentialité +Voir [cette page](SECURITY-FAQfr.md) pour plus d'informations. \ No newline at end of file diff --git a/Docs/FAQru.txt b/Docs/FAQru.txt new file mode 100644 index 0000000..5c770df --- /dev/null +++ b/Docs/FAQru.txt @@ -0,0 +1,21 @@ +# Часто задаваемые вопросы +## Прежде чем задать вопрос на GitHub или в Discord, пожалуйста, ознакомьтесь с этим. + +### **1. Откуда это расширение получает данные?** +Комбинация API Google и старых данных. + +Мы сохраняем все имеющиеся данные в нашей базе данных, чтобы они были доступны после того, как Google прекратит подсчёт отметок «Не нравится» в своём API. + +### **2. Количество не понравившихся видео не обновляется** +В настоящее время видео с отметками «Не нравится» кэшируются и обновляются не очень часто. Раз в 2-3 дня, не чаще. + +Да, это не идеально, но это то, что есть. Мы работаем над тем, чтобы улучшить частоту их обновления. + +### **3. Как это работает?** +Расширение собирает идентификатор видео, которое вы смотрите, извлекает данные об отметках «Не нравится» (и другие поля, такие как просмотры, отметки «Нравится» и т.д.) с помощью нашего API, если видео было извлечено нашим API впервые, оно использует YouTube API для получения данных, затем сохраняет данные в базе данных для кэширования (кэшируются около 2-3 дней) и архивирования и возвращает их вам. После этого расширение отображает отметки «Не нравится» вам. + +### **4. Что произойдёт после того, как API YouTube перестанет возвращать данные о количестве отметок «Не нравится»?** +Внутренняя часть нашего сервера переключится на использование комбинации архивных статистик отметок «Не нравится», оценок, экстраполированных из данных о пользователях расширения, и оценок, основанных на соотношении просмотров и отметок «Нравится» для видео, чьи отметки «Не нравится» не были заархивированы, и для устаревших архивов с отметками «Не нравится». + +## Я беспокоюсь о безопасности / конфиденциальности +Более подробную информацию смотрите на [этой странице](SECURITY-FAQ.md). \ No newline at end of file diff --git a/Docs/SECURITY-FAQ.md b/Docs/SECURITY-FAQ.md index b9eb259..d7f11a9 100644 --- a/Docs/SECURITY-FAQ.md +++ b/Docs/SECURITY-FAQ.md @@ -1,3 +1,5 @@ +Read this in other languages: [Français](SECURITY-FAQfr.md) + # Security ### Are you tracking my viewing history? diff --git a/Docs/SECURITY-FAQfr.md b/Docs/SECURITY-FAQfr.md new file mode 100644 index 0000000..633e4c7 --- /dev/null +++ b/Docs/SECURITY-FAQfr.md @@ -0,0 +1,31 @@ +Lisez ceci dans d'autres langues : [English](SECURITY-FAQ.md) + +# Sécurité + +### Est-ce que vous traquer l'historique des vidéos que je visionne ? + +Non. Le code de l'extension est public et vous pouvez le voir par vous-même. La seule information envoyée est l'ID de la vidéo, qui est nécessaire pour récupérer le nombre de dislikes des vidéos. Aucun en-tête (headers) supplémentaire n'est envoyé. Sur la [couche de communication](https://fr.wikipedia.org/wiki/Mod%C3%A8le_OSI#Caract%C3%A9risation_r%C3%A9sum%C3%A9e_des_couches), votre adresse IP publique sera exposée au serveur, ainsi que l'heure à laquelle la demande a été faite. Toutefois, aucun de ces éléments ne permet de vous identifier de manière unique. Dans un environnement où vous ne pouvez avoir confiance en personne (zero-trust environment), le mieux que l'on puisse obtenir est une IP dynamique. Qui, aujourd'hui est la vôtre, demain est celle de votre voisin. Si vous êtes vraiment inquiet que votre IP soit tracée, vous utilisez probablement déjà un VPN. + +### Pouvez-vous m'identifier de manière unique si je dislike ? + +Oui. Lorsque vous dislikez une vidéo, nous créons pour vous un identifiant unique généré de manière aléatoire et non lié à votre compte Google. Cette mesure vise à empêcher les robots. Mais il n'y a aucun moyen de lier cet identifiant aléatoire à vous ou à votre compte YouTube personnel. + +### Quelles sont les informations dont vous disposez, exactement ? + +Juste l'ID de la vidéo. Pas vos commentaires, pas votre nom d'utilisateur, pas les personnes avec qui vous avez partagé la vidéo, pas de métadonnées supplémentaires. Rien. Juste l'ID de la vidéo. + +### Comment mon IP est-elle stockée ? + +Le backend conserve les adresses IP non hachées uniquement dans la mémoire volatile (RAM). Ces adresses ne sont pas stockées sur un disque dur et ne sont donc pas enregistrées. Nous hachons les adresses IP et stockons ça à la place. Ceci est fait pour empêcher le vandalisme de la base de données. + +### J'ai entendu des discussions sur OAuth, et l'accès à mon compte YouTube ! + +Cette fonctionnalité sera facultative et fera l'objet d'une demande d'adhésion. Si vous êtes un créateur YouTube et que vous souhaitez partager vos statistiques de dislikes avec nous, vous pouvez le faire. La façon dont [OAuth](https://fr.wikipedia.org/wiki/OAuth) a été structuré, c'est en fait très sûr. Vous pouvez révoquer l'accès à votre compte à tout moment et nous donner des autorisations très spécifiques. Nous ne demanderons pas d'autorisations qui ne sont pas nécessaires. Nous ne vous demanderons que l'autorisation de consulter les statistiques de vos vidéos. + +### Comment puis-je faire confiance à ce compte de dislikes ? + +Nous avons mis en place des mesures pour prévenir les attaques de robots et nous allons continuer à travailler pour améliorer l'efficacité du système de prévention des robots : cela nous aidera à faire en sorte que le nombre de dislikes soit une bonne représentation du nombre réel. Bien entendu, il ne sera jamais précis à 100 %, c'est donc à vous de décider si vous lui faites confiance ou non. + +### Pourquoi ne pas partager le code du backend ? + +Nous la partagerons à un moment donné - mais il n'y a pas vraiment de raison de la partager pour le moment. Cela donne un faux sentiment de sécurité, car dans un système zero-trust, nous pourrions tout aussi bien publier une version et en déployer une autre. Il y a de nombreuses raisons de garder le code caché, notamment pour lutter contre le spam. Cacher/dissimuler le code de traitement du spam est une pratique assez standard. \ No newline at end of file diff --git a/Docs/SECURITY-FAQru.md b/Docs/SECURITY-FAQru.md new file mode 100644 index 0000000..f69257e --- /dev/null +++ b/Docs/SECURITY-FAQru.md @@ -0,0 +1,31 @@ +Прочитать на других языках: [English](SECURITY-FAQ.md) + +# Безопасность + +### Вы отслеживаете мою историю просмотров? + +Нет. Код расширения находится в открытом доступе, и вы можете ознакомиться с ним самостоятельно. Единственная передаваемая информация - это идентификатор видео, который необходим для получения данных о количестве просмотров видео. Никаких дополнительных заголовков не передаётся. На коммуникационном уровне серверу будет передан ваш публичный IP-адрес, а также время, когда был сделан запрос. Однако ничто из этого не идентифицирует вас каким-либо образом. Предполагая среду с нулевым доверием, лучшее, что мы можем получить, это динамический IP. Который сегодня ваш, а завтра - вашего соседа. Если вы действительно беспокоитесь о том, что ваш IP может быть отслежен, вы, вероятно, уже используете какой-нибудь VPN. + +### Можете ли вы однозначно идентифицировать меня, если я оставил отметку «Не нравится»? + +Да. Когда вы оставляете видео отметку «Не нравится», мы создаём для вас случайно созданный уникальный идентификатор, который не привязан к вашему аккаунту Google. Это делается для избежания ботов. Но нет никакого способа привязать этот случайный идентификатор к вам или вашему личному аккаунту YouTube. + +### Какой именно информацией вы располагаете? + +Только идентификатор видео. Ни ваших комментариев, ни вашего имени пользователя, ни того, с кем вы поделились видео, ни каких-либо дополнительных метаданных. Ничего. Только идентификатор видео. + +### Как хранится мой IP-адрес? + +Внутренняя часть нашего сервера хранит нехешированные IP-адреса только в энергозависимой памяти (ОЗУ). Эти адреса не хранятся на жёстком диске и поэтому не регистрируются. Мы хэшируем IP-адреса, и оно хранится вместо них. Это сделано для предотвращения вандализма в базе данных. + +### Я слышал обсуждение OAuth и доступа к моему аккаунту на YouTube! + +Эта функция будет необязательной и очень нужной. Если вы являетесь создателем YouTube и хотите поделиться с нами статистикой отметок «Не нравится», вы можете это сделать. По своей структуре [OAuth](https://ru.wikipedia.org/wiki/OAuth#:~:text=%D0%B1%D0%B5%D0%B7%20%D0%BF%D0%B5%D1%80%D0%B5%D0%B4%D0%B0%D1%87%D0%B8%20%D0%B5%D0%B9%20(%D1%82%D1%80%D0%B5%D1%82%D1%8C%D0%B5%D0%B9%20%D1%81%D1%82%D0%BE%D1%80%D0%BE%D0%BD%D0%B5)%20%D0%BB%D0%BE%D0%B3%D0%B8%D0%BD%D0%B0%20%D0%B8%20%D0%BF%D0%B0%D1%80%D0%BE%D0%BB%D1%8F) очень безопасен. Вы можете отозвать доступ к своему аккаунту в любое время, и можете дать нам ограниченные разрешения. Мы не будем запрашивать никаких разрешений, которые не требуются. Мы будем запрашивать разрешения только для просмотра статистики ваших видео. + +### Как я могу доверять этому счётчику отметок «Не нравится»? + +Мы приняли меры по предотвращению атак ботов и собираемся продолжать работать над повышением эффективности системы предотвращения ботов: это поможет нам сохранить подсчёт отметок «Не нравится» как хороший представитель фактического количества. Конечно, он никогда не будет точным на 100%, поэтому вы сами решаете, доверять ему или нет. + +### Почему бы вам не поделиться кодом внутренней части своего сервера? + +Мы поделимся им в какой-то момент - но сейчас нет никаких реальных причин делиться ею. Это даёт ложное чувство безопасности - ведь в системе с нулевым доверием мы можем с таким же успехом раскрыть одну версию, но развернуть другую. Есть много причин держать код в тайне, в частности, как мы боремся со спамом. Скрытие и запутывание кода обработки спама - это довольно стандартная практика. diff --git a/Docs/readme.md b/Docs/readme.md index 52567fb..5a802b2 100644 --- a/Docs/readme.md +++ b/Docs/readme.md @@ -1,3 +1,5 @@ +Read this in other languages: [Français](readmefr.md) + **Contents** - [Guides](#guides) diff --git a/Docs/readmefr.md b/Docs/readmefr.md new file mode 100644 index 0000000..3d5dd5d --- /dev/null +++ b/Docs/readmefr.md @@ -0,0 +1,39 @@ +Lisez ceci dans d'autres langues : [English](readme.md) + +**Contenu** + +- [Guides](#guides) +- [FAQ](#faq) + + +
+ +## Guides + +- [Téléchargement, installation et utilisation](https://github.com/Anarios/return-youtube-dislike/wiki/T%C3%A9l%C3%A9chargement,-installation-et-utilisation) +- [Dépannage](https://github.com/Anarios/return-youtube-dislike/wiki/Guide-de-d%C3%A9pannage) + + + +
+ + +## FAQ + +- [Général](FAQfr.md) +- [Sécurité](SECURITY-FAQfr.md) + + \ No newline at end of file diff --git a/Extensions/UserScript/Return Youtube Dislike.user.js b/Extensions/UserScript/Return Youtube Dislike.user.js index 476561b..453c56e 100644 --- a/Extensions/UserScript/Return Youtube Dislike.user.js +++ b/Extensions/UserScript/Return Youtube Dislike.user.js @@ -33,6 +33,7 @@ const extConfig = { colorTheme: "classic", // [classic*, accessible, neon] Color theme (red/green, blue/yellow, pink/cyan) numberDisplayFormat: "compactShort", // [compactShort*, compactLong, standard] Number format (For non-English locale users, you may be able to improve appearance with a different option. Please file a feature request if your locale is not covered) numberDisplayRoundDown: true, // [true*, false] Round down numbers (Show rounded down numbers) + tooltipPercentageMode: "none", // [none*, dash_like, dash_dislike, both, only_like, only_dislike] Mode of showing percentage in like/dislike bar tooltip. numberDisplayReformatLikes: false, // [true, false*] Re-format like numbers (Make likes and dislikes format consistent) // END USER OPTIONS }; @@ -203,10 +204,10 @@ function getLikeCountFromButton() { if (isShorts()) { //Youtube Shorts don't work with this query. It's not nessecary; we can skip it and still see the results. //It should be possible to fix this function, but it's not critical to showing the dislike count. - return 0; + return false; } let likesStr = getLikeButton() - .querySelector("button") + .querySelector("yt-formatted-string#text") .getAttribute("aria-label") .replace(/\D/g, ""); return likesStr.length > 0 ? parseInt(likesStr) : false; @@ -262,6 +263,32 @@ function createRateBar(likes, dislikes) { const widthPercent = likes + dislikes > 0 ? (likes / (likes + dislikes)) * 100 : 50; + var likePercentage = parseFloat(widthPercent.toFixed(1)); + const dislikePercentage = (100 - likePercentage).toLocaleString(); + likePercentage = likePercentage.toLocaleString(); + + var tooltipInnerHTML; + switch (extConfig.tooltipPercentageMode) { + case "dash_like": + tooltipInnerHTML = `${likes.toLocaleString()} / ${dislikes.toLocaleString()}  -  ${likePercentage}%` + break; + case "dash_dislike": + tooltipInnerHTML = `${likes.toLocaleString()} / ${dislikes.toLocaleString()}  -  ${dislikePercentage}%` + break; + case "both": + tooltipInnerHTML = `${likePercentage}% / ${dislikePercentage}%` + break; + case "only_like": + tooltipInnerHTML = `${likePercentage}%` + break; + case "only_dislike": + tooltipInnerHTML = `${dislikePercentage}%` + break; + default: + tooltipInnerHTML = `${likes.toLocaleString()} / ${dislikes.toLocaleString()}` + } + + if (!rateBar && !isMobile) { let colorLikeStyle = ""; let colorDislikeStyle = ""; @@ -269,7 +296,7 @@ function createRateBar(likes, dislikes) { colorLikeStyle = "; background-color: " + getColorFromTheme(true); colorDislikeStyle = "; background-color: " + getColorFromTheme(false); } - + document.getElementById("menu-container").insertAdjacentHTML( "beforeend", ` @@ -286,7 +313,7 @@ function createRateBar(likes, dislikes) { - ${likes.toLocaleString()} / ${dislikes.toLocaleString()} + ${tooltipInnerHTML} ` @@ -300,8 +327,8 @@ function createRateBar(likes, dislikes) { document.querySelector( "#ryd-dislike-tooltip > #tooltip" - ).innerHTML = `${likes.toLocaleString()} / ${dislikes.toLocaleString()}`; - + ).innerHTML = tooltipInnerHTML; + if (extConfig.coloredBar) { document.getElementById("return-youtube-dislike-bar-container").style.backgroundColor = getColorFromTheme(false); @@ -372,6 +399,12 @@ function likeClicked() { createRateBar(likesvalue, dislikesvalue); previousState = 1; } + if (extConfig.numberDisplayReformatLikes === true) { + const nativeLikes = getLikeCountFromButton(); + if (nativeLikes !== false) { + setLikes(numberFormat(nativeLikes)); + } + } } } @@ -393,6 +426,12 @@ function dislikeClicked() { setDislikes(numberFormat(dislikesvalue)); createRateBar(likesvalue, dislikesvalue); previousState = 2; + if (extConfig.numberDisplayReformatLikes === true) { + const nativeLikes = getLikeCountFromButton(); + if (nativeLikes !== false) { + setLikes(numberFormat(nativeLikes)); + } + } } } } @@ -434,32 +473,38 @@ function roundDown(num) { } function numberFormat(numberState) { - let userLocales; - try { - userLocales = new URL( - Array.from(document.querySelectorAll("head > link[rel='search']")) - ?.find((n) => n?.getAttribute("href")?.includes("?locale=")) - ?.getAttribute("href") - )?.searchParams?.get("locale"); - } catch { - userLocales = document.documentElement.lang; - } - let numberDisplay; if (extConfig.numberDisplayRoundDown === false) { numberDisplay = numberState; } else { numberDisplay = roundDown(numberState); } - return getNumberFormatter(extConfig.numberDisplayFormat, userLocales).format( + return getNumberFormatter(extConfig.numberDisplayFormat).format( numberDisplay ); } -function getNumberFormatter(optionSelect, userLocales) { +function getNumberFormatter(optionSelect) { + let userLocales; + if (document.documentElement.lang) { + userLocales = document.documentElement.lang; + } else if (navigator.language) { + userLocales = navigator.language; + } else { + try { + userLocales = new URL( + Array.from(document.querySelectorAll("head > link[rel='search']")) + ?.find((n) => n?.getAttribute("href")?.includes("?locale=")) + ?.getAttribute("href") + )?.searchParams?.get("locale"); + } catch { + cLog('Cannot find browser locale. Use en as default for number formatting.'); + userLocales = 'en'; + } + } + let formatterNotation; let formatterCompactDisplay; - switch (optionSelect) { case "compactLong": formatterNotation = "compact"; @@ -476,7 +521,7 @@ function getNumberFormatter(optionSelect, userLocales) { } const formatter = Intl.NumberFormat( - document.documentElement.lang || userLocales || navigator.language, + userLocales, { notation: formatterNotation, compactDisplay: formatterCompactDisplay, @@ -516,7 +561,7 @@ function getColorFromTheme(voteIsLike) { function setEventListeners(evt) { let jsInitChecktimer; - function checkForJS_Finish(check) { + function checkForJS_Finish() { console.log(); if (isShorts() || (getButtons()?.offsetParent && isVideoLoaded())) { const buttons = getButtons(); diff --git a/Extensions/combined/_locales/de/messages.json b/Extensions/combined/_locales/de/messages.json index 9250528..9b0a7ba 100644 --- a/Extensions/combined/_locales/de/messages.json +++ b/Extensions/combined/_locales/de/messages.json @@ -2,7 +2,6 @@ "extensionName": { "message": "Return YouTube Dislike" }, - "extensionNameBeta": { "message": "Return YouTube Dislike Beta" }, @@ -50,5 +49,38 @@ }, "customNumberFormats": { "message": "Benutzerdefinierte Zahlenformate" + }, + "considerDonating": { + "message": "Das Einzige, was die Erweiterung am Laufen hält, sind Ihre Spenden, bitte erwägen Sie, das Projekt zu unterstützen." + }, + "roundNumbers": { + "message": "Zeige abgerundete Zahlen" + }, + "roundNumbersHover": { + "message": "Zahlen abrunden (Standardverhalten von YouTube)." + }, + "reformatLikes": { + "message": "Wie Zahlen neu formatieren" + }, + "reformatLikesHover": { + "message": "Machen Sie das Format der Vorlieben und Abneigungen konsistent." + }, + "numberFormat": { + "message": "Zahlenformat:" + }, + "colorizeRatio": { + "message": "Verhältnisbalken einfärben" + }, + "colorizeRatioHover": { + "message": "Benutzerdefinierte Farben für die Verhältnisleiste verwenden." + }, + "colorizeThumbs": { + "message": "Buttons einfärben" + }, + "colorizeThumbsHover": { + "message": "Benutzerdefinierte Farben für die Schaltflächensymbole verwenden." + }, + "colorTheme": { + "message": "Farbschema:" } } diff --git a/Extensions/combined/_locales/en/messages.json b/Extensions/combined/_locales/en/messages.json index 28c476c..a5ba9c0 100644 --- a/Extensions/combined/_locales/en/messages.json +++ b/Extensions/combined/_locales/en/messages.json @@ -23,6 +23,9 @@ "linkHelp": { "message": "Help" }, + "linkChangelog": { + "message": "Change Log" + }, "legendSettings": { "message": "Settings" }, @@ -30,16 +33,55 @@ "message": "Disable like/dislike submission" }, "textLikesDisabled": { - "message": "disabled by owner" + "message": "Disabled by Owner" }, "textSettingsHover": { "message": "Stops counting your likes and dislikes." }, + "textRoundingNumbers": { + "message": "Round down like/dislike stats (default YouTube behavior)" + }, + "textRoundingNumbersHover": { + "message": "Show rounded down stats." + }, + "textConsistentFormat": { + "message": "Make likes and dislikes format consistent" + }, + "textConsistentFormatHover": { + "message": "Re-format like numbers." + }, + "textNumberFormat": { + "message": "Number format:" + }, + "textColorizeRatioBar": { + "message": "Colorize ratio bar" + }, + "textColorizeRatioBarHover": { + "message": "Use custom colors for ratio bar." + }, + "textColorizeThumbs": { + "message": "Colorize thumbs" + }, + "textColorizeThumbsHover": { + "message": "Use custom colors for thumb icons." + }, + "textColorTheme": { + "message": "Color theme:" + }, + "textColorTheme1": { + "message": "Classic" + }, + "textColorTheme2": { + "message": "Accessible" + }, + "textColorTheme3": { + "message": "Neon" + }, "textTempUnavailable": { - "message": "temporarily unavailable" + "message": "Temporarily Unavailable" }, "textUpdate": { - "message": "update to" + "message": "Update to" }, "version30installed": { "message": "Version 3.0.0.1 installed" @@ -58,5 +100,35 @@ }, "considerDonating": { "message": "The only thing that keeps the extension running is your donations, please consider supporting the project." + }, + "roundNumbers": { + "message": "Show rounded down numbers" + }, + "roundNumbersHover": { + "message": "Round down numbers (default YouTube behavior)." + }, + "reformatLikes": { + "message": "Re-format like numbers" + }, + "reformatLikesHover": { + "message": "Make likes and dislikes format consistent." + }, + "numberFormat": { + "message": "Number format:" + }, + "colorizeRatio": { + "message": "Colorize ratio bar" + }, + "colorizeRatioHover": { + "message": "Use custom colors for the ratio bar." + }, + "colorizeThumbs": { + "message": "Colorize thumbs" + }, + "colorizeThumbsHover": { + "message": "Use custom colors for the thumb icons." + }, + "colorTheme": { + "message": "Color theme:" } } diff --git a/Extensions/combined/_locales/es/messages.json b/Extensions/combined/_locales/es/messages.json index efb95da..121c0ee 100644 --- a/Extensions/combined/_locales/es/messages.json +++ b/Extensions/combined/_locales/es/messages.json @@ -1,15 +1,15 @@ { "extensionName": { - "message": "Regresar los Dislikes de YouTube" + "message": "Return YouTube Dislike" }, "extensionNameBeta": { "message": "Return YouTube Dislike Beta" }, "extensionDesc": { - "message": "Regresa la posibilidad de ver los dislikes" + "message": "Recupera la característica de los «dislikes» («No me gusta»)" }, "textDeveloper": { - "message": "por Dmitry Selivanov y la Comunidad" + "message": "por Dmitry Selivanov y la comunidad" }, "linkWebsite": { "message": "Página web" @@ -23,16 +23,112 @@ "linkHelp": { "message": "Ayuda" }, + "linkChangelog": { + "message": "Historial de cambios" + }, "legendSettings": { "message": "Ajustes" }, "textSettings": { - "message": "Desactivar los dislikes" + "message": "Desactivar envío de votos" + }, + "textLikesDisabled": { + "message": "desactivado por el propietario" }, "textSettingsHover": { - "message": "Dejar de contar los dislikes." + "message": "Deja de contar tus «Me gusta» y «No me gusta»." + }, + "textRoundingNumbers": { + "message": "Redondear cifras (comportamiento original de YouTube)" + }, + "textRoundingNumbersHover": { + "message": "Muestra las estadísticas redondeadas." + }, + "textConsistentFormat": { + "message": "Unificar formato de votos" + }, + "textConsistentFormatHover": { + "message": "Cambia el formato de las cifras de «Me gusta» y «No me gusta»." + }, + "textNumberFormat": { + "message": "Formato de cifras:" + }, + "textColorizeRatioBar": { + "message": "Cambiar color de barra de votos" + }, + "textColorizeRatioBarHover": { + "message": "Utiliza colores personalizados para la barra de votos." + }, + "textColorizeThumbs": { + "message": "Cambiar color de iconos de pulgares" + }, + "textColorizeThumbsHover": { + "message": "Utiliza colores personalizados para los iconos de los pulgares." + }, + "textColorTheme": { + "message": "Esquema de colores:" + }, + "textColorTheme1": { + "message": "Clásico" + }, + "textColorTheme2": { + "message": "Accesible" + }, + "textColorTheme3": { + "message": "Neón" + }, + "textTempUnavailable": { + "message": "no disponible temporalmente" }, "textUpdate": { "message": "actualizar a" + }, + "version30installed": { + "message": "Versión 3.0.0.1 instalada" + }, + "whatsnew": { + "message": "Novedades" + }, + "shortsSupport": { + "message": "Soporte de YouTube Shorts" + }, + "customColors": { + "message": "Colores personalizados para la barra y los botones que no me gustan" + }, + "customNumberFormats": { + "message":"Formatos de números personalizados" + }, + "considerDonating": { + "message": "Lo único que mantiene la extensión en funcionamiento son sus donaciones, considere apoyar el proyecto." + }, + "roundNumbers": { + "message": "Mostrar números redondeados hacia abajo" + }, + "roundNumbersHover": { + "message": "Redondear números hacia abajo (comportamiento predeterminado de YouTube)." + }, + "reformatLikes": { + "message": "Reformatear como números" + }, + "reformatLikesHover": { + "message": "Haz que el formato de like y dislike sea consistente." + }, + "numberFormat": { + "message": "Formato de número:" + }, + "colorizeRatio": { + "message": "Colorear barra de relación" + }, + "colorizeRatioHover": { + "message": "Usar colores personalizados para la barra de proporción." + }, + "colorizeThumbs": { + "message": "Colorear los botones likes y dislike" + }, + "colorizeThumbsHover": { + "message": "Usar colores personalizados para los íconos de los botones." + }, + "colorTheme": { + "message": "Combinación de colores:" } } diff --git a/Extensions/combined/_locales/fr/messages.json b/Extensions/combined/_locales/fr/messages.json index 46105d0..95d6193 100644 --- a/Extensions/combined/_locales/fr/messages.json +++ b/Extensions/combined/_locales/fr/messages.json @@ -40,5 +40,53 @@ }, "textUpdate": { "message": "mettre à jour vers" + }, + "version30installed": { + "message": "Version 3.0.0.1 installée" + }, + "whatsnew": { + "message": "Quoi de neuf" + }, + "shortsSupport": { + "message": "Prise en charge des YouTube Shorts" + }, + "customColors": { + "message": "Couleurs personnalisées pour la barre du dislike et les boutons" + }, + "customNumberFormats": { + "message": "Formats numériques personnalisés" + }, + "considerDonating": { + "message": "La seule chose qui permet à l'extension de fonctionner est vos dons, veuillez envisager de soutenir le projet." + }, + "roundNumbers": { + "message": "Afficher les nombres arrondis" + }, + "roundNumbersHover": { + "message": "Arrondir les nombres à la baisse (comportement par défaut de YouTube)." + }, + "reformatLikes": { + "message": "Formater le nombre de likes" + }, + "reformatLikesHover": { + "message": "Rend la valeur des statistiques plus cohérente." + }, + "numberFormat": { + "message": "Format numérique:" + }, + "colorizeRatio": { + "message": "Coloriser la barre de ratio" + }, + "colorizeRatioHover": { + "message": "Utilisez des couleurs personnalisées pour la barre de ratio." + }, + "colorizeThumbs": { + "message": "Mettre en couleur les boutons like et dislike" + }, + "colorizeThumbsHover": { + "message": "Utiliser des couleurs personnalisées pour les boutons like et dislike." + }, + "colorTheme": { + "message": "Schéma de couleur:" } } diff --git a/Extensions/combined/_locales/gr/messages.json b/Extensions/combined/_locales/gr/messages.json index dc548e6..269504c 100644 --- a/Extensions/combined/_locales/gr/messages.json +++ b/Extensions/combined/_locales/gr/messages.json @@ -49,5 +49,38 @@ }, "customNumberFormats": { "message": "Προσαρμοζόμενη μορφή αριθμών." + }, + "considerDonating": { + "message": "Το μόνο πράγμα που διατηρεί την επέκταση σε λειτουργία είναι οι δωρεές σας, σκεφτείτε να υποστηρίξετε το έργο." + }, + "roundNumbers": { + "message": "Εμφάνιση στρογγυλεμένων αριθμών" + }, + "roundNumbersHover": { + "message": "Στρογγυλοποιήστε την τιμή μέτρησης (αυτή είναι η προεπιλεγμένη επιλογή του YouTube)." + }, + "reformatLikes": { + "message": "Μορφοποίηση του αριθμού των likes" + }, + "reformatLikesHover": { + "message": "Κάνει την αξία των στατιστικών πιο συνεπή." + }, + "numberFormat": { + "message": "Αριθμητική μορφή" + }, + "colorizeRatio": { + "message": "Χρωματίστε τη γραμμή dislikes" + }, + "colorizeRatioHover": { + "message": "Χρωματίστε τη γραμμή dislikes με προσαρμοσμένα χρώματα." + }, + "colorizeThumbs": { + "message": "Χρωματίστε τα κουμπιά" + }, + "colorizeThumbsHover": { + "message": "Χρωματίστε τα κουμπιά likes και dislikes με προσαρμοσμένα χρώματα." + }, + "colorTheme": { + "message": "Χρωματικός συνδυασμός:" } } diff --git a/Extensions/combined/_locales/it/messages.json b/Extensions/combined/_locales/it/messages.json index dbcca07..adf6dcb 100644 --- a/Extensions/combined/_locales/it/messages.json +++ b/Extensions/combined/_locales/it/messages.json @@ -9,7 +9,7 @@ "message": "Ripristina la possibilità di vedere i dislikes" }, "textDeveloper": { - "message": "di Dmitry Selivanov e la Community" + "message": "grazie a Dmitry Selivanov e alla Comunità" }, "linkWebsite": { "message": "Sito web" @@ -27,10 +27,10 @@ "message": "Impostazioni" }, "textSettings": { - "message": "Disabilita l'invio di like/dislike" + "message": "Disabilita l'invio dei like e dei dislike" }, "textSettingsHover": { - "message": "Interrompe il conteggio dei tuoi likes e dislikes." + "message": "Interrompe il conteggio dei tuoi likes e dislikes da parte dell'estensione." }, "textUpdate": { "message": "aggiorna a" @@ -39,7 +39,7 @@ "message": "Versione 3.0.0.1 installata" }, "whatsnew": { - "message": "Cosa c'è di nuovo" + "message": "Quali sono le novità" }, "shortsSupport": { "message": "Supporto per YouTube Shorts" @@ -49,5 +49,38 @@ }, "customNumberFormats": { "message": "Formati numerici personalizzati" + }, + "considerDonating": { + "message": "Le uniche cosa che tengono in piedi il progetto sono le vostre donazioni. Per favore, considera di effettuare una donazione per supportarci. Grazie." + }, + "roundNumbers": { + "message": "Mostra i numeri arrotondati" + }, + "roundNumbersHover": { + "message": "Arrotonda il valore del conteggio (questa è l'opzione predefinita di YouTube)." + }, + "reformatLikes": { + "message": "Formatta il numero di like" + }, + "reformatLikesHover": { + "message": "Rende il valore delle statistiche più consistente." + }, + "numberFormat": { + "message": "Formato numerico" + }, + "colorizeRatio": { + "message": "Colora la barra dei dislike" + }, + "colorizeRatioHover": { + "message": "Colora la barra dei dislike con colori personalizzati." + }, + "colorizeThumbs": { + "message": "Colora i pulsanti" + }, + "colorizeThumbsHover": { + "message": "Colora i pulsanti dei like e dei dislike con colori personalizzati." + }, + "colorTheme": { + "message": "Schema colori:" } } diff --git a/Extensions/combined/_locales/ja/messages.json b/Extensions/combined/_locales/ja/messages.json index baf7d7f..9a84fae 100644 --- a/Extensions/combined/_locales/ja/messages.json +++ b/Extensions/combined/_locales/ja/messages.json @@ -57,6 +57,36 @@ "message": "評価数の表示形式のカスタマイズ" }, "considerDonating": { - "message": "この拡張機能を存続させることができるのは、皆様からの寄付だけです。" + "message": "この拡張機能を存続させることができるのは,皆様からの寄付だけです。" + }, + "roundNumbers":{ + "message":"四捨五入された数値を表示" + }, + "roundNumbersHover":{ + "message": "カウント値を四捨五入します（これはYouTubeのデフォルトオプションです）。" + }, + "reformatLikes":{ + "message":"いいねの数をフォーマットする" + }, + "reformatLikesHover":{ + "message":"統計値の一貫性を高めます。" + }, + "numberFormat":{ + "message":"数値形式" + }, + "colorizeRatio":{ + "message":"嫌いなバーに色を付ける" + }, + "colorizeRatioHover":{ + "message":"嫌いなバーをカスタムカラーで色付けします。" + }, + "colorizeThumbs":{ + "message":"ボタンに色を付ける" + }, + "colorizeThumbsHover":{ + "message":"カスタムカラーのボタンの色が好きで嫌いです。" + }, + "colorTheme":{ + "message": "配色：" } } diff --git a/Extensions/combined/_locales/pt_BR/messages.json b/Extensions/combined/_locales/pt_BR/messages.json index 26f40f3..fa6c75a 100644 --- a/Extensions/combined/_locales/pt_BR/messages.json +++ b/Extensions/combined/_locales/pt_BR/messages.json @@ -1,21 +1,21 @@ { "extensionName": { - "message": "Devolver Dislikes do YouTube" + "message": "Voltar Dislikes do YouTube" }, "extensionNameBeta": { - "message": "Return YouTube Dislike Beta" + "message": "Voltar Dislikes do YouTube Beta" }, "extensionDesc": { - "message": "A capacidade de ver os retornos de não gostos" + "message": "Voltar os Deslikes do YouTube" }, "textDeveloper": { - "message": "por Dmitry Selivanov e a Comunidade" + "message": "por Dmitry Selivanov e Comunidade" }, "linkWebsite": { "message": "Website" }, "linkFAQ": { - "message": "FAQ" + "message": "Perguntas Frequentes" }, "linkDonate": { "message": "Doe" @@ -24,15 +24,39 @@ "message": "Ajuda" }, "legendSettings": { - "message": "Ajustes" + "message": "Configurações" }, "textSettings": { - "message": "Desaproveitar as aversões" + "message": "Desativar envio de Curtidas/Não Curtidas" + }, + "textLikesDisabled": { + "message": "Desativado pelo proprietário" }, "textSettingsHover": { - "message": "Pare de contar as antipatias." + "message": "Parar de contar suas curtidas e não curtidas." + }, + "textTempUnavailable": { + "message": "Temporariamente indisponível" }, "textUpdate": { - "message": "atualização para" + "message": "Atualizar para" + }, + "version30installed": { + "message": "Versão 3.0.0.1 instalada" + }, + "whatsnew": { + "message": "O que há de novo?" + }, + "shortsSupport": { + "message": "Suporte para Shorts" + }, + "customColors": { + "message": "Cores personalizadas para barra de não curtidas e botões" + }, + "customNumberFormats": { + "message": "Formato de números personalizados" + }, + "considerDonating": { + "message": "A única coisa que mantém a extensão funcionando são suas doações, considere apoiar o projeto." } -} +} \ No newline at end of file diff --git a/Extensions/combined/_locales/ru/messages.json b/Extensions/combined/_locales/ru/messages.json index 6af9141..c275bf9 100644 --- a/Extensions/combined/_locales/ru/messages.json +++ b/Extensions/combined/_locales/ru/messages.json @@ -52,5 +52,35 @@ }, "considerDonating": { "message": "Единственный источник доходов позволяющий расширению продолжать работу - ваши пожертвования. Пожалуйста, поддержите нас и помогите нам развиваться." + }, + "roundNumbers": { + "message": "Показывать округленные числа" + }, + "roundNumbersHover": { + "message": "Округлить значение счетчика (это параметр YouTube по умолчанию)." + }, + "reformatLikes": { + "message": "Форматировать количество лайков" + }, + "reformatLikesHover": { + "message": "Делает значение статистики более последовательным." + }, + "numberFormat": { + "message": "Числовой формат" + }, + "colorizeRatio": { + "message": "Раскрасьте полосу неприязни" + }, + "colorizeRatioHover": { + "message": "Раскрасьте полосу неприязни собственными цветами." + }, + "colorizeThumbs": { + "message": "Раскрасьте кнопки" + }, + "colorizeThumbsHover": { + "message": "Раскрасьте кнопки нравится и не нравится с помощью пользовательских цветов." + }, + "colorTheme": { + "message": "Цветовая схема:" } } diff --git a/Extensions/combined/popup.css b/Extensions/combined/popup.css index dfe94cb..2ff8516 100644 --- a/Extensions/combined/popup.css +++ b/Extensions/combined/popup.css @@ -15,7 +15,8 @@ html, body { background-color: var(--background); color: var(--white); - min-width: 300px; + min-width: 310px; + min-height: 350px; padding: 0.5em; font-family: "Roboto", Arial, Helvetica, sans-serif; font-size: 14px; @@ -68,9 +69,12 @@ button:hover { border-radius: 0.25rem; } -.switch:before { + +.switch::before, .label-with-hover-tip::before { content: attr(data-hover); visibility: hidden; + opacity: 0; + transition: visibility 0.1s linear, opacity 0.1s linear; width: 250px; background-color: var(--secondary); border-radius: 0.5rem; @@ -82,8 +86,27 @@ button:hover { top: 160%; } -.switch:hover:before { + +.switch:hover::before, .label-with-hover-tip:hover::before { visibility: visible; + opacity: 1; +} + +.fade-in { + opacity: 1; + animation-name: fadeInOpacity; + animation-iteration-count: 1; + animation-timing-function: ease-in; + animation-duration: 2s; +} + +@keyframes fadeInOpacity { + 0% { + opacity: 0; + } + 100% { + opacity: 1; + } } #advancedToggle { @@ -123,6 +146,32 @@ button:hover { border: 2px solid var(--secondary); border-radius: 0.5rem; padding: 1rem; + overflow-y: auto; + overflow-x: hidden; +} + +::-webkit-scrollbar { + width: 1rem; +} + +::-webkit-scrollbar-track { + background: #111; /* color of the tracking area */ +} + +::-webkit-scrollbar-thumb { + background-color: #333; /* color of the scroll thumb */ + border-radius: 1rem 0 0 1rem; /* roundness of the scroll thumb */ + border-bottom: 0.25rem solid #111; /* creates padding around scroll thumb */ + border-left: 0.25rem solid #111; /* creates padding around scroll thumb */ + border-top: 0.25rem solid #111; /* creates padding around scroll thumb */ +} + +::-webkit-scrollbar-thumb:hover { + background-color: #f22; /* color of the scroll thumb */ + border-radius: 1rem 0 0 1rem; /* roundness of the scroll thumb */ + border-bottom: 0.25rem solid #111; /* creates padding around scroll thumb */ + border-left: 0.25rem solid #111; /* creates padding around scroll thumb */ + border-top: 0.25rem solid #111; /* creates padding around scroll thumb */ } #advancedLegend { @@ -142,6 +191,14 @@ button:hover { margin-bottom: 1rem; } +.label-with-hover-tip { + position: relative; + display: inline-block; + width: 80px; + height: 17px; + margin-bottom: 1rem; +} + .switch:last-of-type { margin-bottom: 0; } @@ -162,7 +219,7 @@ button:hover { border-radius: 34px; } -.slider:before { +.slider::before { position: absolute; content: ""; height: 13px; @@ -178,7 +235,7 @@ input:checked + .slider { background: var(--accent); } -input:checked + .slider:before { +input:checked + .slider::before { transform: translateX(13px); background: var(--primary); } diff --git a/Extensions/combined/popup.html b/Extensions/combined/popup.html index 7d39246..8318901 100644 --- a/Extensions/combined/popup.html +++ b/Extensions/combined/popup.html @@ -44,7 +44,7 @@

@@ -94,28 +94,28 @@ __MSG_legendSettings__ -