less rewrite
This commit is contained in:
parent
4734adb74f
commit
7e72aadc06
11 changed files with 527 additions and 425 deletions
1
.gitignore
vendored
1
.gitignore
vendored
|
|
@ -1 +1,2 @@
|
|||
diskort.xpi
|
||||
btfl.css
|
||||
|
|
|
|||
425
btfl.css
425
btfl.css
|
|
@ -1,425 +0,0 @@
|
|||
/** DisKort
|
||||
* (c) Er2 2022 <er2@dismail.de>
|
||||
* Zlib License
|
||||
*/
|
||||
|
||||
/* to hide */
|
||||
[class^="DocSearch"], /* Algolia, f you */
|
||||
[class*="tier"],
|
||||
[class^="username-"],
|
||||
[class^="discrimBase-"],
|
||||
[class^="bannerContainer-"],
|
||||
[class*="banner-"],
|
||||
[class*="perks"],
|
||||
[class*="socialLink-"],
|
||||
[class^="usernameInnerRow-"],
|
||||
[class^="membersGroup-"],
|
||||
[class^="searchBar-"],
|
||||
[class^="nowPlaying"],
|
||||
[class^="marketing"],
|
||||
[class^="clickableSticker-"],
|
||||
[class^="unreadPill-"],
|
||||
[class^="applicationInstall"],
|
||||
[class*="nitro"],
|
||||
[class^="upsell"],
|
||||
[class^="availabilityIndicator-"],
|
||||
div[class^="quickswitcher-"],
|
||||
div[class^="serverBoostTabItem-"],
|
||||
div[class^="overviewSidebar-"],
|
||||
div[class^="autocompleteShadow-"],
|
||||
div[class^="art-"],
|
||||
div[class^="threadSuggestionBar-"],
|
||||
div[class^="nameTag-"],
|
||||
div[class*="hero"],
|
||||
/*div[class^="button"] button[class^="button-"],*/
|
||||
button[class^="shinyButton"], [class*="giftButton"],
|
||||
button[class*="followButton-"],
|
||||
/*button[class*="emojiItemDisabled-"],*/
|
||||
div[class*="premium"],
|
||||
div[id*="premium"],
|
||||
div[role="separator"]:not([id$="new-messages-bar"]),
|
||||
div[class*="goal"],
|
||||
div[class^="welcomeCTA-"],
|
||||
div[class^="channelNotice-"],
|
||||
h2[class^="privateChannelsHeaderContainer"],
|
||||
nav[class^="nav-"],
|
||||
span[class^="questionMark-"],
|
||||
div[class^="characterCount-"] div[class^="root-"],
|
||||
|
||||
div[class^="keybind-"], /* true must know this! */
|
||||
|
||||
/* Settings */
|
||||
div[aria-controls*="nitro"],
|
||||
div[aria-controls="library-inventory-tab"],
|
||||
div[aria-controls="subscriptions-tab"],
|
||||
div[aria-controls="billing-tab"],
|
||||
div[aria-controls^="hypesquad"],
|
||||
div[class^="socialLinks-"],
|
||||
|
||||
/* buttons on chat area */
|
||||
div[class^="channelTextArea-"] div div > div button:not([class^="emojiButton"]):not([class^="attachButton-"]),
|
||||
[class^="stickerIcon-"],
|
||||
div[class^="channelTextArea-"] > div[class^="scrollableContainer-"]
|
||||
div[class^="divider-"],
|
||||
|
||||
div[class^="toolbar-3_"] > :not([aria-label="Close"]),
|
||||
|
||||
#emoji-picker-tab-panel
|
||||
div[class^="emojiPicker-"]
|
||||
> div[class^="header-"],
|
||||
|
||||
section div[class^="children-"] div[class^="spacer-"],
|
||||
|
||||
nav[class^="privateChannels-"] div div
|
||||
*[data-list-item-id$="nitro"],
|
||||
|
||||
#gif-picker-tab, #sticker-picker-tab,
|
||||
#private-channels-0, #private-channels-1, #private-channels-2,
|
||||
|
||||
div[class*="templatesList-"] button[class^="container-"] ~ *,
|
||||
|
||||
[class*="artwork-"],
|
||||
div[class^="characterBackground-"] [class*="rightSplit-"],
|
||||
|
||||
/* main page */
|
||||
#app-mount div:not([class]) div[class=""] div:not([class]),
|
||||
#app-mount div:not([class]) div[class=""] div div[class*="background-"],
|
||||
#app-mount div:not([class]) div[class=""] div[class^="grid-"] div[class^="animation-"]
|
||||
{
|
||||
all: unset !important;
|
||||
display: none !important;
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
}
|
||||
div[aria-label="Servers"] ~ div
|
||||
{
|
||||
/* FIXME: Localized string and bottom is broken */
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* to show */
|
||||
div[class^="scroller-"] div[class^="tutorialContainer-"]
|
||||
{
|
||||
/* FIXME: goto FIXME above */
|
||||
display: unset;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
:not([class^="listItemContents-"]) > div[class^="userInfo-"] {
|
||||
padding-top: 48px;
|
||||
justify-content: left;
|
||||
}
|
||||
div[class^="userInfo-"] button {
|
||||
margin-left: 32px;
|
||||
margin-top: -8px;
|
||||
}
|
||||
div[class^="userInfo-"] div[class^="avatar-"] {
|
||||
top: 32px;
|
||||
}
|
||||
|
||||
div[class^="headerTop-"] div[class^="headerText"]
|
||||
{ margin-left: 84px; }
|
||||
div[class^="profileBanner"] div[class*="avatar"]:not([class^="imageUploaderInner"]) {
|
||||
margin-left: -8px;
|
||||
margin-top: -8px;
|
||||
}
|
||||
|
||||
div[class^="peopleListItem-"]
|
||||
div
|
||||
div[class^="userInfo-"] div[class^="avatar-"] {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
div[class^="messagesWrapper-"] div {
|
||||
scrollbar-width: thin;
|
||||
}
|
||||
|
||||
#emoji-picker-tab-panel:not([role="dialog"]) {
|
||||
position: absolute;
|
||||
top: 0; bottom: 0;
|
||||
left: 0; right: 0;
|
||||
}
|
||||
|
||||
#emoji-picker-tab-panel
|
||||
div[class^="wrapper-"] {
|
||||
top: 0;
|
||||
border-radius: 5px 0 0 5px;
|
||||
}
|
||||
|
||||
div[class^="avatarWrapper-"] {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
div[class^="radioBar-"] {
|
||||
border: none;
|
||||
}
|
||||
|
||||
/* rounder */
|
||||
[class^="authBox"],
|
||||
[class*="embed"],
|
||||
[class^="checkboxWrapper-"],
|
||||
div[class^="autocomplete-"],
|
||||
div[class^="pictureInPicture-"],
|
||||
div[class^="group-"],
|
||||
div[class*="card"],
|
||||
div[class^="item-"],
|
||||
div[class^="select-"],
|
||||
div[class^="popout"],
|
||||
div[class^="userPopout-"],
|
||||
div[class^="accountProfile"],
|
||||
div[class^="profileBanner"],
|
||||
div[class^="connectedAccount"],
|
||||
div[class*="fullscreenOnMobile"],
|
||||
div[class^="auditLog-"],
|
||||
div[class^="auditLog-"] > div,
|
||||
div[class*="root"] div[class^="flex-"],
|
||||
div[class^="menu"],
|
||||
div[class^="messagesWrapper-"] div,
|
||||
div[class^="markup-"] pre code,
|
||||
div[class^="sidebar-"],
|
||||
div[class^="container-"],
|
||||
div[class^="chat-"]
|
||||
{
|
||||
border-radius: 16px !important;
|
||||
}
|
||||
|
||||
div[class^="sidebar-"]
|
||||
{
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
/* sharper */
|
||||
div[class^="tabBarItem-"],
|
||||
div[class^="checkbox"],
|
||||
li[class^="channel-"],
|
||||
#channels ul li div > div[class^="content-"],
|
||||
button[class*="button"],
|
||||
[role="dialog"],
|
||||
div[class^="colorPicker"] div div[class^="saturation"] div,
|
||||
[class*="Text"], [class*="text"],
|
||||
div[class*="input"],
|
||||
input[class^="inputDefault-"],
|
||||
[class^="avatar-"],
|
||||
div[class^="role-"],
|
||||
div[class^="menu-"] div
|
||||
{
|
||||
border-radius: 8px !important;
|
||||
}
|
||||
|
||||
div[class^="tabBarItem-"],
|
||||
div[class^="auditLog"] div[class^="headerExpanded-"]
|
||||
{
|
||||
border-bottom-left-radius: 0 !important;
|
||||
border-bottom-right-radius: 0 !important;
|
||||
}
|
||||
|
||||
div[class^="auditLog-"] div[class^="changeDetails-"]
|
||||
{
|
||||
border-top-left-radius: 0 !important;
|
||||
border-top-right-radius: 0 !important;
|
||||
}
|
||||
|
||||
[class*="embed-"],
|
||||
div[class^="messagesWrapper-"]
|
||||
div[class*="mentioned"]
|
||||
{
|
||||
border-top-left-radius: 4px !important;
|
||||
border-bottom-left-radius: 4px !important;
|
||||
}
|
||||
|
||||
/* no banners */
|
||||
/* user popup */
|
||||
div[class^="userPopout-"] div[class^="headerTop-"] { padding-top: 72px; }
|
||||
div[class^="userPopout-"] div[class^="avatarWrapper"] { left: 8px; top: 16px; }
|
||||
|
||||
/* profile */
|
||||
header div[class^="nameTagWithCustomStatus-"],
|
||||
header div[class^="nameTagNoCustomStatus-"] {
|
||||
margin-bottom: 48px;
|
||||
margin-left: 160px;
|
||||
}
|
||||
|
||||
/* member list */
|
||||
aside[class^="membersWrap-"]
|
||||
{
|
||||
min-width: 48px;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
div[class^="children-"] div[class^="nicknames-"],
|
||||
div[class^="children-"] div[class^="topic-"]
|
||||
{
|
||||
width: unset !important;
|
||||
flex-grow: 0;
|
||||
}
|
||||
|
||||
aside[class^="membersWrap-"] div[class^="content-"],
|
||||
nav[class^="privateChannels-"] div ul[class^="content-"]:only-child,
|
||||
ul[class^="emojiListRow-"]
|
||||
{
|
||||
height: unset !important;
|
||||
flex-grow: 0;
|
||||
}
|
||||
|
||||
div[class^="members-"],
|
||||
div[class^="member-"],
|
||||
div[class*="root"] div[class^="flex-"] div[class^="header"]
|
||||
{
|
||||
padding: 0;
|
||||
flex: 0 0 100%;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
section, header,
|
||||
div[class^="content-"]::before,
|
||||
div[class^="tabBody-"]::before
|
||||
{
|
||||
box-shadow: unset !important;
|
||||
}
|
||||
|
||||
section div[class^="children-"]
|
||||
{
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* mobile mode */
|
||||
@media screen and (max-device-width: 800px) {
|
||||
/* FIXME: add close buttons to emoji panel */
|
||||
|
||||
[class^="channel-"] { max-width: unset; margin: 0 8px; }
|
||||
[class^="layer-"] { padding: 0; margin: auto; }
|
||||
[class^="layer-"] > [class^="container-"],
|
||||
[class^="standardSidebarView-"] { overflow-x: scroll; }
|
||||
[class^="base-"], [class^="contentRegion-"] { min-width: 200%; }
|
||||
[class^="content-"] [class^="sidebar"] { width: calc(50% - 8px - 72px); }
|
||||
[class^="chat-"] { width: 100%; }
|
||||
[class^="tools"] { position: unset !important; }
|
||||
|
||||
[class*="positionLayer-"],
|
||||
[class*="fullscreenOnMobile"] {
|
||||
overflow: auto;
|
||||
width: 100%; min-width: 100%;
|
||||
}
|
||||
[class^="positionLayer-"] {
|
||||
position: absolute;
|
||||
top: 0 !important;
|
||||
left: 0 !important;
|
||||
right: 0 !important;
|
||||
bottom: 0 !important;
|
||||
}
|
||||
[class*="fullscreenOnMobile"] [class^="body"] {
|
||||
width: 100%; height: 100%;
|
||||
}
|
||||
|
||||
[class^="side-"] > [class^="item-"] {
|
||||
margin-top: 4px !important;
|
||||
padding: 6px 10px !important;
|
||||
}
|
||||
|
||||
[class^="side-"] > [class^="item-"],
|
||||
:not([class*="pill"]):not([class*="Pill"]) > [class*="item-"],
|
||||
:not([class*="pill"]):not([class*="Pill"]) > [role="tab"],
|
||||
[class^="member-"],
|
||||
#channels li,
|
||||
div[class^="tabBarItem-"] {
|
||||
margin-top: 16px;
|
||||
padding: 0 8px;
|
||||
font-size: 11pt;
|
||||
}
|
||||
}
|
||||
|
||||
div[class*="fullscreenOnMobile"] div[class^="flex"] * {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
div[class^="tabBarItem-"] {
|
||||
margin-right: 16px;
|
||||
padding: 4px 8px;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
[role="tab"][class*="selected-"],
|
||||
[role="tab"]:hover
|
||||
{
|
||||
background-color: var(--background-modifier-hover);
|
||||
}
|
||||
|
||||
div[class*="templatesList-"] {
|
||||
height: 128px;
|
||||
}
|
||||
|
||||
/* text input */
|
||||
|
||||
div[class^="attachedBars-"],
|
||||
div[class^="messagesWrapper-"] div[class*="Bar-"]:not([class^="newMessagesBar-"]) {
|
||||
position: relative;
|
||||
bottom: 16px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
div[class^="channelTextArea-"] > div[class^="scrollableContainer-"] {
|
||||
background-color: unset;
|
||||
}
|
||||
div[class^="channelTextArea-"] > div[class^="scrollableContainer-"]
|
||||
button[class ^="attachButton-"],
|
||||
div[class^="channelTextArea-"] > div[class^="scrollableContainer-"]
|
||||
div[class^="textArea-"],
|
||||
div[class^="channelTextArea-"] > div[class^="scrollableContainer-"]
|
||||
div[class^="buttons-"]
|
||||
{
|
||||
background-color: var(--background-secondary);
|
||||
border-radius: 24px !important;
|
||||
margin: 0;
|
||||
}
|
||||
div[class^="channelTextArea-"] > div[class^="scrollableContainer-"]
|
||||
> div[class^="inner-"] { padding: 0; }
|
||||
div[class^="channelTextArea-"] > div[class^="scrollableContainer-"]
|
||||
button[class ^="attachButton-"] {
|
||||
padding: 8px;
|
||||
width: auto; height: auto;
|
||||
}
|
||||
div[class^="channelTextArea-"] > div[class^="scrollableContainer-"]
|
||||
div[class^="textArea-"] {
|
||||
margin-left: 8px;
|
||||
border-top-right-radius: 0 !important;
|
||||
border-bottom-right-radius: 0 !important;
|
||||
}
|
||||
div[class^="channelTextArea-"] > div[class^="scrollableContainer-"]
|
||||
div[class^="textArea-"] > * { left: 12px; }
|
||||
div[class^="channelTextArea-"] > div[class^="scrollableContainer-"]
|
||||
div[class^="buttons-"] {
|
||||
height: auto;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
border-top-left-radius: 0 !important;
|
||||
border-bottom-left-radius: 0 !important;
|
||||
}
|
||||
|
||||
/* dimmer theme? */
|
||||
div[class^="downloadApps-"],
|
||||
div[class^="layer-"] div.theme-light div[class*="root-"]
|
||||
{ background-color: var(--background-secondary) !important; }
|
||||
div[class^="layer-"] div.theme-light div[class*="footer-"]
|
||||
{ background: var(--background-primary); }
|
||||
div[class^="downloadApps-"],
|
||||
div[class^="layer-"] div.theme-light {
|
||||
--header-primary: #dedede;
|
||||
--header-secondary: #cacaca;
|
||||
--text-normal: #dcddde;
|
||||
--interactive-normal: #bebebe;
|
||||
--interactive-hover: #dedede;
|
||||
--background-primary: #3e3e3e;
|
||||
--background-secondary: #2e2e2e;
|
||||
--background-tertiary: #1e1e1e;
|
||||
color: var(--header-primary);
|
||||
}
|
||||
div[class^="downloadApps-"] [class*="close-"]
|
||||
{ color: var(--interactive-normal); }
|
||||
div[class^="downloadApps-"] [class*="close-"]:hover
|
||||
{ color: var(--interactive-hover); }
|
||||
div[class^="downloadApps-"] h3,
|
||||
div[class^="downloadApps-"] div[class*="footer-"] {
|
||||
color: var(--header-primary);
|
||||
}
|
||||
12
btfl.less
Normal file
12
btfl.less
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
/** DisKort
|
||||
* (c) Er2 2022 <er2@dismail.de>
|
||||
* Zlib License
|
||||
*/
|
||||
|
||||
@import "src/hide";
|
||||
@import "src/show";
|
||||
@import "src/dimmer";
|
||||
@import "src/profile";
|
||||
@import "src/people";
|
||||
@import "src/fixes";
|
||||
@import "src/style";
|
||||
45
src/dimmer.less
Normal file
45
src/dimmer.less
Normal file
|
|
@ -0,0 +1,45 @@
|
|||
/** DisKort
|
||||
* (c) Er2 2022 <er2@dismail.de>
|
||||
* Zlib License
|
||||
*/
|
||||
|
||||
.dimmer-theme {
|
||||
--header-primary: #dedede;
|
||||
--header-secondary: #cacaca;
|
||||
--text-normal: #dcddde;
|
||||
--interactive-normal: #bebebe;
|
||||
--interactive-hover: #dedede;
|
||||
--background-primary: #3e3e3e;
|
||||
--background-secondary: #2e2e2e;
|
||||
--background-tertiary: #1e1e1e;
|
||||
color: var(--header-primary);
|
||||
|
||||
& [class*="close-"] {
|
||||
color: var(--interactive-normal);
|
||||
|
||||
&:hover
|
||||
{ color: var(--interactive-hover); }
|
||||
}
|
||||
}
|
||||
|
||||
div[class^="layer-"] div.theme-light,
|
||||
div[class^="downloadApps-"] {
|
||||
.dimmer-theme();
|
||||
|
||||
div[class*="root-"] {
|
||||
background-color: var(--background-secondary);
|
||||
}
|
||||
|
||||
div[class*="footer-"] {
|
||||
background-color: var(--background-primary);
|
||||
}
|
||||
}
|
||||
|
||||
div[class^="downloadApps"] {
|
||||
& {
|
||||
background-color: var(--background-secondary) !important;
|
||||
}
|
||||
h3, div[class*="footer-"] {
|
||||
color: var(--header-primary);
|
||||
}
|
||||
}
|
||||
32
src/fixes.less
Normal file
32
src/fixes.less
Normal file
|
|
@ -0,0 +1,32 @@
|
|||
/** DisKort
|
||||
* (c) Er2 2022 <er2@dismail.de>
|
||||
* Zlib License
|
||||
*/
|
||||
|
||||
div[class^="messagesWrapper-"] div {
|
||||
scrollbar-width: thin;
|
||||
}
|
||||
|
||||
#emoji-picker-tab-panel {
|
||||
&:not([role="dialog"]) {
|
||||
// if add reaction (role=dialog), it breaks
|
||||
position: absolute;
|
||||
top: 0; bottom: 0;
|
||||
left: 0; right: 0;
|
||||
}
|
||||
|
||||
div[class^="wrapper-"] {
|
||||
top: 0;
|
||||
border-radius: 5px 0 0 5px; // for add reaction
|
||||
}
|
||||
}
|
||||
|
||||
div[class*="fullscreenOnMobile"] div[class^="flex"] * {
|
||||
// fix overflow
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
div[class*="templatesList-"] {
|
||||
// fix tempates list (it was removed)
|
||||
height: 128px;
|
||||
}
|
||||
115
src/hide.less
Normal file
115
src/hide.less
Normal file
|
|
@ -0,0 +1,115 @@
|
|||
/** DisKort
|
||||
* (c) Er2 2022 <er2@dismail.de>
|
||||
* Zlib License
|
||||
*/
|
||||
|
||||
// Site
|
||||
[class^="DocSearch"], // Algolia, f you
|
||||
#app-mount div:not([class]) div[class=""] div:not([class]), // main page content
|
||||
#app-mount div:not([class]) div[class=""] div div[class*="background-"], // nitro animation at top
|
||||
#app-mount div:not([class]) div[class=""] div[class^="grid-"] div[class^="animation-"], // nitro animation
|
||||
|
||||
// Remove background (invite, login)
|
||||
[class*="artwork-"],
|
||||
div[class^="characterBackground-"] [class*="rightSplit-"],
|
||||
div[class^="art-"],
|
||||
|
||||
// New server (inside app)
|
||||
div[class*="templatesList-"] button[class^="container-"] ~ *, // templates are really useless
|
||||
|
||||
// Nicks
|
||||
[class^="username-"], // in profile
|
||||
[class^="discrimBase-"],
|
||||
|
||||
div[class^="nameTag-"],
|
||||
[class^="usernameInnerRow-"], // at settings
|
||||
|
||||
// Nitro
|
||||
[class^="marketing"],
|
||||
[class*="tier"],
|
||||
[class*="perks-"],
|
||||
[class*="nitro"],
|
||||
[class^="upsell"],
|
||||
[class^="availabilityIndicator-"],
|
||||
div[class^="serverBoostTabItem-"],
|
||||
div[class*="hero"],
|
||||
div[class*="premium"],
|
||||
div[id*="premium"],
|
||||
div[class*="goal"],
|
||||
button[class^="shinyButton"],
|
||||
[class*="giftButton"],
|
||||
span[class^="questionMark-"], // at tag change
|
||||
div[class^="characterCount-"] div[class^="root-"], // at many characters
|
||||
[class^="clickableSticker-"], // stickers
|
||||
nav[class^="privateChannels-"] div div // Nitro tab at DM
|
||||
*[data-list-item-id$="nitro"],
|
||||
|
||||
// Suggestions
|
||||
button[class*="followButton-"], // at top in channels
|
||||
[class^="nowPlaying"], // in friends tab
|
||||
[class^="applicationInstall"], // at bot profile
|
||||
div[class^="threadSuggestionBar-"], // create thread because many replies
|
||||
div[class^="welcomeCTA-"], // wave to say hi on server
|
||||
div[role="separator"]:not([id$="new-messages-bar"]), // aren't needed
|
||||
|
||||
// Profile
|
||||
[class^="bannerContainer-"],
|
||||
[class*="banner-"],
|
||||
|
||||
// Settings
|
||||
div[class^="keybind-"], // true must know it!
|
||||
[class*="socialLink-"], // in change log
|
||||
div[class^="socialLinks-"], // in settings at bottom
|
||||
|
||||
// Tabs
|
||||
div[aria-controls*="nitro"],
|
||||
div[aria-controls="library-inventory-tab"],
|
||||
div[aria-controls="subscriptions-tab"],
|
||||
div[aria-controls="billing-tab"],
|
||||
div[aria-controls^="hypesquad"],
|
||||
|
||||
// Member list
|
||||
[class^="membersGroup-"], // groups (roles)
|
||||
|
||||
// Emoji picker
|
||||
#gif-picker-tab, #sticker-picker-tab,
|
||||
#emoji-picker-tab-panel
|
||||
div[class^="emojiPicker-"]
|
||||
> div[class^="header-"],
|
||||
nav[class^="nav-"], // breaks emoji panel, fixed at fixes.less
|
||||
|
||||
// Search
|
||||
[class^="searchBar-"],
|
||||
div[class^="quickswitcher-"], // Ctrl-K
|
||||
div[class^="toolbar-3_"] > :not([aria-label="Close"]), // toolbar at top, FIXME: fixed string
|
||||
|
||||
// Sidebar
|
||||
div[class^="channelNotice-"], // sh** at bottom of server name like invite people, server boost etc.
|
||||
h2[class^="privateChannelsHeaderContainer"], // direct messages label
|
||||
// #private-channels-0, #private-channels-1, #private-channels-2, // to check
|
||||
|
||||
// Text area
|
||||
div[class^="channelTextArea-"] div div > div // only attach and emoji at text area
|
||||
button:not([class^="emojiButton"]):not([class^="attachButton-"]),
|
||||
div[class^="channelTextArea-"] > div[class^="scrollableContainer-"] // divider breaks redesigned text area
|
||||
div[class^="divider-"],
|
||||
|
||||
// Other
|
||||
div[class^="autocompleteShadow-"], // bugged
|
||||
[class^="unreadPill-"], // NEW at right, not needed
|
||||
div[class^="overviewSidebar-"], // at community creation, not needed
|
||||
section div[class^="children-"] div[class^="spacer-"], // to check
|
||||
{
|
||||
all: unset !important;
|
||||
display: none !important;
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
}
|
||||
|
||||
div[aria-label="Servers"] ~ div
|
||||
{
|
||||
// FIXME: Fixed string and bottom is broken
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
display: none;
|
||||
}
|
||||
51
src/mobile.less
Normal file
51
src/mobile.less
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
/** DisKort
|
||||
* (c) Er2 2022 <er2@dismail.de>
|
||||
* Zlib License
|
||||
*/
|
||||
|
||||
// TODO: comment this
|
||||
|
||||
@media screen and (max-device-width: 800px) {
|
||||
/* FIXME: add close buttons to emoji panel */
|
||||
|
||||
[class^="channel-"] { max-width: unset; margin: 0 8px; }
|
||||
[class^="layer-"] { padding: 0; margin: auto; }
|
||||
[class^="layer-"] > [class^="container-"],
|
||||
[class^="standardSidebarView-"] { overflow-x: scroll; }
|
||||
[class^="base-"], [class^="contentRegion-"] { min-width: 200%; }
|
||||
[class^="content-"] [class^="sidebar"] { width: calc(50% - 8px - 72px); }
|
||||
[class^="chat-"] { width: 100%; }
|
||||
[class^="tools"] { position: unset !important; }
|
||||
|
||||
[class*="positionLayer-"],
|
||||
[class*="fullscreenOnMobile"] {
|
||||
overflow: auto;
|
||||
width: 100%; min-width: 100%;
|
||||
}
|
||||
[class^="positionLayer-"] {
|
||||
position: absolute;
|
||||
top: 0 !important;
|
||||
left: 0 !important;
|
||||
right: 0 !important;
|
||||
bottom: 0 !important;
|
||||
}
|
||||
[class*="fullscreenOnMobile"] [class^="body"] {
|
||||
width: 100%; height: 100%;
|
||||
}
|
||||
|
||||
[class^="side-"] > [class^="item-"] {
|
||||
margin-top: 4px !important;
|
||||
padding: 6px 10px !important;
|
||||
}
|
||||
|
||||
[class^="side-"] > [class^="item-"],
|
||||
:not([class*="pill"]):not([class*="Pill"]) > [class*="item-"],
|
||||
:not([class*="pill"]):not([class*="Pill"]) > [role="tab"],
|
||||
[class^="member-"],
|
||||
#channels li,
|
||||
div[class^="tabBarItem-"] {
|
||||
margin-top: 16px;
|
||||
padding: 0 8px;
|
||||
font-size: 11pt;
|
||||
}
|
||||
}
|
||||
23
src/people.less
Normal file
23
src/people.less
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
/** DisKort
|
||||
* (c) Er2 2022 <er2@dismail.de>
|
||||
* Zlib License
|
||||
*/
|
||||
|
||||
aside[class^="membersWrap-"] {
|
||||
// make it shorter
|
||||
&, div[class^="members-"] {
|
||||
min-width: 48px;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
// remove fixed height
|
||||
div[class^="content-"] {
|
||||
height: unset !important;
|
||||
flex-grow: 0;
|
||||
}
|
||||
|
||||
div[class^="member-"] {
|
||||
padding: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
55
src/profile.less
Normal file
55
src/profile.less
Normal file
|
|
@ -0,0 +1,55 @@
|
|||
/** DisKort
|
||||
* (c) Er2 2022 <er2@dismail.de>
|
||||
* Zlib License
|
||||
*/
|
||||
|
||||
div[class^="userInfo-"] {
|
||||
// settings
|
||||
padding-top: 48px;
|
||||
justify-content: left;
|
||||
|
||||
button {
|
||||
margin-left: 32px;
|
||||
margin-top: -8px;
|
||||
}
|
||||
|
||||
div[class^="avatar-"] {
|
||||
top: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
div[class^="listItemContents-"] div[class^="userInfo"] {
|
||||
padding-top: 0;
|
||||
div[class^="avatar-"] {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
div[class^="userPopout-"] {
|
||||
div[class^="avatarWrapper"] {
|
||||
top: 8px; // fix divider bug
|
||||
}
|
||||
|
||||
div[class^="headerTop-"] {
|
||||
padding-top: 72px; // also fix divider bug
|
||||
}
|
||||
}
|
||||
|
||||
div[class^="profileBanner"] div[class*="avatar"]:not([class^="imageUploaderInner"]) {
|
||||
margin-left: -8px;
|
||||
margin-top: -8px;
|
||||
}
|
||||
|
||||
div[class^="headerTop-"] div[class^="headerText"] {
|
||||
margin-left: 96px; // fix nickname
|
||||
}
|
||||
|
||||
div[class^="avatarWrapper-"] {
|
||||
margin-right: auto; // fix aligment (bottom of sidebar)
|
||||
}
|
||||
|
||||
header div[class^="nameTagWithCustomStatus-"],
|
||||
header div[class^="nameTagNoCustomStatus-"] {
|
||||
margin-bottom: 48px; // some space under avatar
|
||||
margin-left: 160px; // after avatar, not before
|
||||
}
|
||||
11
src/show.less
Normal file
11
src/show.less
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
/** DisKort
|
||||
* (c) Er2 2022 <er2@dismail.de>
|
||||
* Zlib License
|
||||
*/
|
||||
|
||||
div[class^="scroller-"] div[class^="tutorialContainer-"] // Add server
|
||||
{
|
||||
// FIXME: Fixed string and bottom is broken
|
||||
display: unset;
|
||||
margin: 0;
|
||||
}
|
||||
182
src/style.less
Normal file
182
src/style.less
Normal file
|
|
@ -0,0 +1,182 @@
|
|||
/** DisKort
|
||||
* (c) Er2 2022 <er2@dismail.de>
|
||||
* Zlib License
|
||||
*/
|
||||
|
||||
@round: 8px;
|
||||
@rounder: 16px;
|
||||
@roundest: 24px; // text area
|
||||
|
||||
// Round
|
||||
// UI elements
|
||||
div[class^="tabBarItem-"],
|
||||
div[class^="checkbox"],
|
||||
button[class*="button"],
|
||||
|
||||
// UI parts
|
||||
li[class^="channel-"],
|
||||
[class^="avatar-"],
|
||||
[role="dialog"],
|
||||
div[class^="menu-"] div,
|
||||
div[class^="role-"],
|
||||
div[class^="colorPicker"] div div[class^="saturation"] div,
|
||||
#channels ul li div > div[class^="content-"],
|
||||
|
||||
// Input
|
||||
div[class*="input"],
|
||||
input[class^="inputDefault-"],
|
||||
[class*="Text"], [class*="text"],
|
||||
{
|
||||
border-radius: @round !important;
|
||||
}
|
||||
|
||||
// Rounder
|
||||
// Popouts
|
||||
[class^="authBox"], // login
|
||||
div[class^="menu"],
|
||||
div[class*="popout"],
|
||||
div[class*="Popout"],
|
||||
div[class*="fullscreenOnMobile"],
|
||||
div[class*="root"] div[class^="flex-"],
|
||||
|
||||
// UI elements
|
||||
[class^="checkboxWrapper-"], // checkbox
|
||||
[class*="embed"],
|
||||
div[class^="sidebar-"],
|
||||
div[class^="markup-"] pre code, // ```code```
|
||||
div[class^="item-"], // in settings
|
||||
div[class^="group-"], // radiogroup
|
||||
div[class*="card"],
|
||||
|
||||
// UI parts
|
||||
div[class^="auditLog-"],
|
||||
div[class^="auditLog-"] > div,
|
||||
|
||||
div[class^="connectedAccount"], // in profile
|
||||
div[class^="profileBanner"],
|
||||
div[class^="accountProfile"],
|
||||
|
||||
div[class^="autocomplete-"], // input
|
||||
div[class^="pictureInPicture-"],
|
||||
|
||||
div[class^="select-"],
|
||||
div[class^="messagesWrapper-"] div,
|
||||
div[class^="container-"],
|
||||
div[class^="chat-"],
|
||||
{
|
||||
border-radius: @rounder !important;
|
||||
}
|
||||
|
||||
// Movement
|
||||
div[class^="sidebar-"] {
|
||||
margin-right: (@rounder / 2);
|
||||
}
|
||||
|
||||
div[class^="radioBar-"] {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.left-border(@r: 0) {
|
||||
border-top-left-radius: @r !important;
|
||||
border-bottom-left-radius: @r !important;
|
||||
}
|
||||
|
||||
.right-border(@r: 0) {
|
||||
border-top-right-radius: @r !important;
|
||||
border-bottom-right-radius: @r !important;
|
||||
}
|
||||
|
||||
.bottom-border(@r: 0) {
|
||||
border-bottom-left-radius: @r !important;
|
||||
border-bottom-right-radius: @r !important;
|
||||
}
|
||||
|
||||
.top-border(@r: 0) {
|
||||
border-top-left-radius: @r !important;
|
||||
border-top-right-radius: @r !important;
|
||||
}
|
||||
|
||||
div[class^="tabBarItem-"],
|
||||
div[class^="auditLog"] div[class^="headerExpanded-"]
|
||||
{ .bottom-border(); }
|
||||
|
||||
div[class^="auditLog-"] div[class^="changeDetails-"]
|
||||
{ .top-border(); }
|
||||
|
||||
[class*="embed-"],
|
||||
div[class^="messagesWrapper-"]
|
||||
div[class*="mentioned"]
|
||||
{ .left-border(4px); }
|
||||
|
||||
// center titles
|
||||
|
||||
section, header,
|
||||
div[class^="content-"]::before,
|
||||
div[class^="tabBody-"]::before
|
||||
{
|
||||
box-shadow: unset !important;
|
||||
}
|
||||
|
||||
section div[class^="children-"]
|
||||
{ justify-content: center; }
|
||||
|
||||
// tabs
|
||||
div[class^="tabBarItem-"] {
|
||||
margin-right: 16px;
|
||||
padding: 4px 8px;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
[role="tab"][class*="selected-"],
|
||||
[role="tab"]:hover
|
||||
{
|
||||
background-color: var(--background-modifier-hover);
|
||||
}
|
||||
|
||||
// Redesigned text input
|
||||
|
||||
div[class^="attachedBars-"],
|
||||
div[class^="messagesWrapper-"] div[class*="Bar-"]:not([class^="newMessagesBar-"]) {
|
||||
bottom: 16px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
div[class^="attachedBars-"]
|
||||
{ position: relative; }
|
||||
|
||||
div[class^="channelTextArea-"] {
|
||||
& > div[class^="scrollableContainer-"] {
|
||||
background-color: unset;
|
||||
|
||||
button[class^="attachButton-"],
|
||||
div[class^="textArea-"],
|
||||
div[class^="buttons-"] {
|
||||
background-color: var(--background-secondary);
|
||||
border-radius: @roundest !important;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
& > div[class^="inner-"]
|
||||
{ padding: 0; }
|
||||
|
||||
button[class^="attachButton-"] {
|
||||
padding: 8px;
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
div[class^="textArea-"] {
|
||||
margin-left: 8px;
|
||||
.right-border();
|
||||
|
||||
& > * { left: (@roundest / 2); }
|
||||
}
|
||||
|
||||
div[class^="buttons-"] {
|
||||
height: auto; // to match input height
|
||||
flex-direction: column; // to allow buttons center
|
||||
justify-content: center; // and center it
|
||||
.left-border();
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in a new issue