diff --git a/PM-Theme.css b/PM-Theme.css index 297e367c..765a50dd 100644 --- a/PM-Theme.css +++ b/PM-Theme.css @@ -1,94 +1,68 @@ /** * @name PM-Theme * @author PM-Kirill - * @website https://corenodes.host + * @website https://pm-kirill.fun/ * @authorLink https://github.com/PM-Kirill * @authorId 1081189420780240917 - * @donate https://ko-fi.com/plusinsta - * @version 1.0.1 + * @version 1.1 * @invite ap6e7Q7c7R - * @description Лучшая тема Discord в ораньжевом акценте. Мой хостинг:https://corenodes.host + * @description Лучшая тема Discord в ораньжевом акценте. * @source https://github.com/PM-Kirill/PM-Theme.github.io - * @updateUrl https://plusinsta.github.io/discord-plus/DiscordPlus.theme.css + * @updateUrl https://github.com/PM-Kirill/PM-Theme.github.io/main/PM-Theme.css */ @import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); - -/* customize things here */ :root { - /* font, change to 'gg sans' for default discord font*/ --font: 'figtree'; - - /* top left corner text */ --corner-text: 'PM-Theme'; - - /* color of status indicators and window controls */ - --online-indicator: #23a55a; /* default green */ - --dnd-indicator: #f13f43; /* default red */ - --idle-indicator: #f0b232; /* default yellow */ - --streaming-indicator: #593695; /* default purple */ - - /* accent colors */ - --accent-1: hsl(25, 70%, 60%); /* links */ - --accent-2: hsl(25, 70%, 48%); /* general unread/mention elements */ - --accent-3: hsl(25, 70%, 42%); /* accent buttons */ - --accent-4: hsl(25, 70%, 36%); /* accent buttons when hovered */ - --accent-5: hsl(25, 70%, 30%); /* accent buttons when clicked */ - --mention: hsla(25, 80%, 52%, 0.1); /* mentions & mention messages */ + --online-indicator: #23a55a; + --dnd-indicator: #f13f43; + --idle-indicator: #f0b232; + --streaming-indicator: #593695; + --accent-1: hsl(25, 70%, 60%); + --accent-2: hsl(25, 70%, 48%); + --accent-3: hsl(25, 70%, 42%); + --accent-4: hsl(25, 70%, 36%); + --accent-5: hsl(25, 70%, 30%); + --mention: hsla(25, 80%, 52%, 0.1); --mention-hover: hsla(25, 80%, 52%, 0.05); - - /* text colors */ - --text-0: white; /* text on colored elements */ - --text-1: var(--text-2); /* other normally white text */ - --text-2: hsl(0, 0%, 70%); /* headings and important text */ - --text-3: hsl(0, 0%, 60%); /* normal text */ - --text-4: hsl(0, 0%, 50%); /* icon buttons and channels */ - --text-5: hsl(0, 0%, 40%); /* muted channels/chats and timestamps */ - - /* background and dark colors */ - --bg-1: hsl(25, 10%, 15%); /* dark buttons when clicked */ - --bg-2: hsl(25, 10%, 12%); /* dark buttons */ - --bg-3: hsl(25, 10%, 9%); /* spacing, secondary elements */ - --bg-4: hsl(25, 10%, 5%); /* main background color */ - --hover: hsla(25, 15%, 15%, 0.1); /* channels and buttons when hovered */ - --active: hsla(25, 15%, 15%, 0.2); /* channels and buttons when clicked or selected */ - --message-hover: hsla(25, 10%, 8%, 0.1); /* messages when hovered */ - - /* amount of spacing and padding */ + --text-0: white; + --text-1: var(--text-2); + --text-2: hsl(0, 0%, 70%); + --text-3: hsl(0, 0%, 60%); + --text-4: hsl(0, 0%, 50%); + --text-5: hsl(0, 0%, 40%); + --bg-1: hsl(25, 10%, 15%); + --bg-2: hsl(25, 10%, 12%); + --bg-3: hsl(25, 10%, 9%); + --bg-4: hsl(25, 10%, 5%); + --hover: hsla(25, 15%, 15%, 0.1); + --active: hsla(25, 15%, 15%, 0.2); + --message-hover: hsla(25, 10%, 8%, 0.1); --spacing: 12px; - - /* animations */ - /* ALL ANIMATIONS CAN BE DISABLED WITH REDUCED MOTION IN DISCORD SETTINGS */ - --list-item-transition: 0.2s ease; /* channels/members/settings hover transition */ - --unread-bar-transition: 0.2s ease; /* unread bar moving into view transition */ - --moon-spin-transition: 0.4s ease; /* moon icon spin */ - --icon-spin-transition: 1s ease; /* round icon button spin (settings, emoji, etc.) */ - - - --roundness-xl: 22px; - --roundness-l: 20px; - --roundness-m: 16px; - --roundness-s: 12px; - --roundness-xs: 10px; - --roundness-xxs: 8px; - --discord-icon: none; - --moon-icon: block; - --moon-icon-url: url('https://upload.wikimedia.org/wikipedia/commons/c/c4/Font_Awesome_5_solid_moon.svg'); + --list-item-transition: 0.2s ease; + --unread-bar-transition: 0.2s ease; + --moon-spin-transition: 0.4s ease; + --icon-spin-transition: 1s ease; + --roundness-xl: 22px; + --roundness-l: 20px; + --roundness-m: 16px; + --roundness-s: 12px; + --roundness-xs: 10px; + --roundness-xxs: 8px; + --discord-icon: none; + --moon-icon: block; + --moon-icon-url: url('https://upload.wikimedia.org/wikipedia/commons/c/c4/Font_Awesome_5_solid_moon.svg'); --moon-icon-size: auto; - - /* filter uncolorable elements to fit theme */ - /* (just set to none, they're too much work to configure) */ - --login-bg-filter: saturate(0.3) hue-rotate(-15deg) brightness(0.4); /* login background artwork */ - --green-to-accent-3-filter: hue-rotate(56deg) saturate(1.43); /* add friend page explore icon */ - --blurple-to-accent-3-filter: hue-rotate(304deg) saturate(0.84) brightness(1.2); /* add friend page school icon */ + --login-bg-filter: saturate(0.3) hue-rotate(-15deg) brightness(0.4); + --green-to-accent-3-filter: hue-rotate(56deg) saturate(1.43); + --blurple-to-accent-3-filter: hue-rotate(304deg) saturate(0.84) brightness(1.2); } -/* change fonts (edit the variables above, not this part) */ :root { --font-primary: var(--font), 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; --font-display: var(--font), 'Noto Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; } -/* reduced motion */ :root.reduce-motion { --list-item-transition: none; --unread-bar-transition: none; @@ -96,275 +70,320 @@ --icon-spin-transition: none; } -/* modify colors */ -#app-mount .container__7e23c /* channel list */, -.privateChannels__9b518 /* dms list */, -#app-mount .container_debb33 /* user panel inner */, -.members__573eb /* member list inner */, -.member_aa4760 /* member list members */, -.searchResultsWrap__2e184 /* search results */, -.searchHeader__4d70e /* search results header */, -.chat__52833.container_d4d35b /* message requests */, -#app-mount .panels__58331 > div /* user panel children */, -.container_e1958d /* vc panel */, -.sidebarRegionScroller__8113e /* settings left */, -#app-mount .container__03ec9 /* browse channels container */, -#app-mount .header__71942 /* browse channels header */, -#app-mount .container__6b2e5 /* browse channels inner */, -.chat__52833.background__2fff8 /* server guide body */, -#app-mount .scrollerContainer_dda72c /* channels and roles customize */, -.shop_b31ed2 /* shop */, -.wrapper__6bf2d.minimum__7f356 /* private call */, -.container_ec5ce2, .container__33507 /* emoji/sticker and gif picker searchbars */, -#app-mount .uploadModal__6eb75 /* upload modal */, -.uploadModal__6eb75 .footer_f06dbb /* upload modal footer */ { +#app-mount .container__7e23c, +.privateChannels__9b518, +#app-mount .container_debb33, +.members__573eb, +.member_aa4760, +.searchResultsWrap__2e184, +.searchHeader__4d70e, +.chat__52833.container_d4d35b, +#app-mount .panels__58331 > div, +.container_e1958d, +.sidebarRegionScroller__8113e, +#app-mount .container__03ec9, +#app-mount .header__71942, +#app-mount .container__6b2e5, +.chat__52833.background__2fff8, +#app-mount .scrollerContainer_dda72c, +.shop_b31ed2, +.wrapper__6bf2d.minimum__7f356, +.container_ec5ce2, .container__33507, +#app-mount .uploadModal__6eb75, +.uploadModal__6eb75 .footer_f06dbb { background: var(--bg-4); } -.mainCard__0ec2c /* forum post */, -.navRow_bb8efc[data-theme=dark] /* add new account bottom */ { + +.mainCard__0ec2c, +.navRow_bb8efc[data-theme=dark] { background: var(--bg-3); } -.folderIconWrapper__11165[style="background-color: rgba(88, 101, 242, 0.4);"] /* default color closed folders */ { + +.folderIconWrapper__11165[style="background-color: rgba(88, 101, 242, 0.4);"] { background: var(--bg-3) !important; } -.folder__17546.hover__043de /* folder opened on hover */, -#app-mount .outer_a41cf3.interactive__46c44:hover, #app-mount .outer_a41cf3.active__76f42 /* friend activity cards on hover */ { + +.folder__17546.hover__043de, +#app-mount .outer_a41cf3.interactive__46c44:hover, #app-mount .outer_a41cf3.active__76f42 { background: var(--bg-2); } -#app-mount .searchAnswer__2ccaf, /* search filter answer */ -#app-mount .searchFilter_dbda51 /* search filter */ { + +#app-mount .searchAnswer__2ccaf, +#app-mount .searchFilter_dbda51 { background: var(--bg-1); } -.newChannel__1bbcf /* new channel */ { + +.newChannel__1bbcf { background: var(--bg-1) !important; } -.chat__52833 /* chat + member list */, -.sidebar_e031be /* channel sidebar */, -.privateChannels__9b518 .scroller__89969 /* dms list inner */, -#app-mount .innerHeader_ccbd77:after /* channels and roles header shadow */, -.attachedBars_c1606a /* reply bar underneath */ { + +.chat__52833, +.sidebar_e031be, +.privateChannels__9b518 .scroller__89969, +#app-mount .innerHeader_ccbd77:after, +.attachedBars_c1606a { background: none; } -.selected__987e6 .header__77c95, .clickable__1383f .header__77c95:hover /* server name hover */ { + +.selected__987e6 .header__77c95, .clickable__1383f .header__77c95:hover { background: var(--message-hover); } -.message_ccca67.replying__38514.selected_e3bc5d, .mouse-mode.full-motion .message_ccca67.replying__38514:hover /* fix reply message hover */ { + +.message_ccca67.replying__38514.selected_e3bc5d, .mouse-mode.full-motion .message_ccca67.replying__38514:hover { background: var(--background-message-highlight-hover); } -div.message_ccca67.replying__38514::before /* change reply message bar to neutral */ { + +div.message_ccca67.replying__38514::before { background: var(--text-2); } -.activeButtonChild__58171 /* send button */ { + +.activeButtonChild__58171 { color: var(--accent-2); } -.container_debb33 /* user panel button strikethroughs */, -.numberBadge__40d6f /* unread number badge */, -.toolbar__62fb5 /* toolbar button strikethroughs */ { + +.container_debb33, +.numberBadge__40d6f, +.toolbar__62fb5 { --status-danger: var(--accent-2); } -.expandedFolderIconWrapper__324c1 > svg[style="color: rgb(88, 101, 242);"] /* default color folder icons */ { + +.expandedFolderIconWrapper__324c1 > svg[style="color: rgb(88, 101, 242);"] { color: var(--accent-3) !important; } -.divider__855e3 /* unread divider */, -.mention_dd733a /* NEW unread pill */, -.mentionsBar__7d867 /* channel list new mention pill */ { + +.divider__855e3, +.mention_dd733a, +.mentionsBar__7d867 { --status-danger: var(--accent-3); } -.message_ccca67.mentioned_fa6fd2:before /* mention message left edge */, -.botTagOP_fd6360 /* OP tag */ { + +.message_ccca67.mentioned_fa6fd2:before, +.botTagOP_fd6360 { background: var(--accent-3); } -.container__2ed72.checked__36fdc /* settings checkbuttons */ { + +.container__2ed72.checked__36fdc { background: var(--accent-3) !important; } -.mention_dd733a:active /* NEW unread pill when clicked */ { + +.mention_dd733a:active { background: var(--accent-4); } + path[fill='rgba(35, 165, 90, 1)'] { fill: var(--accent-3); } + path[fill='var(--white-500)'] { fill: var(--text-0) !important; } -.numberBadge__40d6f /* dms number badge */, -.newMessagesBar__8b272 .barButtonBase__5e4cf /* unread bar */, -.botTagRegular_fc4b4a /* bot tag */, -.endCap__95d53 /* unread divider */, -.lookFilled__950dd.colorBrand__27d57 /* accent buttons */, -.lookFilled__950dd.colorBrand__27d57 .defaultColor__77578 /* accent buttons */, -.lookFilled__950dd.colorBrandNew__8872c /* accent buttons */, -.lookFilled__950dd.colorGreen__75c93 /* green buttons */, -.lookFilled__950dd.colorRed__5a617 /* red buttons */, -.lookFilled__950dd.colorYellow__818c3 /* yellow buttons */, -.bar_edc096 /* NEW unread pill */, -.wrapper__8436d:hover .childWrapper_a6ce15, /* default server icon text */ -.wrapper__8436d.selected_ae80f7 .childWrapper_a6ce15 /* default server icon text */, -.colorDefault_e361cf.focused_dcafb9 /* menu option hover */, -.colorDefault_e361cf.focused_dcafb9 .caret_ce50ce /* popup menu hover caret */, -.colorDefault_e361cf:active:not(.hideInteraction__0b569) /* menu option active */, -.colorDefault_e361cf:active:not(.hideInteraction__0b569) .caret_ce50ce /* menu option active */, -.tabBar__73938 .addFriend__4c0a2.addFriend__4c0a2.addFriend__4c0a2 /* add friend button */, -#app-mount .button__33db6 /* notice banner button */, -.interactive:hover /* mention hover */, -.uploadIcon_d35ec2 /* profile upload image */, -.focused_a7ad64 .userMenuUsername_d2fe10 .userMenuText_b1842d /* account switcher account hover */, -.dots_a97068 /* typing dots */, -.lookOutlined__014b5.colorWhite__0033e /* server banner buttons */, -.header__8f369 /* server preview mode banner */, + +.numberBadge__40d6f, +.newMessagesBar__8b272 .barButtonBase__5e4cf, +.botTagRegular_fc4b4a, +.endCap__95d53, +.lookFilled__950dd.colorBrand__27d57, +.lookFilled__950dd.colorBrand__27d57 .defaultColor__77578, +.lookFilled__950dd.colorBrandNew__8872c, +.lookFilled__950dd.colorGreen__75c93, +.lookFilled__950dd.colorRed__5a617, +.lookFilled__950dd.colorYellow__818c3, +.bar_edc096, +.wrapper__8436d:hover .childWrapper_a6ce15, +.wrapper__8436d.selected_ae80f7 .childWrapper_a6ce15, +.colorDefault_e361cf.focused_dcafb9, +.colorDefault_e361cf.focused_dcafb9 .caret_ce50ce, +.colorDefault_e361cf:active:not(.hideInteraction__0b569), +.colorDefault_e361cf:active:not(.hideInteraction__0b569) .caret_ce50ce, +.tabBar__73938 .addFriend__4c0a2.addFriend__4c0a2.addFriend__4c0a2, +#app-mount .button__33db6, +.interactive:hover, +.uploadIcon_d35ec2, +.focused_a7ad64 .userMenuUsername_d2fe10 .userMenuText_b1842d, +.dots_a97068, +.lookOutlined__014b5.colorWhite__0033e, +.header__8f369, .categoryItem__0608f.selectedCategoryItem__3e361, -.live_b195a5 /* streaming live */, -#app-mount .activeButton__70b70 /* member page pagination button */ , -#app-mount .tooltipBrand__68214 /* member page filter tooltip */, -.button_b82d53.buttonColor__7bad9.buttonActive_ae686f /* active voice channel icons */, -.button_b82d53.buttonColor__7bad9.buttonActive_ae686f:hover /* active voice channel icons */, -.vcd-screen-picker-radio[data-checked="true"] .defaultColor__30336 /* vencord stream resolution picker buttons when active */, -.icon__493c1 /* streaming activity type icon */ { +.live_b195a5, +#app-mount .activeButton__70b70, +#app-mount .tooltipBrand__68214, +.button_b82d53.buttonColor__7bad9.buttonActive_ae686f, +.button_b82d53.buttonColor__7bad9.buttonActive_ae686f:hover, +.vcd-screen-picker-radio[data-checked="true"] .defaultColor__30336, +.icon__493c1 { color: var(--text-0); } -#app-mount .button__33db6, .theme-light .button__33db6 /* notice banner button */, -.lookOutlined__014b5.colorWhite__0033e /* server banner buttons */ { + +#app-mount .button__33db6, .theme-light .button__33db6 { border-color: var(--text-0); } + #app-mount .button__33db6:hover { border-color: var(--text-0); background-color: var(--text-0); } -.container__2ed72 /* settings checkbutton background */ { + +.container__2ed72 { background: var(--bg-1) !important; } -.container__2ed72.checked__36fdc > .slider__41d94 > rect /* settings checkbutton circle */, -.userMenuItem__7b29e path[fill="var(--white-500)"] /* account switcher account hover */, + +.container__2ed72.checked__36fdc > .slider__41d94 > rect, +.userMenuItem__7b29e path[fill="var(--white-500)"], .colorDefault_e361cf.focused_dcafb9 path { fill: var(--text-0); } -.closeIcon__967e7 path /* alert banner close icon */ { + +.closeIcon__967e7 path { fill: currentColor; } -.container__2ed72 > .slider__41d94 > rect /* settings checkbutton circle */ { + +.container__2ed72 > .slider__41d94 > rect { fill: var(--text-1); } -.menu__13d0c .menuItemFocused__7beab /* account switch button hover */ { + +.menu__13d0c .menuItemFocused__7beab { color: var(--text-3); } -.menu__13d0c .menuItemFocused__7beab path /* account switch button hover */ { + +.menu__13d0c .menuItemFocused__7beab path { fill: var(--text-3); } -.mini_d6d84c .grabber_e3daf3 /* spotify bar handle */ { + +.mini_d6d84c .grabber_e3daf3 { margin-top: 4px; border-width: 1px; } -.grabber_e3daf3 /* settings slider handle */ { + +.grabber_e3daf3 { border-width: 0; } -.button_b82d53.buttonColor__7bad9 /* fix vc buttons */ { + +.button_b82d53.buttonColor__7bad9 { color: var(--text-4); } -.button_b82d53.buttonColor__7bad9:hover /* fix vc buttons hover */ { + +.button_b82d53.buttonColor__7bad9:hover { background-color: var(--hover); color: var(--text-3); } -.iconBadge__19638.isCurrentUserConnected__3bd70 /* change server vc badge to neutral */ { + +.iconBadge__19638.isCurrentUserConnected__3bd70 { background-color: var(--bg-1); color: var(--text-1); } -.bannerVisible_ef30fe .headerContent__6fcc7 /* server name over banner image */, -#app-mount .categoryText__1b8ff /* gif chooser category names */, + +.bannerVisible_ef30fe .headerContent__6fcc7, +#app-mount .categoryText__1b8ff, .searchTitle__533c3 { color: white; } -.gifIcon__4c50e /* profile upload image gif chooser */ { + +.gifIcon__4c50e { background-color: white; } -.controlIcon__73723 /* fix video maximize button */ { + +.controlIcon__73723 { color: var(--text-1); opacity: 0.6; } -.controlIcon__73723:hover /* fix video maximize button hover */ { + +.controlIcon__73723:hover { opacity: 1; } + ::selection { background: var(--accent-4); color: var(--text-0); } + .lookFilled__9c1ef.select_fe2671 { border: none; } -.checkbox_fcf2ad /* channel checkboxes */ { + +.checkbox_fcf2ad { border-color: var(--text-4) !important; } -.newBadge__40645 /* fix forum new badge */ { + +.newBadge__40645 { color: var(--accent-2); line-height: 16px; } -/* remove shadows */ -#app-mount .header_aac16f /* gif picker */ { +#app-mount .header_aac16f { box-shadow: none; } -#app-mount .textContentFooter_e03480 /* forum post image fade */ { + +#app-mount .textContentFooter_e03480 { background: none; } -/* change online indicator color */ rect[fill='#23a55a'], svg[fill='#23a55a'] { fill: var(--online-indicator) !important; } + .status__1c26d[style='background-color: rgb(35, 165, 90);'] { background-color: var(--online-indicator) !important; } + rect[fill='#f0b232'], svg[fill='#f0b232'] { fill: var(--idle-indicator); } + .status__1c26d[style='background-color: rgb(240, 178, 50);'] { background-color: var(--idle-indicator) !important; } + rect[fill='#f23f43'], svg[fill='#f23f43'] { fill: var(--dnd-indicator); } + .status__1c26d[style='background-color: rgb(242, 63, 67);'] { background-color: var(--dnd-indicator) !important; } + rect[fill='#593695'], svg[fill='#593695'] { fill: var(--streaming-indicator); } + .status__1c26d[style='background-color: rgb(89, 54, 149);'] { background-color: var(--streaming-indicator) !important; } -/* color fix filters */ -.container__048f4:last-child .icon_e26761 /* explore discoverable servers icon color */ { +.container__048f4:last-child .icon_e26761 { background-color: #3ba55c; filter: var(--green-to-accent-3-filter); } -.container__048f4:first-child .icon_e26761 /* explore discoverable servers icon color */ { + +.container__048f4:first-child .icon_e26761 { filter: var(--blurple-to-accent-3-filter); } -.artwork__94141 /* filter login image */ { + +.artwork__94141 { filter: var(--login-bg-filter); } -/* fix weird message bar padding */ .clipContainer_ab9cf6 { padding-top: 0; margin-top: 0; } -/* separate header bar */ -.title_d4ba1a.themed_b152d4 /* remove bg */ { +.title_d4ba1a.themed_b152d4 { background: none; } -.searchResultsWrap__2e184 /* allow overflow */ { + +.searchResultsWrap__2e184 { overflow: visible; } -.chatContent_f087cb::before /* main chat */, -.membersWrap__5ca6b::before /* member list */, -.searchResultsWrap__2e184::before /* search results */, -.profilePanel_e2cafe::before /* dm profile */, -.container_b92032::before /* forums */ { + +.chatContent_f087cb::before, +.membersWrap__5ca6b::before, +.searchResultsWrap__2e184::before, +.profilePanel_e2cafe::before, +.container_b92032::before { content: ''; position: absolute; margin-top: -48px; @@ -373,207 +392,232 @@ svg[fill='#593695'] { height: 48px; border-radius: var(--roundness-xl) var(--roundness-xl) 0 0; } -.wrapper__6bf2d.minimum__7f356 ~ .content__01e65 .container__93316::before /* remove when in private call */ { + +.wrapper__6bf2d.minimum__7f356 ~ .content__01e65 .container__93316::before { display: none; } -.membersWrap__5ca6b /* fix members list height when not scroll */ { + +.membersWrap__5ca6b { height: 100%; } -/* rearrange toolbar */ -a[href="https://support.discord.com"] /* hide help */ -{ +a[href="https://support.discord.com"] { display: none; } + .search__07df0 { order: 1; margin: 0 4px 0 12px; } + .chat__52833:has(.searchResultsWrap__2e184) .searchBar__5a20a { width: 394px !important; margin-left: calc(var(--spacing) + 8px); } + .chat__52833:has(.profilePanel_e2cafe) .searchBar__5a20a { width: 316px !important; margin-left: calc(var(--spacing) + 8px); } + .chat__52833:has(.membersWrap__5ca6b) .searchBar__5a20a { width: 216px !important; margin-left: calc(var(--spacing) + 8px); } -/* add spacing */ -.base_c0676e /* outside edges */ { +.base_c0676e { margin: 0 var(--spacing) var(--spacing) 0; } -.sidebar_e031be /* channel list and user panel */, -.content__01e65 /* between chat and member list */ { + +.sidebar_e031be, +.content__01e65 { gap: var(--spacing); } -.sidebar_e031be /* channel list and chat */ { + +.sidebar_e031be { margin-right: var(--spacing); } + .sidebar_e031be.hidden__3ab58 { margin-right: 0; } -.resizeHandle_cc9d34 /* pretend to be a margin */ { + +.resizeHandle_cc9d34 { width: var(--spacing); } -.wrapper__6bf2d.fullScreen_b3f0af .callContainer__1477d /* fullscreen vc */ { + +.wrapper__6bf2d.fullScreen_b3f0af .callContainer__1477d { margin-top: var(--spacing); } -.notice__5fd4c /* banner notice */, -.wrapper__6bf2d.minimum__7f356 /* private call */ { + +.notice__5fd4c, +.wrapper__6bf2d.minimum__7f356 { margin-bottom: var(--spacing); } -/* fix padding */ -#vc-spotify-player /* vencord spotify */, -.container_e1958d /* vc panel */, -.panel_bd8c76 /* stream panel */ { + +#vc-spotify-player, +.container_e1958d, +.panel_bd8c76 { padding: 10px; } -/* add rounded corners */ -.container__7e23c /* channel list */, -.panels__58331 /* user panels */, -.privateChannels__9b518 /* dms list */, -.container_bd15da /* friends page */, -.applicationStore__444b9 /* nitro page */, -#app-mount .container_d4d35b /* message requests */, -.shop_b31ed2 /* discord shop */, -.container_ec90d4 /* family center */, -.container__694a1 /* message request */, -#app-mount .callContainer__1477d /* vc */, -.chat__52833 /* general chat container (for browse channels page */, -.animatedContainer__0e828 /* server image card */, -.notice__5fd4c /* banner notice */, -.wrapper__6bf2d.minimum__7f356, /* private call */ -.wrapper__6bf2d.minimum__7f356 ~ .content__01e65 /* chat under private call */, -.main_e0b3ac /* server onboarding */ { +.container__7e23c, +.panels__58331, +.privateChannels__9b518, +.container_bd15da, +.applicationStore__444b9, +#app-mount .container_d4d35b, +.shop_b31ed2, +.container_ec90d4, +.container__694a1, +#app-mount .callContainer__1477d, +.chat__52833, +.animatedContainer__0e828, +.notice__5fd4c, +.wrapper__6bf2d.minimum__7f356, +.wrapper__6bf2d.minimum__7f356 ~ .content__01e65, +.main_e0b3ac { border-radius: var(--roundness-xl); overflow: hidden; } -.container__93316 /* main chat */, -.chatContent_f087cb /* main chat inner */, -.container_f79ab4 /* members list */, -.members__573eb /* members list inner */, -.searchResultsWrap__2e184 /* search results */, -.profilePanel_e2cafe /* profile panel outer */, -.userPanelOuter_eb00b1 /* profile panel inner */, -.userPanelInner_f9edb8 /* profile panel inner inner */, -.userPanelInner_f9edb8::before /* profile panel inner inner filter */, -.container_b92032 /* forums */ { + +.container__93316, +.chatContent_f087cb, +.container_f79ab4, +.members__573eb, +.searchResultsWrap__2e184, +.profilePanel_e2cafe, +.userPanelOuter_eb00b1, +.userPanelInner_f9edb8, +.userPanelInner_f9edb8::before, +.container_b92032 { border-radius: 0 0 var(--roundness-xl) var(--roundness-xl); } -/* more rounded corners */ -.messagesPopoutWrap__10dd1 /* inbox, pinned messages popout */, -.container_f93da8 /* thread popout */, -.menu__088f7 .item__183e8d /* server option popout */, -.userPopoutOuter__3884e /* user profile popout */, -.root_ba16f0 /* user profile modal */, -.contentWrapper_e0bb2c /* emoji, sticker, gif pickers */, -.footer_e0b400 /* edit modal footer */, -.layerContainer_a2fcaa .root_a28985 /* upload modal */, -.uploadModal__6eb75 .footer_f06dbb /* upload modal footer */ { +.messagesPopoutWrap__10dd1, +.container_f93da8, +.menu__088f7 .item__183e8d, +.userPopoutOuter__3884e, +.root_ba16f0, +.contentWrapper_e0bb2c, +.footer_e0b400, +.layerContainer_a2fcaa .root_a28985, +.uploadModal__6eb75 .footer_f06dbb { border-radius: var(--roundness-l); } -.roundedBanner__16aa6 /* user profile popout top */, -.banner_b7f1fb /* user profile top when edit */ { + +.roundedBanner__16aa6, +.banner_b7f1fb { border-radius: calc(var(--roundness-l) - 4px) calc(var(--roundness-l) - 4px) 0 0; } -.userPopoutInner_e90432:before /* user profile popout bottom */, -.userProfileModalInner__99b1e:before /* user profile modal bottom */ { + +.userPopoutInner_e90432:before, +.userProfileModalInner__99b1e:before { border-radius: calc(var(--roundness-l) - 4px); } -.overlayBackground__2666e /* user profile inner */ { + +.overlayBackground__2666e { border-radius: var(--roundness-s); } -.menu__088f7 /* general popouts */, -.embed_cc6dae /* embeds */, -.mediaAttachmentsContainer__242e2 /* image container */, -.oneByOneGridSingle__8c6ef /* image container single */, -.imageContainer__1b5e9 .imageWrapper__178ee /* gif wrapper */, -.markup_a7e664 code /* code block */, -.itemCard_b64118 /* friend activity */, -.peopleListItem_dab480:hover /* online list friends */, -.withTagAsButton_e22174:hover, .withTagless__058f8:hover /* user panel username */, -.messageGroupWrapper__1fce2 /* pinned messages */ { + +.menu__088f7, +.embed_cc6dae, +.mediaAttachmentsContainer__242e2, +.oneByOneGridSingle__8c6ef, +.imageContainer__1b5e9 .imageWrapper__178ee, +.markup_a7e664 code, +.itemCard_b64118, +.peopleListItem_dab480:hover, +.withTagAsButton_e22174:hover, .withTagless__058f8:hover, +.messageGroupWrapper__1fce2 { border-radius: var(--roundness-m); } -.scrollableContainer_ff917f /* message bar */, -.channelTextArea_c2094b /* message bar underneath */, -.select_fe2671 /* bot dropdown select */, -.layout_bb8e67 /* members */, -.interactive__0786a /* dms */, -.container__17159 /* thread link */, -.input_f27786 /* settings inputs */, -.item_b7fb7e /* settings radiobutton bars */, -.item_b7fb7e .radioBar__70669 /* settings radiobutton bars */ { + +.scrollableContainer_ff917f, +.channelTextArea_c2094b, +.select_fe2671, +.layout_bb8e67, +.interactive__0786a, +.container__17159, +.input_f27786, +.item_b7fb7e, +.item_b7fb7e .radioBar__70669 { border-radius: var(--roundness-s); } -.select_fe2671.open_cd27aa /* vencord plugin show all */ { + +.select_fe2671.open_cd27aa { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } -.popout_a6e77f /* vencord plugin show all */ { + +.popout_a6e77f { border-radius: 0 0 var(--roundness-s) var(--roundness-s); } -.banner_f13f1e /* community server tutorial thing on message bar */ { + +.banner_f13f1e { border-radius: var(--roundness-s) var(--roundness-s) 0 0; } -.scrollableContainer_ff917f.hasConnectedBar__7d21e /* fix message bar with reply bar */ { + +.scrollableContainer_ff917f.hasConnectedBar__7d21e { border-top-left-radius: 0; border-top-right-radius: 0; } + .replyBar_ed6afc { - border-radius: var(--roundness-s) var(--roundness-s) 0 0; + border-radius: var(--roundness-s) var (--roundness-s) 0 0; } -.link_ddbb36 /* channels */, -.content__3b07e /* member connected to vc */, -.side_b4b3f6 .item__48dda /* settings tabs */, -button.button__581d0 /* small buttons */, -.container__33507 /* friend searchbar */, -.container_ec5ce2, /* sticker/emoji picker searchbar */ -.item__183e8 /* general popout buttons */, -.icon__493c1 /* streaming icon */, + +.link_ddbb36, +.content__3b07e, +.side_b4b3f6 .item__48dda, +button.button__581d0, +.container__33507, +.container_ec5ce2, +.item__183e8, +.icon__493c1, #vc-spotify-album-image, -.background__3b760 /* settings nitro tab selected */, -.hoverButtonGroup__304b2 /* video download button */, -.wrapper__4e6b6 /* message hover menu */, +.background__3b760, +.hoverButtonGroup__304b2, +.wrapper__4e6b6, .previewChannelRowContent__9054b { border-radius: var(--roundness-xs); } -.hoverButtonGroup__304b2 /* reposition video download button */ { + +.hoverButtonGroup__304b2 { top: 6px; right: 6px; } -.wrapper__53064 /* mentions */, -.searchBar__5a20a /* search bar */, -.searchBar__621ec .searchBarComponent__8f95f /* find conversation search bar */, -.topPill__63ad4 .item__48dda /* friend online/categories */ { + +.wrapper__53064, +.searchBar__5a20a, +.searchBar__621ec .searchBarComponent__8f95f, +.topPill__63ad4 .item__48dda { border-radius: var(--roundness-xxs); } -#app-mount .centerButton__8316e /* fix vc buttons */ { + +#app-mount .centerButton__8316e { border-radius: 50%; } -/* separate guilds panel background */ .guilds__2b93a { background: var(--bg-4); border-radius: var(--roundness-xl); margin: 0 0 var(--spacing) var(--spacing); } + .guilds__2b93a.hidden__7c832 { margin: 0; } + #app-mount .scroller_de945b { padding: 12px 0; } + .base_c0676e { margin-left: var(--spacing); } -.guilds__2b93a::after /* add bottom scroll shadow */, + +.guilds__2b93a::after , .membersWrap__5ca6b::after { content: ''; position: absolute; @@ -585,7 +629,7 @@ button.button__581d0 /* small buttons */, pointer-events: none; border-radius: 0 0 var(--roundness-xl) var(--roundness-xl); } -.guilds__2b93a::before /* add top scroll shadow */ { +.guilds__2b93a::before { content: ''; position: absolute; background: linear-gradient(var(--bg-4) 0%, transparent 15%); @@ -605,29 +649,22 @@ button.button__581d0 /* small buttons */, .container_d1f8f5 > [style$='display: flex;'] { margin: 0 0 var(--spacing) var(--spacing); } -/* UNCOMMENT IF YOU REMOVE THE ABOVE SECTION "separate guilds panel background" -.expandedFolderBackground_b1385f, -.folder__17546, -.folderIconWrapper__11165 { - background-color: var(--bg-4) !important; -} */ -/* extra top margin for macos and custom clients */ .container_d1f8f5 { margin-top: var(--spacing); } .platform-win .container_d1f8f5 { margin-top: 0; } -/* UNCOMMENT if you want to make panels evenly sized on macos + .platform-osx .wrapper__216eb { margin-top: 0; } .platform-osx .container_d1f8f5 { margin-top: 32px; -} */ +} + -/* top corner title */ [class^='wordmarkWindows'] { padding: 4px var(--spacing); } @@ -648,12 +685,10 @@ button.button__581d0 /* small buttons */, margin-left: 6px; } -/* top bar height */ [class^='typeWindows'] { height: calc(var(--spacing) + 8px); } -/* window controls */ [class^='winButton'] > svg { display: none; } @@ -689,7 +724,6 @@ button.button__581d0 /* small buttons */, background-color: var(--idle-indicator) !important; } -/* custom dm button moon icon */ .childWrapper_a6ce15 > svg:not(.favoriteIcon__901fa) { display: var(--discord-icon); } @@ -724,14 +758,6 @@ button.button__581d0 /* small buttons */, background: var(--bg-3); border-radius: 50%; } -/* custom dm button background instead of icon */ -/* .childWrapper_a6ce15:has(> svg:not(.favoriteIcon__901fa)) { - background: url('https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/logos/exports/1544x1544_circle.png'); - background-color: transparent !important; - background-size: cover; -} */ - -/* improve unread divider */ .divider__855e3 { border-width: 4px; border-radius: 4px; @@ -743,13 +769,11 @@ button.button__581d0 /* small buttons */, margin-top: -1px; padding-top: 2px; } -/* improve highlight message left edge */ .message_ccca67.mentioned_fa6fd2::before, .replying__38514::before { width: 4px; border-radius: 4px; } -/* modify embeds */ .embedFull__14919 { border: 4px solid var(--bg-2); border-top-color: transparent !important; @@ -757,15 +781,13 @@ button.button__581d0 /* small buttons */, border-right-color: transparent !important; } -/* horizontal server list fix */ #app-mount .app_b1f720 .base_c0676e { top: calc(var(--server-container) + var(--spacing)) !important; } -/* list hover animations */ -.wrapper__612a5 .link_ddbb36 /* channels */, -.container_a48b21 /* members */, -.channel__0aef5 /* dms */, +.wrapper__612a5 .link_ddbb36 , +.container_a48b21 , +.channel__0aef5 , .side_b4b3f6 .item__48dda /* settings */ { transition: margin-left var(--list-item-transition); } @@ -778,15 +800,15 @@ button.button__581d0 /* small buttons */, margin-left: 18px; } -/* spin hover animations */ -button.button_ae40a4 /* make user panel buttons round */ { + +button.button_ae40a4 { border-radius: 50%; } -.button_ae40a4:last-child .contents__322f4 /* settings button */, -.attachButton__56f98 .attachButtonInner__84c26 /* upload button */, -.emojiButton_b63c38 .contents__322f4 /* emoji button */, -.closeButton__8177f /* settings exit button */, -.contents__322f4 > .closeIcon__16020 /* modal close */ { +.button_ae40a4:last-child .contents__322f4 , +.attachButton__56f98 .attachButtonInner__84c26 , +.emojiButton_b63c38 .contents__322f4 , +.closeButton__8177f , +.contents__322f4 > .closeIcon__16020 { transition: transform var(--icon-spin-transition); } .button_ae40a4:last-child:hover .contents__322f4, @@ -797,7 +819,6 @@ button.button_ae40a4 /* make user panel buttons round */ { transform: rotate(360deg); } -/* hide unread bar on hover */ .messagesWrapper_add28b { overflow: hidden; } @@ -837,6 +858,7 @@ button.button_ae40a4 /* make user panel buttons round */ { .bottom__53f5a > .containerPadding_ca1052:hover { margin-bottom: -12px; } +@import url('https://raw.githubusercontent.com/PM-KIRILL/PM-Theme.github.io/main/css/anim.css'); .theme-light { --text-link: var(--accent-5); @@ -1133,7 +1155,7 @@ html.theme-light, --search-popout-option-fade: none; --search-popout-option-fade-hover: none; - --brand-260: var(--bg-1); /* new badge */ + --brand-260: var(--bg-1); --brand-430: var(--accent-3); --brand-500: var(--accent-3); --brand-530: var(--accent-4); @@ -1146,13 +1168,13 @@ html.theme-light, --green-500: var(--accent-4); --green-530: var(--accent-5); - --brand-experiment-15a: var(--mention); /* background of reacted reactions */ - --brand-360: var(--accent-2); /* invite text */ + --brand-experiment-15a: var(--mention); + --brand-360: var(--accent-2); - --primary-500: var(--bg-2); /* progress bars */ - --primary-600: var(--bg-3); /* delete message preview */ - --primary-630: var(--bg-3); /* billing transaction history */ - --primary-660: var(--bg-3); /* search popout "enter" bar */ + --primary-500: var(--bg-2); + --primary-600: var(--bg-3); + --primary-630: var(--bg-3); + --primary-660: var(--bg-3); --white-500: var(--text-1); } @@ -1160,4 +1182,4 @@ html.theme-light, * { scrollbar-color: unset !important; scrollbar-width: unset !important; -} \ No newline at end of file +}