☰

betaseries responsive + customizations

betaseries website is more suitable for wide screens.

  1. /* ==UserStyle==
  2. @name           betaseries responsive + customizations
  3. @version        1.0.2
  4. @description    betaseries website is more suitable for wide screens.
  5. @author         BreatFR (https://breat.fr)
  6. @namespace      https://gitlab.com/breatfr
  7. @homepageURL    https://gitlab.com/breatfr/betaseries
  8. @supportURL     https://discord.gg/Q8KSHzdBxs
  9. @license        AGPL-3.0-or-later; https://www.gnu.org/licenses/agpl-3.0.txt
  10. @preprocessor   stylus
  11.  
  12. @var    text        fontsize    "Custom font size"  1.2rem
  13. @var    checkbox    noads       "No ads"            1
  14. @var    checkbox    widemode    "Wide mode"         1
  15. ==/UserStyle== */
  16.  
  17. /* === Credits ===
  18. Website         https://breat.fr
  19. facebook        https://www.facebook.com/breatfroff
  20. mastodon        https://mastodon.social/@breat_fr
  21. telegram        https://t.me/breatfr
  22. vk              https://vk.com/breatfroff
  23. X (twitter)     https://x.com/breatfroff
  24. === Credits === */
  25.  
  26. @-moz-document domain("betaseries.com") {
  27.     /* Custom font size */
  28.     .blockInformations__synopsis {
  29.         font-size: fontsize !important;
  30.         line-height: 1.5;
  31.     }
  32.     
  33.     /* Some border-radius on corners */
  34.     .objectFitCover,
  35.     .progressBarShow,
  36.     .slide__image img,
  37.     .slide__comment {
  38.         border-radius: .5em;
  39.     }
  40.     
  41.     if noads {
  42.         body > div:nth-child(1),
  43.         body > div:nth-child(2) {
  44.             display: none !important;
  45.         }
  46.     }
  47.  
  48.     if widemode {
  49.         body.reskin #contenu .wrapper.container,
  50.         #top .container,
  51.         .container,
  52.         .container-profil {
  53.             max-width: 100% !important;
  54.             width: 100% !important;
  55.         }
  56.         body.layout-1320 .container-1320 {
  57.             max-width: 100%;
  58.             padding-left: 0;
  59.             padding-right: 20px;
  60.         }
  61.         .blockInformations__details {
  62.             text-align: center;
  63.         }
  64.         .blockInformations__details .listAvatars {
  65.             justify-content: center;
  66.         }
  67.         .gridSidebarContentAsideMovies,
  68.         .gridSidebarContentAsideSeries {
  69.             grid-template-columns: 300px repeat(auto-fill, minmax(0, calc(100% - 300px)));
  70.         }
  71.         .grid-informations.informations-reskin {
  72.             grid-template-columns: minmax(125px, 250px) 65% 1fr;
  73.         }
  74.     }
  75.     
  76.     /* Thin scrollbars */
  77.     ::-webkit-scrollbar {
  78.         -webkit-appearance: none !important;
  79.         border-radius: 16px !important;
  80.         scrollbar-width: thin !important;
  81.         width: 5px !important;
  82.     }
  83.  
  84.     ::-webkit-scrollbar-thumb {
  85.         border-radius: 16px !important;
  86.         background-color: #707070 !important;
  87.         box-shadow: 0 0 1px rgba(255, 255, 255, .5) !important;
  88.         -o-box-shadow: 0 0 1px rgba(255, 255, 255, .5) !important;
  89.         -moz-box-shadow: 0 0 1px rgba(255, 255, 255, .5) !important;
  90.         -ms-box-shadow: 0 0 1px rgba(255, 255, 255, .5) !important;
  91.         -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5) !important;
  92.         transition: width 0.3s ease !important;
  93.         -o-transition: width 0.3s ease !important;
  94.         -moz-transition: width 0.3s ease !important;
  95.         -ms-transition: width 0.3s ease !important;
  96.         -webkit-transition: width 0.3s ease !important;
  97.     }
  98.  
  99.     ::-webkit-scrollbar-track {
  100.         background: transparent !important;
  101.     }
  102.  
  103.     ::-webkit-scrollbar-thumb:active,
  104.     ::-webkit-scrollbar-thumb:hover {
  105.         background: #707070 !important;
  106.         border-radius: 16px !important;
  107.         width: 10px !important;
  108.     }
  109.  
  110.     ::-webkit-scrollbar-corner {
  111.         background-color: transparent !important;
  112.     }
  113. }