☰

AtCoder Style Optimizer for Single Display

Overrides AtCoder styles for single display

  1. // ==UserScript==
  2. // @name            AtCoder Style Optimizer for Single Display
  3. // @name:ja         AtCoder Style Optimizer for Single Display
  4. // @namespace       https://github.com/xe-o
  5. // @version         0.4
  6. // @description     Overrides AtCoder styles for single display
  7. // @description:ja  シングルディスプレイ向けにAtCoderのスタイルを最適化します
  8. // @author          XERO
  9. // @license         MIT
  10. // @match           https://atcoder.jp/*
  11. // @run-at          document-start
  12. // @grant           none
  13. // ==/UserScript==
  14.  
  15. (function () {
  16.   "use strict";
  17.  
  18.   const css = `
  19.     @media (max-width: 1100px) {
  20.       .container {
  21.         width: 100%;
  22.       }
  23.  
  24.       #main-container {
  25.         padding: 30px 20px 10px;
  26.       }
  27.  
  28.       #main-div.float-container {
  29.         background: none;
  30.       }
  31.  
  32.       .float-container > #main-container {
  33.         box-shadow: none;
  34.       }
  35.  
  36.       .h2 {
  37.         font-size: 20px;
  38.       }
  39.  
  40.       h3 {
  41.         font-size: 20px;
  42.       }
  43.  
  44.       #main-container > div.row > div:nth-child(2) > span.h2 > a {
  45.         font-size: 11px;
  46.         padding: 2px 6px;
  47.         margin-left: 8px;
  48.       }
  49.  
  50.       #contest-nav-tabs > div > small.back-to-home.pull-right {
  51.         display: none !important;
  52.       }
  53.  
  54.       #contest-nav-tabs > ul > li {
  55.         width: auto;
  56.       }
  57.  
  58.       #contest-nav-tabs > ul > li > a {
  59.         font-size: 12px;
  60.         padding: 6px 8px;
  61.       }
  62.     }
  63.  
  64.     @media screen and (min-width: 768px) {
  65.       #header .header-page, .header-lang {
  66.         display: -webkit-box !important;
  67.       }
  68.     }
  69.   `;
  70.  
  71.   const styleNode = document.createTextNode(css);
  72.   document.head.insertAdjacentHTML("beforeend", "<style></style>");
  73.   document.head.lastElementChild.appendChild(styleNode);
  74. })();