LeetCode Horizontal Scroll for Multi Programming Language Code Div Container

Add a horizontal scrollbar to the div container with class 'bg-layer-2'

As of 2024-01-13. See the latest version.

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install a user script manager extension to install this script.

(I already have a user script manager, let me install it!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

// ==UserScript==
// @name         LeetCode显示的多编程语言代码区域增加水平滚动条
// @name:zh-TW   LeetCode顯示的多程式設計語言程式碼區域新增水准滾動條
// @name:en      LeetCode Horizontal Scroll for Multi Programming Language Code Div Container
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description:en Add a horizontal scrollbar to the div container with class 'bg-layer-2'
// @description:zh-tw 將水准滾動條添加到類為“bg-layer-2”的div容器中
// @description  Add a horizontal scrollbar to the div container with class 'bg-layer-2'
// @author       aspen138
// @match        https://leetcode.cn/*
// @match        https://leetcode.com/*
// @grant        none
// @license      MIT
// ==/UserScript==

(function() {
    'use strict';

    // Add your JavaScript code here
    var css = `
        .bg-layer-2 {
            overflow-x: auto; /* Trigger horizontal scrolling */
            display: flex; /* Ensure the items are in a flex row */
            white-space: nowrap; /* Prevent wrapping of items */
        }
        .bg-layer-2 > div {
            flex: 0 0 auto; /* Prevent flex items from shrinking */
            display: inline-block; /* Treat each div as an inline block */
        }
    `;

    // Create a style element
    var style = document.createElement('style');
    style.type = 'text/css';
    style.appendChild(document.createTextNode(css));
    document.head.appendChild(style);
})();