Skip to content

Discord Tweaks by coffee

Imported and mirrored from https://raw.githubusercontent.com/coffeebank/coffee-userstyles/master/discord-tweaks/style.user.css

Screenshot of Discord Tweaks

Details

Authorcoffee

LicenseMIT

Categorydiscord

Created

Updated

Size3.0 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Add mobile/small screen support, and other tweaks

Notes

  • Sidebar shrinks to reduce distractions
  • Channels list shrinks
  • Voice call members shown when shrunk
  • Threads, Pinned, etc. popups right-aligned
  • Members list shrinks
  • Reduced buttons for non-nitro: Gift, Stickers

Discord hide gift button, hide sticker button, Discord responsive small screen sizes, mobile responsive, Discord mobile browser

Source code

/* ==UserStyle==
@name         Discord Tweaks
@description  Add mobile/small screen support, and other tweaks
@namespace    https://github.com/coffeebank/
@homepageURL  https://github.com/coffeebank/
@version      1.1.2
@license      MIT
@preprocessor default
==/UserStyle== */

@-moz-document domain("discord.com") {
  :root {
      --serverSidebarWidth: 50px;
      --serverSidebarExpand: 240px;
      --memberSidebarWidth: 65px;
      --memberSidebarExpand: 260px;
  }

  /* spacing (hide your server list on screenshots) */

  div[aria-label="Servers"] {
      margin-bottom: 125vh;
  }
      
  /* nitro cleanup */

  button[aria-label="Send a gift"], button[aria-label="Open sticker picker"], div[aria-label="Help"] {
      display: none;
  }
  
  @media screen and (max-width: 684px) {
      
      /* servers and channels */
      /* shrink serverlist to reduce distractions */
      
      nav[aria-label="Servers sidebar"] {
          margin-left: -2.5rem;
      }
      div[class*="content"] > div[class*="sidebar"] {
          width: var(--serverSidebarWidth);
      }
      nav[aria-label="Servers sidebar"], div[class*="content"] > div[class*="sidebar"] {
          transition: all 150ms ease;
          transition-delay: 0.1s;
      }
      nav[aria-label="Servers sidebar"]:hover {
          margin-left: 0px;
      }
      
      nav[aria-label="Servers sidebar"]:hover ~ div[class*="content"] > div[class*="sidebar"], div[class*="content"] > div[class*="sidebar"]:hover {
          width: var(--serverSidebarExpand);
      }
      div[class*="list"][class*="listDefault"][role="group"] { /* voice users */
          padding-left: 6px;
      }
      .container-1ov-mD { /* main chat area - fix width of embeds */
          overflow-x: auto;
          overflow-y: hidden;
      }
      
      
      /* members list */
      
      aside[class*="membersWrap"][class*="hiddenMembers"] {
          transition: all 0.15s ease;
          transition-delay: 0.1s;
          width: var(--memberSidebarWidth);
          min-width: var(--memberSidebarWidth);
          overflow: hidden;
          justify-content: left;
      }
      aside[class*="membersWrap"]:hover {
          width: var(--memberSidebarExpand);
      }
      
      /* top bar */
      
      section[aria-label="Channel header"] {
          flex-wrap: wrap;
          height: 5.25rem;
      }
      
      section[aria-label="Channel header"] div div[role="switch"] {
          margin: 0 !important;
      }
      
      div[aria-label="Search"] {
          width: calc(100vw - 260px) !important;
      }
      
      section[aria-label="Search Results"] {
          width: 100%;
          border-left: darkslategray solid thin;
          border-top-left-radius: 5px;
      }
      
      /* popouts */
      
      div[id*="popout_"][style*="position"] {
          right: 1rem !important;
      }
      
  }
}

Reviews

No reviews yet.