best
Discord css by deezy
Details
Authordeezy
LicenseNo License
Categoryddf
Created
Updated
Size157 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
ccccccc
Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name 10/15/2022, 2:33:15 PM
@namespace github.com/openstyles/stylus
@version 1.0.0
@description A new userstyle
@author Me
==/UserStyle== */
@-moz-document domain("discord.com") {
:root {
--mainColor: #f6ff00;
--backgroundColor01: #2a2139;
--backgroundColor02: #241b2f;
--backgroundCode: #262335;
--backgroundName: rgba(0, 0, 0, 0.2);
--gradientColor01: #f6ff00;
--gradientColor02: #000;
--rs-small-spacing: 2px;
--rs-medium-spacing: 3px;
--rs-large-spacing: 4px;
--rs-small-width: 2px;
--rs-medium-width: 3px;
--rs-large-width: 4px;
--rs-width: 2px;
--rs-avatar-shape: 50%;
--rs-online-color: #000;
--rs-idle-color: #fede5d;
--rs-dnd-color: #fe4450;
--rs-offline-color: #b6b1b1;
--rs-streaming-color: #643da7;
--rs-invisible-color: #b6b1b1;
--rs-phone-visible: block;
--rs-phone-color: var(--rs-online-color);
--customFont: "Whitney";
--rs-version: "1.0.2";
--logo-gif: url('https://i.imgur.com/z0WUs3L.gifv');
}
#app-mount .body {
line-height: 1;
margin: 0;
padding: 0;
font-family: var(--customFont) !important;
font-size: 14px !important;
overflow: hidden;
}
#app-mount .appMount-2yBXZl,
body {
text-rendering: optimizeLegibility;
border-bottom: none;
}
#app-mount .body.folderContentIsOpen-zz6Fg {
line-height: 1;
margin: 0;
padding: 0;
font-family: var(--customFont) !important;
overflow: hidden;
background: transparent;
border-radius: 3px;
background: linear-gradient(to right, #03edf920, #fc28a890) !important;
}
#app-mount .titleBar-1it3bQ {
border-bottom: 3px double #fc28a880 !important;
background: linear-gradient(to right, #03edf920, #fc28a890) !important;
}
#app-mount .container-ZMc96U {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
min-width: 0;
width: 100%;
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
height: 48px;
padding: 0 8px;
font-size: 16px;
line-height: 20px;
cursor: default;
z-index: 2;
color: var(--text-normal);
background-color: var(--backgroundColor01) !important;
box-shadow: rgb(210 109 208) 0px 6px 30px -10px !important;
}
#app-mount .mentioned-Tre-dv:before {
background-color: none !important;
width: 0px !important;
border-radius: 0px !important;
}
#app-mount .mentioned-Tre-dv {
font-variant: JIS83;
background-color: var(--backgroundColor01) !important;
position: relative;
background: var(--elevation-high) !important;
border: 3px groove #03edf940 !important;
border-radius: 15px !important;
box-shadow: #f6ff00 0px 4px 30px -14px !important;
background-clip: border-content !important;
background-image: transparent !important;
}
#app-mount .mentioned-Tre-dv:after {
position: absolute;
content: "";
width: 100%;
height: 100%;
background-color: #f6ff00 !important;
left: 0;
top: 0;
bottom: 0;
right: 0;
z-index: -1;
opacity: 0.15;
border-radius: 13px;
}
[class*="jumpToPresentBar"] {
display: contents;
}
[class*="jumpToPresentBar"] > button:first-child {
display: none;
}
[class*="jumpToPresentBar"] > button:last-child {
position: absolute;
z-index: 1;
bottom: 24px;
right: 22px;
padding: 8px !important;
height: auto;
background-color: var(--backgroundCode) !important;
box-shadow: var(--elevation-high);
border-radius: 100px;
display: flex;
font-size: 0px;
color: transparent;
transition: font-size .2s .1s, color .2s, padding .4s .1s;
}
[class*="jumpToPresentBar"] > button svg {
order: -1;
margin: 0px;
height: 24px;
width: 24px;
top: auto;
margin-right: 0px;
margin-left: 0px;
color: #FFFFFF;
transition: margin .6s;
}
[class*="jumpToPresentBar"]:hover > button {
padding: 8px 18px !important;
font-size: 14px;
color: #FFFFFF;
transition: font-size .2s, color .2s .1s, padding .4s;
}
[class*="jumpToPresentBar"]:hover > button svg {
margin-right: 2px;
margin-left: -6px;
}
.base-2v-uc0 {
transition: all 0.5s;
}
.base-2v-uc0:hover {
transition: all 0s;
transform: scale(1.02);
background-color: var(--backgroundColor02) !important;
}
#status-picker .scrollerBase-_bVAAt {
display: grid;
}
#status-picker-custom-status,
#status-picker div[role=group] {
grid-column: 1/5;
}
#status-picker .item-10djEX:not(#status-picker-custom-status) .status-2DiCMd {
display: none;
}
#status-picker .item-10djEX:not(#status-picker-switch-account) .status-2DiCMd {
display: none;
}
#status-picker .description-3Cwkxk {
display: none;
}
#status-picker .separator-1So4YB {
display: none;
}
#status-picker .status-2DiCMd {
margin-left: 8px;
}
#status-picker .customEmojiPlaceholder-3mRJqA,
#status-picker .switchAccountsIcon-36imMT {
margin-left: 1px;
}
#status-picker .mask-2Me5HY {
height: 78%;
width: 78%;
margin-left: 3px;
}
#status-picker-online,
#status-picker-idle,
#status-picker-dnd {
margin-right: 20px;
}
#status-picker-online .statusItem-2hiCNB,
#status-picker-idle .statusItem-2hiCNB,
#status-picker-dnd .statusItem-2hiCNB,
#status-picker-invisible .statusItem-2hiCNB {
padding: 8px 8px;
}
#status-picker-custom-status .statusItem-2hiCNB {
padding: 6px 8px;
}
#status-picker .customEmojiPlaceholder-3mRJqA {
background-image: none;
background-color: var(--interactive-normal);
mask: var(--icon) center/contain no-repeat;
-webkit-mask: var(--icon) center/contain no-repeat;
width: 22px;
height: 22px;
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' enable-background='new 0 0 24 24' height='24px' viewBox='0 0 24 24' width='24px' fill='%23000000'%3E%3Crect fill='none' height='24' width='24'/%3E%3Cpath d='M11.99,2C6.47,2,2,6.48,2,12s4.47,10,9.99,10C17.52,22,22,17.52,22,12S17.52,2,11.99,2z M8.5,8C9.33,8,10,8.67,10,9.5 S9.33,11,8.5,11S7,10.33,7,9.5S7.67,8,8.5,8z M16.75,14.75C15.8,16.39,14.03,17.5,12,17.5s-3.8-1.11-4.75-2.75 C7.06,14.42,7.31,14,7.69,14h8.62C16.7,14,16.94,14.42,16.75,14.75z M15.5,11c-0.83,0-1.5-0.67-1.5-1.5S14.67,8,15.5,8 S17,8.67,17,9.5S16.33,11,15.5,11z'/%3E%3C/svg%3E");
}
#status-picker .colorDefault-CDqZd0.focused-3qFvc8 .customEmojiPlaceholder-3mRJqA {
background: var(--interactive-active);
}
#status-picker .switchAccountsIcon-36imMT {
background-image: none;
background-color: var(--interactive-normal);
mask: var(--icon) center/contain no-repeat;
-webkit-mask: var(--icon) center/contain no-repeat;
width: 22px;
height: 22px;
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' enable-background='new 0 0 24 24' height='24px' viewBox='0 0 24 24' width='24px' fill='%23000000'%3E%3Cg%3E%3Crect fill='none' height='24' width='24'/%3E%3C/g%3E%3Cg%3E%3Cpath d='M17,20H4V7c0-0.55-0.45-1-1-1S2,6.45,2,7v13c0,1.1,0.9,2,2,2h13c0.55,0,1-0.45,1-1S17.55,20,17,20z M20,2H8 C6.9,2,6,2.9,6,4v12c0,1.1,0.9,2,2,2h12c1.1,0,2-0.9,2-2V4C22,2.9,21.1,2,20,2z M14,5c1.66,0,3,1.34,3,3c0,1.66-1.34,3-3,3 s-3-1.34-3-3C11,6.34,12.34,5,14,5z M7.76,16c1.47-1.83,3.71-3,6.24-3s4.77,1.17,6.24,3H7.76z'/%3E%3C/g%3E%3C/svg%3E");
}
#status-picker .colorDefault-CDqZd0.focused-3qFvc8 .switchAccountsIcon-36imMT {
background: var(--interactive-active);
}
#status-picker-custom-status,
#status-picker-switch-account,
#status-picker-switch-account--manage-accounts {
margin-top: 12px !important;
}
#status-picker-custom-status::after {
content: "";
background: var(--background-modifier-accent);
position: absolute;
top: -6px;
left: 2px;
width: 98%;
height: 1px;
}
#status-picker-switch-account::after {
content: "";
background: var(--background-modifier-accent);
position: absolute;
top: -6px;
left: 2px;
width: 98%;
height: 1px;
}
#status-picker-switch-account--manage-accounts::after {
content: "";
background: var(--background-modifier-accent);
position: absolute;
top: -7px;
left: 2px;
width: 98%;
height: 1px;
}
#status-picker-dnd::after,
#status-picker-idle::after,
#status-picker-online::after {
content: "";
background: var(--background-modifier-accent);
position: absolute;
top: 6px;
left: 50px;
width: 1px;
height: 24px;
}
.card-x5zW6z {
background-color: var(--backgroundColor01) !important;
border-color: var(--backgroundColor01) !important;
}
.card-x5zW6z {
display: flex;
flex-direction: column;
position: relative;
background-color: var(--activity-card-background);
border: 2px solid var(--backgroundColor02) !impo...