From 5dbb2b024fad3c82778e93b9df986554fa6b655e Mon Sep 17 00:00:00 2001 From: Valerie Date: Wed, 23 Apr 2025 11:34:37 -0400 Subject: [PATCH] Updating CSS --- presets/css/VisualRefreshUpgrade/vru.css | 288 +++++++++++++++++------ 1 file changed, 214 insertions(+), 74 deletions(-) diff --git a/presets/css/VisualRefreshUpgrade/vru.css b/presets/css/VisualRefreshUpgrade/vru.css index 04f592f..e3f99dd 100644 --- a/presets/css/VisualRefreshUpgrade/vru.css +++ b/presets/css/VisualRefreshUpgrade/vru.css @@ -4,9 +4,9 @@ /* @import url(https://git.mysty.one/valerie/valcord-css/raw/branch/main/presets/css/VisualRefreshUpgrade/vru.css); */ /* @import url("https://raw.githubusercontent.com/surgedevs/visual-refresh-compact-title-bar/refs/heads/main/desktop.css"); */ /* @import url(https://git.mysty.one/valerie/valcord-css/raw/branch/main/snippets/css/KillAllRoundCorners/karc.css); */ +/* @import url(https://git.mysty.one/valerie/valcord-css/raw/branch/main/snippets/css/SmolProfile/sp.css); */ @import url(https://git.mysty.one/valerie/valcord-css/raw/branch/main/snippets/css/BetterSpotifyPlayer/bsp.css); @import url(https://git.mysty.one/valerie/valcord-css/raw/branch/main/snippets/css/CompactChannelList/ccl.css); -@import url(https://git.mysty.one/valerie/valcord-css/raw/branch/main/snippets/css/SmolProfile/sp.css); @import url(https://scattagain.github.io/VencordStuff/css/GuildbarRevert.css); :root { @@ -20,16 +20,42 @@ --custom-channel-textarea-text-area-height: 56px; } +/* Layout and Structure */ a .visual-refresh [class^="layer_"] > form > [class^="focusLock__"] { position: relative; max-height: calc(100vh - var(--space-24) * 3); top: calc(var(--space-24) / 2); } -.container__8061a > div:not(:has(.vc-platform-indicator)) { - display: none !important; +.container__8061a { + > div:not(:has(.vc-platform-indicator)) { + display: none !important; + } + + /* BiteSize profile modifications */ + .biteSize_c0bea0 & { + position: absolute; + top: -60px; + right: 12px; + max-width: 90px; + width: 24px; + flex-direction: row-reverse; + height: 22px; + overflow: hidden; + transition: height 1s; + background-color: rgba(0, 0, 0, 0.25); + border-radius: 8px; + z-index: 10; + backdrop-filter: blur(5px); + + &:hover { + height: auto; + width: auto; + } + } } +/* Visual Refresh Components */ .visual-refresh { .form_f75fb0 { display: flex; @@ -51,6 +77,7 @@ a .visual-refresh [class^="layer_"] > form > [class^="focusLock__"] { } } +/* Title Bars and Headers */ .bar_c38106 { z-index: 28371983721897; } @@ -69,6 +96,23 @@ a .visual-refresh [class^="layer_"] > form > [class^="focusLock__"] { -webkit-app-region: drag; } +.title_f75fb0 { + padding: 0 0 0 12px !important; + position: fixed; + left: 0; + top: 0; + background: transparent !important; + height: var(--custom-app-top-bar-height) !important; + min-height: 0; + border: none !important; + width: calc(100vw); + + .base_c48ade:has(.bar_c38106[data-windows="true"]) & { + width: calc(100vw - 240px) !important; + } +} + +/* Sidebar and Navigation */ .sidebar_c48ade { overflow: visible !important; position: relative; @@ -82,6 +126,10 @@ a .visual-refresh [class^="layer_"] > form > [class^="focusLock__"] { margin-left: 72px; } +nav.guilds_c48ade { + margin-bottom: 0 !important; +} + .wrapper_ef3116 { position: absolute; top: -35px; @@ -93,6 +141,7 @@ a .visual-refresh [class^="layer_"] > form > [class^="focusLock__"] { padding-top: 40px !important; } +/* Profile Elements */ /* Remove Profile Reactions */ [class*="statusPopover"], [class*="avatarPopover__"], @@ -100,33 +149,52 @@ a .visual-refresh [class^="layer_"] > form > [class^="focusLock__"] { display: none; } -.title_f75fb0 { - padding: 0px !important; - /* scale: 0.9; */ - padding-left: 12px !important; - position: fixed; - left: 0px; - top: 0px; - background: transparent !important; - height: var(--custom-app-top-bar-height) !important; - min-height: 0px; - border: none !important; - width: calc(100vw); +[class*="closedFolderIconWrapper_"] > [class*="guildIcon_"], +[data-list-item-id*="guildsnav_"] > [class*="icon_"], +.icon_f34534.guildIcon__48112 { + border-radius: 50% !important; } -.base_c48ade:has(.bar_c38106[data-windows="true"]) .title_f75fb0 { - width: calc(100vw - 240px) !important; +[class*="membersGroup"]:has([role="button"]), +[class*="member"] [class*="container"]:has([class*="badges"]), +.guildIcon__48112, +[class*="plated"] [style^="background: linear-gradient("] { + display: none; } -.followButton_f75fb0, -.topicClickTarget__6ec1a { - -webkit-app-region: no-drag !important; +.icon_c9d15c path { + fill: #e0115f; } -.topic__6ec1a { - flex: none; +/* Badges and Chips */ +.clanTagChiplet_c19a55, +.chipletContainerInner__4a25c { + display: none; } +.badgeLabel__635ed { + display: none !important; +} + +.badgeContainer__635ed:has( + .badgeLabel__635ed[data-text-variant="text-xs/normal"] + ) + > svg[aria-hidden="true"][width="12"][height="12"][viewBox="0 0 24 24"] { + display: none !important; +} + +/* +.connectedAccountIcon_e6abe8 { + display: none !important; +} + +.flowerStarContainer__3e3b0, +connectedAccountVerifiedIcon_e6abe8 {a + display: none !important; +} +*/ + +/* Code Blocks */ .codeContainer__75297 > code { max-height: var(--codeblock-height); overflow-y: scroll; @@ -165,54 +233,7 @@ a .visual-refresh [class^="layer_"] > form > [class^="focusLock__"] { } } -.clanTagChiplet_c19a55, -.chipletContainerInner__4a25c { - display: none; -} - -.badgeLabel__635ed { - display: none !important; -} - -.badgeContainer__635ed:has( - .badgeLabel__635ed[data-text-variant="text-xs/normal"] - ) - > svg[aria-hidden="true"][width="12"][height="12"][viewBox="0 0 24 24"] { - display: none !important; -} - -/* -.connectedAccountIcon_e6abe8 { - display: none !important; -} - -.flowerStarContainer__3e3b0, -connectedAccountVerifiedIcon_e6abe8 {a - display: none !important; -} -*/ - -[class*="closedFolderIconWrapper_"] > [class*="guildIcon_"], -[data-list-item-id*="guildsnav_"] > [class*="icon_"], -.icon_f34534.guildIcon__48112 { - border-radius: 50% !important; -} - -[class*="membersGroup"]:has([role="button"]), -[class*="member"] [class*="container"]:has([class*="badges"]), -.guildIcon__48112, -[class*="plated"] [style^="background: linear-gradient("] { - display: none; -} - -.icon_c9d15c path { - fill: #e0115f; -} - -nav.guilds_c48ade { - margin-bottom: 0 !important; -} - +/* Content Containers */ .content_a2f514 { display: flex; flex-direction: column; @@ -233,8 +254,9 @@ nav.guilds_c48ade { } } +/* Timestamps */ span[class*="timestampInline_"] { - font-size: 0px !important; + font-size: 0 !important; time::before { content: attr(aria-label); @@ -242,6 +264,16 @@ span[class*="timestampInline_"] { } } +/* Utility Classes */ +.followButton_f75fb0, +.topicClickTarget__6ec1a { + -webkit-app-region: no-drag !important; +} + +.topic__6ec1a { + flex: none; +} + .wrapper_e131a9 { height: 0; overflow: hidden; @@ -249,13 +281,121 @@ span[class*="timestampInline_"] { } .container__2637a { - padding-bottom: 0px !important; + padding-bottom: 0 !important; } .scroller__99e7c { - margin-bottom: 0px !important; + margin-bottom: 0 !important; } .bottom__7aaec { - bottom: 0px !important; + bottom: 0 !important; +} + +/* BiteSize Profile Modifications */ +.biteSize_c0bea0 { + overflow: visible !important; + + .footer__5be3e { + display: none !important; + } + + .descriptionClamp_f5f93a { + -webkit-line-clamp: 2; + } + + rect[mask^="url(#svg-mask-status"] { + display: block; + } + + .container_ab8609 { + left: -20px !important; + top: -45px; + + .outer_ab8609::before { + top: 42px; + left: 10px; + } + + .outer_ab8609::after { + top: 70px; + left: 20px; + } + } + + .usernameRow__63ed3 { + position: absolute; + top: -60px; + left: 109px; + } + + .nickname__63ed3 { + word-wrap: normal; + max-height: 24px; + white-space: nowrap; + text-overflow: ellipsis; + max-width: 150px; + } + + .tags__63ed3 .clickableUsername__63ed3 { + position: absolute; + top: -36px; + left: 110px; + } + + .mutuals__530ce { + position: absolute; + top: 8px; + margin-left: calc(100% - 44px - 32px); + + .text__530ce, + .spacer__530ce { + display: none; + } + + .avatars_ef4a91 { + width: 44px !important; + justify-content: right; + } + } + + .contents__201d5:not(.buttonInner_fb7f94) { + display: none; + } + + .header__5be3e { + min-height: 0; + height: 105px !important; + } + + .dotSpacer__63ed3 { + display: none; + } + + [mask^="url(#uid_"] { + /* display: none; */ + mask: none; + opacity: 0.5; + overflow: hidden; + height: 100%; + } + + .avatar__75742 { + top: 12px !important; + } + + .body__5be3e { + padding-top: 8px !important; + overflow: visible !important; + } + + .mask__68edb, + .banner__68edb { + overflow: visible; + height: 00% !important; + width: 100% !important; + contain: none !important; + min-height: 100% !important; + border-radius: 9px 9px 0 0; + } }