Skip to content

Instantly share code, notes, and snippets.

@Penguin-Spy

Penguin-Spy/pointless.css

Last active November 13, 2022 07:56
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save Penguin-Spy/2196ca8ca0eb8c5eca52fa34ebd0cea7 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save Penguin-Spy/2196ca8ca0eb8c5eca52fa34ebd0cea7 to your computer and use it in GitHub Desktop.
Download ZIP
catastrophe build of Penguin-Spy/pointless, for use with OpenAsar. READ COMMENT!!
Raw
pointless.css
@charset "UTF-8";
/*
THIS IS A FULL COMPILED CSS ONLY VERSION OF POINTLESS (https://github.com/Penguin-Spy/pointless) for use with OpenAsar
THIS IS SUPER JANK AND BROKEN, I KNOW
i will NOT be providing support, although if it gets broken enough to annoy me i will fix it and post the updates here
once replugged is working again, i will remake this theme (and will use a workflow to auto-generate the .css so u can use this with any client mod)
right now i'm using https://openasar.dev/ to apply the theme to my client btw
catastrophe build changelog:
#2: fixed user area popout button & home button
#3: oops missed a change
*/
/* Colorizes various SVGs. Type // before to disable, remove to enable. */
@import "https://nyri4.github.io/Discolored/main.css";
/* Old Discord Font */
@import url("https://fonts.googleapis.com/css2?family=Montserrat+Alternates&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Montserrat&display=swap");
/* ----- MESSAGE BUBBLES ----- */
/*message shape*/
[class*=cozy-][class*=wrapper-] {
padding-top: 1px;
padding-bottom: 1px;
}
[class*=cozyMessage-]:not([class*=groupStart-]) > [class*=contents-] > [class*=markup-]:not(:empty) {
border-radius: var(--_pointless-radius-interface);
}
div:not([class*=disableInteraction-]) [class*=contents-] > [class*=markup-]:not(:empty) {
display: inline-block;
/*max-width:650px;*/
margin: 0;
padding: 8px 12px 7px;
border-radius: var(--_pointless-radius-interface);
position: relative;
overflow: visible;
}
/*bubble color*/
[class*="cozyMessage-"] [class*=markup-]:not(:empty):not([class*=repliedTextContent-]) {
background-image: var(--chatbubble-other);
background-size: cover;
background-position: center;
background-attachment: fixed;
}
/*[data-is-author-self=true] > [class*=contents-] > [class*=markup-]:not(:empty) {
background-image: var(--chatbubble-self);
background-size: cover;
background-position: center;
background-attachment: fixed;
}*/
/*text style*/
[class*=contents-] > [class*=markup-], [class*=contents-] > [class*=markup-] > *:not([class*=anchorUnderlineOnHover-]) {
font-size: 15px;
line-height: 20px;
}
/*[class*="theme-"] [data-is-author-self=false] [class*="container-"] *,[class*="theme-"] [data-is-author-self=false] [class*="markup-"],[class*="theme-"] [data-is-author-self=false] [class*="markup-"]>*{
color:var(--chatbubble-other-text);
}*/
/*last rounded corner*/
/*
[class*="groupStart-"]:before,[class*="hasContent-"]:before,[class*="cozyMessage-"]+[class*="scrollerSpacer-"]:before{
content:"";
display:block;
width:20px;
height:20px;
background-color:transparent;
position:absolute;
border-bottom-left-radius:20px;
border:5px solid var(--background-primary);
border-right:0;
border-top:0;
}
[class*="groupStart-"]:before{transform:translate(-20%,-156%);}
[class*="hasContent-"]:before{left:51px;transform:translateY(-132%);}
[class*="cozyMessage-"]+[class*="scrollerSpacer-"]:before{left:67px; transform:translateY(-84%);}
[class*="mentioned-"]:before{left:unset; top:unset; bottom:unset;}
[class*="mentioned-"]+*:before,[class*="isUnread-"][class*="hasContent-"]+[class*="groupStart-"]:before,[class*="hasContent-"]+[class*="groupStart-"]:before,[class*="backgroundFlash-"]:before{visibility:hidden;}
*/
/* Fix thread icon */
[class*=cozy-][class*=hasThread-]:after {
top: 2.25rem !important;
}
/* NOTE: could also use justify-self:end instead of transform: scaleX(-1), incase that gets too annoying to maintain */
/* ----- RIGHT ALIGN SELF MESSAGES ----- */
/* Flip whole message */
[data-is-author-self=true] {
transform: scaleX(-1);
}
/* Flip back avatar, header, compact timestamp, editing the message, message buttons, reply preview, reactions, and */
[data-is-author-self=true] > [class*=contents-] > [class*=avatar-],
[data-is-author-self=true] > [class*=contents-] > [class*=header-],
[data-is-author-self=true] > [class*=contents-] > [class*=timestampVisibleOnHover-],
[data-is-author-self=true] > [class*=buttonContainer-] > [class*=buttons-] [class*=button-],
[data-is-author-self=true] > [class*=repliedMessage-] > *,
[data-is-author-self=true] > [class*=container-] > [class*=reactions-] > *,
[data-is-author-self=true] > [class*=contents-] > div:not([class*=messageContent-]) {
transform: scaleX(-1);
}
[data-is-author-self=true] > [class*=contents-] > [class*=avatar-]:active {
/* Flip back avatar when clicked */
transform: translateY(1px) scaleX(-1);
}
/* Flip back message content (text) */
[data-is-author-self=true] > [class*=contents-] > [class*=messageContent-]:not([class*=repliedTextContent-]) {
transform: scaleX(-1);
/*display: inline-block; /* can't tell what this does, disabled because it adds unnecessary space to empty messages with embeds*/
padding-right: 78px;
}
/* Flip back system messages (threads), embeds (rich, img link, vid link), attached images [vid?], and server [game?] invite */
[data-is-author-self=true] > [class*=container-] > :is([class*=systemMessageContainer-],
[class*=embed-],
[class*=messageAttachment-],
[class*=userSelectNone-],
[class*=clickableSticker-]) {
transform: scaleX(-1);
}
/* Reverse header items */
[data-is-author-self=true] > [class*=contents-] > [class*=header-] {
display: flex;
flex-direction: row-reverse;
}
[data-is-author-self=true] > [class*=contents-] > [class*=header-] > [class*=headerText-] {
margin-left: 0.25em;
margin-right: 0;
}
/* Reverse reactions */
[data-is-author-self=true] > [class*=container-] > [class*=reactions-] {
display: flex;
flex-direction: row-reverse;
}
/* Put the embed border on the right (for Youtube/Twitter etc. embeds) */
[data-is-author-self=true] > [class*=container-] > [class*=embedFull-] {
border-left: none;
border-right: 4px solid;
}
/* Fix thread formatting */
[data-is-author-self=true] > [class*=contents-] [class*=iconContainer-] {
position: absolute;
right: -82px;
left: unset;
}
/* Fix codeblocks */
[class*=contents-] > [class*=messageContent-] > pre {
max-width: none;
}
/* Bump compact timestamps out of the ping highlight right border */
[data-is-author-self=true] > [class*=container-] > [class*=timestampVisibleOnHover-] {
padding-right: 0.5rem;
}
/* embed structures (for reference)
thread container-1ov-mD > container-3hZ-gs systemMessageContainer-2ddkN3
rich embed container-1ov-mD > embedWrapper-lXpS3L embedFull-2tM8-- embed-IeVjo6 markup-2BOw-j
uploaded image container-1ov-mD > messageAttachment-1aDidq > imageWrapper-2p5ogY embedWrapper-lXpS3L
link img embed container-1ov-mD > embed-IeVjo6 embedWrapper-lXpS3L > imageWrapper-2p5ogY embedWrapper-lXpS3L embedMedia-1guQoW embedImage-2W1cML
link vid embed container-1ov-mD > embed-IeVjo6 embedWrapper-lXpS3L > embedVideo-3nf0O9 embedMedia-1guQoW
server invite container-1ov-mD > wrapper-35wsBm userSelectNone-Iy6XEP cursorDefault-331ZcI
sticker container-1ov-mD > clickableSticker-3HmpgV > assetWrapper-3GNt0z > pngImage-33yLRP stickerAsset-13j1W0
*/
/*
[data-is-author-self="true"] .reactions-12N0jA {
display: flex;
flex-direction: row-reverse;
flex-wrap: wrap-reverse;
}
[data-is-author-self="true"] .container-1ov-mD,
[data-is-author-self="true"] .repliedMessage-VokQwo {
display: flex;
flex-direction: row-reverse !important;
}
[data-is-author-self="true"] .messageContent-2qWWxC:not(.repliedTextContent-1R3vnK),
[data-is-author-self="true"] .embedFull-2tM8--,
[data-is-author-self="true"] .wrapper-35wsBm,
[data-is-author-self="true"] .message-2qnXI6 .imageWrapper-2p5ogY,
[data-is-author-self="true"] .repliedMessage-VokQwo,
[data-is-author-self="true"] .messageContent-2qWWxC:not(.repliedTextContent-1R3vnK) pre code
{
border-top-left-radius: 16px !important;
border-top-right-radius: 0 !important;
}
[data-is-author-self="true"] .repliedMessage-VokQwo ~ .contents-2mQqc9 > .messageContent-2qWWxC:first-of-type {
border-top-left-radius: 0 !important;
}
[data-is-author-self="true"] .repliedMessage-VokQwo {
margin-left: auto !important;
margin-right: 0px !important;
}
.slateTextArea-1Mkdgw {
position: relative !important;
}*/
/* Message context menu
* Original colors by mr_miner#6969, from Powercord#css-snippets: 870552834410680370
* Expanded by Penguin_Spy to cover all message context items */
#message-add-reaction {
color: goldenrod;
}
[class*=focused-]:is(#message-add-reaction) {
background-color: goldenrod;
color: #fff;
}
#message-reactions {
color: burlywood;
}
[class*=focused-]:is(#message-reactions) {
background-color: burlywood;
color: #fff;
}
#message-edit, #message-actions-edit {
color: steelblue;
}
[class*=focused-]:is(#message-edit, #message-actions-edit) {
background-color: steelblue;
color: #fff;
}
#message-pin, #message-actions-pin, #message-unpin {
color: skyblue;
}
[class*=focused-]:is(#message-actions-pin, #message-pin, #message-unpin) {
background-color: #67a7c0;
color: #fff;
}
#message-actions-reply, #message-reply {
color: khaki;
}
[class*=focused-]:is(#message-actions-reply, #message-reply) {
background-color: #c5bb5d;
color: #fff;
}
#message-actions-thread, #message-thread {
color: #69c069;
}
[class*=focused-]:is(#message-actions-thread, #message-thread) {
background-color: #5dbd5d;
color: #fff;
}
#message-apps {
color: aquamarine;
}
[class*=focused-]:is(#message-apps) {
background-color: #65d4af;
color: #fff;
}
#message-actions-mark-unread, #message-mark-unread {
color: plum;
}
[class*=focused-]:is(#message-actions-mark-unread, #message-mark-unread) {
background-color: #c27ec2;
color: #fff;
}
#message-actions-copy-link, #message-copy-link, #message-copy-message-link {
color: lightseagreen;
}
[class*=focused-]:is(#message-actions-copy-link, #message-copy-link, #message-copy-message-link) {
background-color: #199c96;
color: #fff;
}
#message-actions-tts, #message-tts {
color: var(--brand-experiment);
}
[class*=focused-]:is(#message-actions-tts, #message-tts) {
background-color: var(--brand-experiment);
color: #fff;
}
#message-remove-reactions {
color: tomato;
}
[class*=focused-]:is(#message-remove-reactions) {
background-color: tomato;
color: #fff;
}
#message-copy-image {
color: mediumpurple;
}
[class*=focused-]:is(#message-copy-image) {
background-color: indigo;
color: #fff;
}
#message-save-image {
color: mediumorchid;
}
[class*=focused-]:is(#message-save-image) {
background-color: mediumorchid;
color: #fff;
}
#message-copy-native-link {
color: seagreen;
}
[class*=focused-]:is(#message-copy-native-link) {
background-color: seagreen;
color: #fff;
}
#message-open-native-link {
color: darkseagreen;
}
[class*=focused-]:is(#message-open-native-link) {
background-color: darkseagreen;
color: #fff;
}
/* Plugins */
#message-notebook {
color: #d6b498;
}
[class*=focused-]:is(#message-notebook) {
background-color: #c2a085;
color: #fff;
}
#message-translate-message {
color: #1e6fe0;
}
[class*=focused-]:is(#message-translate-message) {
background-color: #1967d2;
color: #fff;
}
/* Guild Context Menu, Guild Header Popout Menu */
/**/
#guild-header-popout-premium-subscribe {
color: rgb(255, 115, 250);
}
[class*=focused-]:is(#guild-header-popout-premium-subscribe) {
background-color: rgb(255, 115, 250);
color: #fff;
}
#guild-context-mark-guild-read {
color: plum;
}
[class*=focused-]:is(#guild-context-mark-guild-read) {
background-color: #c27ec2;
color: #fff;
}
#guild-context-invite-people, #guild-header-popout-invite-people {
color: var(--brand-experiment-360);
}
[class*=focused-]:is(#guild-context-invite-people, #guild-header-popout-invite-people) {
background: var(--brand-experiment-360);
color: #fff;
}
#guild-context-mute-guild, #guild-context-unmute-guild, [id^=guild-context-mute-guild--] {
color: #E91E63;
}
[class*=focused-]:is(#guild-context-mute-guild, #guild-context-unmute-guild, [id^=guild-context-mute-guild--]) {
background: #E91E63;
color: #fff;
}
#guild-context-guild-settings, #guild-header-popout-settings {
color: #668594;
}
[class*=focused-]:is(#guild-context-guild-settings, #guild-header-popout-settings) {
background: #546E7A;
color: #fff;
}
#guild-header-popout-insights {
color: #1ABC9C;
}
[class*=focused-]:is(#guild-header-popout-insights) {
background: #1ABC9C;
color: #fff;
}
#guild-context-notifications, #guild-header-popout-notifications {
color: burlywood;
}
[class*=focused-]:is(#guild-context-notifications, #guild-header-popout-notifications) {
background-color: burlywood;
color: #fff;
}
#guild-context-privacy, #guild-header-popout-privacy {
color: skyblue;
}
[class*=focused-]:is(#guild-context-privacy, #guild-header-popout-privacy) {
background-color: #67a7c0;
color: #fff;
}
#guild-context-change-nickname, #guild-header-popout-change-nickname {
color: steelblue;
}
[class*=focused-]:is(#guild-context-change-nickname, #guild-header-popout-change-nickname) {
background-color: steelblue;
color: #fff;
}
#guild-context-create-channel, #guild-header-popout-create-channel {
color: #69c069;
}
[class*=focused-]:is(#guild-context-create-channel, #guild-header-popout-create-channel) {
background-color: #5dbd5d;
color: #fff;
}
#guild-context-create-category, #guild-header-popout-create-category {
color: seagreen;
}
[class*=focused-]:is(#guild-context-create-category, #guild-header-popout-create-category) {
background-color: seagreen;
color: #fff;
}
#guild-context-create-event, #guild-header-popout-create-event {
color: darkseagreen;
}
[class*=focused-]:is(#guild-context-create-event, #guild-header-popout-create-event) {
background-color: darkseagreen;
color: #fff;
}
#guild-context-leave-guild, #guild-header-popout-leave {
color: #ed4245;
}
[class*=focused-]:is(#guild-context-leave-guild, #guild-header-popout-leave) {
background: #ed4245;
color: #fff;
}
/* Folders */
#guild-context-mark-folder-read {
color: plum;
}
[class*=focused-]:is(#guild-context-mark-folder-read) {
background-color: #c27ec2;
color: #fff;
}
#guild-context-folder-settings {
color: #668594;
}
[class*=focused-]:is(#guild-context-folder-settings) {
background: #546E7A;
color: #fff;
}
#guild-context-folder-collapse {
color: grey;
}
/* New Server Context Menu - I'll bet you never knew this menu existed, I sure didn't */
#guild-context-join {
color: grey;
}
#guild-context-create {
color: grey;
}
/* Plugins */
#guild-context-guild-profile, #guild-header-popout-guild-profile {
color: goldenrod;
}
[class*=focused-]:is(#guild-context-guild-profile, #guild-header-popout-guild-profile) {
background-color: goldenrod;
color: #fff;
}
/* Channel Context Menu */
#channel-context-mark-channel-read {
color: plum;
}
[class*=focused-]:is(#channel-context-mark-channel-read) {
background-color: #c27ec2;
color: #fff;
}
#channel-context-mute-channel, #channel-context-unmute-channel, [id^=channel-context-mute-channel--] {
color: #E91E63;
}
[class*=focused-]:is(#channel-context-mute-channel, #channel-context-unmute-channel, [id^=channel-context-mute-channel--]) {
background: #E91E63;
color: #fff;
}
#channel-context-channel-notifications {
color: grey;
}
#channel-context-edit-channel {
color: grey;
}
#channel-context-invite-people {
color: grey;
}
#channel-context-clone-channel {
color: grey;
}
#channel-context-create-text-channel {
color: grey;
}
#channel-context-create-voice-channel {
color: grey;
}
#channel-context-delete-channel {
color: grey;
}
#channel-context-copy-channel-topic {
color: grey;
}
/* Threads */
#thread-context-join-thread {
color: grey;
}
#thread-context-leave-thread {
color: grey;
}
#thread-context-mark-channel-read {
color: grey;
}
#thread-context-mute-channel {
color: grey;
}
#thread-context-thread-notifications {
color: grey;
}
#thread-context-search {
color: grey;
}
#thread-context-pins {
color: grey;
}
#thread-context-open {
color: grey;
}
/* Category */
#channel-context-collapse-all-categories {
color: grey;
}
/* Other */
#message-devmode-copy-id, #message-actions-copy-id,
#guild-context-devmode-copy-id,
#channel-context-devmode-copy-id,
#thread-context-devmode-copy-id,
#user-context-devmode-copy-id,
#dev-context-devmode-copy-id,
#guild-settings-role-context-devmode-copy-id,
#copy-id-devmode-copy-id {
color: lightsalmon;
}
[class*=focused-]:is(#message-devmode-copy-id, #message-actions-copy-id,
#guild-context-devmode-copy-id,
#channel-context-devmode-copy-id,
#thread-context-devmode-copy-id,
#user-context-devmode-copy-id,
#dev-context-devmode-copy-id,
#guild-settings-role-context-devmode-copy-id,
#copy-id-devmode-copy-id) {
background-color: lightsalmon;
color: #fff;
}
/* Strikethrough disabled items because just .5 opacity doesn't really work when every item is a different color/saturation */
[role=menuitem][class*=disabled-] > [class*=label-] {
text-decoration: line-through;
}
/* Colored channel icons */
/**
* Snippet from #css-snippets applied the Jun 21, 2021 at 1:09:05 PM
* Created by Lorem#3481 (597072695875600385)
* Snippet ID: 855613959738228756
*/
[d="M19.8914 3.80204L22.2438 8.55654C22.5726 9.22119 22.0891 9.99999 21.3475 10L16.6179 10C15.8745 10 15.391 9.21769 15.7235 8.55279L18.1007 3.79829C18.4701 3.05951 19.5251 3.06172 19.8914 3.80204ZM18.4998 5H19.4999V7.5H18.4999L18.4998 5ZM18.4998 8.49887C18.4998 8.77589 18.7238 9 18.9998 9C19.2759 9 19.4999 8.77589 19.4999 8.49887C19.4999 8.22224 19.2759 7.99773 18.9998 7.99773C18.7238 7.99773 18.4998 8.22224 18.4998 8.49887Z"] {
fill: hsl(359, calc(var(--saturation-factor, 1) * 82.6%), 59.4%);
}
/** 855613959738228756 */
/**
* Snippet from #css-snippets applied the Jun 21, 2021 at 1:09:12 PM
* Created by Art#6021 (631028298675388418)
* Snippet ID: 855674162386567178
*/
[d="M21.025 5V4C21.025 2.88 20.05 2 19 2C17.95 2 17 2.88 17 4V5C16.4477 5 16 5.44772 16 6V9C16 9.55228 16.4477 10 17 10H19H21C21.5523 10 22 9.55228 22 9V5.975C22 5.43652 21.5635 5 21.025 5ZM20 5H18V4C18 3.42857 18.4667 3 19 3C19.5333 3 20 3.42857 20 4V5Z"] {
fill: hsl(38, calc(var(--saturation-factor, 1) * 95.7%), 54.1%);
}
/** 855674162386567178 */
/**
* Snippet from #css-snippets applied the Jun 21, 2021 at 1:09:21 PM
* Created by zjtech123#6743 (261236127581601793)
* Snippet ID: 855929646301970432
*/
[d="M22.545 4.87988V5.87988H23.28C23.4126 5.87988 23.52 5.98733 23.52 6.11988V10.6399C23.52 10.7724 23.4126 10.8799 23.28 10.8799H17.76C17.6275 10.8799 17.52 10.7724 17.52 10.6399V6.11988C17.52 5.98733 17.6275 5.87988 17.76 5.87988H18.52V4.87988C18.52 3.75988 19.47 2.87988 20.52 2.87988C21.57 2.87988 22.545 3.75988 22.545 4.87988ZM19.52 5.87988H21.52V4.87988C21.52 4.30845 21.0534 3.87988 20.52 3.87988C19.9867 3.87988 19.52 4.30845 19.52 4.87988V5.87988Z"] {
fill: hsl(38, calc(var(--saturation-factor, 1) * 95.7%), 54.1%);
}
/** 855929646301970432 */
/**
* Snippet from #css-snippets applied the Jun 21, 2021 at 1:09:28 PM
* Created by zjtech123#6743 (261236127581601793)
* Snippet ID: 855929936778493952
*/
[d="M22.025 2V3C22.5635 3 23 3.43652 23 3.975V7C23 7.55228 22.5523 8 22 8H18C17.4477 8 17 7.55228 17 7V4C17 3.44772 17.4477 3 18 3V2C18 0.88 18.95 0 20 0C21.05 0 22.025 0.88 22.025 2ZM19 3H21V2C21 1.42857 20.5333 1 20 1C19.4667 1 19 1.42857 19 2V3Z"] {
fill: hsl(38, calc(var(--saturation-factor, 1) * 95.7%), 54.1%);
}
/** 855929936778493952 */
/* Apply base icon (with a powercord plug as a placeholder for any plugin-added actions we don't know about)
* This was heavily inspired by Corellan's Menu Icons, check it out: https://github.com/CorellanStoma/Menu-Icons/
* I created my own because I wasn't satisfied with his icon choices: they match his theme, whereas I wanted my theme to match Discord's icons */
/* Hide preexisting icons (we replace them)
* Except for the > on submenus */
[role=menuitem]:not(#message-add-reaction, #message-apps,
#user-context-invite-to-server, #user-context-roles,
#user-context-mute-channel,
#channel-context-mute-channel,
#guild-context-mute-guild, #guild-context-guild-settings,
#guild-settings-role-context-view-as-role) > [class|=iconContainer] {
display: none;
}
/* Apply base icon slot */
[role=menuitem]:not([id^=message-add-reaction--]:not(#message-add-reaction--other-reactions),
[id^=user-context-invite-to-server--],
[id^=message-apps--]) > [class*=label]::before {
content: "";
width: 18px;
height: 18px;
margin-right: 8px;
margin-top: 0px;
background: currentColor;
mask: var(--icon-mask) center/contain no-repeat;
-webkit-mask: var(--icon-mask) center/contain no-repeat;
flex-shrink: 0;
--icon-mask: var(--icon, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 447 447'%3E%3Cpath fill='white' d='M221 117.1l-33.8-33.8 70-70c9.3-9.3 24.5-9.3 33.8 0 9.3 9.3 9.3 24.5 0 33.8l-70 70z'/%3E%3Cpath fill='white' d='M216.3 121.7l-33.8-33.8c-2.6-2.6-2.6-6.8 0-9.3l70-70c11.9-11.9 31.2-11.9 43.1 0s11.9 31.2 0 43.1l-70 70c-2.6 2.6-6.7 2.6-9.3 0zm-19.8-38.4l24.5 24.5 65.3-65.3c6.7-6.7 6.7-17.7 0-24.5-6.7-6.7-17.7-6.7-24.5 0l-65.3 65.3z'/%3E%3Cpath fill='white' d='M312.7 208.8L278.9 175l70-70c9.3-9.3 24.5-9.3 33.8 0 9.3 9.3 9.3 24.5 0 33.8l-70 70z'/%3E%3Cpath fill='white' d='M308 213.4l-33.8-33.8c-2.6-2.6-2.6-6.8 0-9.3l70-70c11.9-11.9 31.2-11.9 43.1 0s11.9 31.2 0 43.1l-70 70c-2.5 2.6-6.7 2.6-9.3 0zM288.2 175l24.5 24.5 65.3-65.3c6.7-6.7 6.7-17.7 0-24.5s-17.7-6.7-24.5 0L288.2 175z'/%3E%3Cpath fill='white' d='M143.71 88.065l24.112-24.113L331.94 228.07l-24.112 24.112z'/%3E%3Cpath fill='white' d='M303 257L138.9 92.9c-2.7-2.7-2.7-7 0-9.7L163 59.1c2.7-2.7 7-2.7 9.7 0l164.1 164.1c2.7 2.7 2.7 7 0 9.7L312.7 257c-2.7 2.7-7 2.7-9.7 0zM153.4 88.1l154.5 154.5 14.5-14.5L167.9 73.6l-14.5 14.5z'/%3E%3Cpath fill='white' d='M161.2 327.6l-92.9-92.9c-14.3-14.3-14.3-37.6 0-51.9l85.1-85.1 144.8 144.8-85.1 85.1c-14.3 14.4-37.6 14.4-51.9 0z'/%3E%3Cpath fill='white' d='M156.4 332.4l-92.9-92.9c-17-17-17-44.6 0-61.6l85.1-85.1c2.7-2.7 7-2.7 9.7 0L303 237.7c2.7 2.7 2.7 7 0 9.7l-85 85c-17 17-44.7 17-61.6 0zm-3-225l-80.2 80.2c-11.7 11.7-11.7 30.6 0 42.3l92.9 92.9c11.7 11.7 30.6 11.7 42.3 0l80.2-80.2-135.2-135.2z'/%3E%3Cpath fill='white' d='M71.328 295.671l28.991-28.991 28.991 28.991-28.991 28.991z'/%3E%3Cpath fill='white' d='M95.4 329.5l-29-29c-2.7-2.7-2.7-7 0-9.7l29-29c2.7-2.7 7-2.7 9.7 0l29 29c2.7 2.7 2.7 7 0 9.7l-29 29c-2.7 2.6-7 2.6-9.7 0zM81 295.7l19.3 19.3 19.3-19.3-19.3-19.3L81 295.7z'/%3E%3Cpath fill='white' d='M143.7 445.3L81 382.6c-21.3-21.3-21.3-55.9 0-77.2 2.7-2.7 7-2.7 9.7 0 2.7 2.7 2.7 7 0 9.7-16 16-16 42 0 57.9l62.8 62.8c2.7 2.7 2.7 7 0 9.7s-7.1 2.5-9.8-.2z'/%3E%3C/svg%3E"));
}
/* Display icons on the left */
[role=menuitem] > [class|=label] {
display: flex;
align-items: center;
}
/* Display reactions & checkboxes on the left as well */
[role=menuitem][id^=message-add-reaction--], [role=menuitemcheckbox] {
display: flex;
flex-direction: row-reverse;
}
[role=menuitem][id^=message-add-reaction--] > [class|=imageContainer], [role=menuitemcheckbox] > [class|=iconContainer] {
margin-left: 0;
margin-right: 8px;
width: 18px;
}
[role=menuitem][id^=message-add-reaction--] > [class|=imageContainer] > img {
margin-left: auto;
margin-right: auto;
display: block;
}
/* Define icons that are used multiple times */
:root {
--pointless-icon-edit: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M19.2929 9.8299L19.9409 9.18278C21.353 7.77064 21.353 5.47197 19.9409 4.05892C18.5287 2.64678 16.2292 2.64678 14.817 4.05892L14.1699 4.70694L19.2929 9.8299ZM12.8962 5.97688L5.18469 13.6906L10.3085 18.813L18.0201 11.0992L12.8962 5.97688ZM4.11851 20.9704L8.75906 19.8112L4.18692 15.239L3.02678 19.8796C2.95028 20.1856 3.04028 20.5105 3.26349 20.7337C3.48669 20.9569 3.8116 21.046 4.11851 20.9704Z'/%3E%3C/svg%3E");
--pointless-icon-copy: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z'/%3E%3C/svg%3E");
--pointless-icon-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M22 12L12.101 2.10101L10.686 3.51401L12.101 4.92901L7.15096 9.87801V9.88001L5.73596 8.46501L4.32196 9.88001L8.56496 14.122L2.90796 19.778L4.32196 21.192L9.97896 15.536L14.222 19.778L15.636 18.364L14.222 16.95L19.171 12H19.172L20.586 13.414L22 12Z'/%3E%3C/svg%3E");
--pointless-icon-role: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M12 2C6.486 2 2 6.486 2 12C2 17.515 6.486 22 12 22C14.039 22 15.993 21.398 17.652 20.259L16.521 18.611C15.195 19.519 13.633 20 12 20C7.589 20 4 16.411 4 12C4 7.589 7.589 4 12 4C16.411 4 20 7.589 20 12V12.782C20 14.17 19.402 15 18.4 15L18.398 15.018C18.338 15.005 18.273 15 18.209 15H18C17.437 15 16.6 14.182 16.6 13.631V12C16.6 9.464 14.537 7.4 12 7.4C9.463 7.4 7.4 9.463 7.4 12C7.4 14.537 9.463 16.6 12 16.6C13.234 16.6 14.35 16.106 15.177 15.313C15.826 16.269 16.93 17 18 17L18.002 16.981C18.064 16.994 18.129 17 18.195 17H18.4C20.552 17 22 15.306 22 12.782V12C22 6.486 17.514 2 12 2ZM12 14.599C10.566 14.599 9.4 13.433 9.4 11.999C9.4 10.565 10.566 9.399 12 9.399C13.434 9.399 14.6 10.565 14.6 11.999C14.6 13.433 13.434 14.599 12 14.599Z'/%3E%3C/svg%3E");
--pointless-icon-mute: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M21.178 1.70703L22.592 3.12103L4.12103 21.593L2.70703 20.178L21.178 1.70703Z'/%3E%3Cpath fill='currentColor' d='M18 10.5283L10.5287 18H21V17C19.344 17 18 15.657 18 14V10.5283Z'/%3E%3Cpath fill='currentColor' d='M8.957 19.5718L9.52877 19H15.4449C14.7519 20.19 13.4759 21 11.9999 21C10.7748 21 9.68752 20.442 8.957 19.5718Z'/%3E%3Cpath fill='currentColor' d='M12 3C13.417 3 14.71 3.5 15.734 4.321L5.99805 14.058C5.99805 14.0479 5.99856 14.038 5.99907 14.0283C5.99956 14.0188 6.00005 14.0094 6.00005 14V9C6.00005 5.686 8.68605 3 12 3Z'/%3E%3C/svg%3E");
--pointless-icon-unmute: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M18 9V14C18 15.657 19.344 17 21 17V18H3V17C4.656 17 6 15.657 6 14V9C6 5.686 8.686 3 12 3C15.314 3 18 5.686 18 9ZM11.9999 21C10.5239 21 9.24793 20.19 8.55493 19H15.4449C14.7519 20.19 13.4759 21 11.9999 21Z'/%3E%3C/svg%3E");
--pointless-icon-mark-read: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='m3,17.12111c0.6,-0.53333 3,-0.16667 3,-3.3l0,-4.7c0.1,-3.06667 1.83,-6 6.1,-6.01c4.27,-0.01 5.9,2.91 5.9,6.01l0,0.98l-1,0.02c-3.31,0.4 -5,2.69 -5,6c0,0.7 0.12,1.37 0.34,2l-9.34,0m9,3c-1.1,0 -2.7,-0.99 -3.3,-2l4.1,0c0.24,0.41 0.53,0.79 0.85,1.13c-0.36,0.53 -0.96,0.87 -1.65,0.87z'/%3E%3Cpath fill='currentColor' d='m17.75,19.18111l-2.75,-3l1.16,-1.16l1.59,1.59l3.59,-3.59l1.16,1.41l-4.75,4.75'/%3E%3C/svg%3E");
--pointless-icon-notifications: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M18 9V14C18 15.657 19.344 17 21 17V18H3V17C4.656 17 6 15.657 6 14V9C6 5.686 8.686 3 12 3C15.314 3 18 5.686 18 9ZM11.9999 21C10.5239 21 9.24793 20.19 8.55493 19H15.4449C14.7519 20.19 13.4759 21 11.9999 21Z'/%3E%3C/svg%3E");
--pointless-icon-invite-create: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M10.6 13.4A1 1 0 0 1 9.2 14.8A4.8 4.8 0 0 1 9.2 7.8L12.7 4.2A5.1 5.1 0 0 1 19.8 4.2A5.1 5.1 0 0 1 19.8 11.3L18.3 12.8A6.4 6.4 0 0 0 17.9 10.4L18.4 9.9A3.2 3.2 0 0 0 18.4 5.6A3.2 3.2 0 0 0 14.1 5.6L10.6 9.2A2.9 2.9 0 0 0 10.6 13.4M23 18V20H20V23H18V20H15V18H18V15H20V18M16.2 13.7A4.8 4.8 0 0 0 14.8 9.2A1 1 0 0 0 13.4 10.6A2.9 2.9 0 0 1 13.4 14.8L9.9 18.4A3.2 3.2 0 0 1 5.6 18.4A3.2 3.2 0 0 1 5.6 14.1L6.1 13.7A7.3 7.3 0 0 1 5.7 11.2L4.2 12.7A5.1 5.1 0 0 0 4.2 19.8A5.1 5.1 0 0 0 11.3 19.8L13.1 18A6 6 0 0 1 16.2 13.7Z'/%3E%3C/svg%3E");
--pointless-icon-settings: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M19.738 10H22V14H19.739C19.498 14.931 19.1 15.798 18.565 16.564L20 18L18 20L16.565 18.564C15.797 19.099 14.932 19.498 14 19.738V22H10V19.738C9.069 19.498 8.203 19.099 7.436 18.564L6 20L4 18L5.436 16.564C4.901 15.799 4.502 14.932 4.262 14H2V10H4.262C4.502 9.068 4.9 8.202 5.436 7.436L4 6L6 4L7.436 5.436C8.202 4.9 9.068 4.502 10 4.262V2H14V4.261C14.932 4.502 15.797 4.9 16.565 5.435L18 3.999L20 5.999L18.564 7.436C19.099 8.202 19.498 9.069 19.738 10ZM12 16C14.2091 16 16 14.2091 16 12C16 9.79086 14.2091 8 12 8C9.79086 8 8 9.79086 8 12C8 14.2091 9.79086 16 12 16Z'/%3E%3C/svg%3E");
--pointless-icon-create: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M12 2.00098C6.486 2.00098 2 6.48698 2 12.001C2 17.515 6.486 22.001 12 22.001C17.514 22.001 22 17.515 22 12.001C22 6.48698 17.514 2.00098 12 2.00098ZM17 13.001H13V17.001H11V13.001H7V11.001H11V7.00098H13V11.001H17V13.001Z'/%3E%3C/svg%3E");
--pointless-icon-delete: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M15 3.999V2H9V3.999H3V5.999H21V3.999H15Z'/%3E%3Cpath fill='currentColor' d='M5 6.99902V18.999C5 20.101 5.897 20.999 7 20.999H17C18.103 20.999 19 20.101 19 18.999V6.99902H5ZM11 17H9V11H11V17ZM15 17H13V11H15V17Z'/%3E%3C/svg%3E");
}
/* template for icon
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='
'/%3E%3C/svg%3E");
*/
/* Message Context Menu, Message Actions Menu (···) */
#message-add-reaction, #message-add-reaction--other-reactions {
/* Timothy */
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' fill-rule='evenodd' d='M12.2512 2.00309C12.1677 2.00104 12.084 2 12 2C6.477 2 2 6.477 2 12C2 17.522 6.477 22 12 22C17.523 22 22 17.522 22 12C22 11.916 21.999 11.8323 21.9969 11.7488C21.3586 11.9128 20.6895 12 20 12C15.5817 12 12 8.41828 12 4C12 3.31052 12.0872 2.6414 12.2512 2.00309ZM10 8C10 6.896 9.104 6 8 6C6.896 6 6 6.896 6 8C6 9.105 6.896 10 8 10C9.104 10 10 9.105 10 8ZM12 19C15.14 19 18 16.617 18 14V13H6V14C6 16.617 8.86 19 12 19Z'/%3E%3Cpath fill='white' d='M21 3V0H19V3H16V5H19V8H21V5H24V3H21Z'/%3E%3C/svg%3E");
}
#message-reactions, #message-actions-reactionsd {
/* Jeff */
/* m12,2c-5.523,0 -10,4.477 -10,10c0,5.522 4.477,10 10,10c5.523,0 10,-4.478 10,-10c0,-5.522 -4.477,-10 -10,-10zm-2,6c0,-1.104 -0.896,-2 -2,-2c-1.104,0 -2,0.896 -2,2c0,1.105 0.896,2 2,2c1.104,0 2,-0.895 2,-2zm2,11c3.14,0 6,-2.383 6,-5l0,-1l-12,0l0,1c0,2.617 2.86,5 6,5z */
/* <path clip-rule="evenodd" d="m12,2c-5.523,0 -10,4.477 -10,10c0,5.522 4.477,10 10,10c5.523,0 10,-4.478 10,-10c0,-5.522 -4.477,-10 -10,-10zm-2,6c0,-1.104 -0.896,-2 -2,-2c-1.104,0 -2,0.896 -2,2c0,1.105 0.896,2 2,2c1.104,0 2,-0.895 2,-2zm8,-2l6,0c0,-1.104 -0.896,-2 -2,-2c-1.104,0 -2,0.896 -2,2c0,1.105 0.896,2 2,2c1.104,0 2,-0.895 2,-2l-6,0zm2,11c3.14,0 6,-2.383 6,-5l0,-1l-12,0l0,1c0,2.617 2.86,5 6,5z" fill="currentColor" fill-rule="evenodd" id="svg_1"/> */
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' fill-rule='evenodd' d='m12,2c-5.523,0 -10,4.477 -10,10c0,5.522 4.477,10 10,10c5.523,0 10,-4.478 10,-10c0,-5.522 -4.477,-10 -10,-10zm-2,6c0,-1.104 -0.896,-2 -2,-2c-1.104,0 -2,0.896 -2,2c0,1.105 0.896,2 2,2c1.104,0 2,-0.895 2,-2zm2,0l6,0c0,-1.104 -0.896,-2 -2,-2c-1.104,0 -2,0.896 -2,2c0,1.105 0.896,2 2,2c1.104,0 2,-0.895 2,-2l-6,0zm0,11c3.14,0 6,-2.383 6,-5l0,-1l-12,0l0,1c0,2.617 2.86,5 6,5z'/%3E%3C/svg%3E");
}
#message-actions-edit, #message-edit {
--icon: var(--pointless-icon-edit);
}
#message-pin, #message-unpin, #message-actions-pin {
--icon: var(--pointless-icon-pin);
}
#message-reply, #message-actions-reply {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M10 8.26667V4L3 11.4667L10 18.9333V14.56C15 14.56 18.5 16.2667 21 20C20 14.6667 17 9.33333 10 8.26667Z'/%3E%3C/svg%3E");
}
#message-thread, #message-actions-thread {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M5.43309 21C5.35842 21 5.30189 20.9325 5.31494 20.859L5.99991 17H2.14274C2.06819 17 2.01168 16.9327 2.02453 16.8593L2.33253 15.0993C2.34258 15.0419 2.39244 15 2.45074 15H6.34991L7.40991 9H3.55274C3.47819 9 3.42168 8.93274 3.43453 8.85931L3.74253 7.09931C3.75258 7.04189 3.80244 7 3.86074 7H7.75991L8.45234 3.09903C8.46251 3.04174 8.51231 3 8.57049 3H10.3267C10.4014 3 10.4579 3.06746 10.4449 3.14097L9.75991 7H15.7599L16.4523 3.09903C16.4625 3.04174 16.5123 3 16.5705 3H18.3267C18.4014 3 18.4579 3.06746 18.4449 3.14097L17.7599 7H21.6171C21.6916 7 21.7481 7.06725 21.7353 7.14069L21.4273 8.90069C21.4172 8.95811 21.3674 9 21.3091 9H17.4099L17.0495 11.04H15.05L15.4104 9H9.41035L8.35035 15H10.5599V17H7.99991L7.30749 20.901C7.29732 20.9583 7.24752 21 7.18934 21H5.43309Z'/%3E%3Cpath fill='currentColor' d='M13.4399 12.96C12.9097 12.96 12.4799 13.3898 12.4799 13.92V20.2213C12.4799 20.7515 12.9097 21.1813 13.4399 21.1813H14.3999C14.5325 21.1813 14.6399 21.2887 14.6399 21.4213V23.4597C14.6399 23.6677 14.8865 23.7773 15.0408 23.6378L17.4858 21.4289C17.6622 21.2695 17.8916 21.1813 18.1294 21.1813H22.5599C23.0901 21.1813 23.5199 20.7515 23.5199 20.2213V13.92C23.5199 13.3898 23.0901 12.96 22.5599 12.96H13.4399Z'/%3E%3C/svg%3E");
}
#message-apps {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M12 2C14.761 2 17 4.238 17 7V9H7V7C7 4.238 9.238 2 12 2ZM10.5 5.5C10.5 6.329 11.172 7 12 7C12.828 7 13.5 6.329 13.5 5.5C13.5 4.671 12.828 4 12 4C11.172 4 10.5 4.671 10.5 5.5ZM23 22H17L19 19V12H17V18C17 18.553 16.552 19 16 19H14L15 22H9L10 19H8C7.448 19 7 18.553 7 18V12H5V19L7 22H1L3 19V12C3 10.896 3.897 10 5 10H19C20.103 10 21 10.896 21 12V19L23 22ZM13 14C13 14.553 13.448 15 14 15C14.552 15 15 14.553 15 14C15 13.447 14.552 13 14 13C13.448 13 13 13.447 13 14Z'/%3E%3C/svg%3E");
}
#message-mark-unread, #message-actions-mark-unread {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M14 3H20C21 3 22.0001 4 22.0001 5V19.0003C22.0001 20 21 21 20 21H14C13 21 6 13 6 13H2V11H6C6 11 13 3 14 3Z'/%3E%3C/svg%3E");
}
#message-copy-link, #message-copy-message-link, #message-actions-copy-link {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M10.59 13.41c.41.39.41 1.03 0 1.42-.39.39-1.03.39-1.42 0a5.003 5.003 0 0 1 0-7.07l3.54-3.54a5.003 5.003 0 0 1 7.07 0 5.003 5.003 0 0 1 0 7.07l-1.49 1.49c.01-.82-.12-1.64-.4-2.42l.47-.48a2.982 2.982 0 0 0 0-4.24 2.982 2.982 0 0 0-4.24 0l-3.53 3.53a2.982 2.982 0 0 0 0 4.24zm2.82-4.24c.39-.39 1.03-.39 1.42 0a5.003 5.003 0 0 1 0 7.07l-3.54 3.54a5.003 5.003 0 0 1-7.07 0 5.003 5.003 0 0 1 0-7.07l1.49-1.49c-.01.82.12 1.64.4 2.43l-.47.47a2.982 2.982 0 0 0 0 4.24 2.982 2.982 0 0 0 4.24 0l3.53-3.53a2.982 2.982 0 0 0 0-4.24.973.973 0 0 1 0-1.42z'/%3E%3C/svg%3E");
}
#message-tts, #message-actions-tts {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' fill-rule='evenodd' d='M2.99805 4.8C2.99805 3.8055 3.80445 3 4.79805 3H19.198C20.1925 3 20.998 3.8055 20.998 4.8V15.6C20.998 16.5936 20.1925 17.4 19.198 17.4H11.098L7.49805 21V17.4H4.79805C3.80445 17.4 2.99805 16.5936 2.99805 15.6V4.8ZM11.5737 5.16264C11.7336 5.00375 11.9739 4.95652 12.183 5.04208C12.3921 5.12708 12.5279 5.33098 12.5279 5.55487V14.444C12.5279 14.669 12.3921 14.8718 12.183 14.9579C11.9739 15.0435 11.7336 14.9963 11.5737 14.8374L9.1739 12.2217H7.4969C7.18945 12.2217 6.9379 11.9717 6.9379 11.6662V8.33273C6.9379 8.02772 7.18945 7.77716 7.4969 7.77716H9.1739L11.5737 5.16264ZM13.6459 7.22159V6.11044C15.8037 6.11044 17.5589 7.85549 17.5589 9.99944C17.5589 12.1445 15.8037 13.8884 13.6459 13.8884V12.7773C15.1871 12.7773 16.4409 11.5312 16.4409 9.99944C16.4409 8.46829 15.1871 7.22159 13.6459 7.22159ZM15.3229 9.99944C15.3229 9.08108 14.5705 8.33273 13.6459 8.33273V9.44387C13.9539 9.44387 14.2049 9.69332 14.2049 9.99944C14.2049 10.3056 13.9539 10.555 13.6459 10.555V11.6662C14.5705 11.6662 15.3229 10.9189 15.3229 9.99944Z'/%3E%3C/svg%3E");
}
#message-remove-reactions {
/* Robert */
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' fill-rule='evenodd' d='m12.2512,2.00309c-0.0835,-0.00205 -0.1672,-0.00309 -0.2512,-0.00309c-5.523,0 -10,4.477 -10,10c0,5.522 4.477,10 10,10c5.523,0 10,-4.478 10,-10c0,-0.084 -0.001,-0.1677 -0.0031,-0.2512c-0.6383,0.164 -1.3074,0.2512 -1.9969,0.2512c-4.4183,0 -8,-3.58172 -8,-8c0,-0.68948 0.0872,-1.3586 0.2512,-1.99691zm-2.2512,5.99691c0,-1.104 -0.896,-2 -2,-2c-1.104,0 -2,0.896 -2,2c0,1.105 0.896,2 2,2c1.104,0 2,-0.895 2,-2zm2,11c3.14,0 6,-2.383 6,-5l0,-1l-12,0l0,1c0,2.617 2.86,5 6,5z'/%3E%3Cpath fill='currentColor' d='m19.96016,2.62828l2.12,-2.13l1.42,1.42l-2.13,2.12l2.13,2.12l-1.42,1.42l-2.12,-2.13l-2.12,2.13l-1.42,-1.42l2.13,-2.12l-2.13,-2.12l1.42,-1.42l2.12,2.13z'/%3E%3C/svg%3E");
}
#message-actions-delete, #message-delete {
--icon: var(--pointless-icon-delete);
}
#message-copy-image {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z'/%3E%3C/svg%3E");
}
#message-save-image {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M15,9H5V5H15M12,19A3,3 0 0,1 9,16A3,3 0 0,1 12,13A3,3 0 0,1 15,16A3,3 0 0,1 12,19M17,3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V7L17,3Z'/%3E%3C/svg%3E");
}
#message-copy-native-link {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M10.59 13.41c.41.39.41 1.03 0 1.42-.39.39-1.03.39-1.42 0a5.003 5.003 0 0 1 0-7.07l3.54-3.54a5.003 5.003 0 0 1 7.07 0 5.003 5.003 0 0 1 0 7.07l-1.49 1.49c.01-.82-.12-1.64-.4-2.42l.47-.48a2.982 2.982 0 0 0 0-4.24 2.982 2.982 0 0 0-4.24 0l-3.53 3.53a2.982 2.982 0 0 0 0 4.24zm2.82-4.24c.39-.39 1.03-.39 1.42 0a5.003 5.003 0 0 1 0 7.07l-3.54 3.54a5.003 5.003 0 0 1-7.07 0 5.003 5.003 0 0 1 0-7.07l1.49-1.49c-.01.82.12 1.64.4 2.43l-.47.47a2.982 2.982 0 0 0 0 4.24 2.982 2.982 0 0 0 4.24 0l3.53-3.53a2.982 2.982 0 0 0 0-4.24.973.973 0 0 1 0-1.42z'/%3E%3C/svg%3E");
}
#message-open-native-link {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='m10.6,13.4a1,1 0 0 1 -1.4,1.4a4.8,4.8 0 0 1 0,-7l3.5,-3.6a5.1,5.1 0 0 1 7.1,0a5.1,5.1 0 0 1 0,7.1l-1.5,1.5a6.4,6.4 0 0 0 -0.4,-2.4l0.5,-0.5a3.2,3.2 0 0 0 0,-4.3a3.2,3.2 0 0 0 -4.3,0l-3.5,3.6a2.9,2.9 0 0 0 0,4.2m5.6,0.3a4.8,4.8 0 0 0 -1.4,-4.5a1,1 0 0 0 -1.4,1.4a2.9,2.9 0 0 1 0,4.2l-3.5,3.6a3.2,3.2 0 0 1 -4.3,0a3.2,3.2 0 0 1 0,-4.3l0.5,-0.4a7.3,7.3 0 0 1 -0.4,-2.5l-1.5,1.5a5.1,5.1 0 0 0 0,7.1a5.1,5.1 0 0 0 7.1,0l1.8,-1.8a6,6 0 0 1 3.1,-4.3zM19,21l0,-2l-4,0l0,-2l4,0l0,-2l3,3l-3,3'/%3E%3C/svg%3E");
}
/* Plugins */
#message-notebook {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M 18 0 L 13 0 L 13 11 L 10 8 L 7 11 L 7 0 L 2 0 L 2 20 L 4.464844 24 L 21 24 L 21 5.722656 Z M 19 22 L 5.535156 22 L 4.320313 20 L 18 20 L 18 4.136719 L 19 6.277344 Z'/%3E%3C/svg%3E");
}
#message-translate-message {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M 19.794, 3.299 H 9.765 L 8.797, 0 h -6.598 C 0.99, 0, 0, 0.99, 0, 2.199 V 16.495 c 0, 1.21, 0.99, 2.199, 2.199, 2.199 H 9.897 l 1.1, 3.299 H 19.794 c 1.21, 0, 2.199 -0.99, 2.199 -2.199 V 5.498 C 21.993, 4.289, 21.003, 3.299, 19.794, 3.299 z M 5.68, 13.839 c -2.48, 0 -4.492 -2.018 -4.492 -4.492 s 2.018 -4.492, 4.492 -4.492 c 1.144, 0, 2.183, 0.407, 3.008, 1.171 l 0.071, 0.071 l -1.342, 1.298 l -0.066 -0.06 c -0.313 -0.297 -0.858 -0.643 -1.671 -0.643 c -1.441, 0 -2.612, 1.193 -2.612, 2.661 c 0, 1.468, 1.171, 2.661, 2.612, 2.661 c 1.507, 0, 2.161 -0.962, 2.337 -1.606 h -2.43 v -1.704 h 4.344 l 0.016, 0.077 c 0.044, 0.231, 0.06, 0.434, 0.06, 0.665 C 10.001, 12.036, 8.225, 13.839, 5.68, 13.839 z M 11.739, 9.979 h 4.393 c 0, 0 -0.374, 1.446 -1.715, 3.008 c -0.588 -0.676 -0.995 -1.336 -1.254 -1.864 h -1.089 L 11.739, 9.979 z M 13.625, 13.839 l -0.588, 0.583 l -0.72 -2.452 C 12.685, 12.63, 13.13, 13.262, 13.625, 13.839 z M 20.893, 19.794 c 0, 0.605 -0.495, 1.1 -1.1, 1.1 H 12.096 l 2.199 -2.199 l -0.896 -3.041 l 1.012 -1.012 l 2.953, 2.953 l 0.803 -0.803 l -2.975 -2.953 c 0.99 -1.138, 1.759 -2.474, 2.106 -3.854 h 1.397 V 8.841 H 14.697 v -1.144 h -1.144 v 1.144 H 11.398 l -1.309 -4.443 H 19.794 c 0.605, 0, 1.1, 0.495, 1.1, 1.1 V 19.794 z'/%3E%3C/svg%3E");
}
/* Guild Context Menu, Guild Header Popout Menu */
#guild-header-popout-premium-subscribe {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 12'%3E%3Cpath fill='currentColor' d='M4 0L0 4V8L4 12L8 8V4L4 0ZM7 7.59L4 10.59L1 7.59V4.41L4 1.41L7 4.41V7.59Z'/%3E%3Cpath fill='currentColor' d='M2 4.83V7.17L4 9.17L6 7.17V4.83L4 2.83L2 4.83Z'/%3E%3C/svg%3E");
}
#guild-context-mark-guild-read {
--icon: var(--pointless-icon-mark-read);
}
#guild-context-invite-people, #guild-header-popout-invite-people {
--icon: var(--pointless-icon-invite-create);
}
#guild-context-mute-guild {
--icon: var(--pointless-icon-mute);
}
#guild-context-unmute-guild {
--icon: var(--pointless-icon-unmute);
}
#guild-context-mute-guild--900, #channel-context-mute-channel--900 {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M12 2C6.5 2 2 6.5 2 12C2 17.5 6.5 22 12 22C17.5 22 22 17.5 22 12S17.5 2 12 2M17 13H11V7H12.5V11.5H17V13Z'/%3E%3C/svg%3E");
}
#guild-context-mute-guild--3600, #channel-context-mute-channel--3600 {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M12 2C6.5 2 2 6.5 2 12C2 17.5 6.5 22 12 22C17.5 22 22 17.5 22 12S17.5 2 12 2M12.3 13H11V7H12.5V9.7L14 7.1L15.3 7.9L12.3 13Z'/%3E%3C/svg%3E");
}
#guild-context-mute-guild--28800, #channel-context-mute-channel--28800 {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M12 2C6.5 2 2 6.5 2 12C2 17.5 6.5 22 12 22C17.5 22 22 17.5 22 12S17.5 2 12 2M7.7 15.5L7 14.2L11 11.9V7H12.5V12.8L7.7 15.5Z'/%3E%3C/svg%3E");
}
#guild-context-mute-guild--86400, #channel-context-mute-channel--86400 {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M12 2C6.5 2 2 6.5 2 12C2 17.5 6.5 22 12 22C17.5 22 22 17.5 22 12S17.5 2 12 2M12.5 13H11V7H12.5V13Z'/%3E%3C/svg%3E");
}
#guild-context-mute-guild---1, #channel-context-mute-channel---1 {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='m2.92,2.29l-1.27,1.28l3.55,3.54c-1.37,1.58 -2.2,3.64 -2.2,5.89a9,9 0 0 0 9,9c2.25,0 4.31,-0.83 5.89,-2.2l2.2,2.2l1.27,-1.27l-18.44,-18.44m17.17,14.63c0.58,-1.19 0.91,-2.51 0.91,-3.92a9,9 0 0 0 -9,-9c-1.41,0 -2.73,0.33 -3.92,0.91l12.01,12.01z'/%3E%3C/svg%3E");
/*--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='m2.92,2.29l-1.27,1.28l2.2487,2.539c-6.76582,10.9861 6.5054,20.26621 14.0914,13.7911l2.0999,2.0999l1.27,-1.27l-5.16,-4.585l-5.2601,-3.2851l-0.0199,-2.4701m9.5704,6.9306c2.87557,-5.1742 1.14654,-9.8479 -1.58349,-12.5196c-2.73003,-2.6717 -8.23551,-4.0744 -12.52861,-1.092l4.6035,4.0029l0.05002,-0.82585l1.55133,0.07505l-0.00015,2.5522l7.9074,7.8073z'/%3E%3C/svg%3E");*/
}
#guild-context-guild-settings, #guild-header-popout-settings {
--icon: var(--pointless-icon-settings);
}
#guild-header-popout-insights {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath fill='currentColor' d='M4.5,16.5v-3H3A1.5,1.5,0,0,1,1.5,12V3A1.5,1.5,0,0,1,3,1.5H15A1.5,1.5,0,0,1,16.5,3v9A1.5,1.5,0,0,1,15,13.5H8.5ZM3,3v9H6v1.5L8,12h7V3Z'/%3E%3Cpath fill='currentColor' d='M6.75,4.5H5.25v6h1.5Z'/%3E%3Cpath fill='currentColor' d='M9.75,7.5H8.25v3h1.5Z'/%3E%3Cpath fill='currentColor' d='M12.75,6h-1.5v4.5h1.5Z'/%3E%3C/svg%3E");
}
#guild-context-notifications, #guild-header-popout-notifications {
--icon: var(--pointless-icon-notifications);
}
#guild-context-privacy, #guild-header-popout-privacy {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M19 6.00001C15.56 6.00001 12.826 2.43501 12.799 2.39801C12.421 1.89801 11.579 1.89801 11.201 2.39801C11.174 2.43501 8.44 6.00001 5 6.00001C4.447 6.00001 4 6.44801 4 7.00001V14C4 17.807 10.764 21.478 11.534 21.884C11.68 21.961 11.84 21.998 12 21.998C12.16 21.998 12.32 21.96 12.466 21.884C13.236 21.478 20 17.807 20 14V7.00001C20 6.44801 19.553 6.00001 19 6.00001ZM15 16L12 14L9 16L10 13L8 11H11L12 8.00001L13 11H16L14 13L15 16Z'/%3E%3C/svg%3E");
}
#guild-context-change-nickname, #guild-header-popout-change-nickname {
--icon: var(--pointless-icon-edit);
}
#guild-context-create-channel, #guild-header-popout-create-channel {
--icon: var(--pointless-icon-create);
}
#guild-context-create-category, #guild-header-popout-create-category {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M20 7H12L10.553 5.106C10.214 4.428 9.521 4 8.764 4H3C2.447 4 2 4.447 2 5V19C2 20.104 2.895 21 4 21H20C21.104 21 22 20.104 22 19V9C22 7.896 21.104 7 20 7ZM16 15H13V18H11V15H8V13H11V10H13V13H16V15Z'/%3E%3C/svg%3E");
}
#guild-context-create-event, #guild-header-popout-create-event {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19a2 2 0 0 0 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11zM7 10h5v5H7v-5z'/%3E%3C/svg%3E");
}
#guild-context-leave-guild, #guild-header-popout-leave {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M10.418 13L12.708 15.294L11.292 16.706L6.586 11.991L11.294 7.292L12.707 8.708L10.41 11H21.949C21.446 5.955 17.177 2 12 2C6.486 2 2 6.487 2 12C2 17.513 6.486 22 12 22C17.177 22 21.446 18.046 21.949 13H10.418Z'/%3E%3C/svg%3E");
}
/* Folders */
#guild-context-mark-folder-read {
--icon: var(--pointless-icon-mark-read);
}
#guild-context-folder-settings {
--icon: var(--pointless-icon-settings);
}
#guild-context-folder-collapse {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M14,4H4V14H2V4A2,2 0 0,1 4,2H14V4M18,6H8A2,2 0 0,0 6,8V18H8V8H18V6M22,12V20A2,2 0 0,1 20,22H12A2,2 0 0,1 10,20V12A2,2 0 0,1 12,10H20A2,2 0 0,1 22,12M20,15H12V17H20V15Z'/%3E%3C/svg%3E");
}
/* New Server Context Menu - I'll bet you never knew this menu existed, I sure didn't */
#guild-context-join {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M12,5.5A3.5,3.5 0 0,1 15.5,9A3.5,3.5 0 0,1 12,12.5A3.5,3.5 0 0,1 8.5,9A3.5,3.5 0 0,1 12,5.5M5,8C5.56,8 6.08,8.15 6.53,8.42C6.38,9.85 6.8,11.27 7.66,12.38C7.16,13.34 6.16,14 5,14A3,3 0 0,1 2,11A3,3 0 0,1 5,8M19,8A3,3 0 0,1 22,11A3,3 0 0,1 19,14C17.84,14 16.84,13.34 16.34,12.38C17.2,11.27 17.62,9.85 17.47,8.42C17.92,8.15 18.44,8 19,8M5.5,18.25C5.5,16.18 8.41,14.5 12,14.5C15.59,14.5 18.5,16.18 18.5,18.25V20H5.5V18.25M0,20V18.5C0,17.11 1.89,15.94 4.45,15.6C3.86,16.28 3.5,17.22 3.5,18.25V20H0M24,20H20.5V18.25C20.5,17.22 20.14,16.28 19.55,15.6C22.11,15.94 24,17.11 24,18.5V20Z'/%3E%3C/svg%3E");
}
#guild-context-create {
--icon: var(--pointless-icon-create);
}
/* Plugins */
#guild-context-guild-profile, #guild-header-popout-guild-profile {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' fill-rule='evenodd' d='M21 3H3V21H21V3ZM17.4 6.6H6.6V8.4H17.4V6.6ZM6.6 10.2H17.4V12H6.6V10.2ZM13.8 13.8H6.6V15.6H13.8V13.8Z'/%3E%3C/svg%3E");
}
/* Channel Context Menu */
#channel-context-mark-channel-read {
--icon: var(--pointless-icon-mark-read);
}
#channel-context-mute-channel {
--icon: var(--pointless-icon-mute);
}
#channel-context-unmute-channel {
--icon: var(--pointless-icon-unmute);
}
#channel-context-channel-notifications {
--icon: var(--pointless-icon-notifications);
}
#channel-context-edit-channel {
--icon: var(--pointless-icon-edit);
}
#channel-context-invite-people {
--icon: var(--pointless-icon-invite-create);
}
#channel-context-clone-channel {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M2 12C2 9.2 3.6 6.8 6 5.7V3.5C2.5 4.8 0 8.1 0 12S2.5 19.2 6 20.5V18.3C3.6 17.2 2 14.8 2 12M15 3C10 3 6 7 6 12S10 21 15 21 24 17 24 12 20 3 15 3M20 13H16V17H14V13H10V11H14V7H16V11H20V13'/%3E%3C/svg%3E");
}
#channel-context-create-text-channel {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M5.88657 21C5.57547 21 5.3399 20.7189 5.39427 20.4126L6.00001 17H2.59511C2.28449 17 2.04905 16.7198 2.10259 16.4138L2.27759 15.4138C2.31946 15.1746 2.52722 15 2.77011 15H6.35001L7.41001 9H4.00511C3.69449 9 3.45905 8.71977 3.51259 8.41381L3.68759 7.41381C3.72946 7.17456 3.93722 7 4.18011 7H7.76001L8.39677 3.41262C8.43914 3.17391 8.64664 3 8.88907 3H9.87344C10.1845 3 10.4201 3.28107 10.3657 3.58738L9.76001 7H15.76L16.3968 3.41262C16.4391 3.17391 16.6466 3 16.8891 3H17.8734C18.1845 3 18.4201 3.28107 18.3657 3.58738L17.76 7H21.1649C21.4755 7 21.711 7.28023 21.6574 7.58619L21.4824 8.58619C21.4406 8.82544 21.2328 9 20.9899 9H17.41L16.35 15H19.7549C20.0655 15 20.301 15.2802 20.2474 15.5862L20.0724 16.5862C20.0306 16.8254 19.8228 17 19.5799 17H16L15.3632 20.5874C15.3209 20.8261 15.1134 21 14.8709 21H13.8866C13.5755 21 13.3399 20.7189 13.3943 20.4126L14 17H8.00001L7.36325 20.5874C7.32088 20.8261 7.11337 21 6.87094 21H5.88657ZM9.41045 9L8.35045 15H14.3504L15.4104 9H9.41045Z'/%3E%3C/svg%3E");
}
#channel-context-create-voice-channel {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M11.383 3.07904C11.009 2.92504 10.579 3.01004 10.293 3.29604L6 8.00204H3C2.45 8.00204 2 8.45304 2 9.00204V15.002C2 15.552 2.45 16.002 3 16.002H6L10.293 20.71C10.579 20.996 11.009 21.082 11.383 20.927C11.757 20.772 12 20.407 12 20.002V4.00204C12 3.59904 11.757 3.23204 11.383 3.07904ZM14 5.00195V7.00195C16.757 7.00195 19 9.24595 19 12.002C19 14.759 16.757 17.002 14 17.002V19.002C17.86 19.002 21 15.863 21 12.002C21 8.14295 17.86 5.00195 14 5.00195ZM14 9.00195C15.654 9.00195 17 10.349 17 12.002C17 13.657 15.654 15.002 14 15.002V13.002C14.551 13.002 15 12.553 15 12.002C15 11.451 14.551 11.002 14 11.002V9.00195Z'/%3E%3C/svg%3E");
}
#channel-context-delete-channel {
--icon: var(--pointless-icon-delete);
}
#channel-context-copy-channel-topic {
--icon: var(--pointless-icon-copy);
}
/* Threads */
#thread-context-join-thread {
--icon: var(--pointless-icon-create);
}
#thread-context-leave-thread {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M10.418 13L12.708 15.294L11.292 16.706L6.586 11.991L11.294 7.292L12.707 8.708L10.41 11H21.949C21.446 5.955 17.177 2 12 2C6.486 2 2 6.487 2 12C2 17.513 6.486 22 12 22C17.177 22 21.446 18.046 21.949 13H10.418Z'/%3E%3C/svg%3E");
}
#thread-context-mark-channel-read {
--icon: var(--pointless-icon-mark-read);
}
#thread-context-mute-channel {
--icon: var(--pointless-icon-mute);
}
#thread-context-thread-notifications {
--icon: var(--pointless-icon-notifications);
}
#thread-context-search {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z'/%3E%3C/svg%3E");
}
#thread-context-pins {
--icon: var(--pointless-icon-pin);
}
#thread-context-open {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M13,5H21V19H13V5M3,5H11V7H3V5M3,11V9H11V11H3M3,19V17H11V19H3M3,15V13H11V15H3Z'/%3E%3C/svg%3E");
}
/* Category */
#channel-context-collapse-all-categories {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M14,4H4V14H2V4A2,2 0 0,1 4,2H14V4M18,6H8A2,2 0 0,0 6,8V18H8V8H18V6M22,12V20A2,2 0 0,1 20,22H12A2,2 0 0,1 10,20V12A2,2 0 0,1 12,10H20A2,2 0 0,1 22,12M20,15H12V17H20V15Z'/%3E%3C/svg%3E");
}
/* User Context Menu, User Profile Modal Actions Menu */
#user-context-user-profile {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' fill-rule='evenodd' d='M21 3H3V21H21V3ZM17.4 6.6H6.6V8.4H17.4V6.6ZM6.6 10.2H17.4V12H6.6V10.2ZM13.8 13.8H6.6V15.6H13.8V13.8Z'/%3E%3C/svg%3E");
}
#user-context-mention {
--icon: var(--pointless-icon-role);
}
#user-context-message-user, #user-profile-actions-user-message {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='m3.929,2.34973c-0.95471,0 -1.72863,0.77507 -1.72863,1.73119l0,11.36328c0,0.95613 0.77392,1.73119 1.72863,1.73119l1.72863,0c0.23877,0 0.43216,0.19367 0.43216,0.43279l0,3.6759c0,0.37509 0.44404,0.57274 0.72188,0.32117l4.40259,-3.98336c0.31764,-0.28745 0.7307,-0.4465 1.1589,-0.4465l7.97778,0c0.95471,0 1.72863,-0.77507 1.72863,-1.73119l0,-11.36328c0,-0.95613 -0.77392,-1.73119 -1.72863,-1.73119l-16.42194,0l0,0.00001z'/%3E%3C/svg%3E");
}
#user-context-call {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M11 5V3C16.515 3 21 7.486 21 13H19C19 8.589 15.411 5 11 5ZM17 13H15C15 10.795 13.206 9 11 9V7C14.309 7 17 9.691 17 13ZM11 11V13H13C13 11.896 12.105 11 11 11ZM14 16H18C18.553 16 19 16.447 19 17V21C19 21.553 18.553 22 18 22H13C6.925 22 2 17.075 2 11V6C2 5.447 2.448 5 3 5H7C7.553 5 8 5.447 8 6V10C8 10.553 7.553 11 7 11H6C6.063 14.938 9 18 13 18V17C13 16.447 13.447 16 14 16Z'/%3E%3C/svg%3E");
}
#user-context-note {
/* MDI:file */
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M13,9V3.5L18.5,9M6,2C4.89,2 4,2.89 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2H6Z'/%3E%3C/svg%3E");
}
#user-context-user-volume {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M11.383 3.07904C11.009 2.92504 10.579 3.01004 10.293 3.29604L6 8.00204H3C2.45 8.00204 2 8.45304 2 9.00204V15.002C2 15.552 2.45 16.002 3 16.002H6L10.293 20.71C10.579 20.996 11.009 21.082 11.383 20.927C11.757 20.772 12 20.407 12 20.002V4.00204C12 3.59904 11.757 3.23204 11.383 3.07904ZM14 5.00195V7.00195C16.757 7.00195 19 9.24595 19 12.002C19 14.759 16.757 17.002 14 17.002V19.002C17.86 19.002 21 15.863 21 12.002C21 8.14295 17.86 5.00195 14 5.00195ZM14 9.00195C15.654 9.00195 17 10.349 17 12.002C17 13.657 15.654 15.002 14 15.002V13.002C14.551 13.002 15 12.553 15 12.002C15 11.451 14.551 11.002 14 11.002V9.00195Z'/%3E%3C/svg%3E");
}
[id^=user-context-spotify-play-] {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M17.9,10.9C14.7,9 9.35,8.8 6.3,9.75C5.8,9.9 5.3,9.6 5.15,9.15C5,8.65 5.3,8.15 5.75,8C9.3,6.95 15.15,7.15 18.85,9.35C19.3,9.6 19.45,10.2 19.2,10.65C18.95,11 18.35,11.15 17.9,10.9M17.8,13.7C17.55,14.05 17.1,14.2 16.75,13.95C14.05,12.3 9.95,11.8 6.8,12.8C6.4,12.9 5.95,12.7 5.85,12.3C5.75,11.9 5.95,11.45 6.35,11.35C10,10.25 14.5,10.8 17.6,12.7C17.9,12.85 18.05,13.35 17.8,13.7M16.6,16.45C16.4,16.75 16.05,16.85 15.75,16.65C13.4,15.2 10.45,14.9 6.95,15.7C6.6,15.8 6.3,15.55 6.2,15.25C6.1,14.9 6.35,14.6 6.65,14.5C10.45,13.65 13.75,14 16.35,15.6C16.7,15.75 16.75,16.15 16.6,16.45M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z'/%3E%3C/svg%3E");
}
[id^=user-context-spotify-sync-] {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M9,5A4,4 0 0,1 13,9A4,4 0 0,1 9,13A4,4 0 0,1 5,9A4,4 0 0,1 9,5M9,15C11.67,15 17,16.34 17,19V21H1V19C1,16.34 6.33,15 9,15M16.76,5.36C18.78,7.56 18.78,10.61 16.76,12.63L15.08,10.94C15.92,9.76 15.92,8.23 15.08,7.05L16.76,5.36M20.07,2C24,6.05 23.97,12.11 20.07,16L18.44,14.37C21.21,11.19 21.21,6.65 18.44,3.63L20.07,2Z'/%3E%3C/svg%3E");
}
#user-context-change-nickname {
--icon: var(--pointless-icon-edit);
}
#user-context-invite-to-server {
/* <path d="m24,3zm-14,9c2.205,0 4,-1.795 4,-4c0,-2.205 -1.795,-4 -4,-4c-2.205,0 -4,1.795 -4,4c0,2.205 1.795,4 4,4zm0,1c-4.711,0 -8,2.467 -8,6l0,1l16,0l0,-1c0,-3.533 -3.289,-6 -8,-6zm9.99922,-5.99922l0,-2l-4,0l0,-2l4,0l0,-2l3,3l-3,3" fill="blue"/> */
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='m12,5.5a3.5,3.5 0 0 1 3.5,3.5a3.5,3.5 0 0 1 -3.5,3.5a3.5,3.5 0 0 1 -3.5,-3.5a3.5,3.5 0 0 1 3.5,-3.5m-7,2.5c0.56,0 1.08,0.15 1.53,0.42c-0.15,1.43 0.27,2.85 1.13,3.96c-0.5,0.96 -1.5,1.62 -2.66,1.62a3,3 0 0 1 -3,-3a3,3 0 0 1 3,-3m14,0a3,3 0 0 1 3,3a3,3 0 0 1 -3,3c-1.16,0 -2.16,-0.66 -2.66,-1.62c0.86,-1.11 1.28,-2.53 1.13,-3.96c0.45,-0.27 0.97,-0.42 1.53,-0.42m-13.5,10.25c0,-2.07 2.91,-3.75 6.5,-3.75c3.59,0 6.5,1.68 6.5,3.75l0,1.75l-13,0l0,-1.75m-5.5,1.75l0,-1.5c0,-1.39 1.89,-2.56 4.45,-2.9c-0.59,0.68 -0.95,1.62 -0.95,2.65l0,1.75l-3.5,0m24,0l-3.5,0l0,-1.75c0,-1.03 -0.36,-1.97 -0.95,-2.65c2.56,0.34 4.45,1.51 4.45,2.9l0,1.5zm0,-17z'/%3E%3C/svg%3E");
}
#user-context-add-friend {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M21 3H24V5H21V8H19V5H16V3H19V0H21V3ZM10 12C12.205 12 14 10.205 14 8C14 5.795 12.205 4 10 4C7.795 4 6 5.795 6 8C6 10.205 7.795 12 10 12ZM10 13C5.289 13 2 15.467 2 19V20H18V19C18 15.467 14.711 13 10 13Z'/%3E%3C/svg%3E");
}
#user-context-remove-friend, #user-profile-actions-user-remove {
/* Edit of MDI:account-remove */
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='m24,3zm-14,9c2.205,0 4,-1.795 4,-4c0,-2.205 -1.795,-4 -4,-4c-2.205,0 -4,1.795 -4,4c0,2.205 1.795,4 4,4zm0,1c-4.711,0 -8,2.467 -8,6l0,1l16,0l0,-1c0,-3.533 -3.289,-6 -8,-6zm20,2.69l2.12,-2.13l1.42,1.42l-2.13,2.12l2.13,2.12l-1.42,1.42l-2.12,-2.13l-2.12,2.13l-1.42,-1.42l2.13,-2.12l-2.13,-2.12l1.42,-1.42l2.12,2.13z'/%3E%3Cpath fill='currentColor' d='m20,2.69l2.12,-2.13l1.42,1.42l-2.13,2.12l2.13,2.12l-1.42,1.42l-2.12,-2.13l-2.12,2.13l-1.42,-1.42l2.13,-2.12l-2.13,-2.12l1.42,-1.42l2.12,2.13z'/%3E%3C/svg%3E");
}
#user-context-block, #user-profile-actions-user-block {
/* MDI:cancel */
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M12 2C17.5 2 22 6.5 22 12S17.5 22 12 22 2 17.5 2 12 6.5 2 12 2M12 4C10.1 4 8.4 4.6 7.1 5.7L18.3 16.9C19.3 15.5 20 13.8 20 12C20 7.6 16.4 4 12 4M16.9 18.3L5.7 7.1C4.6 8.4 4 10.1 4 12C4 16.4 7.6 20 12 20C13.9 20 15.6 19.4 16.9 18.3Z'/%3E%3C/svg%3E");
}
#user-context-kick {
/* MDI:account-off */
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M12,4A4,4 0 0,1 16,8C16,9.95 14.6,11.58 12.75,11.93L8.07,7.25C8.42,5.4 10.05,4 12,4M12.28,14L18.28,20L20,21.72L18.73,23L15.73,20H4V18C4,16.16 6.5,14.61 9.87,14.14L2.78,7.05L4.05,5.78L12.28,14M20,18V19.18L15.14,14.32C18,14.93 20,16.35 20,18Z'/%3E%3C/svg%3E");
}
#user-context-ban {
/* MDI:gavel */
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M2.3,20.28L11.9,10.68L10.5,9.26L9.78,9.97C9.39,10.36 8.76,10.36 8.37,9.97L7.66,9.26C7.27,8.87 7.27,8.24 7.66,7.85L13.32,2.19C13.71,1.8 14.34,1.8 14.73,2.19L15.44,2.9C15.83,3.29 15.83,3.92 15.44,4.31L14.73,5L16.15,6.43C16.54,6.04 17.17,6.04 17.56,6.43C17.95,6.82 17.95,7.46 17.56,7.85L18.97,9.26L19.68,8.55C20.07,8.16 20.71,8.16 21.1,8.55L21.8,9.26C22.19,9.65 22.19,10.29 21.8,10.68L16.15,16.33C15.76,16.72 15.12,16.72 14.73,16.33L14.03,15.63C13.63,15.24 13.63,14.6 14.03,14.21L14.73,13.5L13.32,12.09L3.71,21.7C3.32,22.09 2.69,22.09 2.3,21.7C1.91,21.31 1.91,20.67 2.3,20.28M20,19A2,2 0 0,1 22,21V22H12V21A2,2 0 0,1 14,19H20Z'/%3E%3C/svg%3E");
}
#user-context-roles {
--icon: var(--pointless-icon-role);
}
#user-context-transfer-ownership {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='white' d='M13.6572 5.42868C13.8879 5.29002 14.1806 5.30402 14.3973 5.46468C14.6133 5.62602 14.7119 5.90068 14.6473 6.16202L13.3139 11.4954C13.2393 11.7927 12.9726 12.0007 12.6666 12.0007H3.33325C3.02725 12.0007 2.76058 11.792 2.68592 11.4954L1.35258 6.16202C1.28792 5.90068 1.38658 5.62602 1.60258 5.46468C1.81992 5.30468 2.11192 5.29068 2.34325 5.42868L5.13192 7.10202L7.44592 3.63068C7.46173 3.60697 7.48377 3.5913 7.50588 3.57559C7.5192 3.56612 7.53255 3.55663 7.54458 3.54535L6.90258 2.90268C6.77325 2.77335 6.77325 2.56068 6.90258 2.43135L7.76458 1.56935C7.89392 1.44002 8.10658 1.44002 8.23592 1.56935L9.09792 2.43135C9.22725 2.56068 9.22725 2.77335 9.09792 2.90268L8.45592 3.54535C8.46794 3.55686 8.48154 3.56651 8.49516 3.57618C8.51703 3.5917 8.53897 3.60727 8.55458 3.63068L10.8686 7.10202L13.6572 5.42868ZM2.66667 12.6673H13.3333V14.0007H2.66667V12.6673Z'/%3E%3C/svg%3E");
}
/* DMs */
#user-context-mark-channel-read {
--icon: var(--pointless-icon-mark-read);
}
#user-context-mute-channel {
--icon: var(--pointless-icon-mute);
}
#user-context-mute-channel > [class|=label] > strong {
/* Adding an icon to the "Mute @user" messes up the mention spacing */
margin-left: 5px;
}
#user-context-close-dm {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='m18.30007,10.40007c-2.72222,0 -4.9,2.17778 -4.9,4.9c0,2.72222 2.17778,4.9 4.9,4.9c2.72222,0 4.9,-2.17778 4.9,-4.9c0,-2.72222 -2.17778,-4.9 -4.9,-4.9m0,1.63333c1.80756,0 3.26667,1.45911 3.26667,3.26667c0,0.60978 -0.16333,1.176 -0.45733,1.63333l-4.44267,-4.44267c0.45733,-0.294 1.02356,-0.45733 1.63333,-0.45733m-2.80933,1.63333l4.44267,4.44267c-0.45733,0.294 -1.02356,0.45733 -1.63333,0.45733c-1.80756,0 -3.26667,-1.45911 -3.26667,-3.26667c0,-0.60978 0.16333,-1.176 0.45733,-1.63333z'/%3E%3Cpath fill='currentColor' d='m2.85949,2.84983c-0.91629,0 -1.65906,0.73505 -1.65906,1.6418l0,10.77655c0,0.90676 0.74278,1.6418 1.65906,1.6418l1.65906,0c0.22917,0 0.41477,0.18367 0.41477,0.41045l0,3.4861c0,0.35572 0.42617,0.54317 0.69283,0.30458l4.22542,-3.77769c0.30486,-0.27261 0.7013,-0.42345 1.11226,-0.42345l1.37404,0c-0.14347,-5.58503 2.03894,-8.00976 7.94175,-7.56298l0,-4.85537c0,-0.90676 -0.74278,-1.6418 -1.65906,-1.6418l-15.76107,0l0,0.00001z'/%3E%3C/svg%3E");
}
/* Plugins */
/* --- Guild Settings --- */
/* Roles */
#guild-settings-role-context-view-as-role {
/* <polygon fill="currentColor" fill-rule="nonzero" points="13 20 11 20 11 8 5.5 13.5 4.08 12.08 12 4.16 19.92 12.08 18.5 13.5 13 8"></polygon> */
--icon: var(--pointless-icon-role);
}
#guild-settings-role-context-delete-role {
--icon: var(--pointless-icon-delete);
}
/* --- Other --- */
#textarea-context-languages {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M 19.794, 3.299 H 9.765 L 8.797, 0 h -6.598 C 0.99, 0, 0, 0.99, 0, 2.199 V 16.495 c 0, 1.21, 0.99, 2.199, 2.199, 2.199 H 9.897 l 1.1, 3.299 H 19.794 c 1.21, 0, 2.199 -0.99, 2.199 -2.199 V 5.498 C 21.993, 4.289, 21.003, 3.299, 19.794, 3.299 z M 5.68, 13.839 c -2.48, 0 -4.492 -2.018 -4.492 -4.492 s 2.018 -4.492, 4.492 -4.492 c 1.144, 0, 2.183, 0.407, 3.008, 1.171 l 0.071, 0.071 l -1.342, 1.298 l -0.066 -0.06 c -0.313 -0.297 -0.858 -0.643 -1.671 -0.643 c -1.441, 0 -2.612, 1.193 -2.612, 2.661 c 0, 1.468, 1.171, 2.661, 2.612, 2.661 c 1.507, 0, 2.161 -0.962, 2.337 -1.606 h -2.43 v -1.704 h 4.344 l 0.016, 0.077 c 0.044, 0.231, 0.06, 0.434, 0.06, 0.665 C 10.001, 12.036, 8.225, 13.839, 5.68, 13.839 z M 11.739, 9.979 h 4.393 c 0, 0 -0.374, 1.446 -1.715, 3.008 c -0.588 -0.676 -0.995 -1.336 -1.254 -1.864 h -1.089 L 11.739, 9.979 z M 13.625, 13.839 l -0.588, 0.583 l -0.72 -2.452 C 12.685, 12.63, 13.13, 13.262, 13.625, 13.839 z M 20.893, 19.794 c 0, 0.605 -0.495, 1.1 -1.1, 1.1 H 12.096 l 2.199 -2.199 l -0.896 -3.041 l 1.012 -1.012 l 2.953, 2.953 l 0.803 -0.803 l -2.975 -2.953 c 0.99 -1.138, 1.759 -2.474, 2.106 -3.854 h 1.397 V 8.841 H 14.697 v -1.144 h -1.144 v 1.144 H 11.398 l -1.309 -4.443 H 19.794 c 0.605, 0, 1.1, 0.495, 1.1, 1.1 V 19.794 z'/%3E%3C/svg%3E");
}
#textarea-context-paste {
--icon: var(--pointless-icon-copy);
}
/* Plugins & Themes context menu (Open X folder & Load missing X) */
[id^=pc-][id$=-item-0-0-1] {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M14,18V15H10V11H14V8L19,13M20,6H12L10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6Z'/%3E%3C/svg%3E");
}
[id^=pc-][id$=-item-0-0-2] {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M2 12C2 16.97 6.03 21 11 21C13.39 21 15.68 20.06 17.4 18.4L15.9 16.9C14.63 18.25 12.86 19 11 19C4.76 19 1.64 11.46 6.05 7.05C10.46 2.64 18 5.77 18 12H15L19 16H19.1L23 12H20C20 7.03 15.97 3 11 3C6.03 3 2 7.03 2 12Z'/%3E%3C/svg%3E");
}
/* Copy ID for all sorts of stuff */
#message-devmode-copy-id, #message-actions-copy-id,
#guild-context-devmode-copy-id,
#channel-context-devmode-copy-id,
#thread-context-devmode-copy-id,
#user-context-devmode-copy-id,
#dev-context-devmode-copy-id,
#guild-settings-role-context-devmode-copy-id,
#copy-id-devmode-copy-id {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M5 2C3.34315 2 2 3.34315 2 5V19C2 20.6569 3.34315 22 5 22H19C20.6569 22 22 20.6569 22 19V5C22 3.34315 20.6569 2 19 2H5ZM8.79741 7.72V16H6.74541V7.72H8.79741ZM13.2097 7.72C16.0897 7.72 17.5897 9.388 17.5897 11.848C17.5897 14.308 16.0537 16 13.2577 16H10.3537V7.72H13.2097ZM13.1497 14.404C14.6137 14.404 15.5257 13.636 15.5257 11.86C15.5257 10.12 14.5537 9.316 13.1497 9.316H12.4057V14.404H13.1497Z'/%3E%3C/svg%3E");
}
/* DO NOT CHANGE unless you're manually updating this file. If you are making a backup and force updating (in the Powercord updater), do not copy this value */
:root {
--pointless-settings-ver-3: none;
}
.theme-dark {
/* Forest */
--_pointless-palette_set-forest-primary: rgba(27 ,64 ,38 ,var(--pointless-palette-forest));
--_pointless-palette_set-forest-primary_alt: rgba(25 ,56 ,35 ,var(--pointless-palette-forest));
--_pointless-palette_set-forest-secondary: rgba(23 ,54 ,32 ,var(--pointless-palette-forest));
--_pointless-palette_set-forest-secondary_alt: rgba(18 ,41 ,25 ,var(--pointless-palette-forest));
--_pointless-palette_set-forest-tertiary: rgba(11 ,26 ,15 ,var(--pointless-palette-forest));
--_pointless-palette_set-forest-chatbubble_self_0: rgba(46 ,139,87 ,var(--pointless-palette-forest));
--_pointless-palette_set-forest-chatbubble_self_100: rgba(42 ,127,42 ,var(--pointless-palette-forest));
/* "yellow" incomplete */
--_pointless-palette_set-yellow-primary: rgba(255,255,0, var(--pointless-palette-yellow));
--_pointless-palette_set-yellow-primary_alt: rgba(225,225,0, var(--pointless-palette-yellow));
--_pointless-palette_set-yellow-secondary: rgba(176,176,0, var(--pointless-palette-yellow));
--_pointless-palette_set-yellow-secondary_alt: rgba(127,127,0, var(--pointless-palette-yellow));
--_pointless-palette_set-yellow-tertiary: rgba(63 ,63 ,0, var(--pointless-palette-yellow));
--_pointless-palette_set-yellow-chatbubble_self_0: rgba(46 ,139,87 ,var(--pointless-palette-yellow));
--_pointless-palette_set-yellow-chatbubble_self_100: rgba(42 ,127,42 ,var(--pointless-palette-yellow));
/* Discord */
--_pointless-palette_set-discord-primary: rgba(54 ,57 ,63 ,var(--pointless-palette-discord));
--_pointless-palette_set-discord-primary_alt: rgba(51 ,54 ,59 ,var(--pointless-palette-discord));
--_pointless-palette_set-discord-secondary: rgba(47 ,49 ,54 ,var(--pointless-palette-discord));
--_pointless-palette_set-discord-secondary_alt: rgba(41 ,43 ,47 ,var(--pointless-palette-discord));
--_pointless-palette_set-discord-tertiary: rgba(32 ,34 ,37 ,var(--pointless-palette-discord));
--_pointless-palette_set-discord-chatbubble_self_0: rgba(60, 69, 166,var(--pointless-palette-discord));
--_pointless-palette_set-discord-chatbubble_self_100: rgba(88 ,101,242,var(--pointless-palette-discord));
/* Background (black, meant for use with a background image) */
--_pointless-palette_set-background-primary: rgba(0 ,0 ,0 ,var(--pointless-palette-background));
--_pointless-palette_set-background-primary_alt: rgba(0 ,0 ,0, var(--pointless-palette-background));
--_pointless-palette_set-background-secondary: rgba(0 ,0 ,0 ,var(--pointless-palette-background));
--_pointless-palette_set-background-secondary_alt: rgba(0 ,0 ,0 ,var(--pointless-palette-background));
--_pointless-palette_set-background-tertiary: rgba(0 ,0 ,0 ,var(--pointless-palette-background));
--_pointless-palette_set-background-chatbubble_self_0: rgba(46 ,139,87 ,var(--pointless-palette-background));
--_pointless-palette_set-background-chatbubble_self_100: rgba(42 ,127,42 ,var(--pointless-palette-background));
/* Select colors based on which variables are valid (Alpha channel != 0)
* If no variables are valid (no valid palette selected), default to blue. */
--background-primary: var(--_pointless-palette_set-forest-primary,
var(--_pointless-palette_set-yellow-primary,
var(--_pointless-palette_set-discord-primary,
var(--_pointless-palette_set-background-primary,#1b2340))));
--background-primary-alt: var(--_pointless-palette_set-forest-primary_alt,
var(--_pointless-palette_set-yellow-primary_alt,
var(--_pointless-palette_set-discord-primary_alt,
var(--_pointless-palette_set-background-primary_alt, #191f38))));
--background-secondary: var(--_pointless-palette_set-forest-secondary,
var(--_pointless-palette_set-yellow-secondary,
var(--_pointless-palette_set-discord-secondary,
var(--_pointless-palette_set-background-secondary, #171d36))));
--background-secondary-alt: var(--_pointless-palette_set-forest-secondary_alt,
var(--_pointless-palette_set-yellow-secondary_alt,
var(--_pointless-palette_set-discord-secondary_alt,
var(--_pointless-palette_set-background-secondary_alt, #121629))));
--background-tertiary: var(--_pointless-palette_set-forest-tertiary,
var(--_pointless-palette_set-yellow-tertiary,
var(--_pointless-palette_set-discord-tertiary,
var(--_pointless-palette_set-background-tertiary, #0b0e1a))));
--chatbubble-self: linear-gradient(var(--_pointless-palette_set-forest-chatbubble_self_0,
var(--_pointless-palette_set-yellow-chatbubble_self_0,
var(--_pointless-palette_set-discord-chatbubble_self_0,
var(--_pointless-palette_set-background-chatbubble_self_0, #4152a3)))) 0%,
var(--_pointless-palette_set-forest-chatbubble_self_100,
var(--_pointless-palette_set-yellow-chatbubble_self_100,
var(--_pointless-palette_set-discord-chatbubble_self_100,
var(--_pointless-palette_set-background-chatbubble_self_100, #344183)))) 100%);
--chatbubble-other: linear-gradient(var(--background-secondary) 0%,var(--background-secondary-alt) 100%);
}
.theme-light {
/* Light mode support is unfinished, this is just here to make sure the interface is usable */
--_pointless-palette_set-blue-primary: rgba(208,221,242,var(--pointless-palette-blue));
--_pointless-palette_set-blue-primary_alt: rgba(192,209,235,var(--pointless-palette-blue));
--_pointless-palette_set-blue-secondary: rgba(222,233,250,var(--pointless-palette-blue));
--_pointless-palette_set-blue-secondary_alt: rgba(206,220,242,var(--pointless-palette-blue));
--_pointless-palette_set-blue-tertiary: rgba(163,183,217,var(--pointless-palette-blue));
--_pointless-palette_set-blue-chatbubble_self_0: rgba(0 ,200,211,var(--pointless-palette-blue));
--_pointless-palette_set-blue-chatbubble_self_100: rgba(100,122,232,var(--pointless-palette-blue));
/* forest: 23 ,127,54 */
--background-primary: var(--_pointless-palette_set-blue-primary, #fff);
--background-primary-alt: var(--_pointless-palette_set-blue-primary_alt, #f8f9f9);
--background-secondary: var(--_pointless-palette_set-blue-secondary, #f2f3f5);
--background-secondary-alt: var(--_pointless-palette_set-blue-secondary_alt, #ebedef);
--background-tertiary: var(--_pointless-palette_set-blue-tertiary, #e3e5e8);
--chatbubble-self: linear-gradient(var(--_pointless-palette_set-blue-chatbubble_self_0, var(--brand-experiment-300)) 0%,
var(--_pointless-palette_set-blue-chatbubble_self_100, var(--brand-experiment-200)) 100%);
--chatbubble-other: linear-gradient(var(--background-secondary) 0%, var(--background-secondary-alt) 100%);
}
/* Reapply some colors to other areas to reduce the number of variables per palette */
:root {
/*--background-accent: #7289da; /* Reply & thread line (channel list & creation message) */
--channeltextarea-background: var(--background-secondary);
/* Message textarea */
--background-floating: var(--background-tertiary);
/* User popout background, tooltip background */
--deprecated-card-bg: var(--background-secondary);
--scrollbar-thin-thumb: var(--background-tertiary);
/* Channel, Member, & Settings lists (on hover), All Modals (regardless of if scrolls), shows up but never scrolls: user popout, all context menus */
/*--scrollbar-thin-track: transparent; /* Track for above, no rounding | transparent */
--scrollbar-auto-thumb: var(--background-tertiary);
/* Chat & friends page */
--scrollbar-auto-track: var(--background-secondary);
/* Track for above */
/* mobile vars, used on the login screen?? */
--background-mobile-primary: var(--background-primary);
--background-mobile-secondary: var(--background-secondary);
--input-background: var(--background-tertiary);
/* Radius variables */
--_pointless-radius-avatar: var(--pointless-radius-avatar, 20%);
--_pointless-radius-server: var(--pointless-radius-server, 10%);
--_pointless-radius-interface: var(--pointless-radius-interface, 6px);
}
/* Background image */
#app-mount {
background-image: var(--pointless-background-image);
}
/* Fix rolecoloreverywhere making some role text weirdly thin? */
.rolecolor-mention, .rolecolor-colored, .rolecolor-colored .activity-2Gy-9S {
filter: none;
}
/* Online Friends Count badge*/
[class*=guilds-] > ul > [class*=scroller-] > [class*=listItem-] > .onlineFriends-counter {
overflow: hidden;
text-overflow: clip;
text-align: center;
direction: rtl;
white-space: nowrap;
z-index: 1;
background: var(--background-secondary);
color: var(--text-normal);
border-radius: 10px;
position: fixed;
top: 58px;
left: 7px;
width: 1.2em;
height: 15px;
padding-top: 1px;
padding-right: 0.25em;
transition: width 0.15s, left 0.15s, background-color 0.15s;
}
[class*=guilds-] > ul > [class*=scroller-] > [class*=listItem-] > .onlineFriends-counter:hover {
width: inherit;
padding: 1px 0 0;
left: 0px;
background: var(--brand-experiment);
}
/* "pin home icon" with above plugin enabled needs different margin
.container-2lgZY8 > .guilds-1SWlCJ .scroller-1Bvpku > [aria-label] { margin-top: 48px;}*/
/*
botTagCozy-1fFsZk botTag-1un5a6 botTagRegular-2HEhHi botTag-2WPJ74 rem-2m9HGf
botTagCozy-1fFsZk botTag-1un5a6 botTagRegular-2HEhHi botTag-2WPJ74 rem-2m9HGf
botTagCozy-1fFsZk botTag-1un5a6 botTagRegular-2HEhHi botTag-2WPJ74 rem-2m9HGf botTag-1un5a6(2nd) botTagCompact-29bCci > botText-1526X_
botTagCozy-1fFsZk botTag-1un5a6 botTagRegular-2HEhHi botTag-2WPJ74 rem-2m9HGf > botText-1526X_
only with webhook tag plugin:
botTagCompact
*/
/* This *insane* selector is to make the hex color preview on hover display overtop the text */
[class*=layerContainer-] > [class*=layer-] > [class*=tooltipTop-][class*=tooltipDisablePointerEvents-] > [class*=tooltipContent-] > span[style^="display: inline-block; background-color: rgb("][style$="); width: 15px; height: 15px; margin-right: 0px; border-radius: 3px;"] {
position: absolute;
top: 21px;
left: -20px;
width: 64px !important;
height: 24px !important;
}
/* Display crowns for permissions that are granted by being the owner of the server */
[id=user-context-permissions] ~ div > div > div > [class*=scroller-] > div[id*=user-context-permissions--]::after {
content: "";
width: 20px;
height: 20px;
background: var(--text-warning);
-webkit-mask: var(--icon) center/contain no-repeat;
mask: var(--icon) center/contain no-repeat;
flex-shrink: 0;
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='white' d='M13.6572 5.42868C13.8879 5.29002 14.1806 5.30402 14.3973 5.46468C14.6133 5.62602 14.7119 5.90068 14.6473 6.16202L13.3139 11.4954C13.2393 11.7927 12.9726 12.0007 12.6666 12.0007H3.33325C3.02725 12.0007 2.76058 11.792 2.68592 11.4954L1.35258 6.16202C1.28792 5.90068 1.38658 5.62602 1.60258 5.46468C1.81992 5.30468 2.11192 5.29068 2.34325 5.42868L5.13192 7.10202L7.44592 3.63068C7.46173 3.60697 7.48377 3.5913 7.50588 3.57559C7.5192 3.56612 7.53255 3.55663 7.54458 3.54535L6.90258 2.90268C6.77325 2.77335 6.77325 2.56068 6.90258 2.43135L7.76458 1.56935C7.89392 1.44002 8.10658 1.44002 8.23592 1.56935L9.09792 2.43135C9.22725 2.56068 9.22725 2.77335 9.09792 2.90268L8.45592 3.54535C8.46794 3.55686 8.48154 3.56651 8.49516 3.57618C8.51703 3.5917 8.53897 3.60727 8.55458 3.63068L10.8686 7.10202L13.6572 5.42868ZM2.66667 12.6673H13.3333V14.0007H2.66667V12.6673Z'/%3E%3C/svg%3E");
}
/* fix PronounDB's chat pronoun formatting
by: 5h3i1ah#6253 https://canary.discord.com/channels/538759280057122817/755005803303403570/931904851586195476
*/
.pronoundb-pronouns {
font-size: 0.75rem !important;
height: 1.25rem;
cursor: default;
font-weight: 500;
}
/* Remove background of avatar (popout, popout preview in settings) */
[class*=userPopout-] > [class*=avatarWrapper-] div[class*=avatar-], [class*=avatarUploaderInner-] {
border: none;
margin: 6px;
background-color: transparent;
}
[class*=userPopout-] {
width: 600px !important;
}
[class*=userPopout-] > [class*=headerWrapper-] {
height: 0;
/* Banner fills whole top area */
/* Avatar position & remove background */
}
[class*=userPopout-] > [class*=headerWrapper-] [class*=banner-] {
max-width: unset;
height: 240px;
}
[class*=userPopout-] > [class*=headerWrapper-] [class*=avatarWrapper-] {
top: -46px;
left: 252px;
}
[class*=userPopout-] > [class*=headerWrapper-] [class*=avatarWrapper-] [class*=avatar-] {
border: unset;
background-color: unset;
}
[class*=userPopout-] > [class*=headerWrapper-] [class*=avatarWrapper-] [class*=avatarHint-] {
top: 0;
left: 0;
}
[class*=userPopout-] > [class*=headerTop-] {
padding-top: 100px;
/*
headerTagNoNickname- headerTag- nameTag-
headerTagDiscriminatorNoNickname- discrimBase-
nickname-
headerTagWithNickname- headerTag- nameTag-
*/
}
[class*=userPopout-] > [class*=headerTop-] > [class*=headerText-] > :is([class*=nickname-], [class*=headerTagNoNickname-]) {
/*position: absolute;
left:0;
top:42px;
width:600px;
font-size: 20px;
text-align: center; */
}
[class*=userPopout-] > [class*=headerTop-] > [class*=headerText-] > [class*=headerTagWithNickname-], [class*=userPopout-] > [class*=headerTop-] > [class*=headerText-] > [class*=headerTagNoNickname-] > [class*=discrimBase-] {
/*display: none;*/
}
/* Banner in background*/
/*[class*="userPopout-"]>[class*="headerNormal-"]>[class*="popoutBannerPremium-"]>[class*="premiumIconWrapper-"] {display:none}
[class*="userPopout-"]>[class*="headerNormal-"]>[class*="banner-"], .bannerNormal-22rPhb {
position: absolute;
width: 100%;
height: 100%;
border-radius: 8px;
}
[class*="userPopout-"]>[class*="headerNormal-"]>[class*="banner-"]>[class*="bannerOverlay-"] {
display:none;
}
[class*="userPopout-"]>[class*="headerNormal-"]>[class*="banner-"]::after {
content:"";
background: linear-gradient(transparent 0%, rgba(0,0,0,.45) 30%);
position: absolute;
left:0;
top:0;
width:100%;
height:100%;
border-radius: 8px;
}
.theme-light [class*="userPopout-"]>[class*="headerNormal-"]>[class*="banner-"]::after {
background: linear-gradient(transparent 0%, rgba(255, 255, 255, 1) 30%);
}
.theme-light [class*="userPopout-"]>[class*="headerNormal-"]>[class*="banner-"][style*="background-image: "]::after {
background: linear-gradient(transparent 70%, var(--background-floating) 100%);
}
.theme-light [class*="userPopout-"]>[class*="headerNormal-"]>[class*="banner-"][style*="background-image: "] {
height: 120px;
background-position-y: 0%;
}*/
/* Hanging avatar */
/****[class*="userPopout-"]>[class*="avatarWrapper-"], .avatarUploader-3XDtmn {
}*/
/* Nickname & Usertag */
/*[class*="userPopout-"]>[class*="headerTop-"]>[class*="headerText-"] {
background-color:rgba(0,0,0,.45);
margin-top: 8px;
border-radius: 4px;
padding:4px;
}*/
/*[class*="userPopout-"]>[class*="headerTop-"]>[class*="headerText-"]>[class*="headerTag-"] {*/
/*[class*="userPopout-"]>[class*="headerTop-"]>[class*="headerText-"]>[class*="headerTag-"]>[class*="headerTagUsernameBase-"] {
color: var(--interactive-active);
font-weight: 600;
}
[class*="userPopout-"]>[class*="headerTop-"]>[class*="headerText-"]>[class*="headerTag-"]>[class*="discrimBase-"] {
color: var(--header-secondary);
font-weight: 600;
}*/
[class*=userPopout-] > [class*=headerTop-] > [class*=headerText-] > [class*=setIdentityLink-] {
display: none;
}
/* ----- Body ----- */
[class*=userPopout-] > [class*=body-] {
width: 70%;
overflow: unset !important;
display: flex;
flex-direction: column-reverse;
}
[class*=userPopout-] > [class*=body-] > [class*=divider-] {
display: none;
/*position: absolute;
top: -12px;
width:568px;*/
}
[class*=userPopout-] > [class*=body-] > [class*=customStatus-] {
/* Move customstatus up below name */
position: absolute;
top: -48px;
width: 568px;
}
[class*=userPopout-] > [class*=body-] > [class*=customStatus-] > [class*=customStatusSoloEmoji-] {
position: absolute;
top: -24px;
}
[class*=userPopout-] > [class*=body-] > [class*=bodyInnerWrapper-] {
/* Epic "discord readds the same color when it's already in the background" moment */
background-color: transparent;
/*display: flex;
flex-direction: column;*/
/*margin-bottom: 80px;*/
}
/* Notes + Pronouns */
/****
[class*="userPopout-"]>[class*="body-"]>[class*="bodyInnerWrapper-"]>h3[class*="bodyTitle-"]:last-of-type { /* Note title */
/*
position: absolute;
bottom:-8px;
height:auto;
width:38%;
}
[class*="userPopout-"]>[class*="body-"]>[class*="bodyInnerWrapper-"]>h3[class*="bodyTitle-"]:last-of-type:nth-last-child(4) {
right:0;
}
[class*="userPopout-"]>[class*="body-"]>[class*="bodyInnerWrapper-"]>[class*="note-"] {
position: absolute;
bottom:-46px;
height:auto;
width:38%;
}
[class*="userPopout-"]>[class*="body-"]>[class*="bodyInnerWrapper-"]>[class*="note-"]:nth-last-child(3) {
right:8px;
}
[class*="userPopout-"]>[class*="body-"]>[class*="bodyInnerWrapper-"]>div[class*="bodyTitle-"] { /* Pronouns title */
/*
position: absolute;
bottom:-8px;
height:auto;
width:38%;
}
[class*="userPopout-"]>[class*="body-"]>[class*="bodyInnerWrapper-"]>:last-child:not([class*="note-"]) { /* Pronouns content */
/*
position: absolute;
bottom:-30px;
height:auto;
width:38%;
}
*/
/* Roles list */
[class*=userPopout-] > [class*=body-] > [class*=bodyInnerWrapper-] > h3[class*=bodyTitle-]:first-of-type:not(:only-of-type) {
/* Roles title:not(note when there's no roles)*/
position: absolute;
top: 13px;
height: auto;
right: -170px;
width: 38%;
}
[class*=userPopout-] > [class*=body-] > [class*=bodyInnerWrapper-] > [class*=rolesList-] {
position: absolute;
height: auto;
right: -170px;
top: 33px;
width: 38%;
/*order:-1;
transform: translateX(414px);
position: relative;*/
}
[class*=userPopout-] > [class*=body-] > [class*=bodyInnerWrapper-] > [class*=rolesList-] > [class*=role-] {
/* role solid-color background */
max-width: -webkit-fill-available;
position: relative;
overflow: hidden;
z-index: 1;
}
[class*=userPopout-] > [class*=body-] > [class*=bodyInnerWrapper-] > [class*=rolesList-] > [class*=role-] > [class*=roleCircle-] {
min-width: 12px;
}
[class*=userPopout-] > [class*=body-] > [class*=bodyInnerWrapper-] > [class*=rolesList-] > [class*=role-] > [class*=roleCircle-]::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: inherit;
opacity: 0.3;
z-index: -1;
}
/* Message @user box */
[class*=userPopout-] > [class*=footer-] {
margin-top: 55px;
background-color: transparent;
}
/*[aria-label="USER_SETTINGS-"] [class*="profileBannerPreview-"]>[class*="bannerNormal-"] {
}*/
/*
.layerContainer-yqaFcK .layer-v9HyYc#popout_2597 animatorRight/Left-3i_YPs.translate-2dAEQ6.didRender-33z1u8 .userPopout-xaxa6l
.popouts-2bnG9Z .popout-2iWAc- .userPopout-xaxa6l
*/
/* Extra spacing below the username when there's no tabs (viewing your own profile) */
[class*=topSection-] > header:only-child {
padding-bottom: 10px;
}
/* Remove background of avatar (modal, modal preview in settings) */
[class*=root-] > [class*=topSection-] > header > [class*=header-] div[class*=avatar-] {
border: none;
margin: 8px;
background: none;
}
[class*=accountProfileCard-] > [class*=userInfo-] > [class*=avatar-] {
border: none;
margin: 7px;
background: none;
}
/* Remove max length of about me in User Modal */
[class*=root-] > [class*=body-] > [class*=infoScroller-] > [class*=userInfoSection-] > [class*=userBio-] > {
display: inline;
}
/* tabbar on the left popout (needs work)
:root {
--premium-size: 440px; /* 200px For Half /\ 440px For Full Image */
/*
--premium-blur: 2px;
--premium-opacity: 0.2;
}
.tabBar-3nvOPa, .tabBarItem-3dfX8P{display:table;margin-bottom:15px;font-size:16px;margin-left:8px}
.tabBarContainer-37hZsr{margin-top:140px}
.nameTag-ECvD8P {top: 80px;left: 18.5px;}
.top-28JiJ- .item-PXvHYJ,.top-28JiJ- .selected-3s45Ha.themed-OHr7kt.item-PXvHYJ,.top-28JiJ- .themed-OHr7kt.item-PXvHYJ:active{border-bottom-color:transparent;border-bottom:transparent}
.top-28JiJ- .item-PXvHYJ,.top-28JiJ- .selected-3s45Ha.themed-OHr7kt.item-PXvHYJ,.top-28JiJ- .themed-OHr7kt.item-PXvHYJ:active{margin-bottom:20px; top: -50px}
.body-r6_QPy{position:absolute;background-color:transparent;left:190px;top:30px;height:350px;width:400px}
.badgeList-1R1WgZ{display:none}
.actionButton-3vN-m0{display:none}
.profileBannerPremium-35utuo {top: -46px; height: var(--premium-size) ; background-position: center; background-size: cover;opacity: var(--premium-opacity);position: absolute;filter: blur(--premium-blur);}
.profileBanner-33-uE1 {display: none;}
.customStatusText-2opeSw {display: none;}
.note-367eZJ textarea {margin-bottom: 5px;}
.relationshipButtons-pUQVkf {bottom: 10px !important;left: -18px;transform: scale(1.2);position: relative;}
.avatar-AvHqJA {transform: scale(0.9);left: 20px;margin-top: 10px;}
.body-r6_QPy, .topSection-y3p-_D {min-height: 340px;}
.noTabBar-3ZjPNR { border-top: 0;}
.theme-dark .root-1gCeng {background-color: var(--background-floating) !important;}
.body-r6_QPy, .topSection-y3p-_D {background-color: transparent;}*/
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section {
/* ----- SPLIT UP USER AREA ----- */
/* Remove user area container */
/* Settings to bottom left */
/* Mute/Deafen in VC area */
/* Resize VC area buttons to make room for Krisp */
/* but hide them when there's no VC area */
/* User area pfp aligned with our messages */
/*& [class*="avatar-"][class*="wrapper-"] svg {
overflow: unset;
}*/
/* GameActivityToggle button to status picker */
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=container-] {
height: 0;
margin-bottom: 0;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=wrapper-] > [class*=container-] {
border: none;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=container-] > [class*=flex-] > button:last-child {
background: linear-gradient(transparent 0%, var(--background-tertiary) 10%);
color: var(--text-normal);
position: fixed;
left: 0px;
bottom: 0px;
width: 72px;
height: 64px;
padding-top: 1px;
border-radius: 0;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=container-] > [class*=flex-] > button:last-child:hover::before {
content: "";
position: absolute;
display: block;
width: 8px;
height: 20px;
left: 0;
top: 23px;
border-radius: 0 4px 4px 0;
margin-left: -4px;
background-color: var(--header-primary);
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=container-] > [class*=flex-] > button:last-child::after {
background-color: var(--background-primary);
transition: background-color 0.15s ease-out, color 0.15s ease-out;
position: absolute;
content: "";
z-index: -1;
height: 48px;
width: 48px;
border-radius: var(--_pointless-radius-server);
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=container-] > [class*=flex-] > button:last-child:hover {
color: #fff;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=container-] > [class*=flex-] > button:last-child:hover::after {
background-color: var(--brand-experiment);
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=container-] > [class*=flex-] > button:last-child:active {
transform: translateY(1px);
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=wrapper-] > [class*=container-] {
padding-right: 4px;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=wrapper-] > div > [class*=actionButtons-] {
width: 190px;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=wrapper-] > div > [class*=actionButtons-] > button {
min-width: 90px;
padding: 2px 0;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=wrapper-] > div > [class*=flex-] > [class*=flex-] > button:first-child:not(:only-child) {
/* Krisp button to bottom row */
position: absolute;
top: 48px;
left: 204px;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=wrapper-] > div > [class*=flex-] > [class*=flex-] > button:first-child:only-child {
/* disconnect */
left: 54px;
width: 26px;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=container-] > [class*=flex-] > button[aria-checked] {
/* Move Mute/Deafen */
position: relative;
bottom: 64px;
left: 146px;
width: 26px;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=wrapper-]:empty ~ [class*=container-] > [class*=flex-] > button[aria-checked] {
display: none;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section [class*=avatarWrapper-] {
left: 261px;
bottom: 8px;
position: absolute;
z-index: 1;
min-width: unset;
background-color: unset;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section [class*=avatarWrapper-]:active {
transform: translateY(1px);
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section [class*=avatar-][class*=wrapper-] {
/*width: 40px;*/
height: 40px !important;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section [class*=avatar-][class*=wrapper-] > svg > foreignObject {
width: 40px;
height: 40px;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section [class*=avatar-][class*=wrapper-] > svg > rect {
x: 30;
y: 30;
}
.form-3gdLxP:before {
width: 6rem;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=container-] > [class*=avatarWrapper-] > [class*=nameTag-] {
display: none;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=container-] > [class*=flex-] > button:not([aria-checked]):first-child {
position: absolute;
left: 510px;
bottom: 86px;
z-index: 10005;
}
/* THIS FILE RESTYLES THE DISCORD SETTINGS MENU,
IT IS NOT INTENDED TO BE EDITED BY END USERS!
To edit the Pointless theme settings, see the 'settings.scss' file in
the main folder of the theme, not this one in the 'layout' folder.
NOTE: this targets both the User Settings and Guild Settings menus!
*/
[class*=guilds-] > ul > [class*=scroller-] [class*=listItem-] > [class*=wrapper-3XVBev],
[class*=content-] > main[class*=chatContent-] > [class*=layerContainer-] {
pointer-events: none !important;
}
#app-mount [class*=layers-] {
/* Settings content */
/* force colors & pills of Home, guild & settings icons */
/* Remove transition animations */
/* Both main & settings content */
/* Main content, Settings content in */
/* Settings content out */
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) {
left: 72px;
overflow: visible;
/*z-index: 9999;
/*opacity: 0.85 !important;*/
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] {
background-color: var(--background-tertiary);
/* Settings tab scroller */
/* content of selected tab */
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] {
flex: 0 0 240px;
width: 240px;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-]::before {
content: "Settings";
position: absolute;
display: block;
width: 208px;
height: 20px;
padding: 14px 16px;
border-radius: 15px 15px 0 0;
background-color: var(--background-secondary-alt);
font-size: 15px;
line-height: 20px;
font-weight: 600;
color: var(--header-primary);
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] {
display: block;
margin-top: 48px;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav {
width: 232px;
padding: unset;
/* direct container of settings tab list items */
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div {
/* "Category" header */
/* "Channel" */
/* divider */
/* "BetterSettings"'s search bar */
/* fake category for other stuff */
/* Logout, Changelog, & Delete (guild) as buttons */
/* display theme version at end of list */
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [class*=header-] {
padding: 20px 16px 4px;
letter-spacing: 0.25px;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [class*=item-] {
padding: 7px 8px 5px;
margin-left: 8px;
display: flex;
align-items: center;
/* "Channel" icon */
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [class*=item-]::before {
content: "";
width: 20px;
height: 20px;
margin-right: 6px;
background: currentColor;
mask: var(--icon-mask) center/contain no-repeat;
-webkit-mask: var(--icon-mask) center/contain no-repeat;
flex-shrink: 0;
--icon-mask: var(--icon, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 447 447'%3E%3Cpath fill='white' d='M221 117.1l-33.8-33.8 70-70c9.3-9.3 24.5-9.3 33.8 0 9.3 9.3 9.3 24.5 0 33.8l-70 70z'/%3E%3Cpath fill='white' d='M216.3 121.7l-33.8-33.8c-2.6-2.6-2.6-6.8 0-9.3l70-70c11.9-11.9 31.2-11.9 43.1 0s11.9 31.2 0 43.1l-70 70c-2.6 2.6-6.7 2.6-9.3 0zm-19.8-38.4l24.5 24.5 65.3-65.3c6.7-6.7 6.7-17.7 0-24.5-6.7-6.7-17.7-6.7-24.5 0l-65.3 65.3z'/%3E%3Cpath fill='white' d='M312.7 208.8L278.9 175l70-70c9.3-9.3 24.5-9.3 33.8 0 9.3 9.3 9.3 24.5 0 33.8l-70 70z'/%3E%3Cpath fill='white' d='M308 213.4l-33.8-33.8c-2.6-2.6-2.6-6.8 0-9.3l70-70c11.9-11.9 31.2-11.9 43.1 0s11.9 31.2 0 43.1l-70 70c-2.5 2.6-6.7 2.6-9.3 0zM288.2 175l24.5 24.5 65.3-65.3c6.7-6.7 6.7-17.7 0-24.5s-17.7-6.7-24.5 0L288.2 175z'/%3E%3Cpath fill='white' d='M143.71 88.065l24.112-24.113L331.94 228.07l-24.112 24.112z'/%3E%3Cpath fill='white' d='M303 257L138.9 92.9c-2.7-2.7-2.7-7 0-9.7L163 59.1c2.7-2.7 7-2.7 9.7 0l164.1 164.1c2.7 2.7 2.7 7 0 9.7L312.7 257c-2.7 2.7-7 2.7-9.7 0zM153.4 88.1l154.5 154.5 14.5-14.5L167.9 73.6l-14.5 14.5z'/%3E%3Cpath fill='white' d='M161.2 327.6l-92.9-92.9c-14.3-14.3-14.3-37.6 0-51.9l85.1-85.1 144.8 144.8-85.1 85.1c-14.3 14.4-37.6 14.4-51.9 0z'/%3E%3Cpath fill='white' d='M156.4 332.4l-92.9-92.9c-17-17-17-44.6 0-61.6l85.1-85.1c2.7-2.7 7-2.7 9.7 0L303 237.7c2.7 2.7 2.7 7 0 9.7l-85 85c-17 17-44.7 17-61.6 0zm-3-225l-80.2 80.2c-11.7 11.7-11.7 30.6 0 42.3l92.9 92.9c11.7 11.7 30.6 11.7 42.3 0l80.2-80.2-135.2-135.2z'/%3E%3Cpath fill='white' d='M71.328 295.671l28.991-28.991 28.991 28.991-28.991 28.991z'/%3E%3Cpath fill='white' d='M95.4 329.5l-29-29c-2.7-2.7-2.7-7 0-9.7l29-29c2.7-2.7 7-2.7 9.7 0l29 29c2.7 2.7 2.7 7 0 9.7l-29 29c-2.7 2.6-7 2.6-9.7 0zM81 295.7l19.3 19.3 19.3-19.3-19.3-19.3L81 295.7z'/%3E%3Cpath fill='white' d='M143.7 445.3L81 382.6c-21.3-21.3-21.3-55.9 0-77.2 2.7-2.7 7-2.7 9.7 0 2.7 2.7 2.7 7 0 9.7-16 16-16 42 0 57.9l62.8 62.8c2.7 2.7 2.7 7 0 9.7s-7.1 2.5-9.8-.2z'/%3E%3C/svg%3E"));
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [class*=separator-] {
display: none !important;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > .searchdiv {
z-index: 9999;
position: absolute;
top: -5px;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [aria-controls=hypesquad-online-tab] {
margin-top: 40px;
overflow: visible;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [aria-controls=hypesquad-online-tab]::after {
content: "Other";
position: absolute;
top: -40px;
left: -8px;
display: block;
width: 208px;
height: 20px;
padding: 20px 16px 4px;
font-size: 12px;
font-weight: 700;
font-family: var(--font-display);
line-height: 16px;
text-transform: uppercase;
color: var(--channels-default);
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
flex-shrink: 0;
letter-spacing: 0.25px;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [aria-controls=changelog-tab], #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [aria-controls=logout-tab], #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [aria-controls=delete-tab] {
order: 1;
position: relative;
padding: 8px 16px;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [aria-controls=changelog-tab]::before, #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [aria-controls=logout-tab]::before, #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [aria-controls=delete-tab]::before {
content: none;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [aria-controls=changelog-tab] {
margin: 8px 0 4px 8px;
transition: background-color 0.17s ease, color 0.17s ease;
color: #fff;
background-color: var(--brand-experiment);
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [aria-controls=changelog-tab]:hover {
background-color: var(--brand-experiment-560);
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [aria-controls=logout-tab], #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [aria-controls=delete-tab] {
margin: 4px 0 8px 8px;
transition: color 0.17s ease, background-color 0.17s ease, border-color 0.17s ease;
border-width: 1px;
border-style: solid;
color: hsl(359, calc(var(--saturation-factor, 1) * 82.6%), 59.4%);
border-color: hsl(359, calc(var(--saturation-factor, 1) * 82.6%), 59.4%);
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [aria-controls=logout-tab]:hover, #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [aria-controls=delete-tab]:hover {
color: #fff !important;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [class*=socialLinks-] {
order: 2;
padding: 8px 20px 4px;
/* use svg for Powercord icon */
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [class*=socialLinks-] > .powercord-pc-icon::before {
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 447 447'%3E%3Cpath fill='white' d='M221 117.1l-33.8-33.8 70-70c9.3-9.3 24.5-9.3 33.8 0 9.3 9.3 9.3 24.5 0 33.8l-70 70z'/%3E%3Cpath fill='white' d='M216.3 121.7l-33.8-33.8c-2.6-2.6-2.6-6.8 0-9.3l70-70c11.9-11.9 31.2-11.9 43.1 0s11.9 31.2 0 43.1l-70 70c-2.6 2.6-6.7 2.6-9.3 0zm-19.8-38.4l24.5 24.5 65.3-65.3c6.7-6.7 6.7-17.7 0-24.5-6.7-6.7-17.7-6.7-24.5 0l-65.3 65.3z'/%3E%3Cpath fill='white' d='M312.7 208.8L278.9 175l70-70c9.3-9.3 24.5-9.3 33.8 0 9.3 9.3 9.3 24.5 0 33.8l-70 70z'/%3E%3Cpath fill='white' d='M308 213.4l-33.8-33.8c-2.6-2.6-2.6-6.8 0-9.3l70-70c11.9-11.9 31.2-11.9 43.1 0s11.9 31.2 0 43.1l-70 70c-2.5 2.6-6.7 2.6-9.3 0zM288.2 175l24.5 24.5 65.3-65.3c6.7-6.7 6.7-17.7 0-24.5s-17.7-6.7-24.5 0L288.2 175z'/%3E%3Cpath fill='white' d='M143.71 88.065l24.112-24.113L331.94 228.07l-24.112 24.112z'/%3E%3Cpath fill='white' d='M303 257L138.9 92.9c-2.7-2.7-2.7-7 0-9.7L163 59.1c2.7-2.7 7-2.7 9.7 0l164.1 164.1c2.7 2.7 2.7 7 0 9.7L312.7 257c-2.7 2.7-7 2.7-9.7 0zM153.4 88.1l154.5 154.5 14.5-14.5L167.9 73.6l-14.5 14.5z'/%3E%3Cpath fill='white' d='M161.2 327.6l-92.9-92.9c-14.3-14.3-14.3-37.6 0-51.9l85.1-85.1 144.8 144.8-85.1 85.1c-14.3 14.4-37.6 14.4-51.9 0z'/%3E%3Cpath fill='white' d='M156.4 332.4l-92.9-92.9c-17-17-17-44.6 0-61.6l85.1-85.1c2.7-2.7 7-2.7 9.7 0L303 237.7c2.7 2.7 2.7 7 0 9.7l-85 85c-17 17-44.7 17-61.6 0zm-3-225l-80.2 80.2c-11.7 11.7-11.7 30.6 0 42.3l92.9 92.9c11.7 11.7 30.6 11.7 42.3 0l80.2-80.2-135.2-135.2z'/%3E%3Cpath fill='white' d='M71.328 295.671l28.991-28.991 28.991 28.991-28.991 28.991z'/%3E%3Cpath fill='white' d='M95.4 329.5l-29-29c-2.7-2.7-2.7-7 0-9.7l29-29c2.7-2.7 7-2.7 9.7 0l29 29c2.7 2.7 2.7 7 0 9.7l-29 29c-2.7 2.6-7 2.6-9.7 0zM81 295.7l19.3 19.3 19.3-19.3-19.3-19.3L81 295.7z'/%3E%3Cpath fill='white' d='M143.7 445.3L81 382.6c-21.3-21.3-21.3-55.9 0-77.2 2.7-2.7 7-2.7 9.7 0 2.7 2.7 2.7 7 0 9.7-16 16-16 42 0 57.9l62.8 62.8c2.7 2.7 2.7 7 0 9.7s-7.1 2.5-9.8-.2z'/%3E%3C/svg%3E") no-repeat;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [class*=info-] {
order: 2;
text-transform: none;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [class*=info-] > span {
text-transform: capitalize;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=sidebarRegion-] > [class*=sidebarRegionScroller-] > nav > div > [class*=info-]::after {
content: "pointless (catastrophe build #3)";
font-size: 12px;
line-height: 16px;
color: var(--text-muted);
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] {
margin-left: 5px;
background-color: unset;
/* Close button invisibly over guild list */
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] {
border-radius: 15px 15px 0 0;
background-color: var(--background-primary-alt);
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] {
/* title as "channel" title */
margin-top: 48px;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] > main {
padding: 16px 16px 80px 16px;
/* "channel title" */
/* "channel title" icon */
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] > main > div:first-child:not([class*=margin]) > [class*=sectionTitle-], #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] > main > div > div:first-child:not([class*=margin]) > [class*=sectionTitle-], #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] > main > div > [class*=title-], #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] > main > .powercord-settings-error > h2 {
position: fixed;
top: 22px;
height: 48px;
display: flex;
align-items: center;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] > main > div:first-child:not([class*=margin]) > [class*=sectionTitle-] > h1, #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] > main > div > div:first-child:not([class*=margin]) > [class*=sectionTitle-] > h1, #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] > main > div > [class*=title-] > h1, #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] > main > .powercord-settings-error > h2 > h1 {
height: 24px;
margin-bottom: 0;
font-size: 16px;
line-height: 20px;
font-weight: 600;
color: var(--header-primary);
font-weight: 600;
font-family: var(--font-display);
overflow: hidden;
white-space: nowrap;
display: flex;
align-items: center;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] > main > div:first-child:not([class*=margin]) > [class*=sectionTitle-] > h1::before, #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] > main > div > div:first-child:not([class*=margin]) > [class*=sectionTitle-] > h1::before, #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] > main > div > [class*=title-]::before, #app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] > main > .powercord-settings-error > h2::before {
content: "";
width: 24px;
height: 24px;
margin-right: 8px;
background: currentColor;
mask: var(--pointless-icon-settings) center/contain no-repeat;
-webkit-mask: var(--pointless-icon-settings) center/contain no-repeat;
flex-shrink: 0;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] > [class*=contentTransitionWrap-] > [class*=contentRegionScroller-] > [class*=contentColumn-] {
max-width: unset;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] [class*=toolsContainer-] {
position: absolute;
left: -317px;
top: 0;
padding-top: 0;
height: 100%;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] [class*=toolsContainer-] > div {
/* tools- */
width: 72px;
height: 100%;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] [class*=toolsContainer-] > div > div {
/* container- */
height: 100%;
display: grid;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] [class*=toolsContainer-] > div > div > [class*=closeButton-] {
width: 100%;
height: 100%;
display: unset;
border: none;
border-radius: unset;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] [class*=toolsContainer-] > div > div > [class*=closeButton-]:hover {
background-color: unset;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] [class*=toolsContainer-] > div > div > [class*=closeButton-] > svg {
display: none;
}
#app-mount [class*=layers-] > :not([class*=baseLayer-]) [class*=standardSidebarView-] > [class*=contentRegion-] [class*=toolsContainer-] > div > div > [class*=keybind-] {
display: none;
}
#app-mount [class*=layers-] > [class*=baseLayer-][aria-hidden=true] > [class*=container-] > [class*=guilds-] > ul > [class*=scroller-] > [class*=tutorialContainer-]:first-child > div [class*=childWrapper-] {
background-color: var(--background-primary);
color: var(--text-normal);
}
#app-mount [class*=layers-] > [class*=baseLayer-][aria-hidden=true] > [class*=container-] > [class*=guilds-] > ul > [class*=scroller-] > [class*=listItem-]:nth-last-child(2) [class*=circleIconButton-] {
background-color: var(--background-primary);
color: hsl(139, calc(var(--saturation-factor, 1)*47.3%), 43.9%);
}
#app-mount [class*=layers-] > [class*=baseLayer-][aria-hidden=true] > [class*=container-] > [class*=guilds-] > ul > [class*=scroller-] [class*=listItem-] [class*=item-] {
opacity: 0 !important;
}
#app-mount [class*=layers-] > [class*=baseLayer-][aria-hidden=true] > [class*=container-] [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=container-] > [class*=flex-] > button:last-child {
color: #fff;
}
#app-mount [class*=layers-] > [class*=baseLayer-][aria-hidden=true] > [class*=container-] [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=container-] > [class*=flex-] > button:last-child::after {
background-color: var(--brand-experiment);
}
#app-mount [class*=layers-] > [class*=baseLayer-][aria-hidden=true] > [class*=container-] [class*=base-] > [class*=content-] > [class*=sidebar-] > section > [class*=container-] > [class*=flex-] > button:last-child::before {
content: "";
position: absolute;
display: block;
width: 8px;
height: 40px;
left: 0;
top: 13px;
border-radius: 0 4px 4px 0;
margin-left: -4px;
background-color: var(--header-primary);
}
#app-mount [class*=layers-] > [class*=animating-] {
pointer-events: initial;
will-change: unset;
/* oh so this is why the settings animation is so f-ing laggy
it updates this property for EVERY SINGLE ELEMENT IN THE FUCKING APPLICATION TWICE WHY DISCORD */
}
#app-mount [class*=layers-] > [class*=animating-] * {
pointer-events: unset !important;
}
#app-mount [class*=layers-] > div {
opacity: 1 !important;
transform: unset !important;
}
#app-mount [class*=layers-] > [aria-hidden=false] ~ [aria-hidden=false] {
display: none;
pointer-events: none;
}
@font-face {
font-family: "Discord";
font-weight: 700;
src: url("https://raw.githubusercontent.com/powercord-org/powercord-backend/198a7be18d35e2830ead3b765558c2b3cec20a39/web/src/assets/discord-font.otf") format("opentype");
}
:root {
--font-primary: Montserrat, "Helvetica Neue", Helvetica, Arial, sans-serif;
--font-display: "Montserrat Alternates", "Helvetica Neue", Helvetica, Arial, sans-serif;
/*--font-code: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;*/
--font-headline: Discord, Ginto Nord, Ginto, "Helvetica Neue", Helvetica, Arial, sans-serif;
/*--font-korean: Whitney, "Apple SD Gothic Neo", "NanumBarunGothic", "\B9D1\C740 \ACE0\B515", "Malgun Gothic", Gulim, 굴림, Dotum, 돋움, "Helvetica Neue", Helvetica, Arial, sans-serif;
--font-japanese: Whitney, Hiragino Sans, "\30D2\30E9\30AE\30CE\89D2\30B4 ProN W3", "Hiragino Kaku Gothic ProN", "\30E1\30A4\30EA\30AA", Meiryo, Osaka, "MS PGothic", "Helvetica Neue", Helvetica, Arial, sans-serif;
--font-chinese-simplified: Whitney, "Microsoft YaHei New", 微软雅黑, "Microsoft Yahei", "Microsoft JhengHei", 宋体, SimSun, "Helvetica Neue", Helvetica, Arial, sans-serif;
--font-chinese-traditional: Whitney, "Microsoft JhengHei", 微軟正黑體, "Microsoft JhengHei UI", "Microsoft YaHei", 微軟雅黑, 宋体, SimSun, "Helvetica Neue", Helvetica, Arial, sans-serif;
*/
}
/* animation for the "user is typing..." box to float up */
@keyframes textArea-typing {
from {
transform: translateY(52px);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
/* Changes to main chat window + channel, server, & member list */
/* Settings update notice */
#app-mount [class*=baseLayer-] > [class*=container-] > [class*=base-]::before {
display: var(--pointless-settings-ver-3, unset);
content: "[Pointless]: Your settings file is outdated. Please see the readme for more info.";
color: #fff;
font-size: 14px;
line-height: 36px;
font-weight: 500;
text-align: center;
z-index: 1;
background-color: var(--status-danger-background);
margin-bottom: 5px;
border-radius: var(--_pointless-radius-interface);
}
/* Wordmark */
[class*=wordmark-] {
left: 4px;
}
[class*=wordmark-]:after {
content: "Pointless";
font-size: 15px;
position: absolute;
left: 20px;
font-family: "Discord";
color: var(--text-muted);
}
[class*=wordmark-] > svg {
width: 0px;
}
[class*=wordmark-]:before {
content: "";
position: absolute;
height: 20px;
width: 20px;
bottom: 0;
right: 0;
background: url("https://powercord.dev/assets/powercord.1eb41971.svg") center/20px no-repeat;
}
:not(.BF-folderSidebar) > [class*=guilds-] [class*=scroller-] {
/* remove dividers between home & guilds, but not between folders in Better Folders popout */
/* Pin home icon */
padding-top: 0;
/* Make space for settings icon */
}
:not(.BF-folderSidebar) > [class*=guilds-] [class*=scroller-] > [class*=listItem-]:not(:nth-last-child(2)) {
display: none;
}
:not(.BF-folderSidebar) > [class*=guilds-] [class*=scroller-] > [class*=tutorialContainer-]:first-child, :not(.BF-folderSidebar) > [class*=guilds-] [class*=scroller-] > .expanded > [class*=listItem-] {
/* Home button */
position: sticky;
top: 0;
z-index: 1;
background: linear-gradient(var(--background-tertiary) 88%, transparent 100%);
padding-top: 2px;
padding-bottom: 2px;
}
:not(.BF-folderSidebar) > [class*=guilds-] [class*=scroller-] > [class*=tutorialContainer-]:first-child > div {
margin-bottom: 6px;
}
.BF-folderSidebar [class*=scrollerBase-] {
padding-top: 0;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] {
/* Detached notices */
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=notice-] {
margin-bottom: 5px;
border-radius: 8px;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] {
/* ----- HEADER & BORDERS ----- */
/* Remove header shadows & recolor*/
/* Select whatever window is the main content */
/* Round split between channel list & chat */
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-] > nav :is(header, [class*=searchBar-]) {
background-color: var(--background-secondary-alt);
box-shadow: none;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > :nth-child(2) > section {
background-color: var(--background-primary-alt);
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > :nth-child(2) > section > [class*=children-]::after {
background: linear-gradient(90deg, rgba(54, 57, 63, 0) 0, var(--background-primary-alt)) !important;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > :nth-child(2) > div::before {
content: none;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=sidebar-], #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > :nth-child(2) {
border-radius: 15px 15px 0 0;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > :nth-child(2) {
margin-left: 5px;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] {
/* main chat window */
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=container-] aside > [class*=members-] > [class*=content-] {
/* member list */
/* Member list backgrounds */
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=container-] aside > [class*=members-] > [class*=content-] > [class*=member-] [class*=roleColor-]::after {
content: "";
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
opacity: 0.125;
background: currentColor;
border-radius: var(--_pointless-radius-interface);
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=container-] aside > [class*=members-] > [class*=content-] > [class*=membersGroup-] + [class*=member-] {
margin-top: 5px;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form {
/* messages & textarea */
/* position "user is typing..." box above the text area */
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > [class*=typing-] {
bottom: 52px;
animation: textArea-typing 0.2s ease-out;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form [class*=channelTextArea-], #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > [class*=wrapper-], #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > div > div > [class*=wrapper-] {
/* resize textarea box */
margin-bottom: 8px;
/* move down to swap with the typing indicator */
margin-left: 56px;
/* make space for the user area pfp */
width: unset;
/* prevent the textarea from going offscreen */
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form [class*=channelTextArea-] > [class*=scrollableContainer-] > div, #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > [class*=wrapper-] > [class*=scrollableContainer-] > div, #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > div > div > [class*=wrapper-] > [class*=scrollableContainer-] > div {
/* move the (+) file upload & thread button to the right */
/* make space for the file upload button (but only when it's there) */
/* Hide unnecessary buttons */
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form [class*=channelTextArea-] > [class*=scrollableContainer-] > div > [class*=attachWrapper-], #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > [class*=wrapper-] > [class*=scrollableContainer-] > div > [class*=attachWrapper-], #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > div > div > [class*=wrapper-] > [class*=scrollableContainer-] > div > [class*=attachWrapper-] {
order: 1;
/*right: 66px;*/
/*right: 18px;
position: fixed;*/
right: -14px;
position: absolute;
z-index: 1;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form [class*=channelTextArea-] > [class*=scrollableContainer-] > div > [class*=attachWrapper-] ~ [class*=buttons-], #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > [class*=wrapper-] > [class*=scrollableContainer-] > div > [class*=attachWrapper-] ~ [class*=buttons-], #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > div > div > [class*=wrapper-] > [class*=scrollableContainer-] > div > [class*=attachWrapper-] ~ [class*=buttons-] {
right: 32px;
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form [class*=channelTextArea-] > [class*=scrollableContainer-] > div > [class*=buttons-], #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > [class*=wrapper-] > [class*=scrollableContainer-] > div > [class*=buttons-], #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > div > div > [class*=wrapper-] > [class*=scrollableContainer-] > div > [class*=buttons-] {
/* make space for file upload button before the Accessibility Send button (not always present) */
/*&>[class*="separator-"] {
right: -32px;
position: relative;
}*/
}
#app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form [class*=channelTextArea-] > [class*=scrollableContainer-] > div > [class*=buttons-] > [class*=buttonContainer-] > [class*=button-]:not([class*=emojiButton-]), #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form [class*=channelTextArea-] > [class*=scrollableContainer-] > div > [class*=buttons-] > button[class*=button-] > [class*=button-], #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > [class*=wrapper-] > [class*=scrollableContainer-] > div > [class*=buttons-] > [class*=buttonContainer-] > [class*=button-]:not([class*=emojiButton-]), #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > [class*=wrapper-] > [class*=scrollableContainer-] > div > [class*=buttons-] > button[class*=button-] > [class*=button-], #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > div > div > [class*=wrapper-] > [class*=scrollableContainer-] > div > [class*=buttons-] > [class*=buttonContainer-] > [class*=button-]:not([class*=emojiButton-]), #app-mount [class*=layer-] > [class*=container-] > [class*=base-] > [class*=content-] > [class*=chat-] > [class*=content-] > [class*=chatContent-] > form > div > div > [class*=wrapper-] > [class*=scrollableContainer-] > div > [class*=buttons-] > button[class*=button-] > [class*=button-] {
/* Nitro Gift */
display: none;
}
/* Move settings tooltip back on screen */
#app-mount [class*=layerContainer-] > :is([style="position: absolute; bottom: 72px; left: -23px;"],
[style="position: absolute; bottom: 72px; left: -29px;"]) {
left: 80px !important;
bottom: 15px !important;
}
#app-mount [class*=layerContainer-] > :is([style="position: absolute; bottom: 72px; left: -23px;"],
[style="position: absolute; bottom: 72px; left: -29px;"]) > div {
transform-origin: 0 50%;
max-width: 196px;
font-size: 16px;
line-height: 20px;
font-weight: 600;
word-wrap: break-word;
}
#app-mount [class*=layerContainer-] > :is([style="position: absolute; bottom: 72px; left: -23px;"],
[style="position: absolute; bottom: 72px; left: -29px;"]) > div > [class*=tooltipPointer-] {
position: absolute;
right: 100%;
left: unset !important;
top: 50%;
margin-top: -5px;
border-left-width: 5px;
transform: rotate(90deg);
}
/* highly improved crash screen */
#app-mount [class*=errorPage-] [class*=text-] {
width: unset;
}
#app-mount [class*=errorPage-] [class*=text-] h4, #app-mount [class*=errorPage-] [class*=text-] p {
font-size: 0;
}
#app-mount [class*=errorPage-] [class*=text-] h4::after, #app-mount [class*=errorPage-] [class*=text-] p::after {
font-size: 16px;
}
#app-mount [class*=errorPage-] [class*=text-] h4::after {
font-size: 24px;
content: "OOPSIE WOOPSIE!!";
}
#app-mount [class*=errorPage-] [class*=text-] p:first-child::after {
content: "Uwu We made a fucky wucky!! A wittle fucko boingo!";
}
#app-mount [class*=errorPage-] [class*=text-] p:last-child::after {
content: "The code monkeys at our headquarters are working VEWY HAWD to fix this!";
}
/* chat message username bg
by: ashtrath. (chloe.#9079) https://discord.com/channels/538759280057122817/755005803303403570/912038821565173781
edited to use class string selectors
*/
[class*=compact-] [class*=headerText-] > span:first-child::before {
content: "";
width: calc(100% + 6px);
height: 100%;
border-radius: 5px;
background-color: currentColor;
opacity: 0.3;
position: absolute;
top: 0;
left: -4px;
z-index: -1;
}
[class*=compact-] [class*=headerText-] > span:first-child::after {
content: ":";
}
[class*=cozy-] [class*=headerText-] > span:first-child::before {
content: "";
width: calc(100% + 6px);
height: 100%;
border-radius: 5px;
background-color: currentColor;
opacity: 0.3;
position: absolute;
top: 0;
z-index: -1;
/* repairs left shift*/
left: -3px;
}
/*[class*="cozy-"] [class*="headerText-"] > span::after {
content: ":";
}*/
/* repairs left shift */
[class*=cozy-] [class*=headerText-] > span {
margin-left: 3px;
}
/* voice channel user background */
[class*=containerDefault-] > [class*=list-] > [class*=draggable-] {
padding: 2px 0;
}
[class*=containerDefault-] > [class*=list-] > [class*=draggable-],
[class*=containerDefault-] > [class*=list-] > [class*=draggable-] > [class*=userSmall-],
[class*=containerDefault-] > [class*=list-] > [class*=draggable-] [class*=content-] {
height: 34px;
}
[class*=voiceUser-] [class*=avatar-] {
z-index: 1;
}
[class*=voiceUser-] .rolecolor-colored {
overflow: visible;
}
[class*=voiceUser-] .rolecolor-colored::after {
/* discord randomly flips which one of these works (TODO: figure out why) */
/*content: '';
width: calc(100% + 42px);
height: calc(100% + 14px);
border-radius: 5px;
background-color: currentColor;
opacity: 0.3;
position: absolute;
top: -7px;
left: -42px;
z-index: -1;*/
content: "";
width: calc(100% + 0px);
height: calc(100% - 0px);
border-radius: 5px;
background-color: currentColor;
opacity: 0.3;
position: absolute;
top: 0px;
left: 0px;
z-index: -1;
}
[class*=voiceUser-] [class*=avatarSpeaking-] {
box-shadow: inset 0 0 0 2px hsl(139, calc(var(--saturation-factor, 1)*47.3%), 43.9%);
}
/* gives me a tag :)
og by: dante_nl#1234 https://discord.com/channels/538759280057122817/755005803303403570/929388259598008320
*/
[class*=compact-][data-author-id="97399302313242624"] [class*=username-]::before,
[class*=cozyMessage-][data-author-id="97399302313242624"] [class*=username-]::after {
content: "pointless";
position: relative;
bottom: 2px;
background-color: #5865F2;
border-radius: 3px;
margin-right: 5px;
color: #fff;
padding-left: 5px;
padding-right: 5px;
padding-top: 2px;
padding-bottom: 2px;
line-height: 1.3;
margin-left: 4px;
font-size: 10px;
font-weight: 500;
}
/* Jump to Message buttons
by: ThatOtherAndrew#8134 https://canary.discord.com/channels/538759280057122817/755005803303403570/929440925791449148
*/
[title^="https://discord.com/channels/"], [title^="https://ptb.discord.com/channels/"], [title^="https://canary.discord.com/channels/"] {
line-height: 0;
font-size: 0;
text-decoration-color: #fff !important;
}
[title^="https://discord.com/channels/"]::before, [title^="https://ptb.discord.com/channels/"]::before, [title^="https://canary.discord.com/channels/"]::before {
content: "✉ Jump to Message";
font-size: 16px;
user-select: text;
font-weight: 500;
transition: background-color 50ms ease-out, color 50ms ease-out;
cursor: pointer;
border-radius: 3px;
padding: 0 2px;
background: hsla(235, calc(var(--saturation-factor, 1) * 85.6%), 64.7%, 0.3);
color: hsl(236, calc(var(--saturation-factor, 1) * 83.3%), 92.9%);
}
[title^="https://discord.com/channels/"]:hover::before, [title^="https://ptb.discord.com/channels/"]:hover::before, [title^="https://canary.discord.com/channels/"]:hover::before {
background-color: hsl(235, calc(var(--saturation-factor, 1) * 85.6%), 64.7%);
color: #fff;
}
/* colored window buttons
by: ِJJ#0001 https://canary.discord.com/channels/538759280057122817/755005803303403570/929921672482529310
*/
[class*=winButton-]:nth-child(3):hover {
background-color: var(--brand-experiment);
}
[class*=winButton-]:nth-child(4):hover {
background-color: orange;
}
/* Game activity as guild list item */
[class*=activityPanel-] {
border: unset;
padding: unset;
/* game title as tooltip */
/* stream button as exponent, can click anywhere */
/* pill */
}
[class*=activityPanel-] [class*=gameWrapper-] {
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(transparent 0%, var(--background-tertiary) 10%);
color: var(--text-normal);
position: fixed;
left: 0px;
bottom: 55px;
width: 72px;
height: 64px;
padding-top: 1px;
border-radius: 0;
}
[class*=activityPanel-] [class*=gameIcon-] {
width: 48px;
height: 48px;
border-radius: var(--_pointless-radius-server);
}
[class*=activityPanel-]:active [class*=gameIcon-] {
transform: translateY(1px);
}
[class*=activityPanel-] [class*=info-] {
display: none;
position: fixed;
left: 72px;
bottom: 70px;
border-radius: 5px;
background-color: var(--background-floating);
box-shadow: var(--elevation-high);
color: var(--text-normal);
overflow: visible;
}
[class*=activityPanel-] [class*=info-]::before {
content: "";
position: absolute;
right: 100%;
top: calc(50% - 5px);
width: 0;
height: 0;
border: 5px solid transparent;
border-right-color: var(--background-floating);
}
[class*=activityPanel-] [class*=info-] [class*=title-] {
max-width: 196px;
font-size: 16px;
line-height: 20px;
font-weight: 600;
word-wrap: break-word;
padding: 8px 12px;
overflow: hidden;
}
[class*=activityPanel-] [class*=gameWrapper-]:hover [class*=info-] {
display: unset;
}
[class*=activityPanel-] [class*=actions-] {
position: fixed;
left: 0px;
bottom: 55px;
width: 72px;
height: 64px;
margin-left: 0px;
padding-top: 1px;
}
[class*=activityPanel-] [class*=actions-] button {
width: 72px;
height: 64px;
align-items: flex-start;
justify-content: flex-end;
}
[class*=activityPanel-] [class*=actions-] button [class*=contents-] {
background-color: var(--background-tertiary);
padding: 3px;
border-radius: 50%;
}
[class*=activityPanel-] [class*=actions-] button svg {
width: 16px;
height: 16px;
margin: 0px;
}
[class*=activityPanel-] [class*=actions-] > button:hover {
background-color: transparent;
}
[class*=activityPanel-] [class*=actions-] button[class*=disabled-] {
opacity: unset;
}
[class*=activityPanel-] [class*=actions-] button[class*=disabled-] svg {
opacity: 0.4;
}
[class*=activityPanel-] [class*=actions-] button:hover::before {
content: "";
position: absolute;
display: block;
width: 8px;
height: 20px;
left: 0;
top: 23px;
border-radius: 0 4px 4px 0;
margin-left: -4px;
background-color: var(--header-primary);
}
[class*=activityPanel-]:active [class*=actions-] {
transform: translateY(1px);
}
/* move stream button tooltip to the left */
#app-mount [class*=layerContainer-] > :is([style^="position: absolute; left: -"][style$="px; bottom: 127px;"]) {
left: 80px !important;
bottom: 70px !important;
}
#app-mount [class*=layerContainer-] > :is([style^="position: absolute; left: -"][style$="px; bottom: 127px;"]) > div {
transform-origin: 0 50%;
max-width: unset;
font-size: 16px;
line-height: 20px;
font-weight: 600;
word-wrap: break-word;
}
#app-mount [class*=layerContainer-] > :is([style^="position: absolute; left: -"][style$="px; bottom: 127px;"]) > div > [class*=tooltipPointer-] {
position: absolute;
right: 100%;
left: unset;
top: 50%;
margin-top: -5px;
border-left-width: 5px;
transform: rotate(90deg);
}
/* better 'danger' buttons */
button[class*=lookOutlined][class*=colorRed]:hover {
background-color: var(--background-modifier-hover);
color: #fff;
}
/* server list icon badges */
[class*=guilds-] [class*=listItem-] [class*=upperBadge-] {
transform: translate(8px, -8px) !important;
}
[class*=guilds-] [class*=listItem-] [class*=iconBadge-] {
padding: 3px;
border-radius: 50%;
width: 22px;
height: 22px;
}
[class*=guilds-] [class*=listItem-] [class*=iconBadge-] [class*=icon-] {
width: 16px;
height: 16px;
margin: 0px;
padding: 0;
}
.theme-dark [class*=guilds-] [class*=listItem-] [class*=iconBadge-] {
background-color: var(--background-tertiary);
}
/* User area "popout" (status picker, but now also shows name [& background?]) */
/*#status-picker {
position: fixed;
bottom: 8px;
left: 77px;
width: 230px;
height: 225px;
background: var(--background-tertiary);
border-radius: 5px;
z-index: -1;
}
#status-picker [class*="item-"] svg{
width: 16px;
height: 16px;
}
#status-picker [class*="scrollerBase-"] {
display: grid;
grid-template-columns: auto auto auto auto;
grid-template-rows: 40px 40px;
margin: auto 4px 4px 4px;
}
#status-picker [class*="separator-"] {
display: none;
}
#status-picker [class*="item-"] {
height: 32px;
}*/
/* usernametag to status picker */
[class*=container-] [class*=avatarWrapper-][aria-expanded=false] ~ [class*=nameTag-] {
display: none;
}
[class*=container-] [class*=avatarWrapper-][aria-expanded=true] ~ [class*=nameTag-] {
display: unset;
position: absolute;
left: 160px;
bottom: 16px;
z-index: 10005;
/*
position: absolute;
display: flex;
flex-direction: column;
bottom: 115px;
left: 50px;
width: 145px;
z-index: 10005;
margin: 0;
align-items: center;*/
}
/* hide unhovered status names, descriptions & status names for statuses with descriptions */
/*[class*="menu-"]#status-picker [class*="item-"]:not([class*="focused-"]) [class*="status-"]:last-child, [class*="menu-"]#status-picker [class*="item-"] [class*="status-"]:not(:last-child), [class*="menu-"]#status-picker [class*="item-"]:not([class*="focused-"]) [class*="description-"] {
display: none;
}*/
/* Show status names/descriptions when hovered */
/*[class*="menu-"]#status-picker [class*="item-"][class*="focused-"] [class*="status-"]:last-child, [class*="menu-"]#status-picker [class*="item-"][class*="focused-"] [class*="description-"] {
display: block;
position: absolute;
bottom: 30px;
width: 100%;
right: 0;
text-align: center;
}*/
:root [class*=panels-] {
z-index: unset;
}
/* ----- OTHER ----- */
/* Blur when offline */
#app-mount [class*=app-] > [class*=container-] {
background: rgba(0, 0, 0, 0.1);
backdrop-filter: blur(5px);
}
/* Hide cursor in fullscreen video when: */
[class*=wrapperControlsHidden-] {
cursor: none;
}
/* Floating Mark As Read/Jump To Present Pillbars */
[class*=chatContent-] > [class*=messagesWrapper-] > [class*=newMessagesBar-] {
top: 8px;
border-radius: var(--_pointless-radius-interface);
}
[class*=chatContent-] > [class*=messagesWrapper-] > [class*=jumpToPresentBar-] {
bottom: 32px;
padding-bottom: 0;
border-radius: var(--_pointless-radius-interface);
}
/* link target tooltip
.grid-1nZz7S {
overflow: visible !important;
}
.markup-2BOw-j a {
position: relative;
}
.markup-2BOw-j a::before {
content: attr(href);
position: absolute;
bottom: calc(100% + 5px);
left: 50%;
width: max-content;
max-width: 200px;
margin: auto;
background-color: black;
color: #dcddde !important;
font-weight: 500 !important;
font-size: 14px;
line-height: 16px;
text-align: center;
white-space: normal;
overflow-wrap: break-word;
padding: 8px 12px;
border-radius: 5px;
z-index: 100;
transform: scale(.98) translateY(2px) translateX(-50%);
filter: opacity(0);
pointer-events: none;
box-shadow: var(--elevation-high);
transition: transform .1s, filter .1s;
}
.markup-2BOw-j a:hover:before {
transform: translateX(-50%);
filter: opacity(1);
}*/
/* ----- User Avatar Radius ----- */
img[class*=avatar-],
[class*=avatar-][style],
svg[class*=avatarHint-],
[class*=avatarUploaderInner-],
img[class*=avatar-] ~ [class*=avatarSpeaking-] {
border-radius: var(--_pointless-radius-avatar) !important;
}
/* clear extra avatar (& emoji picker guild icon) radii masks */
foreignObject[mask*="url(#svg-mask-avatar"],
foreignObject[mask="url(#svg-mask-squircle)"],
foreignObject[mask="url(#svg-mask-voice-user-summary-item)"],
[class*=bottomControls-] [class*=viewer-] {
mask: none;
}
/* ----- Guild Icon Radius ----- */
[class*=container-] > :is([class*=guilds-], .BF-folderSidebar) [class*=listItem-] svg > foreignObject,
[class*=container-] > :is([class*=guilds-], .BF-folderSidebar) [class*=listItem-] svg > foreignObject [class*=folderIconWrapper-] [class*=iconInactive-],
img[class*=guildIcon-],
[class*=container-] > :is([class*=guilds-], .BF-folderSidebar) [class*=listItem-] [class*=dragInner-],
[class*=videoControls-] [class*=bottomControls-] [class*=controlButton-],
[class*=videoControls-] [class*=bottomControls-] [class*=controlButton-] foreignObject,
[class*=videoControls-] [class*=bottomControls-] [class*=controlButton-] button {
mask: none;
border-radius: var(--_pointless-radius-server);
}
/* Remove extra border radii on icons & folders */
[class*=container-] > :is([class*=guilds-], .BF-folderSidebar) [class*=listItem-] [class*=wrapperSimple-],
[class*=container-] > :is([class*=guilds-], .BF-folderSidebar) [class*=listItem-] svg > foreignObject [class*=folderIconWrapper-] {
border-radius: unset;
}
/* Settings switches */
[class*=control-] > [class*=container-],
.powercord-product-header [class*=container-] {
border-radius: var(--_pointless-radius-interface);
}
[class*=control-] > [class*=container-] > svg > rect,
.powercord-product-header [class*=container-] > svg > rect {
/* inside bit */
rx: var(--_pointless-radius-interface);
}
/* red LIVE indicators */
[class*=streamQualityIndicator-] [class*=liveQualityIndicator-] {
border-radius: 3px 0 0 3px;
}
[class*=streamQualityIndicator-] [class*=liveIndicator-],
[class*=streamQualityIndicator-] [class*=liveShapeRoundRight-] {
border-radius: 0 3px 3px 0 !important;
}
[class*=liveShapeRound-] {
border-radius: 3px;
}
/* Applies color variables to all the places where Discord didn't use them */
/* the powercord notices plugin literally defines it's own copy of the discord colors for some reason */
.theme-light, .theme-dark {
--toast-background: var(--background-secondary);
--toast-header: var(--background-tertiary);
--toast-contents: var(--background-primary);
}
/* ----- PAGE BACKGROUNDS ----- */
/* Friends page */
[class*=content-] > [class*=sidebar-] ~ [class*=container-] [class*=peopleColumn-] {
background-color: var(--background-primary);
}
:is([class*=nowPlayingColumn-], [class*=nowPlayingSidebar-]) > [class*=container-] {
/* Active Now */
background-color: var(--background-secondary);
}
:is([class*=nowPlayingColumn-], [class*=nowPlayingSidebar-]) > [class*=container-] > [class*=scroller-] {
/* Hide the divider on Active Now because now it's a different color */
border-left: none;
}
:is([class*=nowPlayingColumn-], [class*=nowPlayingSidebar-]) > [class*=container-] > [class*=scroller-] > :is([class*=itemCard-], [class*=card-]) {
/* Active Now card */
background-color: var(--background-secondary-alt);
border: none;
border-radius: 6px;
}
:is([class*=nowPlayingColumn-], [class*=nowPlayingSidebar-]) > [class*=container-] > [class*=scroller-] > [class*=card-] {
background-color: var(--background-tertiary);
}
/* Public Servers page */
[class*=content-] > [class*=sidebar-] ~ [class*=pageWrapper-] {
background-color: var(--background-primary);
}
/* Voice Settings */
[class*=userSettingsVoice-] [class*=select-] > [class*=container-] > [class*=menu-] {
/*I/O dropdown*/
background-color: var(--background-secondary);
}
[class*=userSettingsVoice-] [class*=previewOverlay-] {
/* Preview background */
background-color: var(--background-secondary);
border-color: var(--background-tertiary);
}
/* Mic test, this removes the notches because i can't figure out how to color them (also styles the Krisp popout) */
[class*=micTest-] [class*=wrapper-] > [class*=container-] {
border-radius: 4px;
}
[class*=micTest-] [class*=wrapper-] [class*=progress-] {
background-color: var(--interactive-muted);
}
[class*=micTest-] [class*=wrapper-] [class*=notches-] {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='20' fill='none'%3E%3C/svg%3E");
}
/* Slider bar backgrounds */
[class*=slider-] > [class*=bar-] {
background-color: var(--interactive-muted);
}
/* Video embed background */
[class*=message-] [class*=embedVideo-] [class*=wrapper-][data-fullscreen] {
background-color: var(--background-tertiary);
}
/* ----- POPOUTS/TEMP whatever it's called ----- */
/* Color Picker */
[class*=layer-] [class*=colorPickerCustom-] {
background-color: var(--background-primary);
border-color: var(--background-tertiary);
}
/* Search menu */
[class*=layerContainer-] > [class*=layer-] > [class*=container-][id][aria-activedescendant][style] {
background-color: var(--background-secondary-alt);
}
[class*=layer-] > #search-results > [class*=resultsGroup-] {
/*background*/
background-color: var(--background-primary);
}
[class*=layer-] > #search-results > [class*=resultsGroup-] > [class*=selected-],
[class*=layer-] > #search-results > [class*=queryContainer-] {
background-color: var(--background-tertiary);
}
[class*=layer-] > #search-results > [class*=resultsGroup-] > [class*=option-]:after {
background: linear-gradient(90deg, rgba(0, 0, 0, 0), var(--background-primary) 80%);
}
[class*=layer-] > #search-results > [class*=resultsGroup-] > [class*=option-][class*=selected-]:after {
background: linear-gradient(90deg, rgba(0, 0, 0, 0), var(--background-tertiary) 50%);
}
/* Search filter background (not identical to this var, but close enough) */
[class*=chat-] > [class*=title-] > [class*=toolbar-] > [class*=search-] :is([class*=searchFilter-], [class*=searchAnswer-]) {
background-color: var(--background-secondary);
}
/* Autocomplete */
[class*=channelTextArea-] > [class*=autocomplete-] {
background-color: var(--background-secondary);
}
[class*=channelTextArea-] > [class*=autocomplete-] :is([class*=selected-], [class*=categoryHeader-]) {
background-color: var(--background-primary);
}
/* Keybind button thing */
:root [class*=keybindShortcut-] > span {
/* extra stuff to increase specificity */
background-color: var(--background-accent);
box-shadow: inset 0 -4px 0 var(--background-secondary-alt);
color: var(--text-normal);
}
/* Server invite background color */
[class*=message-] [class*=guildIconImage-] {
background-color: var(--background-primary);
}
/* Server settings popup */
[class*=standardSidebarView-] [class*=noticeRegion-] > [class*=container-] {
background-color: var(--background-tertiary) !important;
opacity: 0.9;
}
/* Stream ended background */
.pictureInPictureVideo-2puO2Q {
background-color: var(--background-floating);
}
.pictureInPictureVideo-2puO2Q .button-3Vyz67 {
background-color: var(--interactive-muted);
}
/* stream ended */
[class*=callContainer-] [class*=wrapper-] > [class*=tile-],
[class*=callContainer-] [class*=wrapper-] [class*=videoWrapper-] {
background-color: var(--background-tertiary);
}
[class*=video-] > [class*=callContainer-] {
background: unset;
}
.emptyPreview-1SMLD4 {
background: linear-gradient(120deg, var(--background-tertiary), var(--background-secondary-alt));
}
/* Screen share hover popup */
[class*=layerContainer-] [class*=streamPreview-] {
background-color: var(--background-tertiary);
}
/* ----- Modals (there's like 3-4 types so this is :thonk:
* Change Identity modal :not(view image modal)
* Upload file modal
* Other various modals */
[class*=layerContainer-] [class*=root-][class*=fullscreenOnMobile-],
[class*=backdrop-] ~ [class*=modal-] > [class*=inner-] :is([class*=fullscreenOnMobile-], [class*=uploadModal-]),
[class*=modal-] > [class*=inner-] > [class*=modal-] {
background-color: var(--background-primary);
}
[class*=layerContainer-] [class*=root-] [class*=footer-],
[class*=backdrop-] ~ [class*=modal-] [class*=footer-] {
background-color: var(--background-secondary);
box-shadow: none;
}
/* Delete message modal */
[class*=layerContainer-] [class*=root-] [class*=content-] > [class*=message-] {
background-color: var(--background-primary);
}
/* Include user's settings */
/* Palette option variables */
/* Plugin-related styling (support/fixes) */
/* Split up the user area: pfp & status picker next to message bar, settings & game activity into guild list */
/* Settings menu styled as a guild w/ channels & pages */
/* Apply new fonts. Please edit font settings in QuickCSS with :root {} */
/* Chat, channel list, toolbar, user area */
/* Apply radius variable to avatars & server icons*/
/* Fix discord's jank non-use of theme variables on certain menus */
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment