☰

LeetCode Horizontal Scroll for Multi Language Code

Add a horizontal scrollbar to the div container of multi programming language Code

  1. // ==UserScript==
  2. // @name         LeetCode Horizontal Scroll for Multi Language Code
  3. // @name:ar      LeetCode شريط تمرير أفقي لأكواد متعددة اللغات
  4. // @name:bg      LeetCode Хоризонтален скрол за код на мн. езици
  5. // @name:cs      LeetCode Horizontální posuvník pro kód více jazyků
  6. // @name:da      LeetCode Vandret rullebjælke til fler-sprog kode
  7. // @name:de      LeetCode Horizontale Leiste für Mehrsprach-Code
  8. // @name:el      LeetCode Οριζόντια κύλιση για κώδικα πολλών γλωσσών
  9. // @name:en      LeetCode Horizontal Scroll for Multi Language Code
  10. // @name:eo      LeetCode Horizontala Rulŝtango por Plurlingva Kodo
  11. // @name:es      LeetCode Barra horizontal para código multilenguaje
  12. // @name:fi      LeetCode Vaakavvieritys monikieliselle koodille
  13. // @name:fr      LeetCode Défilement horizontal pour code multilangue
  14. // @name:fr-CA   LeetCode Défilement horizontal pour code multi
  15. // @name:he      LeetCode גלילה אופקית לקוד רב-שפות
  16. // @name:hr      LeetCode Vodoravni klizač za višejezični kod
  17. // @name:hu      LeetCode Vízszintes görgető többnyelvű kódhoz
  18. // @name:id      LeetCode Gulir Horizontal untuk Kode Multibahasa
  19. // @name:it      LeetCode Barra orizzontale per codice multilingue
  20. // @name:ja      LeetCode マルチ言語コード用水平スクロール
  21. // @name:ka      LeetCode ჰორიზონტალური გადახვევა მრავალენოვანი
  22. // @name:ko      LeetCode 다중 언어 코드용 수평 스크롤
  23. // @name:nb      LeetCode Vannrett rullefelt for fler-språk kode
  24. // @name:nl      LeetCode Horizontale balk voor meertalige code
  25. // @name:pl      LeetCode Poziomy pasek dla kodu wielojęzycznego
  26. // @name:pt-BR   LeetCode Rolagem horizontal para código multi
  27. // @name:ro      LeetCode Bară orizontală pentru cod multilingv
  28. // @name:ru      LeetCode Горизонтальная прокрутка для кода мн. языков
  29. // @name:sk      LeetCode Horizontálny posuvník pre viacjazyčný kód
  30. // @name:sr      LeetCode Хоризонтални клизач за вишејезични код
  31. // @name:sv      LeetCode Horisontell rullning för flerspråkig kod
  32. // @name:th      LeetCode แถบเลื่อนแนวนอนสำหรับโค้ดหลายภาษา
  33. // @name:tr      LeetCode Yatay Kaydırma Çok Dilli Kod için
  34. // @name:ug      LeetCode يانتۇ سۈرگۈچ كۆپ تىللىق كود ئۈچۈن
  35. // @name:uk      LeetCode Горизонтальна прокрутка для коду мн. мов
  36. // @name:vi      LeetCode Thanh cuộn ngang cho mã đa ngôn ngữ
  37. // @name:zh      LeetCode 多语言代码水平滚动条
  38. // @name:zh-CN   LeetCode 多语言代码水平滚动条
  39. // @name:zh-HK   LeetCode 多語言程式碼水平滾動條
  40. // @name:zh-SG   LeetCode 多语言代码水平滚动条
  41. // @name:zh-TW   LeetCode 多語言程式碼區水平滾動條
  42.  
  43. // @description  Add a horizontal scrollbar to the div container of multi programming language Code
  44. // @description:ar إضافة شريط تمرير أفقي إلى حاوية div لأكواد البرمجة متعددة اللغات
  45. // @description:bg Добавяне на хоризонтален скролбар към контейнера div с код на множество програмни езици
  46. // @description:cs Přidat horizontální posuvník do kontejneru div s kódem ve více programovacích jazycích
  47. // @description:da Tilføj en vandret rullebjælke til div-beholderen med kode i flere programmeringssprog
  48. // @description:de Fügen Sie eine horizontale Bildlaufleiste zum div-Container mit Code in mehreren Programmiersprachen hinzu
  49. // @description:el Προσθήκη οριζόντιας γραμμής κύλισης στον περιέκτη div κώδικα πολλαπλών γλωσσών προγραμματισμού
  50. // @description:en Add a horizontal scrollbar to the div container of multi programming language Code
  51. // @description:eo Aldonu horizontala rulŝtango al la div-ujo de plurlingva programa kodo
  52. // @description:es Agregar una barra de desplazamiento horizontal al contenedor div de código en múltiples lenguajes de programación
  53. // @description:fi Lisää vaakasuora vierityspalkki monikielisen ohjelmointikoodin div-säiliöön
  54. // @description:fr Ajouter une barre de défilement horizontale au conteneur div de code en plusieurs langages de programmation
  55. // @description:fr-CA Ajouter une barre de défilement horizontale au conteneur div de code en plusieurs langages de programmation
  56. // @description:he הוסף גלילה אופקית למיכל ה-div של קוד בשפות תכנות מרובות
  57. // @description:hr Dodaj vodoravni klizač u spremnik div koda u više programskih jezika
  58. // @description:hu Adjon vízszintes görgetősávot a több programozási nyelvű kód div tárolójához
  59. // @description:id Tambahkan bilah gulir horizontal ke kontainer div kode bahasa pemrograman ganda
  60. // @description:it Aggiungi una barra di scorrimento orizzontale al contenitore div di codice in più linguaggi di programmazione
  61. // @description:ja マルチプログラミング言語コードのdivコンテナに水平スクロールバーを追加する
  62. // @description:ka დაამატეთ ჰორიზონტალური გადახვევის ზოლი მრავალი პროგრამირების ენის კოდის div კონტეინერს
  63. // @description:ko 다중 프로그래밍 언어 코드의 div 컨테이너에 수평 스크롤바를 추가하세요
  64. // @description:nb Legg til et vannrett rullefelt i div-beholderen med kode i flere programmeringsspråk
  65. // @description:nl Voeg een horizontale schuifbalk toe aan de div-container met code in meerdere programmeertalen
  66. // @description:pl Dodaj poziomy pasek przewijania do kontenera div z kodem w wielu językach programowania
  67. // @description:pt-BR Adicione uma barra de rolagem horizontal ao contêiner div de código em várias linguagens de programação
  68. // @description:ro Adăugați o bară de derulare orizontală la containerul div de cod în mai multe limbaje de programare
  69. // @description:ru Добавить горизонтальную прокрутку к контейнеру div с кодом на нескольких языках программирования
  70. // @description:sk Pridajte horizontálny posuvník do kontajnera div s kódom vo viacerých programovacích jazykoch
  71. // @description:sr Додај хоризонтални клизач у контејнер div кода у више програмских језика
  72. // @description:sv Lägg till en horisontell rullningslist i div-behållaren med kod för flera programmeringsspråk
  73. // @description:th เพิ่มแถบเลื่อนแนวนอนให้กับคอนเทนเนอร์ div ของโค้ดหลายภาษาการเขียนโปรแกรม
  74. // @description:tr Çoklu programlama dili kodunun div konteynerine yatay kaydırma çubuğu ekle
  75. // @description:ug كۆپ تىللىق پروگرامما كودىنىڭ div قاچىسىغا يانتۇ سۈرگۈچ قوشۇڭ
  76. // @description:uk Додайте горизонтальну прокрутку до контейнера div з кодом на кількох мовах програмування
  77. // @description:vi Thêm thanh cuộn ngang vào vùng chứa div của mã code đa ngôn ngữ lập trình
  78. // @description:zh 为多编程语言代码的div容器添加水平滚动条
  79. // @description:zh-CN 为多编程语言代码的div容器添加水平滚动条
  80. // @description:zh-HK 為多編程語言程式碼嘅div容器添加水平滾動條
  81. // @description:zh-SG 为多编程语言代码的div容器添加水平滚动条
  82. // @description:zh-tw 在多程式設計語言Code的div容器中添加一個水平滾動條
  83. // @namespace    http://tampermonkey.net/
  84. // @version      0.2.3.1
  85. // @author       aspen138
  86. // @match        https://leetcode.cn/*
  87. // @match        https://leetcode.com/*
  88. // @icon         https://assets.leetcode.cn/aliyun-lc-upload/uploaded_files/2021/03/73c9f099-abbe-4d94-853f-f8abffd459cd/leetcode.png?x-oss-process=image%2Fformat%2Cwebp
  89. // @grant        none
  90. // @license      MIT
  91. // ==/UserScript==
  92.  
  93.  
  94.  
  95.  
  96. (function() {
  97.     'use strict';
  98.  
  99.     // Add your JavaScript code here
  100.     var css = `
  101.         .flex.select-none.bg-layer-2:not(.dark) {
  102.             overflow-x: auto; /* Trigger horizontal scrolling */
  103.             display: flex; /* Ensure the items are in a flex row */
  104.             white-space: nowrap; /* Prevent wrapping of items */
  105.         }
  106.         .flex.select-none.bg-layer-2:not(.dark) > div {
  107.             flex: 0 0 auto; /* Prevent flex items from shrinking */
  108.             display: inline-block; /* Treat each div as an inline block */
  109.         }
  110.         /* Styles for dark mode */
  111.         .flex.select-none.bg-layer-2.dark.bg-dark-layer-2 {
  112.             overflow-x: auto; /* Trigger horizontal scrolling for dark mode */
  113.             display: flex; /* Ensure the items are in a flex row for dark mode */
  114.             white-space: nowrap; /* Prevent wrapping of items for dark mode */
  115.         }
  116.         .flex.select-none.bg-layer-2.dark.bg-dark-layer-2 > div {
  117.             flex: 0 0 auto; /* Prevent flex items from shrinking in dark mode */
  118.             display: inline-block; /* Treat each div as an inline block in dark mode */
  119.         }
  120.     `;
  121.  
  122.     // Create a style element
  123.     var style = document.createElement('style');
  124.     style.type = 'text/css';
  125.     style.appendChild(document.createTextNode(css));
  126.     document.head.appendChild(style);
  127. })();