er2
/
diskort
1
1
Fork 0
Code Issues Pull Requests Releases 1 Activity

Update. 

Bugfixes.

Continue removing classes.

Add some border radius to tabs.

Add support for new profile update (not tested without it).

Radius are now not important when not needed.
This commit is contained in:
Er2 2022-09-06 21:24:40 +03:00
parent 5b91f8f843
commit 444d94d1a9
7 changed files with 162 additions and 150 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/fixes.less
View File

@ -75,6 +75,10 @@ div[class^="toolsContainer-"] { // in settings
} }
} }
div.page-nvZ_ef {
margin: 0 16px;
}
div[class^="contentContainer-"] div[class*="stickyHeader-"] { div[class^="contentContainer-"] div[class*="stickyHeader-"] {
padding-left: 0; padding-left: 0;
padding-right: 0; padding-right: 0;

22
src/func.less
View File

@ -1,25 +1,25 @@
.left-border(@r: 0) { .left-border(@r: 0) {
border-top-left-radius: @r !important; border-top-left-radius: @r;
border-bottom-left-radius: @r !important; border-bottom-left-radius: @r;
} }
.right-border(@r: 0) { .right-border(@r: 0) {
border-top-right-radius: @r !important; border-top-right-radius: @r;
border-bottom-right-radius: @r !important; border-bottom-right-radius: @r;
} }
.bottom-border(@r: 0) { .bottom-border(@r: 0) {
border-bottom-left-radius: @r !important; border-bottom-left-radius: @r;
border-bottom-right-radius: @r !important; border-bottom-right-radius: @r;
} }
.top-border(@r: 0) { .top-border(@r: 0) {
border-top-left-radius: @r !important; border-top-left-radius: @r;
border-top-right-radius: @r !important; border-top-right-radius: @r;
} }
.radius(@r: 0) { .radius(@r: 0) {
border-radius: @r !important; border-radius: @r;
} }
.hide { .hide {
@ -62,9 +62,9 @@
.verify(@id) { .verify(@id) {
div.message-2CShn3 img.avatar-2e8lTP[src*="/@{id}/"] + .header-2jRmjb > .headerText-2z4IhQ::after div.message-2CShn3 img.avatar-2e8lTP[src*="/@{id}/"] + .header-2jRmjb > .headerText-2z4IhQ::after
{ .bot('✓DEV', 16px); } { .bot('✓', 16px); }
// Replies // Replies
div.repliedMessage-3Z6XBG img.replyAvatar-sHd2sU[src*="/@{id}/"] + span::after div.repliedMessage-3Z6XBG img.replyAvatar-sHd2sU[src*="/@{id}/"] + span::after
{ .bot('✓DEV', 12px); } { .bot('✓', 12px); }
} }

23
src/hide.less
View File

@ -11,23 +11,16 @@
{ &:extend(.hide); } { &:extend(.hide); }
} }
// Nicks
.username-1g6Iq1
{ &:extend(.hide); }
// Remove background (invite, login) // Remove background (invite, login)
[class*="artwork-"], [class*="artwork-"],
div[class^="characterBackground-"] [class*="rightSplit-"], div[class^="characterBackground-"] [class*="rightSplit-"],
div[class^="art-"], div[class^="art-"],
{ &:extend(.hide); } { &:extend(.hide); }
// Nicks
[class^="username-"] {
li[class^="messageListItem-"]
[class*="cozyMessage-"] & {
color: var(--header-primary) !important;
}
:not([class^="headerText-"])
> div[class*="nameTag-"] &, // outside message
{ &:extend(.hide); }
}
[class^="discrimBase-"], [class^="discrimBase-"],
div[class^="discordTag-"] [class^="username-"], // friends tab div[class^="discordTag-"] [class^="username-"], // friends tab
div[class^="nameTag-"], div[class^="nameTag-"],
@ -64,8 +57,8 @@ div[class^="toolbar-3_"] > :nth-child(3)
{ &:extend(.hide); } { &:extend(.hide); }
// Text area // Text area
div[class^="channelTextArea-"] { div.channelTextArea-1FufC0 {
div div > div[class^="buttons-"] { // button div.buttons-uaqb-5 { // buttons
& > button // gift button, f you & > button // gift button, f you
{ &:extend(.hide); } { &:extend(.hide); }
@ -74,8 +67,8 @@ div[class^="channelTextArea-"] {
{ &:extend(.hide); } { &:extend(.hide); }
} }
} }
& > div[class^="scrollableContainer-"] div.scrollableContainer-15eg7h
div[class^="divider-"] // breaks redesigned text area div.separator-3ng7S5 // breaks redesigned text area
{ &:extend(.hide); } { &:extend(.hide); }
} }

154
src/profile.less
View File

@ -1,23 +1,4 @@
div[class^="accountProfileCard-"] div[class^="userInfo-"] {
// settings
justify-content: left;
padding-top: 24px;
height: 56px;
button {
margin-left: 32px;
margin-top: -8px;
}
div[class^="avatar-"] {
background-color: var(--background-tertiary) !important;
top: 0;
border-radius: 0 !important;
border-bottom-right-radius: 50% !important;
}
}
.profile() when (@no-nitro = true) { .profile() when (@no-nitro = true) {
[class^="botTagVerified-"], [class^="botTagVerified-"],
[class^="badgeList-"], // modal profile page [class^="badgeList-"], // modal profile page
@ -30,34 +11,43 @@ div[class^="accountProfileCard-"] div[class^="userInfo-"] {
top: 0; top: 0;
} }
} }
// fixes
div.overlayBackground-arbZMT,
div.overlayBackground-H1K9ZY {
margin: 8px 0 0 0;
background: none;
padding-right: 8px;
}
div.overlayBackground-H1K9ZY {
// in settings
padding-right: 0;
margin-top: -8px;
div[class^="userPopout-"], div.section-3FmfOT:first-child {
div[class^="profileBannerPreview-"] { // nick
div[class^="avatarWrapper"],
div[class*="avatarUploaderNormal-"] {
position: relative;
top: 8px;
left: 0;
width: max-content;
margin: 0 auto; margin: 0 auto;
} }
}
div.status-b9jLr4 {
position: relative;
top: -32px;
left: calc(50% + 8px);
}
div[class^="headerText-"] { .profileBadges-2pItdR,
display: flex; .profileBadges-31rDHI {
flex-direction: column; background: rgba(0, 0, 0, 0.1);
align-items: center; justify-content: left;
} position: absolute;
right: 0;
left: 8px;
}
div[class^="profileBadges-"] { div.avatarWrapper-3y0KZ1,
position: static; div.avatarUploader-CHGwK7 {
justify-content: center; position: relative;
} left: 0;
margin: 0 auto;
div[class^="headerTop-"] {
padding: 8px;
margin-top: 8px;
align-self: center;
}
} }
} }
.profile(); .profile();
@ -67,17 +57,46 @@ div[class^="pencilContainer-"] {
} }
// Profile card in settings // Profile card in settings
div[class^="accountProfileCard-"] { div.accountProfileCard-lbN7n- {
div[class^="field-"]:nth-child(1) { div.field-21XZwa:first-child {
height: 0; height: 0;
div[class^="constrainedRow-"] { div.constrainedRow-3y91Xf
display: none; { &:extend(.hide); }
}
button { button {
top: -48pt; top: -48pt;
left: 300pt; left: 300pt;
} }
} }
div.userInfo-regn9W {
justify-content: left;
padding-top: 24px;
height: 56px;
button {
margin-left: 32px;
margin-top: -8px;
}
}
div.avatar-3mTjvZ {
background-color: var(--background-tertiary) !important;
.radius();
border-bottom-right-radius: 16px;
top: 0;
}
div.container-1gYwHN {
width: max-content;
margin-top: 8px;
margin-left: -22px;
background-color: var(--background-tertiary);
.radius();
border-bottom-right-radius: 16px;
height: 32px;
padding-top: 4px;
padding-right: 4px;
}
} }
div[class^="banner"] { div[class^="banner"] {
@ -93,69 +112,70 @@ div[class^="banner"] {
} }
// Redesigned profile page // Redesigned profile page
header div[class^="nameTagWithCustomStatus-"], div.root-8LYsGj {
header div[class^="nameTagNoCustomStatus-"] {
margin-bottom: 48px; // some space under avatar
margin-left: 160px; // after avatar, not before
}
div.root-8LYsGj { // I not love fixed classes, but this selects only modal page
flex-direction: row; flex-direction: row;
header { header {
width: 260px; width: 260px;
margin: 24px; margin: 24px;
div[class^="avatar-"] { div.avatar-3QF_VA {
top: 0; left: 0; top: 0; left: 0;
position: relative; position: relative;
} }
div[class^="headerTop-"] { div.headerTop-1PNKck {
position: unset; position: unset;
justify-content: left; justify-content: left;
} }
div[class^="nameTag"] { div.nameTag-H6kSJ0 {
width: 64px; width: 64px;
position: absolute; position: absolute;
margin-top: -64px; margin-top: -64px;
margin-left: 130px; margin-left: 130px;
} }
div[class^="customStatus"] { div.customStatus-kFfkj5 {
margin-top: 16px; margin-top: 16px;
padding: 0; padding: 0;
} }
} }
div[class^="body-"] { div.body-1Ukv50 {
border: none; border: none;
margin-left: 16px; margin-left: 16px;
height: 370px; height: 370px;
& > * & > *
{ padding: 0 !important; } { padding: 0 !important; }
} }
div[class^="tabBarContainer"] div.tabBarContainer-sCZC4w
{ border: none; } { border: none; }
div[class^="tabBar-"] { div.tabBar-2hXqzU {
flex-direction: column; flex-direction: column;
height: unset; height: unset;
margin: 8px; margin: 8px;
} }
div[class^="tabBarItem-"] { div.tabBarItem-30Te4- {
margin-right: 0; margin-right: 0;
border-bottom: unset; border-bottom: unset;
&:hover, &[class*="selected-"] { &:hover, &.selected-g-kMVV {
border-right: 2px solid var(--interactive-active) !important; border-right: 2px solid var(--interactive-active) !important;
} }
.top-border(); .radius() !important;
.left-border(@round); .left-border(@round) !important;
} }
} }
#account-info div.headerTop-3GPUSF { #account-info {
padding-top: 108px; div.headerTop-3GPUSF {
padding-top: 108px;
}
div.profileBadges-2pItdR {
width: max-content;
.radius(8px);
padding: 2px;
}
} }
#account-avatar div.avatarWrapperNormal-ahVUaC { #account-avatar div.avatarWrapperNormal-ahVUaC {

21
src/settings.less
View File

@ -46,20 +46,6 @@ div.standardSidebarView-E9Pc3j {
} }
} }
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[aria-controls="stickers-tab"],
{ &:extend(.nitro); }
div[aria-controls="keybinds-tab"],
div[aria-controls="game-activity-tab"],
div[aria-controls="analytics-tab"],
div[aria-controls="partner-tab"],
{ &:extend(.hide); }
#my-account-tab > div { #my-account-tab > div {
.horiz-tab(); .horiz-tab();
& > div:first-child { & > div:first-child {
@ -113,13 +99,12 @@ div.optionBox-1UOevl:nth-child(2)
} }
} }
#connections-tab div.children-1xdcWE { #passport-tab div.children-1xdcWE {
flex-direction: row; flex-direction: row;
flex-flow: row wrap; flex-flow: row wrap;
div.accountList-Wii_T5 { div.accountList-Wii_T5 {
margin-right: @div-width; margin-right: @div-width;
width: 33%; width: 33%;
height: 100%; // decreases height? 0_0
// auto detect // auto detect
& + div.container-1zDvAE { & + div.container-1zDvAE {
@ -130,6 +115,10 @@ div.optionBox-1UOevl:nth-child(2)
div.connectionList-11Q_X- { div.connectionList-11Q_X- {
flex-grow: 1; flex-grow: 1;
} }
div.connection-YOVI9j {
height: max-content;
}
} }
#appearance-tab div.children-1xdcWE { #appearance-tab div.children-1xdcWE {

72
src/style.less
View File

@ -123,47 +123,49 @@ div[class^="messagesWrapper-"] div[class*="Bar-"]:not([class^="newMessagesBar-"]
div[class^="attachedBars-"] div[class^="attachedBars-"]
{ position: relative; } { position: relative; }
div[class^="channelTextArea-"] { div.channelTextArea-1VQBuV {
&[class*="channelTextAreaDisabled-"] &.channelTextAreaDisabled-1p2fQv
button[class^="attachButton-"] { .attachButton-1ijpt9
display: none; { &:extend(.hide); }
}
& > div[class^="scrollableContainer-"] { div.scrollableContainer-15eg7h {
background-color: unset; background-color: unset;
opacity: 1; opacity: 1;
}
button[class^="attachButton-"], .attachButton-1ijpt9,
div[class^="textArea-"], .textArea-2CLwUE,
div[class^="buttons-"] { .buttons-uaqb-5 {
background-color: var(--background-secondary); background-color: var(--background-secondary);
border-radius: @roundest !important; .radius(@roundest) !important;
margin: 0; margin: 0;
}
div.inner-NQg18Y {
padding: 0;
}
.attachButton-1ijpt9 {
padding: 8px;
width: auto;
height: auto;
margin-right: 8px;
}
.textArea-2CLwUE {
&:not(.textAreaDisabled-10ObTX)
{ .right-border() !important; }
div > * {
left: (@roundest / 2);
} }
}
& > div[class^="inner-"] .buttons-uaqb-5 {
{ padding: 0; } height: auto; // to match input height
.left-border() !important;
button[class^="attachButton-"] { & > * {
padding: 8px; align-items: center; // center buttons
width: auto;
height: auto;
margin-right: 8px;
}
div[class^="textArea-"] {
&:not([class*="textAreaDisabled-"])
{ .right-border(); }
div > * { left: (@roundest / 2); }
}
div[class^="buttons-"] {
height: auto; // to match input height
& > * {
align-items: center; // center buttons
}
.left-border();
} }
} }
} }

16
src/ui.less
View File

@ -9,7 +9,7 @@ div[class^="slider-"] {
width: @rounder; width: @rounder;
height: @rounder; height: @rounder;
border: none; border: none;
border-radius: @half; .radius(@half);
top: @half * 1.5; top: @half * 1.5;
margin-top: unset; margin-top: unset;
margin-left: -@half; margin-left: -@half;
@ -19,19 +19,23 @@ div[class^="slider-"] {
// tabs // tabs
div[role="tab"], div[role="tab"],
div[class^="tabBarItem-"] { div.tabBarItem-30Te4- {
.top-border(16px); .top-border(16px) !important;
.bottom-border(); .bottom-border(4px) !important;
margin: 0; margin: 0;
margin-top: 8px; margin-top: 8px;
margin-right: 16px; margin-right: 16px;
padding: 4px 8px; padding: 4px 8px;
&:hover, &:hover,
&[class*="selected-"] { &.selected-g-kMVV {
background-color: var(--interactive-muted) !important; background-color: var(--interactive-muted) !important;
color: var(--text-normal) !important; color: var(--text-normal) !important;
} }
div.textBadge-1fdDPJ {
margin-left: 4px;
}
} }
// slider // slider
@ -46,7 +50,7 @@ div[class^="container-"] {
& > svg[class*="slider"] { & > svg[class*="slider"] {
width: 16px !important; width: 16px !important;
height: 16px !important; height: 16px !important;
border-radius: 50%; .radius(50%);
margin: 4px 8px; margin: 4px 8px;
margin-right: 0; margin-right: 0;
background-color: white; background-color: white;