AtCoder Navbar Restrictor

restricts navbar width

2024-07-27 기준 버전입니다. 최신 버전을 확인하세요.

작성자 지원 사이트 방문, 질문 또는 리뷰 남기기, 또는 스크립트 신고하기.

줄 바꿈

// ==UserScript==
// @name         AtCoder Navbar Restrictor
// @namespace    https://twitter.com/KakurenboUni
// @version      0.0.2
// @description  restricts navbar width
// @author       uni_kakurenbo
// @match        https://atcoder.jp/contests/**
// @license      MIT
// @supportURL   https://twitter.com/KakurenboUni
// ==/UserScript==

(function() {
    'use strict';

    const $navbar =document.getElementById("navbar-collapse");
    if(!$navbar) return;

    const $contestTitle = document.getElementsByClassName("contest-title")[0];
    if(!$contestTitle) return;

    $contestTitle.style["text-overflow"] = "ellipsis"
    $contestTitle.style["text-wrap"] = "nowrap"
    $contestTitle.style["overflow-x"] = "clip"

    const observer = new ResizeObserver(() => {
        const $navbarBrand = document.getElementsByClassName("navbar-brand")[0];
        const $navbarRight = document.getElementsByClassName("navbar-right")[0];

        if(!$navbarBrand || !$navbarRight) return;

        const width = $navbar.offsetWidth - ($navbarRight.offsetWidth + $navbarBrand.offsetWidth);
        $contestTitle.style["max-width"] = `${width}px`;
    });

    observer.observe($navbar);
})();